如何向我的应用添加展开/关闭图标？

Question

I have created an expandable/collapsible list after following a tutorial for my app in Android Studio, however I'm wanting to add a button which is aligned left of the heading which changes to an up/down button when a heading is expanded/collapsed. How can I add this?

My activity files for the expandable and collapsible list are as follows:

list_main.xml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:background="#f4f4f4" >

<ExpandableListView
    android:id="@+id/lvExp"
    android:layout_height="match_parent"
    android:layout_width="match_parent"/>

</LinearLayout>

list_group.xml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:padding="8dp"
android:background="#000000">


<TextView
    android:id="@+id/lblListHeader"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:paddingLeft="?android:attr/expandableListPreferredItemPaddingLeft"
    android:textSize="17dp"
    android:textColor="#f9f93d" />

</LinearLayout>

list_item.xml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="55dip"
android:orientation="vertical" >

<TextView
    android:id="@+id/lblListItem"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:textSize="17dip"
    android:paddingTop="5dp"
    android:paddingBottom="5dp"
    android:paddingLeft="?android:attr/expandableListPreferredChildPaddingLeft" />

</LinearLayout>

I've tried to implement it by changing the layout file of list_group.xml to:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:padding="8dp"
android:background="#000000">


<selector xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">
    <item android:drawable="@drawable/down_squared"  android:state_checked="true"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />
    <item android:drawable="@drawable/up_squared"  android:state_checked="false"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />
</selector>

<TextView
    android:id="@+id/lblListHeader"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
          android:paddingLeft="?android:attr/expandableListPreferredItemPaddingLeft"
    android:textSize="17dp"
    android:textColor="#f9f93d" />

</LinearLayout>

However the page keeps crashing now and there the design tab says there are rendering errors, which are:

The following classes could not be found: - item (Fix Build Path, Edit XML) - selector (Fix Build Path, Edit XML)

Answer 1

Use checkbox with background set as your drawable

<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@drawable/play_icon" android:state_checked="true" />
<item android:drawable="@drawable/pause_icon" android:state_checked="false" />
</selector>

then in your code set a callback for checkbox setOnCheckedChangeListener

and inside the onCheckedChanged put expandGroup and collapseGroup calls, depending on the check state