更改可扩展列表视图中的可扩展指示器。

Question

尝试创建可扩展的ListView。初始视图中的组显示正常。但是，当我单击列表项时，箭头不会更改。请参见下面的图像。 如何更改箭头方向？

布局XML:

  <ExpandableListView
        android:id="@+id/expandable_list"
        android:layout_width="fill_parent"
        android:layout_height="match_parent"            
        android:divider="@null"
        android:background="#ffffff"
        android:groupIndicator="@drawable/settings_selector"
        android:transcriptMode="alwaysScroll" />

settings_selector.xml:

 <?xml version="1.0" encoding="utf-8"?>
<animation-list xmlns:android="http://schemas.android.com/apk/res/android" >

<selector xmlns:android="http://schemas.android.com/apk/res/android" >
    <item
        android:drawable="@drawable/arrow_down"
        android:state_empty="true"/>
    <item
        android:drawable="@drawable/arrow_right"
        android:state_expanded="true"/>
</selector>

</animation-list>

- NagarjunaReddy

---

发布listView行的xml。 - Triode

@RajeshCP 看一下更新一。 - NagarjunaReddy

在onItemClick函数的单击事件中，您可以更改group_indicator的源。为此，您需要一个向上箭头按钮，否则您可以将位图旋转一定角度，并将其设置为ImageView的源。 - Triode

@RajeshCP 在左侧箭头上工作得很好，使用此链接http://www.hrupin.com/2012/08/how-to-create-custom-groupindicator-for-expandablelistview-group中的内容，但如何解决右侧箭头问题？ - NagarjunaReddy

让我们在聊天室中继续这个讨论。 - NagarjunaReddy

Answer 1

可展开的列表视图

 <ExpandableListView
    android:id="@+id/expandable_list"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:groupIndicator="@drawable/group_indicator"
    android:transcriptMode="alwaysScroll" />

setindicator 在这里我使用了 setindicator 代码，像这样，它的效果很好。

 DisplayMetrics metrics = new DisplayMetrics();
    getWindowManager().getDefaultDisplay().getMetrics(metrics);
    int width = metrics.widthPixels; 

 mExpandableList = (ExpandableListView)findViewById(R.id.expandable_list);
 mExpandableList.setIndicatorBounds(width - GetPixelFromDips(50), width - GetPixelFromDips(10));  

   public int GetPixelFromDips(float pixels) {
    // Get the screen's density scale 
    final float scale = getResources().getDisplayMetrics().density;
    // Convert the dps to pixels, based on density scale
    return (int) (pixels * scale + 0.5f);
}

res/drawable/group_indicator

  <?xml version="1.0" encoding="utf-8"?>

     <selector xmlns:android="http://schemas.android.com/apk/res/android">            
           <item android:drawable="@drawable/arrow_right" android:state_empty="true">  </item>            
           <item android:drawable="@drawable/arrow_down" android:state_expanded="true"></item>                
           <item android:drawable="@drawable/arrow_right"></item>
     </selector>

- NagarjunaReddy

---

为什么 mExpandableList.setIndicatorBounds(width - 50, width - 10); 的输出结果相同？ - Pratik Butani

在Android 4.3中，可以使用expListView.setIndicatorBoundsRelative方法。 - Mourice

您可以在dimens.xml中保存指示器大小： <dimen name="indicator_bounds">-50dp</dimen> 然后使用内置方法将dp计算为像素： getResources().getDimensionPixelSize(R.dimen.indicator_bounds) - gSorry

图标被拉伸到布局的高度。 - prasanthMurugan

Answer 2

尝试将此应用于您的settings_selector.xml文件：

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >

    <item
        android:drawable="@drawable/arrow_right"
        android:state_expanded="true" />

    <item
        android:drawable="@drawable/arrow_down" />

</selector>

- Benoit Duffez

---

当我发表我的答案时，你没有发布你的答案 :) - Benoit Duffez

因为它对于任何新开发者都是有用的。 - NagarjunaReddy

Answer 3

我采用了以下方式：根据isExpanded标志决定您的groupView的左/右可绘制对象。
通过这种方式，我们更容易自定义指示器可绘制对象的填充/背景和其他属性。

希望对您有所帮助。

    public View getGroupView(int groupPosition, boolean isExpanded, View convertView,
            ViewGroup parent) {
        TextView textView = (TextView) mLayoutInflater.inflate(R.layout.menu_group, null);
        textView.setCompoundDrawablesWithIntrinsicBounds(0, 0, isExpanded ? 0 : android.R.drawable.ic_menu_more, 0);
        textView.setText(getGroup(groupPosition).toString());
        return textView;
    }

- lily

Answer 4

import java.util.ArrayList;

import android.app.Activity;
import android.content.Context;
import android.database.DataSetObserver;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.ViewGroup;
import android.widget.BaseExpandableListAdapter;
import android.widget.ExpandableListView;
import android.widget.TextView;

