Pages

Wednesday 13 November 2013

Multi Item ListView using Base Adapter

                                         Multi Item ListView using Base Adapter

Today, We will learn how to create multi item listview using base adapter.

1. First create new project, After creating new project open your main.xml file and add listview in this like.

<ListView
        android:id="@+id/listView1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_below="@+id/textView1"
        android:layout_marginTop="36dp" >
    </ListView>

2. Create custom layout for your listview which contain two textview and one imageview.
See following code.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="?android:attr/listPreferredItemHeight"
    android:padding="6dip" >
    <ImageView
        android:id="@+id/icon"
        android:layout_width="wrap_content"
        android:layout_height="fill_parent"
        android:layout_alignParentBottom="true"
        android:layout_alignParentTop="true"
        android:layout_marginRight="6dip"
        android:contentDescription="TODO"
        android:src="@drawable/ic_launcher" />
    <TextView
        android:id="@+id/names"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignTop="@+id/icon"
        android:layout_marginLeft="14dp"
        android:layout_toRightOf="@+id/icon"
        android:text="TextView" />
    <TextView
        android:id="@+id/profession"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignBottom="@+id/icon"
        android:layout_alignLeft="@+id/names"
        android:text="TextView" />
</RelativeLayout>  


3. Create MainActivity.java.  :- Initialize listview , create two array for your listview, Suppose i take name and profession.   

you need to pass both arry and activity context to your custom adapter class. 

ListAdpater = new DynamicListAdapter(this,Names,Profession);  

Then set adapter to your listview like

listviewObj.setAdapter(ListAdpater);  

Take a look at following code.

public class MainActivity extends Activity { private ListView listviewObj; private DynamicListAdapter ListAdpater; private String[] Names = {"Sandeep Armal","Arun Choudhari", "Pradeep Chavan","Shrikant Pathe","Sarang Takone","Abhiraj Nagtode"}; private String[] Profession = {"Android Developer","Network Adminstartor", "Database Adminstrative","Customer Support","BMC Tool Manager","WildLife Photographer"}; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); initializeVariable(); ListAdpater = new DynamicListAdapter(this,Names,Profession); listviewObj.setAdapter(ListAdpater); } private void initializeVariable() { listviewObj = (ListView)findViewById(R.id.listView1); } }
4.  Create Custom Adapetr class.
Then custom adapter class. in this code your are actually getting and setting value in listview.
Extend BaseAdapter class , After extending you will get override method in your class .

You can get view of your custom listview in getView() method. In this method you can initialize your textviews, ImageView and set value to this object.  See.

public class DynamicListAdapter extends BaseAdapter{ private String[] names; private String[] profession; private Activity context; private static LayoutInflater layoutInflater = null; public DynamicListAdapter(Activity context, String[] names, String[] profession) { this.names = names; this.profession = profession; this.context = context; layoutInflater = (LayoutInflater)context.getSystemService(Context.LAYOUT_INFLATER_SERVICE); }
@Override public int getCount() { // TODO Auto-generated method stub return this.names.length; }
@Override public Object getItem(int position) { // TODO Auto-generated method stub return position; }
@Override public long getItemId(int position) { // TODO Auto-generated method stub return position; }
@Override public View getView(int arg0, View convertView, ViewGroup arg2) { View view = convertView;     if(convertView==null)               view = layoutInflater.inflate(R.layout.list_item_layout, null);   ImageView  icon = (ImageView)view.findViewById(R.id.icon); TextView tvNames = (TextView)view.findViewById(R.id.names); TextView tvProfession = (TextView)view.findViewById(R.id.profession); icon.setImageDrawable(context.getResources().getDrawable(R.drawable.ic_launcher)); tvNames.setText(names[arg0]); tvProfession.setText(profession[arg0]);
return view; }} 
Enjoy code.

download code from here