具有不同圆角半径的 CardView [英] CardView with different corner radius
问题描述
我有以下 CardView,我想为卡片中的每个角设置不同的半径.是否可以通过 XML 或以编程方式更改它们?提前致谢.
您也可以通过编程实现.
只需应用自定义
I have the following CardView and I want to set different radius for each corner in the card. Is it possible to change them by XML or programmaticaly? Thanks in advance.
<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_marginRight="16dp"
android:layout_marginLeft="16dp"
android:layout_marginTop="5dp"
android:layout_marginBottom="5dp"
app:cardCornerRadius="0dp"
app:cardElevation="0dp">
</android.support.v7.widget.CardView>
EDIT
As Avinash suggest, I am looking for the behaviour of this lib github.com/captain-miao/OptionRoundCardview but using the default CardView item. If it is not possible to change it individually, this lib is a good approach.
解决方案 It requires the official MaterialCardView
(which extends the androidx.cardview.widget.CardView
) and at least the version 1.1.0 of the Material components library.
Add to your layout the MaterialCardView
:
<com.google.android.material.card.MaterialCardView
style="@style/CustomCardViewStyle"
...>
</com.google.android.material.card.MaterialCardView>
Define a custom style inheriting a material card style (for example Widget.MaterialComponents.CardView
) and use the shapeAppearanceOverlay
attribute:
<style name="CustomCardViewStyle" parent="@style/Widget.MaterialComponents.CardView">
<item name="shapeAppearanceOverlay">@style/ShapeAppearanceOverlay_card_custom_corners</item>
</style>
<style name="ShapeAppearanceOverlay_card_custom_corners" parent="">
<item name="cornerFamily">rounded</item>
<item name="cornerSizeTopRight">4dp</item>
<item name="cornerSizeTopLeft">8dp</item>
<item name="cornerSizeBottomRight">16dp</item>
<item name="cornerSizeBottomLeft">0dp</item>
</style>
You can also achieve it programmatically.
Just apply a custom ShapeAppearanceModel
to the corners of the card.
Something like:
float radius = getResources().getDimension(R.dimen.my_corner_radius);
cardView.setShapeAppearanceModel(
cardView.getShapeAppearanceModel()
.toBuilder()
.setTopLeftCorner(CornerFamily.ROUNDED,..)
.setTopRightCorner(CornerFamily.ROUNDED,..)
.setBottomRightCorner(CornerFamily.ROUNDED,radius)
.setBottomLeftCornerSize(0)
.build());
Note: it requires the version 1.1.0 of the library.
With Jetpack compose 1.0.x
you can use the shape
parameter in the Card
.
Something like:
Card(
shape = RoundedCornerShape(
4.dp,
8.dp,
16.dp,
2.dp)
){
Text("Content Card")
}
这篇关于具有不同圆角半径的 CardView的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!