android - 如何在 ExpanadbleListView 中结合子项及其标题？

Question

我正在寻找一种将组视图和子视图组合在这样的列表中的方法

除了它将是一个可扩展的列表。

谢谢你。

Answer 1

我冒昧地为此编写了一些示例代码。最有意义的是创建您自己的自定义视图ExpandableListView（尤其是如果您想要圆角），一个自定义适配器来处理组和子级，然后让您main.xml只包含多个自定义视图。正如您从屏幕截图中看到的那样，我已经设法非常接近地重现了它。

所以这里是代码：

RoundedExpandableListView.java

public class RoundedExpandableListView extends ExpandableListView {

    public RoundedExpandableListView(Context context) {
        super(context);
    }

    public RoundedExpandableListView(Context context, AttributeSet attrs) {
        super(context, attrs);

        // for setting the background color and rounded corners
        int bgColor = attrs.getAttributeIntValue("http://schemas.android.com/apk/res/android", "background", 0xffffff);
        TypedArray a = getContext().obtainStyledAttributes(attrs, R.styleable.RoundedExpandableListView);
        int radius = a.getInteger(R.styleable.RoundedExpandableListView_radius, 0);
        PaintDrawable drawable = new PaintDrawable();
        drawable.getPaint().setColor(bgColor);
        drawable.setCornerRadius(radius);
        setBackgroundDrawable(drawable);
        a.recycle();
    }
}

GroupedViewAdapter.java

public class GroupedViewAdapter extends BaseExpandableListAdapter {

    private Context mContext;
    private String[] mGroups;
    private Object[][] mChildren;
    private int mGroupLayoutId;
    private int mChildLayoutId;
    private Drawable mTitleDrawable;

    public GroupedViewAdapter(Context c, String[] k, Object[][] v, int titleDrawableResId) {
        this(c, k, android.R.layout.simple_expandable_list_item_1, v,
                android.R.layout.simple_expandable_list_item_1, titleDrawableResId);
    }

    public GroupedViewAdapter(Context c, String[] k, int groupLayoutResId, Object[][] v,
            int childLayoutResId, int titleDrawableResId) {
        super();
        mContext = c;
        mGroups = k;
        mChildren = v;
        mGroupLayoutId = groupLayoutResId;
        mChildLayoutId = childLayoutResId;
        mTitleDrawable = mContext.getResources().getDrawable(titleDrawableResId);
        mTitleDrawable.setBounds(0, 0, 48, 48); // not necessarily the best way, but just to show example
    }

    @Override
    public int getGroupCount() {
        return mGroups.length;
    }

    @Override
    public int getChildrenCount(int groupPosition) {
        return (mChildren[groupPosition] == null) ? 0 : mChildren[groupPosition].length;
    }

    @Override
    public void onGroupCollapsed(int groupPosition) {
        super.onGroupCollapsed(groupPosition);
    }

    @Override
    public void onGroupExpanded(int groupPosition) {
        super.onGroupExpanded(groupPosition);
    }

    @Override
    public String getGroup(int groupPosition) {
        return mGroups[groupPosition];
    }

    @Override
    public Object getChild(int groupPosition, int childPosition) {
        return (mChildren[groupPosition] == null) ? null : mChildren[groupPosition][childPosition];
    }

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

    @Override
    public long getChildId(int groupPosition, int childPosition) {
        return childPosition;
    }

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

    @Override
    public View getGroupView(int groupPosition, boolean isExpanded,
            View convertView, ViewGroup parent) {
        View v;
        if (convertView != null) {
            v = convertView;
        } else {
            LayoutInflater li = (LayoutInflater) mContext.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
            v = li.inflate(mGroupLayoutId, parent, false);
        }

        TextView tv = ((TextView) v);
        tv.setText(getGroup(groupPosition));
        tv.setTag(getGroupId(groupPosition));
        // set title group special properties
        if (groupPosition == 0) {
            tv.setTextSize(20);
            tv.setCompoundDrawables(mTitleDrawable, null, null, null);
        } else if (isExpanded) {
            tv.setCompoundDrawablesWithIntrinsicBounds(0, 0, R.drawable.icon_expanded, 0);
        } else {
            tv.setCompoundDrawablesWithIntrinsicBounds(0, 0, R.drawable.icon_collapsed, 0);
        }

        return tv;
    }

