How to add colored border on cardview?
Start From the material design update, it support app:strokeColor
and also app:strokeWidth
. see more
to use material design update. add following code to build.gradle
(:app)
dependencies { // ... implementation 'com.google.android.material:material:1.0.0' // ... }
and Change CardView
to MaterialCardView
try doing:
<?xml version="1.0" encoding="utf-8"?><android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="wrap_content" xmlns:card_view="http://schemas.android.com/apk/res-auto" card_view:cardElevation="2dp" card_view:cardCornerRadius="5dp"> <FrameLayout android:background="#FF0000" android:layout_width="4dp" android:layout_height="match_parent"/> <LinearLayout android:layout_width="fill_parent" android:layout_height="wrap_content" android:padding="16dp" android:orientation="vertical"> <TextView style="@style/Base.TextAppearance.AppCompat.Headline" android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="Title" /> <TextView style="@style/Base.TextAppearance.AppCompat.Body1" android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="Content here" /> </LinearLayout></android.support.v7.widget.CardView>
this removes the padding from the cardview and adds a FrameLayout with a color. You then need to fix the padding in the LinearLayout then for the other fields
Update
If you want to preserve the card corner radius create card_edge.xml in drawable folder:
<?xml version="1.0" encoding="utf-8"?><shape xmlns:android="http://schemas.android.com/apk/res/android" > <solid android:color="#F00" /> <size android:width="10dp"/> <padding android:bottom="0dp" android:left="0dp" android:right="0dp" android:top="0dp"/> <corners android:topLeftRadius="5dp" android:bottomLeftRadius="5dp" android:topRightRadius="0.1dp" android:bottomRightRadius="0.1dp"/></shape>
and in the frame layout use android:background="@drawable/card_edge"
I think this solution may not be efficient but it serves the purpose and adds flexibility with the border width.
<android.support.v7.widget.CardView android:layout_width="match_parent" android:layout_height="match_parent" android:layout_margin="40dp" android:layout_gravity="center" card_view:cardBackgroundColor="@color/some_color" card_view:cardCornerRadius="20dp" card_view:contentPadding="5dp"> <!-- Change it to customize the border width --> <android.support.v7.widget.CardView android:layout_width="match_parent" android:layout_height="match_parent" android:layout_gravity="center" card_view:cardCornerRadius="20dp" card_view:contentPadding="5dp"> <RelativeLayout android:layout_width="match_parent" android:layout_height="match_parent"> <!-- Add your UI elements --> </RelativeLayout> </android.support.v7.widget.CardView></android.support.v7.widget.CardView>