如何填充波纹效果

Question

以前，我使用StateDrawable来实现带有阴影效果的自定义卡片视图 - https://stackoverflow.com/a/33829309/72437 。 这是由于CardView的限制，无法在其cardBackgroundColor接受选择器

现在，我想添加涟漪效应。 我使用以下 XML。

<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
    android:color="#00ff00">
    <item android:drawable="@drawable/statelist_item_background"/>
</ripple>

然而，这会产生副作用，即绿色波纹一直延伸到触及阴影区域。

我想避免接触阴影区域的绿色波纹。 我尝试添加填充信息。

<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
    android:color="#00ff00">
    <item>
        <shape android:shape="rectangle">
            <padding android:top="10dp" android:right="10dp" android:bottom="10dp" android:left="10dp" />
        </shape>
    </item>

    <item android:drawable="@drawable/statelist_item_background"/>
</ripple>

然而，它没有什么不同。 在ripple标签中添加填充信息没有区别。

我可以知道如何填充波纹效果吗？

Answer 1

您可以使用inset标签来定义您需要的填充。 有一个inset属性来定义全局填充或每个方向的 4 个属性。

<?xml version="1.0" encoding="utf-8"?>
<inset xmlns:android="http://schemas.android.com/apk/res/android"
    android:inset="10dp">
    <ripple
        android:color="#00ff00">
        <item android:drawable="@drawable/statelist_item_background"/>
    </ripple>
</inset>

Answer 2

首先创建可绘制文件（例如：bg_ripple.xml）

<?xml version="1.0" encoding="utf-8"?>    
<inset xmlns:android="http://schemas.android.com/apk/res/android"
    android:inset="4dp">

    <ripple android:color="@color/gray_light">    

        <item android:id="@android:id/mask">
            <shape android:shape="rectangle">
                <!-- this color does not matter, it's a mask shape -->
                <solid android:color="@color/blue" />
                <corners android:radius="@dimen/button_corner_radius" />
            </shape>
        </item>

        <item android:id="@android:id/background">
            <shape android:shape="rectangle">
                <corners android:radius="@dimen/button_corner_radius" />
                <stroke
                    android:width="2dp"
                    android:color="@color/red"
                    />
                <solid android:color="@color/white" />
            </shape>
        </item>

    </ripple>
</inset>

其次将它作为背景添加到按钮

<Button        
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="@string/click_me"
    android:background="@drawable/bg_ripple"
    />

Answer 3

您应该将此添加到您的 CarView：

<CardView
    ...
    style="@style/MyCardViewStyle"
    android:foreground="?attr/selectableItemBackground">
</CardView>

然后，在你的风格中添加：

<style name="MyCardViewStyle">
    <item name="colorControlHighlight">@color/my_awesome_color</item>
</style>

它将为您的涟漪效果提供您想要的令人敬畏的颜色，而无需自己创建涟漪，并且会自动检测边界，因此您无需查找是否可以为涟漪添加填充。