RSS

Binding Android ListView with Custom Objects using ArrayAdapter

06 Feb
In my previous tutorial Binding Android ListView with String Array using ArrayAdapter, I have shown you how you can bind the Android ListView control with an array of String objects. Although it was a very simple implementation, but it was useful for those who are just starting learning Android application development. As an Android developer, soon you will realize that showing simple Strings in the ListView is not what you exactly want in real-world  Android Apps, and you will often find yourself dealing with collections  of custom Java objects. In this tutorial, I have decided to show you how you can bind Android ListView with custom objects using ArrayAdapter.
Create a new Android project in Eclipse with MainActivity as your default Activity and main.xml as your default layout file. Declare aListView control in your main.xml layout file as shown in the following code.

main.xml
<?xml version=”1.0″ encoding=”utf-8″?>
<LinearLayout xmlns:android=”http://schemas.android.com/apk/res/android&#8221;
android:orientation=”vertical”
android:layout_width=”fill_parent”
android:layout_height=”fill_parent”>

 <ListView
android:id=”@+id/listView1″
android:layout_height=”fill_parent”
android:layout_width=”fill_parent” />

</LinearLayout>
The above code is using simple LinearLayout with vertical orientation, and a ListView is declared to cover the entire width and height of the parent container using the fill_parent as the value of both android:layout_height and android:layout:width properties.ListView also has a unique id listView1 that will be used in the MainActivity to reference the ListView control.

Before I show you the MainActivity code, you need to create a java class whose objects you will bind with the ListView. Add a new class Product in your Android project and add the following code in it.

Product.java
public class Product {
private int id;
private String name;
private double price;

public Product(){
super();
}

public Product(int id, String name, double price) {
super();
this.id = id;
this.name = name;
this.price = price;
}

@Override
public String toString() {
return this.id + “. ” + this.name + ” [$” + this.price + “]”;
}

}

The MainActivity code is shown below first access the ListView control by passing the generated id to findViewById function. Then the array of Product objects is defined and passed as a parameter to the constructor of ArrayAdapter. Finally, the adapter is provided to ListView using setAdapter function available in ListView class. You may be wondering how the ListView will display the Productobject and which property of the Product object will be displayed. The answer is very simple, by default Android ListView control renders a simple TextView inside every ListView item and TextView control can only display simple text. Notice how the toString()function is overridden in the Product class we defined above. Whatever String you will return from the object toString() function will be displayed in the TextView rendered in the ListView items.

MainActivity.java
public class MainActivity extends Activity {

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

ListView listView1 = (ListView) findViewById(R.id.listView1);

Product[] items = {
new Product(1, “Milk”, 21.50),
new Product(2, “Butter”, 15.99),
new Product(3, “Yogurt”, 14.90),
new Product(4, “Toothpaste”, 7.99),
new Product(5, “Ice Cream”, 10.00),
};

ArrayAdapter<Product> adapter = new ArrayAdapter<Product>(this,
android.R.layout.simple_list_item_1, items);

listView1.setAdapter(adapter);
}
}

Run your project and you will be able to see the following output.

Android ListView Custom Objects_ArrayAdapter

 

Referenced by: http://www.ezzylearning.com/tutorial.aspx?tid=6816874&q=binding-android-listview-with-custom-objects-using-arrayadapter

Advertisements
 
Leave a comment

Posted by on February 6, 2012 in Android

 

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

 
%d bloggers like this: