首页 文章

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

提问于
浏览 次
74

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

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

<?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>

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

编辑：

作为参考，这是我的布局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>
android android-5.0-lollipop rippledrawable

9 回答

  • 44

    把它放到你的布局中：

    android:clickable="true"
android:background="?attr/selectableItemBackground"

    注意：API文档中存在错误 . 它只适用于 API >= 23

    对于 all API levels 使用此Solution

    回复于
  • 0

    除了_551994的答案之外，我还要添加这个，以防有人想要一个不同颜色的布局并且还有涟漪效果 . 你只需在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>

    然后将其作为布局的背景或任何按钮，如答案中提到的Igor Ganapolsky .

    android:clickable="true"
android:background="@drawable/ripple"
    回复于
  • 6
    <?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>

    使用此 ripple.xml in Drawable folder ，然后将其指定为View

    android:background="@drawable/ripple"

    android:clickable="true"

    回复于
  • 175

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

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

    回复于
  • 15

    只需添加 android:background="?selectableItemBackground" 的默认涟漪效果

    Like:

    <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="100dp"
            android:background="?selectableItemBackground"
            android:clickable="true"
            >

           ...

</LinearLayout>
    回复于
  • 20

    我尝试了所有这些答案，没有什么对我有用，所以，我解决了创建以下样式：

    <style name="Button.Borderless" parent="Base.Widget.AppCompat.Button.Borderless">
    <item name="android:minHeight">0dp</item>
    <item name="android:minWidth">0dp</item>
    <item name="android:layout_marginLeft">-6dp</item>
    <item name="android:layout_marginRight">-6dp</item>
    <item name="android:paddingTop">0dp</item>
    <item name="android:paddingBottom">0dp</item>
    <item name="android:paddingLeft">6dp</item>
    <item name="android:paddingRight">6dp</item>
</style>

    然后，我应用于我的线性布局：

    <LinearLayout
      android:id="@+id/ll_my_ripple"
      style="@style/Button.Borderless">
</LinearLayout>
    回复于
  • 0

    您必须在任何窗口小部件（ TextView / Button ）中更改以下代码段，并且可以实现 Ripple Effect ：

    android:clickable="true"
android:focusable="true"
android:foreground="?attr/selectableItemBackground"

    你很高兴 .

    回复于
  • 1

    在布局上设置 android:clickable="true" .

    回复于
  • 2

    在布局上设置这些属性（如果布局具有默认的白色/浅色背景）：

    android:clickable="true"
          android:focusable="true"
          android:background="?attr/selectableItemBackground"

    在这种情况下，您不需要自定义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>

    然后将此波纹绘制为 android:background 属性 .

    您可以在AOSP中看到许多这类涟漪的例子：http://androidxref.com/8.0.0_r4/search?q=ripple&defs=&refs=&path=&hist=&project=art&project=bionic&project=bootable&project=build&project=cts&project=dalvik&project=developers&project=development&project=device&project=docs&project=external&project=frameworks&project=hardware&project=kernel&project=libcore&project=libnativehelper&project=packages&project=pdk&project=platform_testing&project=prebuilts&project=sdk&project=system&project=test&project=toolchain&project=tools

    回复于

相关问题