Home » Android » android – Two ListView Side By Side

android – Two ListView Side By Side

Posted by: admin June 15, 2020 Leave a comment

Questions:

I have two ListView. And I need to place them side by side horizontally. But the problem is – Only one list is visible. (Note : The second list is in right side of the layout and can have at most 1 character. And the first list will expand to fill the rest of the screen.)

Help me please.

The layout is like this.

------------
|       |  |
|       |  |
|       |  |
|       |  |
|       |  |
|       |  |
|       |  |
|       |  |
|       |  |
------------

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

    <ListView
        android:layout_width="fill_parent"
        android:layout_height="fill_parent" />
</LinearLayout>

<LinearLayout
    android:layout_width="wrap_content"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

    <ListView
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:drawSelectorOnTop="true" />
</LinearLayout>

Shaiful

How to&Answers:

I can’t believe nobody has come up with this in three years. Perhaps somebody else will have this question.

The issue is that ListView is greedy when it comes to horizontal space. You can tell it to pipe down using layout_width='0dp' and whichever layout_weight numbers you feel are best. Below is an example putting leftListView at ¾ and rightListView at ¼. I tried it, it works fine.

<?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="match_parent"
    android:orientation="horizontal">

    <ListView
        android:id="@+id/leftListView"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_margin="2dp"
        android:layout_weight=".75" />

    <ListView
        android:id="@+id/rightListView"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_margin="2dp"
        android:layout_weight=".25" />

</LinearLayout>

Another alternative is to so the same layout trick but with FrameLayouts, then create fragments for each ListView. It’s heavier but you might find value in having the Fragments lying around.

Answer:

I think use this code it will work fine.
You have to use layout_weight = 0.5 and things will work perfectly fine.

<LinearLayout
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:layout_marginBottom="60dp"
android:layout_marginTop="60dp"
android:orientation="horizontal"
android:id="@+id/linearLayout2">
    <ListView
        android:id="@+id/sportsList"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:entries="@array/sports_array"
        android:layout_weight="0.5"/>

    <ListView
        android:id="@+id/sportsList_1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:entries="@array/sports_array"
        android:layout_weight="0.5"/>
</LinearLayout>

So, basically use two list views in a linear layout and give the weight of each layout to 0.5 . I think this helps.

Answer:

Your first LinearLayout says fill_parent for both height and width, so it will take up all the room. Instead, use a single LinearLayout that is set to horizontal, then put your two ListViews inside there. The height should be wrap_content. The width can be set however you want (not fill_parent though), and you can use minWidth and layout_weight to specify better.

Answer:

I’d suggest a LinearLayout with attribute android:orientation="horizontal"
Then put 2 LinearLayouts with android:orientation="vertical" into the horizontal one.
Now fill the vertical once with your stuff.

For futher information look here 🙂

Hope this helps!

EDIT:
Try this:

<LinearLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="75dp">
 <LinearLayout
     android:orientation="vertical"
     android:layout_width="fill_parent"
     android:layout_height="wrap_content"
     android:layout_weight="1">

**YOUR STUFF**

 </LinearLayout>
 <LinearLayout
     android:orientation="vertical"
     android:layout_width="fill_parent"
     android:layout_height="wrap_content">
     android:layout_weight="2">

 **YOUR STUFF**

 </LinearLayout>
</LinearLayout>

Answer:

Try using a relative layout or table layout as the root layout and then positioning the 2 listviews as children of the root.

Answer:

Put the two in a horizontal LinearLayout, like several have suggested. For the list on the left, set the layout_width to 0 and layout_weight to 1; for the list on the right, set layout_width to wrap_content and layout_weight to 0.

Answer:

<LinearLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:orientation="horizontal" >


        <ListView

            android:id="@+id/list_view2"
            android:layout_width="100dp"
            android:layout_height="475dp"
            android:layout_alignParentLeft="true"
            android:layout_alignParentStart="true"
            android:layout_alignParentTop="true" />

        <ListView
        android:id="@+id/list_view"
        android:layout_width="306dp"
        android:layout_height="match_parent"
        android:layout_alignParentEnd`enter code here`="true"
        android:layout_alignParentRight="true" />

</LinearLayout>

Answer:

Ok. I see that thread is dead, but i know how to do that.

My layout xml file:

<?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:orientation="horizontal" >


    <RelativeLayout
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1" >

        <RelativeLayout
            android:id="@+id/relativeLayout1"
            android:layout_width="55dp"
            android:layout_height="match_parent"
            android:layout_alignParentLeft="true"
            android:layout_alignParentTop="true" >
        </RelativeLayout>

        <ListView
            android:id="@+id/ListView01"
            android:layout_width="192px"
            android:layout_height="match_parent"
            android:layout_alignParentRight="true"
            android:layout_alignParentTop="true"
            android:layout_marginLeft="10dp"
            android:layout_marginRight="10dp"
            android:layout_toRightOf="@+id/relativeLayout1"
            android:layout_weight="1" >

        </ListView>
    </RelativeLayout>



    <RelativeLayout
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1" >

        <RelativeLayout
            android:id="@+id/relativeLayout2"
            android:layout_width="55dp"
            android:layout_height="match_parent"
            android:layout_alignParentRight="true"
            android:layout_alignParentTop="true" >
        </RelativeLayout>


        <ListView
            android:id="@+id/ListView02"
            android:layout_width="192px"
            android:layout_height="match_parent"
            android:layout_alignParentLeft="true"
            android:layout_alignParentTop="true"
            android:layout_marginLeft="10dp"
            android:layout_marginRight="10dp"
            android:layout_toLeftOf="@+id/relativeLayout2"
            android:layout_weight="1" >

        </ListView>
    </RelativeLayout>

</LinearLayout>

Second my code from activity:

 @Override  
    public void onCreate(Bundle savedInstanceState) {  
        super.onCreate(savedInstanceState);
        setRequestedOrientation (ActivityInfo.SCREEN_ORIENTATION_LANDSCAPE);
        setContentView(R.layout.main);    
        ListView lv1=(ListView)this.findViewById(R.id.ListView01);  
        ListView lv2=(ListView)this.findViewById(R.id.ListView02);
        File fCurrDirOne = new File ("/");
        File fCurrDirTwo = new File ("/");
        String[] mListOfFilesOne = fCurrDirOne.list();
        String[] mListOfFilesTwo = fCurrDirTwo.list();
        ArrayAdapter list1 = new ArrayAdapter<String>(          
                this, R.layout.itemlistview,mListOfFilesOne);  
        ArrayAdapter list2 = new ArrayAdapter<String>(          
                this, R.layout.itemlistview,mListOfFilesTwo);  
        lv1.setAdapter(list1);  
        lv2.setAdapter(list2);  
    }  

Enjoy)

P.S. you should create layuot for you list items, mine called itemlistview.xml, and you can use android.R.layout.simple_list_item_1 as default.

My itemlistview.xml file

<?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:textSize="20dp" >

</TextView>