CardView grey on API 19 and 21

Question

I have no idea why my cards appear grey on my API 21 and 19 emulator. I have built RecyclerViews with CardViews before and they were white. I don't change the background color anywhere. It appears normal on my API 26 emulator.

This my layout for the cards:

<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="8dp">

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:gravity="center"
    android:orientation="vertical">

    <TextView
        android:id="@+id/text_view_name"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
        android:layout_marginBottom="8dp"
        android:layout_marginTop="8dp"
        android:text="Name"
        android:textColor="@android:color/black"
        android:textSize="20sp" />


    <ImageView
        android:id="@+id/image_view_upload"
        android:layout_width="match_parent"
        android:layout_height="200dp"
        android:layout_below="@+id/text_view_name" />

</RelativeLayout>

This is my adapter class:

public class ImageAdapter extends RecyclerView.Adapter<ImageAdapter.ImageViewHolder> {

private Context mContext;
private List<Upload> mUploads;


public ImageAdapter(Context context, List<Upload> uploads) {
    mContext = context;
    mUploads = uploads;
}

@Override
public ImageViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
    View v = LayoutInflater.from(mContext).inflate(R.layout.image_item, parent, false);
    return new ImageViewHolder(v);
}

@Override
public void onBindViewHolder(ImageViewHolder holder, int position) {
    Upload upload = mUploads.get(position);
    holder.textViewName.setText(upload.getName());
    Picasso.with(mContext)
            .load(upload.getImageUrl())
            .fit()
            .centerCrop()
            .into(holder.imageView);

}

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

class ImageViewHolder extends RecyclerView.ViewHolder {
    TextView textViewName;
    ImageView imageView;

    ImageViewHolder(View itemView) {
        super(itemView);

        textViewName = itemView.findViewById(R.id.text_view_name);
        imageView = itemView.findViewById(R.id.image_view_upload);
    }
}

}

I load these images from the Firebase storage. As you can see, I didn't change the background color anywhere.

Any idea?

Answer 1

I believe you are passing the wrong context to your adapter to inflate your layout. Try passing activity or fragment context instead of passing applicationConetxt. ApplicationContext does not apply the theme you defined.

OR

if you don't wanna do that. you need to change background color of your carview like this:

<android.support.v7.widget.CardView 
 xmlns:android="http://schemas.android.com/apk/res/android"
 android:layout_width="match_parent"
 android:layout_height="match_parent"
 xmlns:card="http://schemas.android.com/apk/res-auto"
 card:cardBackgroundColor="@color/colorPrimary"
 android:layout_margin="8dp">
</android.support.v7.widget.CardView>

Answer 2

I am not sure why it is showing grey on api 21.

But if you want white background then you can set the background color like this.

<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="8dp"
android:background="#FFFFFF">

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:gravity="center"
    android:orientation="vertical"
    android:background="#FFFFFF">

    <TextView
        android:id="@+id/text_view_name"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
        android:layout_marginBottom="8dp"
        android:layout_marginTop="8dp"
        android:text="Name"
        android:textColor="@android:color/black"
        android:textSize="20sp" />


    <ImageView
        android:id="@+id/image_view_upload"
        android:layout_width="match_parent"
        android:layout_height="200dp"
        android:layout_below="@+id/text_view_name" />

</RelativeLayout>

Also please note that cardview is supported from api 21 only.