Android: Customizing the ListView interface

A ListView that can only display a piece of text is just too dull, and we can now customize the ListView interface to allow it to display richer content.

First of all, we need to prepare a set of pictures, corresponding to each of the fruits provided above, we will let these fruit names next to a pattern.

Next, define an entity class as the adapter type for the ListView adaptor. To create a new class Fruit, the code looks like this:

public class Fruit {private String name; private int imageId;

Public Fruit (String name, int imageId) {

THIS.name = name;

This.imageid = imageId;

}

Public String GetName () {

return name;

}

public int Getimageid () {

return imageId;

}

}

There are only two fields in the Fruit class, name indicates the name of the fruit, and imageId represents the resource ID of the fruit corresponding to the picture. Then you need to specify a custom layout for the child of the ListView and create a new one in the layout directory

Fruit_item.xml, the code is as follows:

<linearlayout xmlns:android= "Http://schemas.android.com/apk/res/android" android:layout_width= "match_parent" android:layout_height= "match_parent" >

<imageview android:id= "@+id/fruit_image" android:layout_width= "wrap_content" android:layout_height= "Wrap_ Content "/>

<textview android:id= "@+id/fruit_name" android:layout_width= "wrap_content" android:layout_height= "wrap_content "android:layout_gravity=" center "android:layout_marginleft=" 10dip "/>

</LinearLayout>

In this layout, we define a picture of the ImageView used to display the fruit, and define a

TextView is used to display the name of the fruit.

Next, you need to create a custom adapter that inherits from Arrayadapter and designates the generic as the Fruit class. To create a new class Fruitadapter, the code looks like this:

public class Fruitadapter extends Arrayadapter<fruit> {

private int resourceId;

Publicfruitadapter (context context, int Textviewresourceid, list<fruit>objects) {

Super (context, Textviewresourceid, objects);

ResourceId = Textviewresourceid;

}

@Override

Public View GetView (int position, View Convertview, ViewGroup parent) {fruitfruit = GetItem (position);// Get the current item's Fruit Instances

Viewview = Layoutinflater.from (GetContext ()). Inflate (resourceId, NULL); ImageView fruitimage = (ImageView) View.findviewbyid (r.id.fruit_image); TextView fruitname = (TextView) View.findviewbyid (r.id.fruit_name); Fruitimage.setimageresource (Fruit.getimageid ()); Fruitname.settext (Fruit.getname ());

return view;

}

}

Fruitadapter overrides a set of constructors for the parent class to pass in the ID and data of the context, ListView child layout. It also overrides the GetView () method, which is called when each child is scrolled into the screen. In the GetView method, we first get the Fruit instance of the current item through the GetItem () method, then use Layoutinflater to load our incoming layout for this subkey, and then call the View's Findviewbyid () method to get to the Image View and TextView instances, and call their Setimageresource () and SetText () methods respectively to set the displayed picture and text, and finally return the layout so that our custom adapter is complete.

The following changes the code in Mainactivity as follows:

public class Mainactivity extends Activity {

Private list<fruit> fruitlist = newarraylist<fruit> ();

@Override

Protected voidoncreate (Bundle savedinstancestate) {super.oncreate (savedinstancestate); Setcontentview ( R.layout.activity_main);

initfruits ();// Initialization of fruit data

Fruitadapter adapter = Newfruitadapter (Mainactivity.this, R.layout.fruit_item, fruitlist);

ListView ListView = (ListView) Findviewbyid (R.id.list_view);

Listview.setadapter (adapter);

}

private void Initfruits () {

Fruit Apple = new Fruit ("Apple", r.drawable.apple_pic);

Fruitlist.add (Apple);

Fruit banana = new Fruit ("banana", r.drawable.banana_pic);

Fruitlist.add (banana);

Fruit orange = new Fruit ("Orange", r.drawable.orange_pic);

Fruitlist.add (orange);

Fruit watermelon = new Fruit ("Watermelon", r.drawable.watermelon_pic);

Fruitlist.add (watermelon);

Fruit pear = new Fruit ("Pear", r.drawable.pear_pic);

Fruitlist.add (pear);

Fruit grape = new Fruit ("Grape", r.drawable.grape_pic);

Fruitlist.add (grape);

Fruit pineapple = new Fruit ("Pineapple", r.drawable.pineapple_pic);

Fruitlist.add (pineapple);

Fruit Strawberry = new Fruit ("Strawberry", r.drawable.strawberry_pic);

Fruitlist.add (strawberry);

Fruit cherry = new Fruit ("Cherry", r.drawable.cherry_pic);

Fruitlist.add (cherry);

Fruit mango = new Fruit ("Mango", r.drawable.mango_pic);

Fruitlist.add (Mango);

}

}

As you can see, a initfruits () method is added here to initialize all the fruit data. In the constructor of the Fruit class, the name of the fruit and the corresponding image ID are passed in, and the created object is added to the fruit list. We then created the Fruitadapter object in the OnCreate () method and passed the Fruitadapter as an adapter to the ListView. This completes the task of customizing the ListView interface.

Now rerun the program, as shown in effect 3.30.

Figure 3.30

Android: Customizing the ListView interface