public class MyActivity extends Activity {

    private ExpandableListView mExpandableList;

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_my);


        mExpandableList = (ExpandableListView)findViewById(R.id.expandable_list);
        mExpandableList.setGroupIndicator(null);
        ArrayList<Parent> arrayParents = new ArrayList<Parent>();
        ArrayList<String> arrayChildren = new ArrayList<String>();

        //here we set the parents and the children
        for (int i = 0; i < 10; i++){
            //for each "i" create a new Parent object to set the title and the children
            Parent parent = new Parent();
            parent.setTitle("Parent " + i);

            arrayChildren = new ArrayList<String>();
            for (int j = 0; j < 10; j++) {
                arrayChildren.add("Child " + j);
            }
            parent.setArrayChildren(arrayChildren);

            //in this array we add the Parent object. We will use the arrayParents at the setAdapter
            arrayParents.add(parent);
        }

        //sets the adapter that provides data to the list.
        mExpandableList.setAdapter(new MyCustomAdapter(MyActivity.this,arrayParents));

    }

    public class Parent {
        private String mTitle;
        private ArrayList<String> mArrayChildren;

        public String getTitle() {
            return mTitle;
        }

        public void setTitle(String mTitle) {
            this.mTitle = mTitle;
        }

        public ArrayList<String> getArrayChildren() {
            return mArrayChildren;
        }

        public void setArrayChildren(ArrayList<String> mArrayChildren) {
            this.mArrayChildren = mArrayChildren;
        }
    }




    public class MyCustomAdapter extends BaseExpandableListAdapter implements OnClickListener{


        private LayoutInflater inflater;
        private ArrayList<Parent> mParent;

        public MyCustomAdapter(Context context, ArrayList<Parent> parent){
            mParent = parent;
            inflater = LayoutInflater.from(context);
        }


        @Override
        //counts the number of group/parent items so the list knows how many times calls getGroupView() method
        public int getGroupCount() {
            return mParent.size();
        }

        @Override
        //counts the number of children items so the list knows how many times calls getChildView() method
        public int getChildrenCount(int i) {
            return mParent.get(i).getArrayChildren().size();
        }

        @Override
        //gets the title of each parent/group
        public Object getGroup(int i) {
            return mParent.get(i).getTitle();
        }

        @Override
        //gets the name of each item
        public Object getChild(int i, int i1) {
            return mParent.get(i).getArrayChildren().get(i1);
        }

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

        @Override
        public long getChildId(int i, int i1) {
            return i1;
        }

        @Override
        public boolean hasStableIds() {
            return true;
        }

        @Override
        //in this method you must set the text to see the parent/group on the list
        public View getGroupView(int i, boolean b, View view, ViewGroup viewGroup) {

            if (view == null) {
                view = inflater.inflate(R.layout.list_item_parent, viewGroup,false);
            }
            view.findViewById(R.id.button).setTag(i);
            view.findViewById(R.id.button).setOnClickListener(this);
            TextView textView = (TextView) view.findViewById(R.id.list_item_text_view);
            //"i" is the position of the parent/group in the list
            textView.setText(getGroup(i).toString());

            //return the entire view
            return view;
        }

        @Override
        //in this method you must set the text to see the children on the list
        public View getChildView(int i, int i1, boolean b, View view, ViewGroup viewGroup) {
            if (view == null) {
                view = inflater.inflate(R.layout.list_item_child, viewGroup,false);
            }

            TextView textView = (TextView) view.findViewById(R.id.list_item_text_child);
            //"i" is the position of the parent/group in the list and
            //"i1" is the position of the child
            textView.setText(mParent.get(i).getArrayChildren().get(i1));

            //return the entire view
            return view;
        }

        @Override
        public boolean isChildSelectable(int i, int i1) {
            return true;
        }

        @Override
        public void registerDataSetObserver(DataSetObserver observer) {
            /* used to make the notifyDataSetChanged() method work */
            super.registerDataSetObserver(observer);
        }


        /* (non-Javadoc)
         * @see android.view.View.OnClickListener#onClick(android.view.View)
         * @since Mar 20, 2013
         * @author rajeshcp 
         */
        @Override
        public void onClick(View v) {
            if(mExpandableList.isGroupExpanded((Integer)v.getTag()))
        {
            mExpandableList.collapseGroup((Integer)v.getTag());
        }else
        {
            mExpandableList.expandGroup((Integer)v.getTag());
        }
        }
    }


}

请修改您的MyActivity代码，然后告诉我还需要什么？

- Triode

---

在可扩展列表视图中不需要使用onitemclick，而是需要使用onitemclick。 - NagarjunaReddy

我真的不明白你想要什么？ - Triode

