Put on the right the indicator of an ExpandableListView in Android

Question

I have to move the indicator from the left to the right (because of the plane image). I couldn't succeed also because the expandableviewlist is inside a fragment and not inside a whole activity. Any idea? Thanks!

Rook

are you talking about arrow image ? – Imminent

yes I talk about that one! – Rook

All XML solution based on layout:direction can be found here: https://mcmap.net/q/293410/-expandable-list-view-move-group-icon-indicator-to-right – Coom

Does this answer your question? Expandable list view move group icon indicator to right – Bricker

Answer 1

I don't know a way to do that from XML but i'll tell you a way to do so dynamically in your adapter.

First you have to remove group indicator from your xml

 <ExpandableListView [...] 
    android:groupIndicator="@null" />

Then in your layout of the parent add an imageview in the right position of your layout.

Then in your custom adapter do the following

public View getGroupView(int groupPosition, boolean isExpanded,
        View convertView, ViewGroup parent) {
  ...

    if (isExpanded) {
        groupHolder.img.setImageResource(R.drawable.group_down);
    } else {
        groupHolder.img.setImageResource(R.drawable.group_up);
    }
  ...

}

Orthoscope

Thanks man, Its working like a charm guys, just implement it. – Katharinakatharine

@Rook what is a groupHolder ?? ViewGroup parent or LayoutInflater or what?? – Verile

It's a holder for the group views list.. For example if your group view contains a textview and an imageview. Then the group holder class should be like private static class GroupHolder{ ImageView img; TextView textView; } – Orthoscope

This is the cleanest solution I have seen so far. – Ashleaashlee

Answer 2

One more solution is: 1) First set groupIndicator in your ExpandableListView to @null:

<ExpandableListView [...] 
    android:groupIndicator="@null" />

2) Then create group_indicator.xml file with following details:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/down_icon" android:state_selected="false"></item>
    <item android:drawable="@drawable/up_icon" android:state_selected="true"></item>
    <item android:drawable="@drawable/down_icon"></item>
</selector>

3) Then create group_header.xml layout with following details and inflate this layout in getGroupView() method of ExpandableListAdapter.java:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:padding="10dp">

    <TextView
        android:id="@+id/tvHeader"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:textColor="@color/white"
        android:layout_centerVertical="true"
        android:textSize="16sp"/>

    <ImageView
        android:id="@+id/ivGroupIndicator"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/group_indicator"
        android:layout_centerVertical="true"
        android:layout_alignParentRight="true"/>
</RelativeLayout>

3) In getGroupView() method of your ExpandableListAdapter.java class, just set the following:

ivGroupIndicator.setSelected(isExpanded);

With this approach, your down_icon and up_icon will work properly. Hope this helps.

Lauretta

You wouldn't happen to know the android resource file for down_icon and up_icon, would you? – Dorinda

Answer 3

put this into your xml view:

<ExpandableListView
...
android:layoutDirection="rtl" />

than you can set the gravity of your text title in your layout item according your preference.

your text view parent list item:

<TextView
...
android:gravity="center"/>

eg. result:

Ritzy

Answer 4

another solution to put the indicator on the right programmatically:

expandableListView = (ExpandableListView) findViewById(R.id.expandableListView);

        Display display = getWindowManager().getDefaultDisplay();
        Point size = new Point();
        display.getSize(size);
        int width = size.x;
        Resources r = getResources();
        int px = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP,
                50, r.getDisplayMetrics());
        if (android.os.Build.VERSION.SDK_INT < android.os.Build.VERSION_CODES.JELLY_BEAN_MR2) {
            expandableListView.setIndicatorBounds(width - px, width);
        } else {
            expandableListView.setIndicatorBoundsRelative(width - px, width);
        }

where expandableListView is your ExpandableListview

Bespoke

Answer 5

In your groupcustom.xml file you can use Relativelayout and put that image to

android:alignParentRight = "true";

Imminent

I have to put the arrow to the right, not the plane! And the arrow is a custom icon of the expandableListview.. so I cannot change its position :( – Rook