GridView inside Expandable list in android
Asked Answered
I

4

36

I want to put an gridview with images inside an expandable list...I've already make that, but the gridview don't show all item...

How can i make my expandable list child adapt to the gridview size?

LIST ADAPTER

public class CustomListAdapter extends BaseExpandableListAdapter
{
    String[]            catg    = { "Administração, Escritorio e Industria", "Cultura e Entretenimento", "Educação e Crianças", "Eventos e Estado do tempo", "Amigos, Familia e Habitações", "Multimédia", "Diversos", "Números e Letras", "Restaurantes e Hoteis", "Desporto, Saude e Beleza", "Lojas", "Turismo e Natureza", "Transportes" };

    Context             myctx;


    @Override
    public Object getChild(int groupPosition, int childPosition)
    {
        // TODO Auto-generated method stub
        return null;
    }

    @Override
    public long getChildId(int groupPosition, int childPosition)
    {
        return childPosition;
    }

    @Override
    public View getChildView(int groupPosition, int childPosition, boolean isLastChild, View convertView, ViewGroup parent)
    {
        ViewGroup item = getViewGroupChild(convertView, parent);
        GridView label = (GridView) item.findViewById(ipvc.estg.placebook.R.id.gridview);
        label.setAdapter(new GridAdapter(parent.getContext(), groupPosition+1));
        return item;
    }

    private ViewGroup getViewGroupChild(View convertView, ViewGroup parent)
    {
        // The parent will be our ListView from the ListActivity
        if (convertView instanceof ViewGroup)
        {
            return (ViewGroup) convertView;
        }
        Context context = parent.getContext();
        LayoutInflater inflater = LayoutInflater.from(context);
        ViewGroup item = (ViewGroup) inflater.inflate(ipvc.estg.placebook.R.layout.expandable_list_row, null);
        return item;
    }

    @Override
    public int getChildrenCount(int groupPosition)
    {
        return 1;
    }

    @Override
    public Object getGroup(int groupPosition)
    {
        return catg[groupPosition];
    }

    @Override
    public int getGroupCount()
    {
        return catg.length;
    }

    @Override
    public long getGroupId(int groupPosition)
    {
        return groupPosition;
    }



    @Override
    public View getGroupView(int groupPosition, boolean isExpanded, View convertView, ViewGroup parent)
    {
        View item = getViewGroupGroup(convertView, parent);

        TextView text = (TextView) item.findViewById(android.R.id.text1);
        text.setText(catg[groupPosition]);
        return item;
    }

    private View getViewGroupGroup(View convertView, ViewGroup parent)
    {
        // The parent will be our ListView from the ListActivity
        if (convertView instanceof View)
        {
            return (View) convertView;
        }
        Context context = parent.getContext();
        LayoutInflater inflater = LayoutInflater.from(context);
        View item1 = (View) inflater.inflate(android.R.layout.simple_expandable_list_item_1, null);

        return item1;
    }

    @Override
    public boolean hasStableIds()
    {
        // TODO Auto-generated method stub
        return false;
    }

    @Override
    public boolean isChildSelectable(int groupPosition, int childPosition)
    {
        // TODO Auto-generated method stub
        return true;
    }

}

LIST ROW LAYOUT

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    android:id="@+id/linearLayout1"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    xmlns:android="http://schemas.android.com/apk/res/android">
    <GridView
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/gridview"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:columnWidth="50dp"
        android:numColumns="auto_fit"
        android:verticalSpacing="10dp"
        android:horizontalSpacing="10dp"
        android:stretchMode="columnWidth"
        android:gravity="center" />
</LinearLayout>
Impaction answered 19/4, 2011 at 16:31 Comment(2)
can you show the GridAdapter? because i already implement expandable listview inside navigation drawer, and i want to add gridview contain images inside expandable listview child.Schlesinger
Hey can you please share the full coding?Subdominant
M
36

I've done tons of searches my own for solving this situation, but didn't find anything so far, so i've made a workaround.

This workaround assumes that you know / can retrieve the width of your columns, and the height of your grid cell renderers (the dp size set in your layout xmls).

You should insert a few more lines inside your ExpandableListAdapter's getChildView method:

@Override
public View getChildView(int groupPosition, int childPosition, boolean isLastChild, View convertView, ViewGroup parent)
{
    ViewGroup item = getViewGroupChild(convertView, parent);
    GridView label = (GridView) item.findViewById(ipvc.estg.placebook.R.id.gridview);
    label.setAdapter(new GridAdapter(parent.getContext(), groupPosition+1));

    // initialize the following variables (i've done it based on your layout
    // note: rowHeightDp is based on my grid_cell.xml, that is the height i've
    //    assigned to the items in the grid.
    final int spacingDp = 10;
    final int colWidthDp = 50;
    final int rowHeightDp = 20;

    // convert the dp values to pixels
    final float COL_WIDTH = getBaseContext().getResources().getDisplayMetrics().density * colWidthDp;
    final float ROW_HEIGHT = getBaseContext().getResources().getDisplayMetrics().density * rowHeightDp;
    final float SPACING = getBaseContext().getResources().getDisplayMetrics().density * spacingDp;

    // calculate the column and row counts based on your display
    final int colCount = (int)Math.floor((parentView.getWidth() - (2 * SPACING)) / (COL_WIDTH + SPACING));
    final int rowCount = (int)Math.ceil((intValues.size() + 0d) / colCount);

    // calculate the height for the current grid
    final int GRID_HEIGHT = Math.round(rowCount * (ROW_HEIGHT + SPACING));

    // set the height of the current grid
    label.getLayoutParams().height = GRID_HEIGHT;

    return item;
}

With the addition above i was able to produce the following displayed layouts:

expandable list with grid - portrait

and

expandable list with grid - landscape

I hope it can help you as well.

Malebranche answered 20/4, 2011 at 5:59 Comment(14)
You're welcome, happy coding further! ;) also +1 for the orig. question, let's hope others will find it useful as wellMalebranche
@Malebranche can you please tell me what the parentView and intValues stands for ? Thanks in advanceConstructionist
@Anuja Piyadigama: parentView is a view (optionally containing the grid), who's width can be determined, and matches the width of the grid. If you have fixed grid width, you can use it there. The intValues is a list of integers that are fed into the grid. Based on the number of these integers, and knowing the column count you are able to calculate how many rows are necessary. Hope this clears up things a bit.Malebranche
@Malebranche thanks for the reply. I am having the ExpandableListView in LinearLayout in one XML file and the GridView is inside another LinearLayout in another XML file. So do I need to get the LinearLayout as my parentView or is that a single Grid are you talking about? I'm feeding the Grid content from a seperate JSON where it can be increase. So how can I count the intValues Thank youConstructionist
@Anuja Piyadigama, you see if the parent parameter does work for you or not (as I understand, it refers to the LinearLayout you are looking for, so instead of using parentView you could use the parent parameter's width); as of the intValues, it does not matter that the length of this list changes, with a proper BaseAdapter extension for the ExpandableListView you can call on it notifyDatasetChanged() whenever it is necessary, so you just feel free to count the items in the JSON list, and calculate with it.Malebranche
Hey can you please add code for new GridAdapter(parent.getContext(), groupPosition+1). Please don't mind but i am trying to execute expandable list with each row containing 3 columns max but failed. So if you can show me how you executing above functionality just by adding GridAdapter code then i can check and modify according to my requirement. Thanks in advance!Mitosis
Can we work with the GridView as in this, majgowrishankar.blogspot.in/2013/03/… ???Kortneykoruna
@Malebranche is this gridview scrollable?Compiler
@lazylord no, it was meant to expand to its full height.Malebranche
@Malebranche so how to make it scrollable for supporting paginationCompiler
@Malebranche just i want to ask i have created my gridview in xml can i use that oneAffliction
@Malebranche if u have any sample code is working fine can u provide me and in gridview in need two textviewAffliction
@AtulDhanuka You should create your own adapter (extend BaseAdapter for instance), and use your layout with two textviews from that. Sorry, but I don't have any sample layout code at my hand now.Malebranche
Hey can you guide me how to do Expandable list with grid items?Subdominant
S
3

all you need to do is change the GrideView with ExpandableHeightGridView

and configure XML with

android:isScrollContainer="false"

and in code

expandableHeightGridView.setExpanded(true);
Song answered 30/1, 2013 at 16:58 Comment(1)
Your solution works. I think this is the easiest to solve this problem. ThanksNat
I
1

how about using a Gallery instead of GridView? check this out!

Implacable answered 25/4, 2012 at 10:22 Comment(1)
Note that the Gallery was deprecated starting API level 16 (Jelly Bean).Goalkeeper
S
1

Try this github full source code of expendable list view with gridview

https://github.com/coolwd10/ExpandablelistwithGirdview

Security answered 16/2, 2015 at 13:45 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.