请参考此示例：http://www.hrupin.com/2012/08/how-to-create-custom-groupindicator-for-expandablelistview-group，将左侧图像更改为右侧图像。 - NagarjunaReddy

我只是使用那个示例来说明如何像我的问题中的图像一样将其从左侧更改为右侧。 - NagarjunaReddy

嘿，在运行应用程序后，请查看编辑过的答案，只需单击行中的每个按钮。 - Triode

无论如何，感谢您解决了我的问题，我们看到我的答案运行得很好。 - NagarjunaReddy

Answer 5

主题：

    int width = getResources().getDisplayMetrics().widthPixels;
    if (android.os.Build.VERSION.SDK_INT < android.os.Build.VERSION_CODES.JELLY_BEAN_MR2) {
        listView.setIndicatorBounds(width - getPixelValue(40), width - getPixelValue(10));
    } else {
        listView.setIndicatorBoundsRelative(width - getPixelValue(40), width - getPixelValue(10));
    }

以及辅助方法：

public static int getPixelValue(int dp) {

    final float scale = getResources().getDisplayMetrics().density;
    return (int) (dp * scale + 0.5f);
}

- tier777

Answer 6

虽然我有点晚了，但我的要求与此类似，但有所不同。

我有三个要求：

1. 如果一个组有子元素，则显示向下箭头（V）
2. 如果一个组没有子元素，则不显示箭头/图片
3. 如果一个有子元素的组展开了，则显示向上箭头（^）

为了实现类似于这样的效果：

1. Your ExpandableListView will look something similar to this with android:groupIndicator null

    <ExpandableListView
    android:id="@+id/expandableListView"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:divider="@android:color/darker_gray"
    android:dividerHeight="0.5dp"
    android:groupIndicator="@null" />
   

2. Your group/header layout will look something like this with text and image at the end:

<androidx.appcompat.widget.AppCompatImageView
    android:id="@+id/ivDrawerHeaderItemIcon"
    android:layout_width="@dimen/dp_30"
    android:layout_height="@dimen/dp_30"
    android:layout_gravity="center_vertical"
    android:layout_marginStart="@dimen/dp_10"
    android:layout_marginEnd="@dimen/dp_10"
    android:src="@drawable/switch" />

<androidx.appcompat.widget.AppCompatTextView
    android:id="@+id/lblListHeader"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_margin="@dimen/dp_5"
    android:layout_weight="1"
    android:fontFamily="@font/roboto_condensed_regular"
    android:gravity="center_vertical"
    android:padding="@dimen/dp_10"
    android:textAllCaps="true"
    android:textColor="@android:color/white"
    android:textSize="@dimen/sp_16" />

<androidx.appcompat.widget.AppCompatImageView
    android:id="@+id/ivIcon"
    android:layout_width="@dimen/dp_15"
    android:layout_height="@dimen/dp_15"
    android:layout_gravity="center_vertical"
    android:layout_marginStart="@dimen/dp_10"
    android:layout_marginEnd="@dimen/dp_10" />

3. In your BaseExpandableListAdapter's getGroupView() method, use

        if (Objects.requireNonNull(expandableListDetail.get(expandableListTitle.get(listPosition))).size() > 0) {
        if (isExpanded) {
            ivIcon.setImageResource(R.drawable.arrow_up);
        } else {
            ivIcon.setImageResource(R.drawable.arrow_down);
        }
    }
   

其中，expandableListTitle 是组名，expandableListDetail 是其子项。

- Kishan Solanki

Answer 7

在分组项的xml中，只需创建一个视图/图像视图，并将其放置在您想要的任何位置：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/parent_group"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:padding="10dp">

<ImageView
    android:id="@+id/expandable_icon"
    android:layout_width="25dp"
    android:layout_height="25dp"
    android:layout_marginTop="6dp"
    android:src="@drawable/group_icon_not_expanded" />

<TextView
    android:id="@+id/group_name"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_gravity="center"
    android:layout_marginLeft="10dp"
    android:fontFamily="@font/roboto_thin"
    android:textColor="@android:color/black"
    android:textSize="17sp" />

对于您的可扩展列表，使用GroupClickListener来通过编程方式更改ImageView的图像，例如：

listView.setOnGroupClickListener(new ExpandableListView.OnGroupClickListener() {
        @Override
        public boolean onGroupClick(ExpandableListView parent, View v, int groupPosition, long id) {
            parent.smoothScrollToPosition(groupPosition);

            if (parent.isGroupExpanded(groupPosition)) {
                ImageView imageView = v.findViewById(R.id.expandable_icon);
                imageView.setImageDrawable(getResources().getDrawable(R.drawable.group_icon_not_expanded));
            } else {
                ImageView imageView = v.findViewById(R.id.expandable_icon);
                imageView.setImageDrawable(getResources().getDrawable(R.drawable.group_icon_expanded));
            }
            return false    ;
        }
    });

- shadygoneinsane