如何在简单的布局中创建涟漪效果

Zac*_*ach 95 android rippledrawable android-5.0-lollipop

触摸布局时,如何在简单的线性/相对布局中产生涟漪效应?

我已经尝试将布局的背景设置为:

<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
    android:color="?android:colorControlHighlight" >

    <item android:drawable="@android:color/white"/>

</ripple>
Run Code Online (Sandbox Code Playgroud)

然而,我只看到纯白色背景,并且在触摸布局时没有涟漪效应.我究竟做错了什么?

编辑:

作为参考,这是我的布局xml文件:

<?xml version="1.0" encoding="utf-8"?>
    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="250dp"
        android:layout_height="250dp"
        android:background="@drawable/test"
        android:clickable="true">
    </RelativeLayout>
Run Code Online (Sandbox Code Playgroud)

Igo*_*sky 219

在布局上设置这些属性(如果您的布局具有默认的白色/浅色背景):

          android:clickable="true"
          android:focusable="true"
          android:background="?attr/selectableItemBackground"
Run Code Online (Sandbox Code Playgroud)

在这种情况下,您不需要自定义drawable.

但是,如果你的布局有黑色/深色背景,你必须像这样创建自己的波纹可绘制:

<?xml version="1.0" encoding="utf-8"?>
<!-- An white rectangle ripple. -->
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
    android:color="@android:color/white">
    <item
        android:id="@android:id/mask"
        android:gravity="center">
        <shape android:shape="rectangle">
            <solid android:color="@android:color/white"/>
        </shape>
    </item>
</ripple>
Run Code Online (Sandbox Code Playgroud)

然后设置这个波纹drawable作为你的android:background属性.

您可以在AOSP中看到许多这类涟漪的例子:在这里

  • 如果您想要另一种背景颜色,可以将该颜色设置为背景,并将"?attr/selectableItemBackground"设置为android:foreground (28认同)
  • 如果我必须提供不同的颜色作为背景怎么办?那么什么应该是最好的方法? (9认同)
  • @AnujSharma您是否尝试过为“背景”提供颜色资源? (2认同)
  • 哇!这很棒.这应该标记为答案+1 (2认同)

Erf*_*MPR 56

我除了Igor Ganapolsky的回答之外还添加了这个,以防任何人想要有不同颜色的布局并且还有涟漪效果.你只需在drawable中创建一个涟漪效果,如下所示:

ripple.xml

<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:color="@color/rippleColor"
    tools:targetApi="lollipop"> <!-- ripple effect color -->
    <item android:id="@android:id/background">
        <shape android:shape="rectangle">
            <solid android:color="@color/backgroundColor" /> <!-- background color -->
        </shape>
    </item>
</ripple>
Run Code Online (Sandbox Code Playgroud)

然后把它作为你的布局背景或任何按钮,如Igor Ganapolsky在他的回答中提到的那样.

android:clickable="true"
android:background="@drawable/ripple"
Run Code Online (Sandbox Code Playgroud)


Pan*_*lan 31

您必须在任何小部件(TextView/ Button)中更改以下代码段,并且您可以实现Ripple Effect:

android:clickable="true"
android:focusable="true"
android:foreground="?attr/selectableItemBackground"
Run Code Online (Sandbox Code Playgroud)

你很高兴.

  • 请注意,API 23 (Android 6.0) 中添加了“foreground”属性,并且“对低于 23 的 API 级别没有影响”(根据 Android Studio 警告) (2认同)

Zac*_*ach 19

事实证明这是按预期工作的.标准的Material主题colorControlHighlight值是#40ffffff.所以在白色背景上,这不会出现.将高亮颜色更改为其他内容可以起作用,和/或更改对象的背景颜色.

谢谢大家(特别是Alanv指出我正确的方向).


Jer*_*App 9

设置android:clickable="true"你的布局.


小智 9

这是单击具有涟漪效应的示例布局的示例:

 <LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="?attr/selectableItemBackground"
    android:clickable="true"
    android:focusable="true"
    android:orientation="vertical">
Run Code Online (Sandbox Code Playgroud)


Abh*_*pta 5

<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:color="#cfd8dc"
    tools:targetApi="lollipop">
    <item android:id="@android:id/mask">
        <shape android:shape="rectangle">
            <solid android:color="#d1c4e9" />
        </shape>
    </item>
</ripple>
Run Code Online (Sandbox Code Playgroud)

在 Drawable 文件夹中使用这个ripple.xml,然后将其指定为View的

android:background="@drawable/ripple"

安卓:可点击=“真”