滚动视图内的 ExpandableListView答案

【问题标题】：ExpandableListView inside a scrollview滚动视图内的 ExpandableListView
【发布时间】：2013-07-17 09:27:00
【问题描述】：

在我的应用程序中，我想创建一个具有 ExpandableListView 并在其下方为 CheckBox 的页面。

我的问题是我的 ExpandableListView 太大，使 CheckBox 超出页面。

在较小的屏幕上根本不可见。

我试图将 ExpandableListView 放在滚动视图中，但它不起作用。

有没有办法让我的设计？

这是我的代码和屏幕截图。

XML 代码：

<?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="match_parent"
    android:background="@color/White" >

    <ScrollView
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:fillViewport="true" >

        <RelativeLayout
            android:layout_width="fill_parent"
            android:layout_height="fill_parent" >

            <TextView
                android:id="@+id/textView1"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_alignParentTop="true"
                android:layout_marginTop="15sp"
                android:text="In this page you can save a group of exercise under one routine."
                android:textColor="@color/Black"
                android:textSize="20sp" />

            <ExpandableListView
                android:id="@+id/instructionsExView"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_alignParentLeft="true"
                android:layout_below="@+id/textView1"
                android:layout_marginTop="15sp" >
            </ExpandableListView>

            <TextView
                android:id="@+id/textView2"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_below="@+id/instructionsExView"
                android:layout_marginTop="15sp"
                android:text="If you want to open the instruction again check &apos;need help?&apos;"
                android:textColor="@color/Black"
                android:textSize="20sp" />

            <CheckBox
                android:id="@+id/checkInstructions"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentLeft="true"
                android:layout_below="@+id/textView2"
                android:layout_marginTop="16dp"
                android:checked="false"
                android:text="dont show again when opening the page"
                android:textColor="@color/Black" />

        </RelativeLayout>
    </ScrollView>

</RelativeLayout>

屏幕截图：

编辑：

【问题讨论】：

使用MergeAdapter:github.com/commonsguy/cwac-merge

标签： android xml android-layout android-xml

【解决方案1】：

在您的“onCreate”方法中，在“expListView.setAdapter(listAdapter)”之后写入：“setListViewHeight(expListView)”，然后为您的可展开列表视图设置 OnGroupClickListener，如下所示：

expListView.setOnGroupClickListener(new OnGroupClickListener() {

        @Override
        public boolean onGroupClick(ExpandableListView parent, View v,
                int groupPosition, long id) {
            setListViewHeight(parent, groupPosition);
            return false;
        }
    });

使用的方法：

private void setListViewHeight(ListView listView) {
    ListAdapter listAdapter = listView.getAdapter();
    int totalHeight = 0;
    for (int i = 0; i < listAdapter.getCount(); i++) {
    View listItem = listAdapter.getView(i, null, listView);
    listItem.measure(0, 0);
    totalHeight += listItem.getMeasuredHeight();
    }

    ViewGroup.LayoutParams params = listView.getLayoutParams();
    params.height = totalHeight
    + (listView.getDividerHeight() * (listAdapter.getCount() - 1));
    listView.setLayoutParams(params);
    listView.requestLayout();
    }


    private void setListViewHeight(ExpandableListView listView,
    int group) {
    ExpandableListAdapter listAdapter = (ExpandableListAdapter) listView.getExpandableListAdapter();
    int totalHeight = 0;
    int desiredWidth = MeasureSpec.makeMeasureSpec(listView.getWidth(),
    MeasureSpec.EXACTLY);
    for (int i = 0; i < listAdapter.getGroupCount(); i++) {
    View groupItem = listAdapter.getGroupView(i, false, null, listView);
    groupItem.measure(desiredWidth, MeasureSpec.UNSPECIFIED);

    totalHeight += groupItem.getMeasuredHeight();

    if (((listView.isGroupExpanded(i)) && (i != group))
    || ((!listView.isGroupExpanded(i)) && (i == group))) {
    for (int j = 0; j < listAdapter.getChildrenCount(i); j++) {
    View listItem = listAdapter.getChildView(i, j, false, null,
    listView);
    listItem.measure(desiredWidth, MeasureSpec.UNSPECIFIED);

    totalHeight += listItem.getMeasuredHeight();

    }
    }
    }

    ViewGroup.LayoutParams params = listView.getLayoutParams();
    int height = totalHeight
    + (listView.getDividerHeight() * (listAdapter.getGroupCount() - 1));
    if (height < 10)
    height = 200;
    params.height = height;
    listView.setLayoutParams(params);
    listView.requestLayout();

    }

现在你可以走了。

【讨论】：

