How to set background image for each ListView item in Android?

Question

<?xml version="1.0" encoding="utf-8"?> <LinearLayout 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_marginRight="6dip" android:src="@drawable/icon" /> <LinearLayout android:orientation="vertical" android:layout_width="0dip" android:layout_weight="1" android:layout_height="fill_parent"> <TextView android:id="@+id/toptext" android:layout_width="fill_parent" android:layout_height="0dip" android:layout_weight="1" android:gravity="center_vertical" android:textStyle="bold" /> <TextView android:layout_width="fill_parent" android:layout_height="0dip" android:layout_weight="1" android:id="@+id/bottomtext" android:singleLine="false" /> </LinearLayout> </LinearLayout> 

This is my current line. If I created a .JPEG and I want it to be for each element ... how can I modify this .xml file? Where would I place the image? In assets?

Answer 1

If you want to have individual backgrounds for each item in the list, you must declare your own custom adapter.

Derive it from the BaseAdapter, and the most important part for the implementation is the getView(int, View, ViewGroup) method getView(int, View, ViewGroup) .

You need to understand how android reuses existing elements of the list item view when scrolling through the list. This means: at any given time, as many views will be displayed as can be seen on the screen at the same time.

This optimal strategy of not generating too many views in general leads to the problem that you will need to set the background for each list item according to their position, which is necessary when getView is called. If you try to set the background statically only when creating the view, it will reappear again, possibly tied to the wrong item.

The getView method either brings "convertView" as the second parameter or not (null). If your method is called with the set convertView value, it means: "reuse this view for the element that is required right now."

The technique used here is well described in the API demos (Lists sections), as well as for this video blog.

Here's how to do it:

 public class MyAdapter extends BaseAdapter { public View getView(int position, View convertView, ViewGroup parent) { // position is the element id to use // convertView is either null -> create a new view for this element! // or not null -> re-use this given view for element! // parent is the listview all the elements are in if (convertView == null) { convertView = mInflater.inflate(R.layout.your_layout, null); // here you must do whatever is needed to populate the elements of your // list element layout ... } else { // re-use the given convert view // here you must set all the elements to the required values } // your drawable here for this element convertView.setBackground( ... ); // maybe here more to do with the view return convertView; } } 

This is basically it. If there are only a few background images, I would probably cache them, so you don't need to read the resources again and again!

Good luck

Answer 2

Do you need a list in which each line has its own background, for example, below?

In your code, you most likely set the ListAdapter in the view. Several adapters that you can build take in a layout or view argument. You just need to set the android: background property for the view you are pointing to.

For example, I may have an ArrayAdapter created as follows:

 new ArrayAdapter<String>(context, R.layout.item, R.id.itemName); 

Of course, I am using a ListView setAdapter with this adapter. In my item.xml file , I can define the textual representation of itemName as follows:

 <TextView android:id="@+id/itemName" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Test view" android:background="@drawable/add"/> 

However, I do not think that all types of ListAdapter have a constructor with this function. Check the documentation for the type of ListAdapter you are using. If you use one without this constructor, I think you will have to subclass the adapter and override the getView adapter to inflate your view from your XML file.

I have an add.png image in each res / drawable folder .