ExpandableListView - group indication is stretch to fit the text size

Question

I have group indication with small icon, and i use groupIndicator to call the selector to draw it but I see android by default stretch that icon to fits the text size

Answer 1

chitacan thanks for the comment. Very helpful!

But if you are trying to change views (e.g. indicator) in the groupview in methods onGroupExpanded and onGroupCollapsed like me, you will eventually figure out that they turn back to their original state. Reason: exp.listview calls getGroupView after expansion and collapse. If you are generating views there and not holding them somewhere, everything will be generated from scratch. So you can simply change the view (indicator) in getGroupView method with the isExpanded parameter. Hope this helps and you won't lose so much time like me. In this case you won't need onGroupCollapsed and onGroupExpanded methods.

Answer 2

First of all thank you coderat. Your answer helped me a lot. I recently figured how not only the stretching-problem could be solved but also the problem that the drawable is aligned to bottom/top when the groupItem is bigger in height then the drawable. I just changed the 9patch a bit. This image will also work for all screen-densities (you don't have to create a scaled 9patch for each drawable-folder (hdpi, mdpi,...) ). Hope that helps ;)

Answer 3

<ExpandableListView 
    android:layout_height="fill_parent"
    android:layout_width="fill_parent"
    android:id="@+id/elv_store_info_Expandlist"
    android:cacheColorHint="#FFFFFF"
    android:overScrollMode="never"
    android:fastScrollEnabled="false"
    android:fastScrollAlwaysVisible="false"
    android:indicatorRight="20dp"
    android:divider="@android:color/transparent"
    android:dividerHeight="0dp"
    android:groupIndicator="@drawable/store_info_expandabellist_indicator"
    />

@store_info_expandabellist_indicator.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item  android:state_empty="true" android:drawable="@drawable/bitmap_btn_arraw_right_dark_small">
</item>
<item android:state_expanded="true" android:drawable="@drawable/bitmap_btn_arraw_bottom_white_small">
</item>
<item android:drawable="@drawable/bitmap_btn_arraw_right_dark_small">
</item>
</selector>

@bitmap_btn_arraw_right_dark_small

 <?xml version="1.0" encoding="utf-8"?>
 <layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
 <item 
    android:left="11dp"
    android:right="11dp"
    android:top="12dp"
    android:bottom="12dp"
    android:drawable="@drawable/btn_arrowright_dark">
 </item>
 </layer-list>

Answer 4

I think that the easiest thing to do in this case is include the indicator inside your row group view (as an imageView) and change its selected state based on whether the group is expanded. You'll want to make sure that your ImageView uses a selector with selected state drawables.

Something like this:

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

        if (convertView != null)
        {
            row = convertView;
        }
        else
        {
            row = LayoutInflater.from(getContext()).inflate(R.layout.group_row, null));
        }


        final ImageView indicator = (ImageView)row.findViewById(R.id.indicator);
        indicator.setSelected(isExpanded);
        return row;
    }

Answer 5

Whatever image you are using as your group indicator, make it a 9 patch (xxx.9.png) image and set its stretchable areas to around the border pixels (which probably may be transparent). It will prevent stretching of image from the middle.

Answer 6

You can add group indicator by setGroupIndicator method. But By default, Android stretch height of indicator to fit group item's height. (width can be adjusted by setIndicatorBounds method.) Therefore, you should make group indicator's height exactly same as group item's height. (see ExpandableListView)

Otherwise, you can make fully customized group indicator with onGroupCollapsed and onGroupExpanded methods. Just make a view with some states and When these methods are called, change your view's state. (see ExpandableListAdapter)