Two ListViews inside a Linear Layout

Question

PLease help me with layout of the two list views placed vertically in the Linear Layout. Problem is that if list1 had more data than list2 is not visible and it not scrollable, using scollview is not solution.

     <?xml version="1.0" encoding="utf-8"?>
     <LinearLayout  xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:background="@drawable/backrepeat"
    android:orientation="vertical" >

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:background="@drawable/shape_calendar_top"
        android:orientation="horizontal" >

        <ImageView
            android:id="@+id/prevMonth"
            android:layout_width="50dp"
            android:layout_height="55dp"
            android:src="@drawable/button_events_previous" >
        </ImageView>

        <TextView
            android:id="@+id/currentMonth"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_vertical"
            android:layout_weight="0.6"
            android:gravity="center_vertical|center_horizontal"
            android:text="Janauary"
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:textColor="#d458b1"
            android:textStyle="bold" >
        </TextView>

        <ImageView
            android:id="@+id/nextMonth"
            android:layout_width="50dp"
            android:layout_height="55dp"
            android:src="@drawable/button_events_next" />
    </LinearLayout>


        <TextView
            android:id="@+id/direction_label"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_alignParentLeft="true"
            android:layout_alignParentRight="true"
            android:layout_marginTop="10dp"
            android:background="#DA81F5"
            android:paddingLeft="5dp"
            android:paddingTop="5dp"
            android:text="PRESS RELEASES"
            android:textColor="#FFFFFF"
            android:textSize="13dip" />

        <ListView
            android:id="@+id/eventsList"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_below="@+id/direction_label"
            android:background="#ffffff" >
        </ListView>


        <TextView
            android:id="@+id/direction_label1"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="10dp"
            android:background="#DA81F5"
            android:paddingLeft="5dp"
            android:paddingTop="5dp"
            android:text="SPEECHES"
            android:textColor="#FFFFFF"
            android:textSize="13dip" />

        <ListView
            android:id="@+id/eventsList1"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_below="@+id/direction_label1"
            android:background="#ffffff" >
        </ListView>


    <TextView
        android:id="@+id/empty_list"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:gravity="center"
        android:text=""
        android:textAppearance="?android:attr/textAppearanceMedium" />

</LinearLayout>

If I use the scrollview then it is wrapping up the listview for only first row.

Please suggest something.

EDIT :

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

<LinearLayout 
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:background="@drawable/backrepeat"
    android:orientation="vertical" >



    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:background="@drawable/shape_calendar_top"
        android:orientation="horizontal" >

        <ImageView
            android:id="@+id/prevMonth"
            android:layout_width="50dp"
            android:layout_height="55dp"
            android:src="@drawable/button_events_previous" >
        </ImageView>

        <TextView
            android:id="@+id/currentMonth"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_vertical"
            android:layout_weight="0.6"
            android:gravity="center_vertical|center_horizontal"
            android:text="Janauary"
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:textColor="#d458b1"
            android:textStyle="bold" >
        </TextView>

        <ImageView
            android:id="@+id/nextMonth"
            android:layout_width="50dp"
            android:layout_height="55dp"
            android:src="@drawable/button_events_next" />
    </LinearLayout>


        <TextView
            android:id="@+id/direction_label"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_alignParentLeft="true"
            android:layout_alignParentRight="true"
            android:layout_marginTop="10dp"
            android:background="#DA81F5"
            android:paddingLeft="5dp"
            android:paddingTop="5dp"
            android:text="PRESS RELEASES"
            android:textColor="#FFFFFF"
            android:textSize="13dip" />

        <ListView
            android:id="@+id/eventsList"
            android:layout_width="fill_parent"
            android:layout_height="0dp"
            android:layout_weight="1"
            android:layout_below="@+id/direction_label"
            android:background="#ffffff" >
        </ListView>

        <TextView
            android:id="@+id/direction_label1"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="10dp"
            android:background="#DA81F5"
            android:paddingLeft="5dp"
            android:paddingTop="5dp"
            android:text="SPEECHES"
            android:textColor="#FFFFFF"
            android:textSize="13dip" />

        <ListView
            android:id="@+id/eventsList1"
            android:layout_width="fill_parent"
                 android:layout_height="0dp"
            android:layout_weight="1"
            android:layout_below="@+id/direction_label1"
            android:background="#ffffff" >
        </ListView>

    <TextView
        android:id="@+id/empty_list"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:gravity="center"
        android:text=""
        android:textAppearance="?android:attr/textAppearanceMedium" />

