How to make listview expandable inside a scrollview

Question

Since i am new in android programming i am facing one issue as described below :

I have a ListView inside a ScrollView , but it is not expanding (eg : if i have 3 data, the ListView is only showing 1 data) i need to make the ListView expanding.

Here is my xml:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/fragment_profile"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#ffffff">

<ScrollView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:id="@+id/svprofile"
    android:layout_alignParentTop="true"
    android:layout_alignParentLeft="true"
    android:layout_alignParentStart="true">

    <LinearLayout
        android:id="@+id/linLayout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginLeft="20dp"
        android:layout_marginRight="20dp"
        android:orientation="vertical">

        <de.hdodenhof.circleimageview.CircleImageView
            android:id="@+id/imageToUpload"
            android:layout_width="200dp"
            android:layout_height="200dp"
            android:layout_gravity="center_horizontal"
            android:src="@drawable/ic_menu_camera"
            android:layout_marginTop="10dp" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:text="Profile Detail"
            android:id="@+id/tvProfileDetail"
            android:layout_marginTop="30dp" />

        <EditText
            android:id="@+id/etFullname"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:hint="@string/Fullname"
            android:editable="false"/>

        <EditText
            android:id="@+id/etEmail"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:inputType="textEmailAddress"
            android:hint="@string/Email"/>

        <EditText
            android:id="@+id/etPhone"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:inputType="phone"
            android:hint="@string/Phone"/>

        <EditText
            android:id="@+id/etAddress"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:minLines="1"
            android:maxLines="3"
            android:hint="@string/Address"/>

        <EditText
            android:id="@+id/etDirectSuperiorName"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:hint="@string/DirectSuperiorName"
            android:editable="false"/>

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:text="Leave Balance"
            android:id="@+id/tvSisaCuti"
            android:layout_marginTop="20dp" />

        <EditText
            android:id="@+id/etSisaCuti"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:hint="Sisa Cuti"
            android:layout_marginTop="1dp"
            android:editable="false"
            android:paddingTop="10dp" />

        <ListView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:id="@+id/lvProfile"
            android:choiceMode="singleChoice"
            android:headerDividersEnabled="false"
            android:divider="@null"
            android:dividerHeight="0dp"/>
    </LinearLayout>
</ScrollView>

Design

Any help would be appreciate. Thanks fellas

Answer 1

you can use ExpandableListView instead of using listview.

 <ExpandableListView
            android:id="@+id/activity_expandable_list_view"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@color/white"/>

refer this for more details.

http://thedeveloperworldisyours.com/android/expandable-listview-inside-scrollview/#sthash.awUvzL7C.dpbs

Answer 2

You are setting android:layout_height="wrap_content" that's why it's showing only one row. wrap_content to resize listView to it's all items doesn't work.

<ListView
            android:layout_width="match_parent"
            android:layout_height="500dp"
            android:id="@+id/lvProfile"
            android:choiceMode="singleChoice"
            android:headerDividersEnabled="false"
            android:divider="@null"
            android:dividerHeight="0dp"/>

Answer 3

It is not good practice to use one Scrolling UI component in another Scrolling UI component.

You should change you implementation logic.

Answer 4

If you are using listview inside ScrollView then plz follow below code It will help you to resolve your issue:

For exe

listview.setAdapter(youradapter);
setListViewHeightBasedOnChildren(youradapter) 

public void setCustomListViewHeightBasedOnChildren(ListView listView, YourAdapter yourAdapter) {
            if (yourAdapter == null) {
                return;
            }
            int totalHeight;
            int listWidth = listView.getMeasuredWidth();
            int items = yourAdapter.getCount();
            if (items == 0) {
                totalHeight = 0;
            } else {
                View childView = yourAdapter.getView(0, null, listView);
                childView.measure(MeasureSpec.makeMeasureSpec(listWidth, MeasureSpec.EXACTLY),
                        MeasureSpec.makeMeasureSpec(0, MeasureSpec.UNSPECIFIED));
                totalHeight = childView.getMeasuredHeight() * items;
            }
            ViewGroup.LayoutParams params = listView.getLayoutParams();
            params.height = totalHeight;
            listView.setLayoutParams(params);
            listView.requestLayout();
    }

Answer 5

you can you do like this:

 <ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/activity_expandable_scroll_view"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:fillViewport="true">
     
        <LinearLayout
            android:id="@+id/LinearLayout1"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical"
            android:paddingBottom="@dimen/activity_vertical_margin"
            android:paddingLeft="@dimen/activity_horizontal_margin"
            android:paddingRight="@dimen/activity_horizontal_margin"
            android:paddingTop="@dimen/activity_vertical_margin">
     
    <!-- your code --->
     
     <ExpandableListView
                android:id="@+id/activity_expandable_list_view"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:background="@color/white"/>
     
        </LinearLayout>
    </ScrollView>

then you need a function in your activity or fragment:

private fun setListViewHeight(
        listView: ExpandableListView,
        group: Int
    ) {
        val listAdapter: ExpandableListAdapter =
            listView.expandableListAdapter as ExpandableListAdapter
        var totalHeight = 0
        val desiredWidth: Int = View.MeasureSpec.makeMeasureSpec(
            listView.getWidth(),
            View.MeasureSpec.EXACTLY
        )
        for (i in 0 until listAdapter.groupCount) {
            val groupItem: View = listAdapter.getGroupView(i, false, null, listView)
            groupItem.measure(desiredWidth, View.MeasureSpec.UNSPECIFIED)
            totalHeight += groupItem.measuredHeight
            if (listView.isGroupExpanded(i) && i != group
                || !listView.isGroupExpanded(i) && i == group
            ) {
                for (j in 0 until listAdapter.getChildrenCount(i)) {
                    val listItem: View = listAdapter.getChildView(
                        i, j, false, null,
                        listView
                    )
                    listItem.measure(desiredWidth, View.MeasureSpec.UNSPECIFIED)
                    totalHeight += listItem.measuredHeight
                }
            }
        }
        val params: ViewGroup.LayoutParams = listView.layoutParams
        var height: Int = (totalHeight
                + listView.dividerHeight * (listAdapter.groupCount - 1))
        if (height < 10) height = 200
        params.height = height
        listView.layoutParams = params
        listView.requestLayout()
    }

you can check this post and the example in you github