Custome ListView Example output
Custom ListView Output |
Project Structure
Project Structure |
Step 1 :
Create a new package “model”
Under this package create a
class “ListItem.class”
/**
* Created by prats on 5/28/2015.
*/
public class ListItem {
public String getCountryName() {
return countryName;
}
public void setCountryName(String countryName) {
this.countryName = countryName;
}
public String getCountryCurrancy() {
return countryCurrancy;
}
public void setCountryCurrancy(String countryCurrancy) {
this.countryCurrancy = countryCurrancy;
}
public int getCountryImage() {
return countryImage;
}
public void setCountryImage(int countryImage) {
this.countryImage = countryImage;
}
private String countryName;
private String countryCurrancy;
private int countryImage;
}
Step 2 :
Create a new package “adapter”
Under this package create a
class “CustomAdapter.class”
package com.pratik.customlistviewexample.adapter;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;
import com.pratik.customlistviewexample.R;
import com.pratik.customlistviewexample.model.ListItem;
import java.util.ArrayList;
/**
* Created by prats on 5/28/2015.
*/
public class CustomAdapter extends BaseAdapter {
private Context context;
private ArrayList<ListItem> arrayList;
public CustomAdapter(Context context,ArrayList<ListItem> arrayList)
{
this.context = context;
this.arrayList = arrayList;
}
@Override
public int getCount() {
return arrayList.size();
}
@Override
public Object getItem(int position) {
return arrayList.get(position);
}
@Override
public long getItemId(int position) {
return position;
}
@Override
public View getView(int position, View convertView, ViewGroup parent) {
if (convertView == null) {
LayoutInflater vi =
(LayoutInflater)context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
convertView = vi.inflate(R.layout.custom_row, null);
}
final ListItem listItem = arrayList.get(position);
if (listItem != null)
((TextView) convertView.findViewById(R.id.txtCountryName)).setText(listItem.getCountryName());
((TextView) convertView.findViewById(R.id.txtCountryCurrancy)).setText(listItem.getCountryCurrancy());
((ImageView) convertView.findViewById(R.id.imgCountryFlag)).setImageResource(listItem.getCountryImage());
return convertView;
}
}
public View getView(int position, View convertView, ViewGroup parent) {
if (convertView == null) {
LayoutInflater vi =
(LayoutInflater)context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
convertView = vi.inflate(R.layout.custom_row, null);
}
final ListItem listItem = arrayList.get(position);
if (listItem != null)
((TextView) convertView.findViewById(R.id.txtCountryName)).setText(listItem.getCountryName());
((TextView) convertView.findViewById(R.id.txtCountryCurrancy)).setText(listItem.getCountryCurrancy());
((ImageView) convertView.findViewById(R.id.imgCountryFlag)).setImageResource(listItem.getCountryImage());
return convertView;
}
}
Step 3:
Create a new layout xml file
“custom_row.xml” under directory ”layout”
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<ImageView
android:id="@+id/imgCountryFlag"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_margin="10dp" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_gravity="center">
<TextView
android:id="@+id/txtCountryName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="10dp" />
<TextView
android:id="@+id/txtCountryCurrancy"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="10dp"/>
</LinearLayout>
</LinearLayout>
</LinearLayout>
Step 4:
activity_main
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#FFFFFF">
<ListView
android:id="@+id/listView"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:dividerHeight="1dp"
android:divider="#ff305aff"/>
</LinearLayout>
Step 4:
MainActivity.class
package com.pratik.customlistviewexample;
import android.support.v7.app.ActionBarActivity;
import android.os.Bundle;
import android.widget.ListView;
import com.pratik.customlistviewexample.adapter.CustomAdapter;
import com.pratik.customlistviewexample.model.ListItem;
import java.util.ArrayList;
public class MainActivity extends ActionBarActivity {
private ListView listView;
private CustomAdapter customAdapter;
private ArrayList<ListItem> arrayList;
private String[] countryList =new String[] {"Australia",
"Brazil",
"Canada",
"Denmark",
"Egypt",
"France",
"Germany",
"Hong Kong",
"India",
"Japan"};
private String[] countryCurrancy =new String[] {"AUD Australian dollar",
"BRL Brazilian real",
"CAD Canadian dollar",
"DKK Danish krone",
"EGP Egyptian pound",
"EUR Euro",
"EUR Euro",
"HKD Hong Kong dollar",
"INR Indian rupee",
"JPY Japanese yen"};
private int[] flags =new int[] { R.drawable.ic_australia,
R.drawable.ic_brazil,
R.drawable.ic_canada,
R.drawable.ic_danmark,
R.drawable.ic_egypt,
R.drawable.ic_france,
R.drawable.ic_germany,
R.drawable.ic_hong_kong,
R.drawable.ic_india,
R.drawable.ic_japan};
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
listView = (ListView) findViewById(R.id.listView);
arrayList = new ArrayList<ListItem>();
for (int i = 0;i <=9;i++){
ListItem listItem = new ListItem();
listItem.setCountryName(countryList[i]);
listItem.setCountryCurrancy(countryCurrancy[i]);
listItem.setCountryImage(flags[i]);
arrayList.add(listItem);
}
customAdapter = new CustomAdapter(this,arrayList);
listView.setAdapter(customAdapter);
}
}
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
listView = (ListView) findViewById(R.id.listView);
arrayList = new ArrayList<ListItem>();
for (int i = 0;i <=9;i++){
ListItem listItem = new ListItem();
listItem.setCountryName(countryList[i]);
listItem.setCountryCurrancy(countryCurrancy[i]);
listItem.setCountryImage(flags[i]);
arrayList.add(listItem);
}
customAdapter = new CustomAdapter(this,arrayList);
listView.setAdapter(customAdapter);
}
}
Step 4:
Copy and paste below flag images into "drawable" folder
ic_austrailia |
ic_brazil |
ic_canada |
ic_denmark |
ic_egypt |
ic_france |
ic_germany |
ic_hong_kong |
ic_india |
ic_japan |
You can download this project from below link :
https://drive.google.com/file/d/0By1zg6cvLTQ9S1NaRHppYzZPVzQ/view?usp=sharing