这对我来说效果很好......但是，当 ExpandableListView 向上滚动并离开查看区域时，列表会自动折叠回来。有什么办法可以解决这个问题？我正在使用 setListViewHeight(ExpandableListView ... 方法
此代码在 ExpandableListView 需要属性 layout_height="wrap_content" 时很有用。使用代码，您的视图将正确包装内容。
第二个函数工作正常，但第一个函数对我不起作用，即在单击任何组之前，expandablelistview 的高度不正确。有没有人能够解决这个问题？
@dvc 您是否在 onCreate 方法中的“expListView.setAdapter(listAdapter)”之后使用了“setListViewHeight(expListView)”？顺便说一句，我认为最好不要一起使用 expandablelistview 和 scrollview，尝试使用 expandablelistviews 并自定义它的第一个和最后一个项目。
这个解决方案在滚动方面效果很好，但它在第一次加载时无法正确计算 ExpandableListView 的高度。点击一个组就可以了，所以需要一点点触摸才能到达那里。

【解决方案2】：

基于@Dmila Ram的answer，我能够做到。

就我而言，我在onCreate 方法中初始化并填充ExpandableListView，如下所示：

expandableListView = (ExpandableListView) findViewById(R.id.appsMenu);
listAdapter = new ExpandableListAdapter(this, listDataHeader, listDataChild);
expandableListView.setAdapter(listAdapter);
for (int i = 0; i < listAdapter.getGroupCount(); i++)
     expandableListView.expandGroup(i);
setListViewHeight(expandableListView);
expandableListView.setOnGroupClickListener(new ExpandableListView.OnGroupClickListener() {
     @Override
     public boolean onGroupClick(ExpandableListView parent, View v, int groupPosition, long id) {
          setListViewHeight(parent, groupPosition);
          return false;
        }
     });

请注意，我展开了每个组。之后我打电话给setListViewHeight(expandableListView);

该方法负责计算ExpandableListView首次创建时的高度。

代码如下：

private void setListViewHeight(ExpandableListView listView) {
        ExpandableListAdapter listAdapter = (ExpandableListAdapter) listView.getExpandableListAdapter();
        int totalHeight = 0;
        for (int i = 0; i < listAdapter.getGroupCount(); i++) {
            View groupView = listAdapter.getGroupView(i, true, null, listView);
            groupView.measure(0, View.MeasureSpec.UNSPECIFIED);
            totalHeight += groupView.getMeasuredHeight();

        if (listView.isGroupExpanded(i)){
            for(int j = 0; j < listAdapter.getChildrenCount(i); j++){
                View listItem = listAdapter.getChildView(i, j, false, null, listView);
                listItem.measure(0, View.MeasureSpec.UNSPECIFIED);
                totalHeight += listItem.getMeasuredHeight();
            }
        }
    }

    ViewGroup.LayoutParams params = listView.getLayoutParams();
    params.height = totalHeight
            + (listView.getDividerHeight() * (listAdapter.getGroupCount() - 1));
    listView.setLayoutParams(params);
    listView.requestLayout();
}

确实没有必要扩展组，而是我们可以循环遍历子项并将它们添加到总高度的计算中。

这将使ScrollView 中的所有小部件都可滚动，并且还将正确显示ExpandableListView。

那么我们也需要这个方法，确保点击组也会计算高度：

private void setListViewHeight(ExpandableListView listView,
                                   int group) {
        ExpandableListAdapter listAdapter = (ExpandableListAdapter) listView.getExpandableListAdapter();
        int totalHeight = 0;
        int desiredWidth = View.MeasureSpec.makeMeasureSpec(listView.getWidth(),
                View.MeasureSpec.EXACTLY);
        for (int i = 0; i < listAdapter.getGroupCount(); i++) {
            View groupItem = listAdapter.getGroupView(i, false, null, listView);
        groupItem.measure(desiredWidth, View.MeasureSpec.UNSPECIFIED);
        totalHeight += groupItem.getMeasuredHeight();

        if (((listView.isGroupExpanded(i)) && (i != group))
                || ((!listView.isGroupExpanded(i)) && (i == group))) {
            for (int j = 0; j < listAdapter.getChildrenCount(i); j++) {
                View listItem = listAdapter.getChildView(i, j, false, null,
                        listView);
                listItem.measure(desiredWidth, View.MeasureSpec.UNSPECIFIED);
                totalHeight += listItem.getMeasuredHeight();
            }
        }
    }

    ViewGroup.LayoutParams params = listView.getLayoutParams();
    int height = totalHeight
            + (listView.getDividerHeight() * (listAdapter.getGroupCount() - 1));
    if (height < 10)
        height = 200;
    params.height = height;
    listView.setLayoutParams(params);
    listView.requestLayout();
}

差不多就是这样，然后它工作正常，但这个解决方案可以进一步优化。

【讨论】：

很好。非常有用且准确。
完美！！回答解决 ScrollView 内部的所有可扩展视图问题，经过 3 小时的搜索和实施，来到这个解决方案。谢谢@Apostrofix

【解决方案3】：

你不能在滚动视图中使用列表视图，所以你应该使用滚动视图并动态添加行作为视图。

【讨论】：

【解决方案4】：

你不需要多个RelativeLayout，因为expandablelistview应该在两个项目之间（在你的情况下），这两个项目将是第一个具有parentTop和parentBottom的项目，其余的将被定位在上面/下面.

<?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="match_parent"
android:background="@color/White"
android:orientation="vertical" >

<TextView
    android:id="@+id/textView1"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentTop="true"
    android:layout_marginTop="15sp"
    android:text="In this page you can save a group of exercise under one routine."
    android:textColor="@color/Black"
    android:textSize="20sp" />

<CheckBox
    android:id="@+id/checkInstructions"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:layout_marginTop="16dp"
    android:checked="false"
    android:text="dont show again when opening the page"
    android:textColor="@color/Black" />

<TextView
    android:id="@+id/textView2"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_above="@+id/checkInstructions"
    android:layout_marginTop="15sp"
    android:text="If you want to open the instruction again check &apos;need help?&apos;"
    android:textColor="@color/Black"
    android:textSize="20sp" />

<ExpandableListView
    android:id="@+id/instructionsExView"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_above="@+id/textView2"
    android:layout_below="@id/textView1"
    android:layout_marginTop="15sp" >
</ExpandableListView>

</RelativeLayout>

【讨论】：

但我希望我的复选框位于 ExpandableListView 下方
就是这样，查看复选框内的 parentBottom。下一个项目将根据复选框进行绘制，查看下一个项目的属性。因为您最后看到 ExpandableListView 并不意味着它是最后一个显示在屏幕上。
它的某种工作。因为 ExpandableListView 现在只在很小的区域展开。我希望它将扩展到屏幕尺寸。查看我的编辑和屏幕截图。
我不明白你，你的第一个问题是“我的问题是我的 ExpandableListView 太大并且使 CheckBox 超出页面”但是现在你 expandableListView 占用的空间更少（因为现在复选框是在页面上）。查看您的最后一个屏幕截图，您可能只想在按下确定按钮后才显示复选框和文本？请详细说明。
我希望 ExpandableListView 根据需要获得空间，如果文本很长，它将填满页面。我希望我可以向下滚动 ExpandableListView 并进入我的复选框。

【解决方案5】：

你可以使用下面的代码来实现这件事。我用ListView你可以替换成ExpandableListView

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

<TextView
    android:id="@+id/textView1"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentTop="true"
    android:layout_marginTop="15sp"
    android:text="In this page you can save a group of exercise under one routine."
    android:textColor="@color/WHITE"
    android:textSize="20sp" />

<ListView
    android:id="@+id/listView1"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_weight="2" >

</ListView>

<TextView
    android:id="@+id/textView2"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_marginTop="15sp"
    android:text="If you want to open the instruction again check &apos;need help?&apos;"
    android:textColor="@color/WHITE"
    android:textSize="20sp" />

<CheckBox
    android:id="@+id/checkInstructions"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentLeft="true"
    android:layout_below="@+id/textView2"
    android:layout_marginBottom="20dp"
    android:layout_marginTop="16dp"
    android:checked="false"
    android:text="dont show again when opening the page"
    android:textColor="@color/WHITE" />

我用大约 50 个 listitem 值检查了上面的代码，并在一个非常小的显示设备上进行了测试，它工作正常。

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

<TextView
    android:id="@+id/textView1"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentTop="true"
    android:layout_marginTop="15sp"
    android:text="In this page you can save a group of exercise under one routine."
    android:textColor="@color/WHITE"
    android:textSize="20sp" />

<ExpandableListView
    android:id="@+id/expandableListView1"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_weight="2" >

</ExpandableListView>

<TextView
    android:id="@+id/textView2"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_marginTop="15sp"
    android:text="If you want to open the instruction again check &apos;need help?&apos;"
    android:textColor="@color/WHITE"
    android:textSize="20sp" />

<CheckBox
    android:id="@+id/checkInstructions"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentLeft="true"
    android:layout_below="@+id/textView2"
    android:layout_marginBottom="20dp"
    android:layout_marginTop="16dp"
    android:checked="false"
    android:text="dont show again when opening the page"
    android:textColor="@color/WHITE" />

我检查了ExpandableListView，它对我来说工作正常。

【讨论】：

stackoverflow.com/questions/34269075/… 请参考此链接并提供解决方案@dasdasd