34

我有以下 CardView,我想为卡片中的每个角设置不同的半径。是否可以通过 XML 或编程方式更改它们?提前致谢。

<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>

编辑 正如 Avinash 建议的那样,我正在寻找这个 lib github.com/captain-miao/OptionRoundCardview的行为,但使用默认的 CardView 项目。如果无法单独更改它,那么这个库是一个好方法。

4

4 回答 4

99

它需要官方MaterialCardView(扩展了androidx.cardview.widget.CardView)和至少1.1.0版本的Material components library

在您的布局中添加MaterialCardView

    <com.google.android.material.card.MaterialCardView
        style="@style/CustomCardViewStyle"
        ...>
      
    </com.google.android.material.card.MaterialCardView>

定义继承材料卡样式的自定义样式(例如Widget.MaterialComponents.CardView)并使用shapeAppearanceOverlay属性:

  <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>

在此处输入图像描述

您也可以通过编程方式实现它。
只需将自定义应用ShapeAppearanceModel到卡片的角落即可。
就像是:

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());

注意:它需要库的 1.1.0 版本。


使用Jetpack composeshape,您可以使用Card.

就像是:

    Card(
        shape = RoundedCornerShape(
           4.dp,
           8.dp,
           16.dp,
           2.dp)
    ){
        Text("Content Card")
    }

在此处输入图像描述

于 2019-09-07T20:14:17.867 回答
3

您可以创建一个自定义 xml 并将其命名为rounded_corners.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<corners android:radius="1dp"
    android:topLeftRadius="20dp"
    android:topRightRadius="30dp"
    android:bottomLeftRadius="40dp"
    android:bottomRightRadius="50dp"/>
<solid android:color="your_background_color" />
</shape>

然后将其用作您的背景CardView

android:background="@drawable/rounded_corners"

编辑:我刚刚注意到这可能适用于除 之外的所有其他视图CardView,因此请参阅此问题以了解如何解决问题。

于 2018-07-04T18:02:12.713 回答
0

注意:如果您只想在底部实现圆角并在顶部实现常规角,这是一种解决方法。如果您想为卡片视图的所有四个角设置不同的半径,这将不起作用。您将不得不为此使用材料卡视图或使用一些第三方库。

这似乎对我有用:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:background="#F9F9F9">

    <androidx.cardview.widget.CardView
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="200dp"
            android:background="@drawable/profile_bg"/>

    </androidx.cardview.widget.CardView>

    <androidx.cardview.widget.CardView
        android:id="@+id/cvProfileHeader"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:cardCornerRadius="32dp">
    
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="280dp"
            android:orientation="vertical"
            android:background="@drawable/profile_bg"
            android:id="@+id/llProfileHeader"
            android:gravity="center_horizontal">

            <!--Enter your code here-->

        </LinearLayout>
    
    </androidx.cardview.widget.CardView>

</RelativeLayout>

总共有两个cardview。第二个卡片视图将具有圆角(像往常一样在所有侧面),并将在其下保存所有其他子视图。它上面的第一个卡片视图也处于同一水平(海拔),并且具有相同的背景,但只有第二个卡片视图高度的一半左右,并且没有圆角(只是通常的尖角)。通过这种方式,我能够在底部实现部分圆角,在顶部实现正常角。但是对于所有四个面,您可能必须使用材料卡片视图。

于 2020-10-15T14:43:51.903 回答
-1

您好,您可以使用以下代码以编程方式或通过 xml 添加它。

app:cardCornerRadius="0dp"// xml
cardView.setRadius(0);

这个是额外的谁正在寻找海拔

app:cardElevation="0.7dp"//xml
app:cardMaxElevation="1dp"//xml
cardView.setCardElevation(2.1f);//code
cardView.setMaxCardElevation(3f);//code

CardView 的 XML 的完整 Java 表示。

CardView cardView = (CardView) findViewById(R.id.cardView);
cardView.setUseCompatPadding(true);
cardView.setContentPadding(30, 30, 30, 0);
cardView.setPreventCornerOverlap(true);
cardView.setCardBackgroundColor(Color.WHITE);
cardView.setCardElevation(2.1f);
cardView.setRadius(0);
cardView.setMaxCardElevation(3f);
于 2018-07-04T18:13:58.547 回答