Search code examples
androidandroid-recyclerviewandroid-cardviewandroid-viewholderandroid-background

Setting recyclerview/cardview background colour dynamically


I'm wondering if it's possible to change the background colour of each recycler view item if the item contains a certain word. For example, my custom item contains 4 textviews and 1 checkbox, I want the background colour to be light brown if the item contains the word "dead", red if it contains "bench".. ect ect.. is there a way to do this?

Here is my item.xml:

<android.support.v7.widget.CardView
android:id="@+id/card_view"
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_width="match_parent"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:layout_margin="5dp"
card_view:cardCornerRadius="10dp"
card_view:cardElevation="10dp" >


<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
          android:orientation="horizontal"
          android:layout_width="match_parent"
          android:layout_height="match_parent"
android:paddingTop="5dp"
android:paddingLeft="5dp"
android:paddingRight="5dp">

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:textAppearance="?android:attr/textAppearanceSmall"
    android:text="Squat"
    android:textSize="20sp"
    android:paddingStart="5dp"
    android:paddingLeft="5dp"
    android:paddingRight="50dp"
    android:id="@+id/txtExercise"

    />

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:textAppearance="?android:attr/textAppearanceSmall"
    android:text="%"
    android:textSize="20sp"
    android:paddingLeft="10dp"
    android:paddingRight="10dp"
    android:id="@+id/txtPercentage"
    android:layout_centerVertical="true"
    android:layout_toLeftOf="@+id/txtReps"
    android:layout_toStartOf="@+id/txtReps"/>

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:textAppearance="?android:attr/textAppearanceSmall"
    android:text="Reps"
    android:paddingRight="10dp"
    android:paddingLeft="10dp"
    android:textSize="20sp"
    android:id="@+id/txtReps"
    android:layout_alignTop="@+id/check1"
    android:layout_toLeftOf="@+id/txtWeight"
    android:layout_toStartOf="@+id/txtWeight"/>

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Weight"
    android:paddingRight="10dp"
    android:paddingLeft="20dp"
    android:textSize="20sp"
    android:id="@+id/txtWeight"
    android:layout_alignParentTop="true"
    android:layout_toLeftOf="@+id/check1"
    android:layout_toStartOf="@+id/check1"/>

<CheckBox
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:id="@+id/check1"
    android:paddingRight="10dp"
    android:checked="false"
    android:layout_centerVertical="true"
    android:layout_alignParentRight="true"
    android:layout_alignParentEnd="true"/>

</RelativeLayout>

And my recycler view:

public class MyRecyclerAdapter extends RecyclerView.Adapter<MyViewHolder> {

Context mContext;
ArrayList<Workout> workout;
SharedPreferences prefs;
int firstSecondOrThird;


public MyRecyclerAdapter(Context context, ArrayList<Workout> workout, int thePosition) {
    mContext = context;
    this.workout = workout;
    this.firstSecondOrThird = thePosition;
}
// INITIALIZE HOLDER
@Override
public MyViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
    View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.workout_item, null);
    MyViewHolder holder = new MyViewHolder(view);

    return holder;
}

//BIND DATA TO VIEWS
@Override
public void onBindViewHolder(MyViewHolder holder, final int position) {
    holder.exercise.setText(workout.get(position).getExercise());
    holder.percent.setText(workout.get(position).getPercent());
    holder.reps.setText(workout.get(position).getReps());
    holder.weight.setText(workout.get(position).getWeight());
    holder.check1.setOnCheckedChangeListener(null);
    final Workout isCheck = workout.get(position);
    holder.check1.setChecked(isCheck.isCheck1());
    prefs = mContext.getSharedPreferences("checkstate", Context.MODE_PRIVATE);
    holder.check1.setChecked(prefs.getBoolean(firstSecondOrThird+"checkState"+position, false));
    isCheck.setCheck1(prefs.getBoolean(firstSecondOrThird+"checkState"+position, false));

    holder.check1.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() {
        @Override
        public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
            isCheck.setCheck1(isChecked);
            prefs.edit().putBoolean(firstSecondOrThird+"checkState"+position, isChecked).apply();
        }
    });

}

@Override
public int getItemCount() {
    return workout.size();
}
}

Thanks!


Solution

  • In the base ViewHolder class, itemView is public, so in your onBindViewHolder() method you check for which color you want and set it.

        int colorResId = R.color.default;
        if (workout.get(position).getExercise().contains("bench") {
            colorResId = R.color.red;
        //  more tests for which color to use
        }
        int color = getResources.getColor(colorResId, context);
        ((CardView) holder.itemView).setCardBackgroundColor(color);