Skip to content Skip to sidebar Skip to footer

How To Change A List Item Rendering According To Its Content?

I am using a ListFragment with a CursorAdapter to display a list of items. The XML layout is pretty simple: it only consists of the title, a description and the number of comments.

Solution 1:

Inside your adapter's getView method(in your case, bindView) get the parent of the view that will be bound and update it's background color with View.setBackGroundColor!

publicvoidbindView(View view, Context context, Cursor cursor) {
   //usual stuff//...ColornewColor= colorFunction(comments_count);//calculate your new colorViewv= (View)view.getParent();
   v.setBackgroundColor(newColor);
}

In this example, I've created a list using ArrayAdapter, with a NAME followed by a random NUMBER. I wrapped this number inside a LinearLayout and according to it's value I change his parent layout.

Check my example below.

publicclassMainActivityextendsListActivity {

@OverridepublicvoidonCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setListAdapter(newColorAdapter(this, R.layout.row, mockData));
}

String[] mockData = { "Item 1", "Item 2", "Item 3", "Item 4", "Item 5", "Item 6",
        "Item 7", "Item 8", "Item 9", "Item 10", "Item 11", "Item 12" };

publicclassColorAdapterextendsArrayAdapter<String> {

    publicColorAdapter(Context context, int textViewResourceId,
            String[] objects) {
        super(context, textViewResourceId, objects);

    }

    @Overridepublic View getView(int position, View convertView, ViewGroup parent) {

        Viewrow= convertView;

        if (row == null) {
            LayoutInflaterinflater= getLayoutInflater();
            row = inflater.inflate(R.layout.row, parent, false);
        }

        TextViewlabel= (TextView) row.findViewById(R.id.title);
        label.setText(mockData[position]);

        TextViewdesc= (TextView) row.findViewById(R.id.description);
        desc.setText("Description: "+ mockData[position]);

        TextViewvalue= (TextView) row.findViewById(R.id.comments_count);

        //Here is the object you need to change the colors.LinearLayoutbackground= (LinearLayout) value.getParent();

        Randomrandom_number=newRandom();
        intcomments_count= random_number.nextInt(256);

        value.setText(comments_count+"");

        //Calculates a random colorintnewBackgroundColor= colorFunction(comments_count); 

        //Set the new background color on the comments_count parent
        background.setBackgroundColor(newBackgroundColor);

        return row;
    }

    privateintcolorFunction(int commentsNumber) {
        if (commentsNumber == 0) {
            return Color.WHITE;
        }
        elseif(commentsNumber < 0) {
            returnnewRandom().nextInt(256);
        }
        else {
            int color;
            Randomrnd=newRandom(); 
            color = Color.argb(commentsNumber, rnd.nextInt(commentsNumber), rnd.nextInt(256), rnd.nextInt(commentsNumber));

            return color;
        }
    }
}

}

row.xml:

<?xml version="1.0" encoding="utf-8"?><LinearLayoutxmlns:android="http://schemas.android.com/apk/res/android"android:layout_width="match_parent"android:layout_height="match_parent"android:gravity="center"android:orientation="horizontal"android:padding="10dip" ><RelativeLayoutandroid:layout_width="fill_parent"android:layout_height="fill_parent"android:layout_weight="0.7" ><TextViewandroid:id="@+id/title"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_alignParentLeft="true"android:layout_centerVertical="true"android:text="Large Text"android:textAppearance="?android:attr/textAppearanceLarge" /><TextViewandroid:id="@+id/description"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_alignParentLeft="true"android:layout_below="@+id/title"android:ellipsize="end"android:lines="1"android:text="Small Text"android:textAppearance="?android:attr/textAppearanceSmall" /></RelativeLayout><LinearLayoutandroid:layout_width="fill_parent"android:layout_height="wrap_content"android:layout_centerHorizontal="true"android:layout_centerVertical="true"android:layout_weight="1"android:background="@drawable/border"android:orientation="vertical" ><LinearLayoutandroid:layout_width="fill_parent"android:layout_height="fill_parent"android:orientation="vertical" ><TextViewandroid:id="@+id/comments_count"android:layout_width="fill_parent"android:layout_height="fill_parent"android:gravity="center"android:padding="10dip"android:text="Large Text"android:textAppearance="?android:attr/textAppearanceLarge" /></LinearLayout></LinearLayout></LinearLayout>

border.xml

<?xml version="1.0" encoding="utf-8"?><shapexmlns:android="http://schemas.android.com/apk/res/android"><strokeandroid:width="4dp"android:color="#000000" /><solidandroid:color="#ffffff" /><paddingandroid:left="15dp"android:top="15dp"android:right="15dp"android:bottom="15dp" /><cornersandroid:radius="4dp" /></shape>

The resulting list(portrait and landscape) are below.

List in portrait

List in landscape

Post a Comment for "How To Change A List Item Rendering According To Its Content?"