在视图组内容上绘制波纹

Question

我正在尝试将涟漪效果 (@drawable/pill) 应用于布局。波纹在布局子项下绘制，而我希望将效果应用于内容。

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:clickable="true"
        android:focusable="true"
        android:background="@drawable/pill"
        android:padding="8dp">

        <ImageView
            android:layout_width="40dp"
            android:layout_height="40dp"
            android:src="@drawable/my_icon"/>

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Sample text"/>
    </FrameLayout>

</FrameLayout>

并且 pill.xml（其中@drawable/pill_bg 是自定义形状）：

<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
        android:color="?android:attr/colorControlHighlight">
    <item android:id="@android:id/mask" android:drawable="@drawable/pill_bg"/>
    <item android:drawable="@drawable/pill_bg"/>
</ripple>

在其他帖子之后，我尝试将android:background="@null" 和android:drawSelectorOnTop="true" 应用于ImageView，但没有成功。

将波纹定义为布局的背景是否有意义？我想知道是否正确的方法是将波纹与背景可绘制对象分开，并将波纹应用于与内容重叠的虚拟视图。

Answer 1

你是对的。您在 xml 中定义的内容如第一张图所示。要在 ImageView 和 TextView 上方绘制波纹，您需要在它们上方定义它。实现这一目标的一种方法是在 LinearLayout 之上放置一个 ImageView：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <LinearLayout
        android:id="@+id/ll_container"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:clickable="true"
        android:focusable="true"
        android:padding="8dp">

        <ImageView
            android:layout_width="40dp"
            android:layout_height="40dp"
            android:src="@drawable/my_icon" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Sample text" />
    </LinearLayout>

    <ImageView
        android:id="@+id/iv_ripple"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignBottom="@id/ll_container"
        android:layout_alignLeft="@id/ll_container"
        android:layout_alignRight="@id/ll_container"
        android:layout_alignTop="@id/ll_container"
        android:src="@drawable/pill" />

</RelativeLayout>