Android布局圆角设置问题：CardView出现白色矩形背景

我来帮你搞定这个圆角显示的困扰！你遇到的白色矩形边缘，大概率是内部控件的背景没有被CardView的圆角裁剪，或者默认的控件背景（比如EditText的白色背景）透出导致的。下面是具体的解决步骤：

一、核心问题分析 #

CardView本身设置app:cardCornerRadius后，默认会裁剪自身的背景，但内部的子控件如果有不透明的背景（比如EditText默认的白色背景、LinearLayout继承的窗口白色背景），这些背景不会自动跟着CardView的圆角裁剪，就会露出矩形边缘。

二、分步解决方案 #

1. 强制CardView裁剪子视图 #

给CardView添加android:clipToOutline="true"属性，强制让所有子视图都被裁剪到CardView的圆角范围内：

<android.support.v7.widget.CardView 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    app:cardCornerRadius="9dp"
    android:clipToOutline="true"  <!-- 新增：强制裁剪子视图 -->
    xmlns:android="http://schemas.android.com/apk/res/android">

2. 移除内部布局的默认背景 #

给最外层的LinearLayout设置透明背景，避免它继承窗口的白色背景：

<LinearLayout 
    ...
    android:background="@android:color/transparent">  <!-- 新增：透明背景 -->

3. 处理EditText的默认白色背景 #

EditText默认自带白色矩形背景，这是最容易露出圆角外的元素，你可以二选一处理：

• 方案A：设置透明背景
  直接把EditText的背景设为透明，这样就不会透出白色：

  <EditText 
      ...
      android:background="@android:color/transparent"/>
  

• 方案B：自定义匹配圆角的背景
  如果需要保留EditText的白色背景，创建一个res/drawable/edittext_bg.xml文件：

  <?xml version="1.0" encoding="utf-8"?>
  <shape xmlns:android="http://schemas.android.com/apk/res/android">
      <solid android:color="@android:color/white"/>
      <corners android:radius="9dp"/> <!-- 和CardView圆角一致 -->
  </shape>
  

  然后给EditText设置这个背景：

  <EditText 
      ...
      android:background="@drawable/edittext_bg"/>
  

4. 优化兼容性（可选） #

如果在旧版本Android上仍有问题，添加这两个属性优化：

app:cardUseCompatPadding="true"  <!-- 为旧版本添加兼容padding，防止内容溢出 -->
app:cardPreventCornerOverlap="false"  <!-- 关闭旧版本的圆角重叠处理，避免多余padding -->

三、修改后的完整代码示例 #

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    app:cardCornerRadius="9dp"
    android:clipToOutline="true"
    app:cardUseCompatPadding="true"
    app:cardPreventCornerOverlap="false"
    xmlns:android="http://schemas.android.com/apk/res/android">

    <LinearLayout 
        xmlns:android="http://schemas.android.com/apk/res/android" 
        xmlns:app="http://schemas.android.com/apk/res-auto" 
        xmlns:tools="http://schemas.android.com/tools" 
        android:orientation="vertical" 
        android:layout_width="match_parent" 
        android:id="@+id/relative_layout" 
        android:layout_height="wrap_content"
        android:background="@android:color/transparent">

        <android.support.v7.widget.Toolbar 
            android:layout_width="match_parent" 
            android:layout_height="46dp" 
            android:id="@+id/toolbar" 
            android:background="@color/fab_background">
        </android.support.v7.widget.Toolbar>

        <RelativeLayout 
            android:padding="16dp" 
            android:layout_width="match_parent" 
            android:layout_height="wrap_content"
            android:background="@android:color/transparent">

            <ImageView 
                android:layout_marginBottom="10dp" 
                android:layout_width="50dp" 
                android:layout_height="40dp" 
                android:src="@drawable/expense" 
                android:id="@+id/expense_image"/>

            <EditText 
                android:layout_marginLeft="29dp" 
                android:layout_width="match_parent" 
                android:layout_toRightOf="@id/expense_image" 
                android:layout_height="40dp" 
                android:hint="@string/expense" 
                android:id="@+id/expense" 
                android:inputType="number"
                android:background="@android:color/transparent"/>

            <ImageView 
                android:layout_width="50dp" 
                android:layout_height="40dp" 
                android:src="@drawable/note" 
                android:id="@+id/note_image" 
                android:layout_marginTop="60dp"/>

            <EditText 
                android:layout_marginLeft="29dp" 
                android:layout_marginTop="20dp" 
                android:layout_toRightOf="@id/note_image" 
                android:layout_below="@id/expense" 
                android:layout_width="match_parent" 
                android:layout_height="wrap_content" 
                android:hint="@string/add_note" 
                android:id="@+id/add_note"
                android:background="@android:color/transparent"/>
        </RelativeLayout>

        <Button 
            android:layout_marginTop="20dp" 
            android:layout_width="150dp" 
            android:layout_height="40dp" 
            android:layout_margin="16dp" 
            android:id="@+id/putOn" 
            android:layout_below="@id/add_note" 
            android:text="@string/put_on" 
            android:background="@android:color/darker_gray"/>
    </LinearLayout>
</android.support.v7.widget.CardView>

内容的提问来源于stack exchange，提问作者Saad Zahoor