Xamarin android 在 ExpandableListView 中显示自定义布局

Question

在我的应用程序中，我试图在自定义布局中显示一个 ExpandableListView。例如，我有这个 ExpandableListView

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

当我展开它时，我想用 3 个图像视图显示这个布局

<LinearLayout
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
     android:orientation="horizontal">
        <ImageView
            android:layout_width="40dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            app:srcCompat="@mipmap/hat_off" />
        <ImageView
            android:layout_width="40dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            app:srcCompat="@mipmap/clothes_top_off" />
        <ImageView
            android:layout_width="40dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            app:srcCompat="@mipmap/clothes_bot_off" />
  </LinearLayout>

你知道我该怎么做吗？非常感谢

Answer 1

您需要使用 BaseExpandableListAdapter。并在 GetChildView() 方法中膨胀你想要显示的布局。
首先，找到 ExpandableListView 并设置适配器：

        List<string> list = new List<string>();
        list.Add("A");
        list.Add("B");
        list.Add("C");
        list.Add("D");
        ExpandableListView expandableListView = FindViewById<ExpandableListView>(Resource.Id.expandableListView);
        expandableListView.SetAdapter(new ExpandableListAdapter(this, list));

和ExpandableListAdapter：

public class ExpandableListAdapter : BaseExpandableListAdapter
{
    public override int GroupCount => data.Count;    
    public override bool HasStableIds => true;    
    private readonly Activity _context;
    private List<string> data;

    public ExpandableListAdapter(Activity context, List<string> list)
    {
        _context = context;
        data = list;
    }    

    public override View GetGroupView(int groupPosition, bool isExpanded, View convertView, ViewGroup parent)
    {
        View header = convertView;
        if (header == null)
        {
            header = _context.LayoutInflater.Inflate(Resource.Layout.GroupItem, null);
        }
        header.FindViewById<TextView>(Resource.Id.textView1).Text = data[groupPosition];

        return header;
    }

    public override View GetChildView(int groupPosition, int childPosition, bool isLastChild, View convertView, ViewGroup parent)
    {
        View row = convertView;
        if (row == null)
        {
            row = _context.LayoutInflater.Inflate(Resource.Layout.DataItem, null);
        }

        ///Find your ImageView and set data if you need
        ///ImageView img1 = row.FindViewById<ImageView>(Resource.Id.ImageView1)
        ///...
        ///...

        return row;    
    }

    public override Java.Lang.Object GetChild(int groupPosition, int childPosition)
    {
        return childPosition;
    }

    public override long GetChildId(int groupPosition, int childPosition)
    {
        return childPosition;
    }

    public override int GetChildrenCount(int groupPosition)
    {
        return 1;
    }    

    public override Java.Lang.Object GetGroup(int groupPosition)
    {
        return groupPosition;
    }

    public override long GetGroupId(int groupPosition)
    {
        return groupPosition;
    }

    public override bool IsChildSelectable(int groupPosition, int childPosition)
    {
        return true;
    }
}

和 GroupItem.axml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:minWidth="25px"
    android:minHeight="25px">
    <TextView
        android:text="Text"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/textView1" />
</LinearLayout>

DataItem.axml:

<?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="wrap_content"
     android:orientation="horizontal">
  <ImageView
      android:id="@+id/ImageView1"
      android:layout_width="40dp"
      android:layout_height="match_parent"
      android:layout_weight="1"
      app:srcCompat="@mipmap/hat_off" />
  <ImageView
      android:layout_width="40dp"
      android:layout_height="match_parent"
      android:layout_weight="1"
      app:srcCompat="@mipmap/clothes_top_off" />
  <ImageView
      android:layout_width="40dp"
      android:layout_height="match_parent"
      android:layout_weight="1"
      app:srcCompat="@mipmap/clothes_bot_off" />
</LinearLayout>

我在 GitHub 上找到了一个 ExpandableListView sample porject。你可以参考一下。

Xamarin android 在 ExpandableListView 中显示自定义布局

Xamarin android display custom layout inside ExpandableListView

android

xamarin.android

expandablelistview