Android开发：如何修改Adapter布局的背景形状与颜色

数据老陈

2026-6-27

修改Adapter布局以实现自定义背景形状与颜色

我是一名Android开发新手，需要实现如图所示的背景形状颜色设计。请告知如何修改以下提供的Adapter布局代码，以更改背景的形状与颜色。

原布局代码

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="134dp"
    android:layout_height="205dp"
    android:orientation="vertical">

    <androidx.cardview.widget.CardView
        app:cardBackgroundColor="#f6f6f6"
        app:cardCornerRadius="3dp"
        app:cardElevation="5dp"
        app:cardUseCompatPadding="false"
        android:layout_margin="7dp"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <com.balysv.materialripple.MaterialRippleLayout
            android:id="@+id/lyt_parent"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginRight="10dp"
            android:layout_marginEnd="10dp"
            app:mrl_rippleAlpha="0.2"
            app:mrl_rippleColor="@color/colorRipple"
            app:mrl_rippleHover="true"
            app:mrl_rippleOverlay="true">

            <RelativeLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content">

                <LinearLayout
                    android:id="@+id/lyt_row_content"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:gravity="center"
                    android:orientation="vertical">
                    <androidx.constraintlayout.widget.ConstraintLayout
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content">

                        <RelativeLayout
                            android:layout_width="0dp"
                            android:layout_height="0dp"
                            app:layout_constraintDimensionRatio="H,1:1"
                            app:layout_constraintLeft_toLeftOf="parent"
                            app:layout_constraintRight_toRightOf="parent"
                            app:layout_constraintTop_toTopOf="parent">
                            <com.makeramen.roundedimageview.RoundedImageView
                                android:id="@+id/recipe_image"
                                android:layout_width="match_parent"
                                android:layout_height="match_parent"
                                android:layout_centerInParent="true"
                                android:adjustViewBounds="true"
                                android:scaleType="fitCenter"
                                android:src="@drawable/ic_thumbnail"
                                app:riv_corner_radius="8dp" />

                            <ImageView
                                android:id="@+id/thumbnail_video"
                                android:layout_width="68dp"
                                android:layout_height="68dp"
                                android:alpha="0.8"
                                android:src="@drawable/ic_thumbnail_video"
                                android:layout_centerInParent="true"
                                android:scaleType="centerCrop"
                                android:visibility="gone" />
                            <RelativeLayout
                                android:id="@+id/lytDiscount"
                                android:layout_width="70dp"
                                android:layout_height="30dp">

                                <ImageView
                                    android:layout_width="170dp"
                                    android:layout_height="match_parent"
                                    android:layout_centerInParent="true"
                                    android:src="@drawable/ic_offer" />

                                <TextView
                                    android:id="@+id/showDiscount"
                                    android:layout_width="match_parent"
                                    android:layout_height="wrap_content"
                                    android:layout_alignParentStart="true"
                                    android:layout_centerVertical="true"
                                    android:text="- 50%"
                                    android:textColor="@color/white"
                                    android:textSize="@dimen/_10ssp"
                                    android:textStyle="bold" />
                            </RelativeLayout>
                        </RelativeLayout>
                    </androidx.constraintlayout.widget.ConstraintLayout>
                    <LinearLayout
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:layout_below="@+id/lyt_title_row"
                        android:gravity="center_vertical"
                        android:paddingBottom="4dp"
                        android:orientation="horizontal">

                        <TextView
                            android:id="@+id/price"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:layout_marginStart="5dp"
                            android:gravity="center_horizontal"
                            android:text="25002"
                            android:textAppearance="@style/Base.TextAppearance.AppCompat.Small"
                            android:textStyle="bold"
                            android:textSize="@dimen/_12sdp" />

                        <TextView
                            android:id="@+id/discountprice"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:text="20023"
                            android:textColor="@color/black"
                            android:layout_marginStart="3dp"
                            android:textStyle="bold"
                            android:paddingEnd="@dimen/dimen_5dp"
                            android:textSize="@dimen/_12sdp" />

                    </LinearLayout>
                    <RelativeLayout
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content">

                        <RelativeLayout
                            android:id="@+id/lyt_title_row"
                            android:layout_width="match_parent"
                            android:layout_height="wrap_content">

                            <RelativeLayout
                                android:layout_marginStart="@dimen/_4sdp"
                                android:layout_width="match_parent"
                                android:layout_height="wrap_content">

                                <TextView
                                    android:id="@+id/recipe_title"
                                    android:layout_width="wrap_content"
                                    android:layout_height="wrap_content"
                                    android:ellipsize="end"
                                    android:maxLines="1"
                                    android:text="Title"
                                    android:textAppearance="@style/Base.TextAppearance.AppCompat.Body2"
                                    android:textSize="@dimen/text_title_size" />

                            </RelativeLayout>

                        </RelativeLayout>

                        <LinearLayout
                            android:layout_marginStart="@dimen/_4sdp"
                            android:layout_width="match_parent"
                            android:layout_height="wrap_content"
                            android:layout_below="@+id/lyt_title_row"
                            android:gravity="center_vertical"
                            android:orientation="horizontal"
                            android:paddingBottom="4dp">

                            <TextView
                                android:id="@+id/category_name"
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:ellipsize="end"
                                android:maxLines="1"
                                android:text="Category"
                                android:textSize="@dimen/text_sub_title_size" />

                            <LinearLayout
                                android:id="@+id/lyt_comment"
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:layout_marginStart="8dp"
                                android:layout_marginLeft="8dp"
                                android:gravity="center"
                                android:orientation="horizontal">

                                <ImageView
                                    android:layout_width="14dp"
                                    android:layout_height="14dp"
                                    android:src="@drawable/ic_comment"
                                    app:tint="@color/colorGreyDark" />

                                <TextView
                                    android:id="@+id/comment"
                                    android:layout_width="wrap_content"
                                    android:layout_height="wrap_content"
                                    android:layout_marginStart="3dp"
                                    android:layout_marginLeft="3dp"
                                    android:text="2"
                                    android:textSize="@dimen/text_sub_title_size" />

                            </LinearLayout>
                        </LinearLayout>

                    </RelativeLayout>

                </LinearLayout>

            </RelativeLayout>

        </com.balysv.materialripple.MaterialRippleLayout>

    </androidx.cardview.widget.CardView>