</LinearLayout>

If I use this, nothing is shown :(

Asmi

EDIT : CODE FOR THE TWO LISTVIEWS:

            {
                arrayofWebData.add(cn);
                listAdapter = new SelectArralAdapter(getActivity(),
                        arrayofWebData);
                List_events.setAdapter(listAdapter);
            }

For the Second ListView it is as follows :

  if ((year == event_year) && (event_month == month))

            {
            arrayofWebDataPress.add(cn);
            listAdapter_press = new   SelectArralAdapter_Press(getActivity(),arrayofWebDataPress);
                List_events_press.setAdapter(listAdapter_press);
                i++;

            }

Array Adapter for the two ListViews :

     class SelectArralAdapter_Press extends ArrayAdapter<PressDB> {

    private LayoutInflater inflater;

    public SelectArralAdapter_Press(Context context,
            ArrayList<PressDB> arrayofWebDataPress) {

        super(context, R.layout.speech_list_item, R.id.event_title,
                arrayofWebDataPress);
        inflater = LayoutInflater.from(context);

    }

    @Override
    public View getView(int position, View convertView, ViewGroup parent) {

        ViewHolder_Press holder;
        if (convertView == null) {

            convertView = inflater.inflate(R.layout.speech_list_item, null);

            holder = new ViewHolder_Press(convertView);
            convertView.setTag(holder);

        } else {

            holder = (ViewHolder_Press) convertView.getTag();
        }
        holder.populateFrom(arrayofWebDataPress.get(position));

        return (convertView);
    }

}

  class ViewHolder_Press{
    public TextView event_name = null;
    public TextView event_date = null;

    public ViewHolder_Press(View row) {
        event_name = (TextView) row.findViewById(R.id.event_title);
        event_date = (TextView) row.findViewById(R.id.event_date_time);

    }

    void populateFrom(PressDB eventsMainDB) {
        event_name.setText(eventsMainDB.press_name);
        event_date.setText(eventsMainDB.press_date + " ");
    }
}

For the second Adaper :

      class SelectArralAdapter extends ArrayAdapter<SpeechDB> {

    private LayoutInflater inflater;

    public SelectArralAdapter(Context context,
            ArrayList<SpeechDB> arrayofWebData) {

        super(context, R.layout.speech_list_item, R.id.event_title,
                arrayofWebData);
        inflater = LayoutInflater.from(context);

    }

    @Override
    public View getView(int position, View convertView, ViewGroup parent) {

        ViewHolder holder;
        if (convertView == null) {

            convertView = inflater.inflate(R.layout.speech_list_item, null);

            holder = new ViewHolder(convertView);
            convertView.setTag(holder);

        } else {

            holder = (ViewHolder) convertView.getTag();
        }
        holder.populateFrom(arrayofWebData.get(position));

        return (convertView);
    }

}

class ViewHolder {
    public TextView event_name = null;
    public TextView event_date = null;

    public ViewHolder(View row) {

        event_name = (TextView) row.findViewById(R.id.event_title);

        event_date = (TextView) row.findViewById(R.id.event_date_time);

    }

    void populateFrom(SpeechDB eventsMainDB) {
        event_name.setText(eventsMainDB.speech_name);

        event_date.setText(eventsMainDB.speech_date + " ");


    }

}

similar problem here http://stackoverflow.com/questions/14952155/relativelayout-content-can-not-be-seen/14952256#14952256 — Charan Pai, Feb 20 '13 at 04:27
Which solution you recommend I tried with relative layout, it is not working — Asmi, Feb 20 '13 at 04:38
You can try to put `layout_weight=1` attribute on both your `ListView` and both will take the same proportion. Remember to change `layout_height` to `0` instead of `wrap_content`. — Aprian, Feb 20 '13 at 04:41
If I give fixed height , will the Listview expand accroding to the size of elemnts inside it — Asmi, Feb 20 '13 at 05:03
you have to fix the size of the listview.weather by weight or by giving fix size. and if the rows will be more then the listview starts scrolling. Seen my answer below — Narendra Pal, Feb 20 '13 at 05:07
can u give us the code, how u r adding rows in the listview ? @Asmi — Shoshi, Feb 20 '13 at 05:16

Narendra Pal · Answer 1 · 2013-02-20T05:13:43.603

Try this.

If you want to go with the xml design then you have to give the fix size, either by using the weight (this is most preferable) or by giving the fix size in dp.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:background="@drawable/backrepeat"
    android:weightSum="1"
    android:orientation="vertical" >

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:background="@drawable/shape_calendar_top"
        android:orientation="horizontal" >

        <ImageView
            android:id="@+id/prevMonth"
            android:layout_width="50dp"
            android:layout_height="55dp"
            android:src="@drawable/button_events_previous" >
        </ImageView>

        <TextView
            android:id="@+id/currentMonth"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_vertical"
            android:layout_weight="0.6"
            android:gravity="center_vertical|center_horizontal"
            android:text="Janauary"
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:textColor="#d458b1"
            android:textStyle="bold" >
        </TextView>

        <ImageView
            android:id="@+id/nextMonth"
            android:layout_width="50dp"
            android:layout_height="55dp"
            android:src="@drawable/button_events_next" />
    </LinearLayout>

    <TextView
        android:id="@+id/direction_label"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentRight="true"
        android:layout_marginTop="10dp"
        android:background="#DA81F5"
        android:paddingLeft="5dp"
        android:paddingTop="5dp"
        android:text="PRESS RELEASES"
        android:textColor="#FFFFFF"
        android:textSize="13dip" />

    <ListView
        android:id="@+id/eventsList"
        android:layout_width="fill_parent"
        android:layout_height="0dp"
        android:layout_weight="0.5"
        android:layout_below="@+id/direction_label"
        android:background="#ffffff" >
    </ListView>

    <TextView
        android:id="@+id/direction_label1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="10dp"
        android:background="#DA81F5"
        android:paddingLeft="5dp"
        android:paddingTop="5dp"
        android:text="SPEECHES"
        android:textColor="#FFFFFF"
        android:textSize="13dip" />

    <ListView
        android:id="@+id/eventsList1"
        android:layout_width="fill_parent"
        android:layout_height="0dp"
        android:layout_weight="0.5"
        android:layout_below="@+id/direction_label1"
        android:background="#ffffff" >
    </ListView>

    <TextView
        android:id="@+id/empty_list"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:gravity="center"
        android:text=""
        android:textAppearance="?android:attr/textAppearanceMedium" />

</LinearLayout>

i am getting this screen at design time.

enter image description here

you mean when you run this code then you are facing this issue. — Narendra Pal, Feb 20 '13 at 05:13
No , It runs succesfully, but there is listview is empty for both the listviews — Asmi, Feb 20 '13 at 05:13
post your java code also.you might not setting the another layout on listview in your code. Please check — Narendra Pal, Feb 20 '13 at 05:15

Rahul Gokani · Answer 2 · 2013-02-20T06:52:17.663

0

You can take something like this.

<LinearLayout>
   <ScrollView>
     <LinearLayout>
       {Your All code of controls}
     </LinearLayout>
   </ScrollView>
</LinearLayout>

OR uo can take <ScrollView> as parent tag..
You can do something like this. as per my Knowledge...

edited Feb 20 '13 at 06:52

answered Feb 20 '13 at 04:38

Rahul Gokani

1,688
5
25
43

Shoshi · Answer 3 · 2013-02-20T05:08:55.767

i have used like:

<ScrollView
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#FFF">

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical"
    android:gravity="center">

// first linearlayout which is holding one textview and a listview
<LinearLayout
    ">      
    <TextView 
        />        
    <ListView
        android:id="@+id/failed_list"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_marginLeft="20dp"
        android:layout_marginRight="20dp"
        android:layout_marginTop="5dp"/>
 </LinearLayout>

// second linearlayout which is holding one textview and a listview
<LinearLayout
    ">      
    <TextView 
        />        
    <ListView
        android:id="@+id/failed_list"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_marginLeft="20dp"
        android:layout_marginRight="20dp"
        android:layout_marginTop="5dp"/>
 </LinearLayout>

// third linearlayout which is holding one textview and a listview
<LinearLayout
    ">      
    <TextView 
        />        
    <ListView
        android:id="@+id/failed_list"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_marginLeft="20dp"
        android:layout_marginRight="20dp"
        android:layout_marginTop="5dp"/>
 </LinearLayout>

// and finally i have added a button in the parent linearlayout
<Button
     />

</LinearLayout>
</ScrollView>

you can try this.

score 0 · Answer 4 · edited May 23 '17 at 12:30

Try out as below :

Here is the solution to more than one ListView within the same layout file. You can set the layout files as the below layout by providing the equal weights to each layout inside the LinearLayout.

<LinearLayout android:layout_weight="1" 
                    android:layout_height="fill_parent" 
                    android:layout_width="fill_parent">

                <ListView   android:id="@+id/list1" 
                            android:layout_height="fill_parent" 
                            android:layout_width="fill_parent">

                </ListView>
    </LinearLayout>

<LinearLayout android:layout_weight="1" 
                android:layout_height="fill_parent" 
                android:layout_width="fill_parent">

            <ListView   android:id="@+id/list2" 
                        android:layout_height="fill_parent" 
                        android:layout_width="fill_parent">

            </ListView>
</LinearLayout>

Java Code

public class MainActivity extends Activity {
private ListView lv1 = null;
private ListView lv2 = null;
private String s1[] = {"a", "b", "c", "d", "e", "f"};
private String s2[] = {"r", "s", "t", "u", "v", "w", "x"};

@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);

    setContentView(R.layout.main);
    lv1 = (ListView) findViewById (R.id.list1);
    lv2 = (ListView) findViewById (R.id.list2);

    lv1.setAdapter(new ArrayAdapter<String> (this, android.R.layout.simple_list_item_1, s1));
    lv2.setAdapter(new ArrayAdapter<String> (this, android.R.layout.simple_list_item_1, s2));

} 
}

For more details you can refer the Link which have given the solution for same.

I hope it will help you.

Thanks.

This makes the screen divided into two parts , above one for 1 listview and below for other one1, each part have its own listview scroll, can I have something like whole layout is scrollable instead separate scrolling of the listview. So that once the listview1 is finished the Listview2 starts — Asmi, Feb 20 '13 at 06:18
If I put whole Layout in scrollview, do I need to disable the scrolling of Listview — Asmi, Feb 20 '13 at 07:12
no there is no need to disable the scrolling of the listview. — GrIsHu, Feb 20 '13 at 08:34
It is not working that way , if I add scroll view only the first row is shown in the listview, rest gets overlapped — Asmi, Feb 20 '13 at 09:17

score 0 · Answer 5 · answered Feb 21 '13 at 04:57

0

I solved the issue by using section headers and combining the two listviews into one listview and categorizing them by help of Section headers.

answered Feb 21 '13 at 04:57

Asmi

301
3
13

Two ListViews inside a Linear Layout

5 Answers5