Android – ListView – 3 – Custom ListView
-
Paresh Mayani
- June 11, 2011
- 1 min read
- 7 Comments
Problem: Android – ListView with Two TextViews and ImageView
Welcome to the part 3 of the ListView series.
So far this series:
In 2nd part, we discussed about defining custom adapter and defining a custom item xml layout file. As said in 2nd part, we can have as many as views we want in each items, to do this we just need to take views inside the item XML layout file. So as defined in the problem, we will take 2 TextView and 1 ImageView
We have already looked into defining custom adapter, so I will directly jumped into the example.
For example:
Main.xml:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
android:id="@+id/relativeLayout1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
xmlns:android="http://schemas.android.com/apk/res/android">
<ListView
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:id="@+id/listView3"
android:layout_alignParentLeft="true">
</ListView>
</RelativeLayout>
listitem_row.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
android:id="@+id/relativeLayout1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
xmlns:android="http://schemas.android.com/apk/res/android"
android:padding="5dip">
<ImageView
android:layout_width="50dip"
android:layout_height="50dip"
android:id="@+id/imgViewLogo"
android:src="@drawable/icon"
android:layout_alignParentLeft="true"
android:layout_centerInParent="true"
android:scaleType="center">
</ImageView>
<TextView
android:textAppearance="?android:attr/textAppearanceLarge"
android:layout_height="wrap_content"
android:text="TextView"
android:layout_width="wrap_content"
android:id="@+id/txtViewTitle"
android:layout_toRightOf="@+id/imgViewLogo"
android:layout_marginLeft="2dip">
</TextView>
<TextView
android:layout_height="wrap_content"
android:text="TextView"
android:layout_width="wrap_content"
android:id="@+id/txtViewDescription"
android:layout_toRightOf="@+id/imgViewLogo"
android:layout_below="@+id/txtViewTitle"
android:layout_marginLeft="2dip">
</TextView>
</RelativeLayout>
ListView3Activity.java:
package com.technotalkative.customlistview3;
import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.widget.AdapterView;
import android.widget.ListView;
import android.widget.Toast;
import android.widget.AdapterView.OnItemClickListener;
public class ListView3Activity extends Activity implements OnItemClickListener
{
/** Called when the activity is first created. */
ListView lview3;
ListViewCustomAdapter adapter;
private static String month[] = {"January","February","March","April","May",
"June","July","August","September",
"October","November","December"};
private static String desc[] = {"Month - 1","Month - 2","Month - 3",
"Month - 4","Month - 5","Month - 6","Month - 7",
"Month - 8","Month - 9","Month - 10","Month - 11","Month - 12"};
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
lview3 = (ListView) findViewById(R.id.listView3);
adapter = new ListViewCustomAdapter(this, month, desc);
lview3.setAdapter(adapter);
lview3.setOnItemClickListener(this);
}
@Override
public void onItemClick(AdapterView<?> arg0, View arg1, int position, long id) {
// TODO Auto-generated method stub
Toast.makeText(this, "Title => "+month[position]+" n Description => "+desc[position], Toast.LENGTH_SHORT).show();
}
}
ListViewCustomAdapter.java:
package com.technotalkative.customlistview3;
import android.app.Activity;
import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.ImageView;
import android.widget.TextView;
public class ListViewCustomAdapter extends BaseAdapter
{
public String title[];
public String description[];
public Activity context;
public LayoutInflater inflater;
public ListViewCustomAdapter(Activity context,String[] title, String[] description) {
super();
this.context = context;
this.title = title;
this.description = description;
this.inflater = (LayoutInflater)context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
}
@Override
public int getCount() {
// TODO Auto-generated method stub
return title.length;
}
@Override
public Object getItem(int position) {
// TODO Auto-generated method stub
return null;
}
@Override
public long getItemId(int position) {
// TODO Auto-generated method stub
return 0;
}
public static class ViewHolder
{
ImageView imgViewLogo;
TextView txtViewTitle;
TextView txtViewDescription;
}
@Override
public View getView(int position, View convertView, ViewGroup parent) {
// TODO Auto-generated method stub
ViewHolder holder;
if(convertView==null)
{
holder = new ViewHolder();
convertView = inflater.inflate(R.layout.listitem_row.xml, null);
holder.imgViewLogo = (ImageView) convertView.findViewById(R.id.imgViewLogo);
holder.txtViewTitle = (TextView) convertView.findViewById(R.id.txtViewTitle);
holder.txtViewDescription = (TextView) convertView.findViewById(R.id.txtViewDescription);
convertView.setTag(holder);
}
else
holder=(ViewHolder)convertView.getTag();
holder.imgViewLogo.setImageResource(R.drawable.icon);
holder.txtViewTitle.setText(title[position]);
holder.txtViewDescription.setText(description[position]);
return convertView;
}
}