</LinearLayout>

修改方案

1. 快速调整CardView背景（简单形状/纯色）

布局里最外层的背景由CardView控制，直接修改它的属性就能快速调整：

修改背景颜色：把app:cardBackgroundColor="#f6f6f6"换成目标颜色，比如@color/your_custom_color（需提前在res/values/colors.xml中定义）或十六进制色值如#FF4081
修改圆角形状：调整app:cardCornerRadius="3dp"的数值，比如改成12dp实现更大圆角；Android 12及以上版本可以单独设置某几个角的圆角（如app:cardCornerRadiusTopLeft），低版本需用自定义drawable实现

2. 自定义复杂背景（渐变、特殊圆角、边框等）

如果需要渐变背景、非对称圆角、带边框等复杂效果，需创建自定义drawable文件：

在res/drawable目录下新建custom_card_bg.xml，示例内容：

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <!-- 渐变背景 -->
    <gradient
        android:startColor="#FF4081"
        android:endColor="#E91E63"
        android:angle="0"/>
    <!-- 非对称圆角 -->
    <corners
        android:topLeftRadius="16dp"
        android:topRightRadius="16dp"
        android:bottomLeftRadius="0dp"
        android:bottomRightRadius="0dp"/>
    <!-- 白色边框 -->
    <stroke
        android:width="1dp"
        android:color="#FFFFFF"/>
</shape>

修改CardView属性，关闭默认背景并应用自定义drawable：

<androidx.cardview.widget.CardView
    app:cardBackgroundColor="@android:color/transparent" <!-- 设为透明以显示自定义背景 -->
    app:cardCornerRadius="0dp" <!-- 取消默认圆角 -->
    app:cardElevation="5dp" <!-- 保留阴影效果，可选 -->
    app:cardUseCompatPadding="false"
    android:layout_margin="7dp"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@drawable/custom_card_bg"> <!-- 设置自定义背景 -->

3. 修改内部布局背景

如果需要给lyt_row_content这类内部布局设置背景，直接给对应布局添加android:background属性即可，支持纯色或自定义drawable。

内容的提问来源于stack exchange，提问作者Syed Ghouser