A Simple Layout with two listViews.

By | March 2, 2012

Here is a simple example to show two listviews horizintally in android.

here is the java code that sets up the list.

package com.coderzheaven.pack;

import android.app.Activity;
import android.content.Context;
import android.graphics.Color;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.AdapterView;
import android.widget.ArrayAdapter;
import android.widget.ImageView;
import android.widget.ListView;
import android.widget.TextView;
import android.widget.AdapterView.OnItemClickListener;

public class AlphabetListDemo extends Activity {
	//String of alphabets //
	String[] alphabts = {"A","B","C","D","E","F","G","H","I","J","K","L"};
	ListView L1, L2;
	myAdapter myadp;
	myAdapter2 myadp2;
	String prod_arr[] = {};

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);

        L1 = (ListView)findViewById(R.id.list1);
        L2 = (ListView)findViewById(R.id.list2);

        myadp = new myAdapter(this,alphabts);
        L2.setAdapter(myadp);

        // initial populating //
        setProducts(0);

        L2.setOnItemClickListener(new OnItemClickListener(){
    		@Override
    		public void onItemClick(AdapterView<?> arg0, View arg1, int arg2,
    				long arg3) {
    			setProducts(arg2);
    		}
    	});

    }

    public void setProducts(int number){
    	prod_arr = new String[25];
    	// adding some dummy data //
    	for(int i = 0; i < 25 ; i++){
			prod_arr[i] = "Product : " + alphabts[number] + i;
		}
		//setting the adapter in listview //
		 myadp2 = new myAdapter2(AlphabetListDemo.this,prod_arr);
	     L1.setAdapter(myadp2);
    }

    class myAdapter extends ArrayAdapter<String>
    {
  	   TextView label;
  	   ImageView image;
  	   View row;
  	   public myAdapter(Context context,String[] arr)
  	   {
  		    super(context, android.R.layout.simple_list_item_1, arr);
  	   }

  	   public View getView(final int position, View convertView, ViewGroup parent)
  		{
  	 		   try{
  	 				LayoutInflater inflater=getLayoutInflater();
  	 				row = inflater.inflate(R.layout.lv_rows, parent, false);
  					label = (TextView)row.findViewById(R.id.item_title);
  					label.setText(alphabts[position]);
  					label.setTextColor(Color.YELLOW);
  	 		   }catch(Exception e){

  			   }
  		    return row;
  		}
    }
    // adapter for second list.....
    class myAdapter2 extends ArrayAdapter<String>
    {
  	   TextView label;
  	   ImageView image;
  	   View row;
  	   public myAdapter2(Context context,String[] arr)
  	   {
  		    super(context, android.R.layout.simple_list_item_1, arr);
  	   }

  	   public View getView(final int position, View convertView, ViewGroup parent)
  		{
  	 		   try{
  	 				LayoutInflater inflater=getLayoutInflater();
  	 				row = inflater.inflate(R.layout.lv_rows, parent, false);
  					label = (TextView)row.findViewById(R.id.item_title);
  					label.setText(prod_arr[position]);
  					label.setTextColor(Color.WHITE);
  	 		   }catch(Exception e){

  			   }
  		    return row;
  		}
    }
}

Here is the main.xml file.

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

    <LinearLayout
	    android:layout_width="fill_parent"
	    android:layout_height="fill_parent"
	    android:layout_marginLeft="5dp"
	    android:layout_marginRight="5dp"
	    android:layout_marginTop="5dp"
	    android:orientation="horizontal">

	    <!--  this list contains products -->
		 <ListView
		 	android:id="@+id/list1"
			android:cacheColorHint="#00000000"
			android:scrollbars="none"
			android:fadingEdge="vertical"
			android:soundEffectsEnabled="true"
			android:dividerHeight="1px"
			android:padding="0dip"
			android:smoothScrollbar="true"
		    android:layout_width="fill_parent"
		    android:layout_height="wrap_content"
		    android:drawSelectorOnTop="false"
		    android:layout_marginTop="5dip"
		    android:layout_marginLeft="5dip"
		    android:layout_marginRight="5dip"
		    android:layout_marginBottom="5dip"
		    android:layout_weight="1"
		   />

		  <ListView
		 	android:id="@+id/list2"
		 	android:layout_weight="4"
			android:cacheColorHint="#00000000"
			android:scrollbars="none"
			android:fadingEdge="vertical"
			android:soundEffectsEnabled="true"
			android:dividerHeight="1px"
			android:padding="0dip"
			android:smoothScrollbar="true"
		    android:layout_width="wrap_content"
		    android:layout_height="wrap_content"
		    android:drawSelectorOnTop="false"
		    android:layout_marginTop="5dip"
		    android:layout_marginLeft="5dip"
		    android:layout_marginRight="5dip"
		    android:layout_marginBottom="5dip" />

  	</LinearLayout>
    </LinearLayout>

Here is the layout for each row in the list .

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:padding="7dp"
    >
        <TextView
            android:id="@+id/item_title"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:padding="2dp"
            android:text="Main Item"
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:textSize="14dp"
            android:textStyle="normal" />
 </RelativeLayout>

Here is the complete source code for this example.

Leave a Reply

Your email address will not be published. Required fields are marked *