    @Override
    public View getChildView(int groupPosition, int childPosition,
            boolean isLastChild, View convertView, ViewGroup parent) {

        View v;
        if (convertView != null) {
            v = convertView;
        } else {
            LayoutInflater li = (LayoutInflater) mContext.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
            v = li.inflate(mChildLayoutId, parent, false);
        }

        TextView tv = ((TextView) v);
        tv.setText((String)getChild(groupPosition, childPosition));
        tv.setTag(getChildId(groupPosition, childPosition));

        return tv;
    }

    @Override
    public boolean isChildSelectable(int groupPosition, int childPosition) {
        return true;
    }
}

MainActivity.java

public class MainActivity extends Activity {

    private RoundedExpandableListView mContact;
    private RoundedExpandableListView mAddress;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        mContact = (RoundedExpandableListView) findViewById(R.id.listview_contact);
        mAddress = (RoundedExpandableListView) findViewById(R.id.listview_address);
        mContact.setAdapter(new GroupedViewAdapter(this,
                getResources().getStringArray(R.array.contact_list_items), // I chose to create this directly in XML, but you can generate it via Java like I did the children below
                R.layout.drawer_list_item,
                createChildList(),
                R.layout.drawer_list_item,
                R.drawable.ic_action_email));
        mAddress.setAdapter(new GroupedViewAdapter(this,
                getResources().getStringArray(R.array.address_list_items),
                R.layout.drawer_list_item,
                createChildList(),
                R.layout.drawer_list_item,
                R.drawable.ic_action_map));
        mContact.setGroupIndicator(null); // since the adapter is changing how to show the group indicator icon
        mAddress.setGroupIndicator(null); // since the adapter is changing how to show the group indicator icon
    }

    private String[][] createChildList() {
        // Do stuff here to generate the list of children. Since the examples
        //   didn't have any, I didn't add any here.
        return null; // Change this once you have children
    }
}

资源/布局/activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:local="http://schemas.android.com/apk/res/com.example.sample"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:background="#95c91d" >

    <com.example.sample.RoundedExpandableListView
        android:id="@+id/listview_contact"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="10dp"
        android:layout_marginBottom="20dp"
        android:paddingLeft="10dp"
        android:background="#ffffff"
        local:radius="20" />

    <com.example.sample.RoundedExpandableListView
        android:id="@+id/listview_address"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="10dp"
        android:layout_marginBottom="20dp"
        android:paddingLeft="10dp"
        android:background="#ffffff"
        local:radius="20"
        android:layout_below="@+id/listview_contact" />
</RelativeLayout>

res/layout/drawer_list_item.xml

<?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/list_text"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:gravity="center_vertical"
    android:textSize="14sp"
    android:text="test"
    android:paddingTop="@dimen/list_item_margin"
    android:paddingRight="@dimen/list_item_margin"
    android:paddingBottom="@dimen/list_item_margin"
    android:drawableLeft="@android:drawable/ic_menu_manage"
    android:drawablePadding="12dp"
    />

res/values/attrs.xml（用于为您创建自定义属性View）

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <declare-styleable name="RoundedExpandableListView">
        <attr name="radius" format="integer" />
    </declare-styleable>
</resources>

res/values/strings.xml

<!-- stuff up here -->

<string-array name="contact_list_items">
    <item name="item_title">Contact</item>
    <item name="item_number">+41 41 41</item>
    <item name="item_email">xxx@email.com</item>
    <item name="item_website">www.website.com</item>
</string-array>

<string-array name="address_list_items">
    <item name="item_title">Address</item>
    <item name="item_address">xxxxxx\nxxxxxxxxxxx\nxxxxxxxxxx\nxxxxxxx</item>
    <item name="item_other">PDF</item>
</string-array>

应该是这样！祝你好运！