My xml is as follows:
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/recyclerMainCardView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="18dp"
app:cardElevation="10dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageView
android:id="@+id/imgRecyclerMain"
android:layout_width="match_parent"
android:layout_height="100dp"
android:fitsSystemWindows="true"
android:scaleType="centerCrop" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:orientation="vertical"
android:weightSum="5">
<TextView
android:id="@+id/txtRecyclerMainTheme"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="3"
android:textSize="20sp" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="end"
android:layout_weight="2"
android:orientation="horizontal">
<TextView
android:id="@+id/txtRecyclerMainNumberCommunity"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="8dp"
android:textSize="14sp" />
<TextView
android:id="@+id/txtRecyclerMainNumberArticles"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="14sp" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
</android.support.v7.widget.CardView>
That is my recycler_main_themes.xml which in inside a recycler view to display themes. The behavior of the image I'm looking for is to have the card with both left and right borders with 8dp radius, so I've put inside the MainActivity this:
cardView.setBackgroundResource(R.drawable.card_view_border);
And this is the card_view_border.xml:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<solid android:color="@color/white" />
<corners android:topLeftRadius="10dp" android:topRightRadius="10dp" />
</shape>
But when the app runs, before the image is displayed, the cardView has both top borders with the radius then after the image is downloaded, the imageView overlaps the cardView and the card looks rectangular. Picture of how it is:
What am I missing to display it properly?
Edit: just to complement, I've tried many things such as changing the ImageView scaleType to fitXY
, set setPreventCornerOverlap(false)
on CardView, changing cardElevation on CardView and putting elevation on ImageView, but none succeeded.