how to set colored border on cardview
Solution 1
Create drawable selector.xml
<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<solid android:color="#808080"/>
<stroke android:width="3dp" android:color="#B1BCBE" />
<corners android:radius="20dp"/>
<padding android:left="0dp" android:top="0dp"
android:right="0dp" android:bottom="0dp" />
</shape>
then give set this as a background, change color according your choice
Solution 2
Started from v28
design support library we can use Material Card View, which provides us with a material styled cardview implementation out of the box.
<android.support.design.card.MaterialCardView
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_margin="10dp">
... child views ...
</android.support.design.card.MaterialCardView>
You can further style the cardview by using two of the attributes that come with it:
- app:strokeColor - The colour to be used for the given stroke, this must be set in order to display a stroke
- app:strokeWidth - The width to be applied to the stroke of the view
Solution 3
With the material components library just use the MaterialCardView
with the app:strokeColor
and app:strokeWidth
attributes.
Note that without an app:strokeColor
, the card will not render a stroked border, regardless of the app:strokeWidth
value (the default values are app:strokeColor=@null
and app:strokeWidth=0dp
).
Something like:
<com.google.android.material.card.MaterialCardView
...
app:strokeWidth="1dp"
app:strokeColor="@color/stroke_color"
app:cardElevation="xxdp">
...
</com.google.android.material.card.MaterialCardView>
With Jetpack Compose 1.0.x
you can use the border
attribute in the Card
composable:
Card( border= BorderStroke(1.dp, Red)){
//.....
}
Solution 4
here is the solution for your problem:
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle" >
<solid android:color="#ffffff" />
<stroke android:width="1dip" android:color="#00ff00"/>
<corners android:radius="20dip"/>
</shape>
use it as background drawable of your layout
Solution 5
I did this a little simpler by making the cardBackgroundColor
green and contentPadding
1dp
and inside the card having a ConstraintLayout
(or other layout) with a white background, like this:
<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="8dp"
app:cardBackgroundColor="@color/colorAccent"
app:contentPadding="1dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<android.support.constraint.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@android:color/white"
android:padding="8dp">
...
This way no extra xml or other superfluous code is needed.
Result:
Comments
-
Sagar Chavada over 2 years
I am implementing card view but I can't find any border option to set a border on it.
here is my card.xml:
<android.support.v7.widget.CardView android:layout_marginTop="10dp" android:id="@+id/cardView" android:layout_width="match_parent" android:layout_height="wrap_content" xmlns:android="http://schemas.android.com/apk/res/android" card_view:cardPreventCornerOverlap="false" app:cardPreventCornerOverlap="false" xmlns:card_view="http://schemas.android.com/tools" xmlns:app="http://schemas.android.com/apk/res-auto"> <RelativeLayout android:background="@drawable/tab_bg" android:layout_width="match_parent" android:layout_height="wrap_content" android:padding="16dp"> <TextView android:id="@+id/title" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Title" android:textSize="20sp" /> </RelativeLayout> </android.support.v7.widget.CardView>
here is my image that I want to implement that green border on card view?
Help me. How can I implement this thing? I have no clue.
Thank you.
-
tiagocarvalho92 almost 6 yearsThis simply doesn't work. I've applied it to my app and the result is just random
-
Morse over 5 yearsThis gives error. Use
android.support.design.card.MaterialCardView
by adding ` implementation 'com.android.support:design:28.0.0'` in gradle -
Emmanuel Guther over 5 yearsThis response should be accepted. stackoverflow.com/users/5895830/sagar-chavada
-
Arash Afsharpour almost 4 yearsI did this but it doesn't apply to the card view and the background is still white color. any idea why is that happening?
-
Jeel Vankhede almost 4 years@sagar-chavada This should be accepted answer as it not a workaround but actual implementation that material design library provides for material card view.
-
Amir Dora. over 3 yearsShould be the top rated answer, super simple solution without using any xml.
-
Achintha Isuru about 3 yearsandroid:background="@drawable/selector" Use this to add the shape
-
Achintha Isuru about 3 yearsThis is now deprecated. For new one follow the instructions on stackoverflow.com/questions/57619574/…