在ImageButton外实现水波纹效果

Question

我正在尝试为ImageButton实现水波纹效果。我已经将水波纹设置为背景，并将可绘制图像设置为其src。

android:background="@drawable/myripplexml"
android:src="@drawable/myimagepath"

它在按钮布局内部产生了漂亮的涟漪效果。但我希望涟漪效果也能延伸到按钮布局之外。另一种实现方法是使用：

其内部的涟漪效果很不错，但我希望能够将其扩展到按钮布局之外。另一种方法是使用：

 android:background="?android:attr/selectableItemBackgroundBorderless"

但是它使用默认的颜色和样式。我该如何自定义它的颜色、形状和大小呢？

- Chaitanya Pimparkar

---

没明白你的意思，你实际上想做什么？ - Murtaza Khursheed Hussain

@MurtazaHussain 我想要类似于selectableItemBackground无边框的效果，但是颜色不同。 - Chaitanya Pimparkar

创建没有边框的可绘制对象。 - Murtaza Khursheed Hussain

不行。 selectableItemBackgroundBorderless 用于超出视图范围的涟漪效果。来源：https://developer.android.com/training/material/animations.html - Chaitanya Pimparkar

您可以通过不在<ripple>元素中添加任何子元素来创建无边界的涟漪效果。在RippleDrawable文档中有一个示例。 - alanv

@ChaitanyaPimparkar 在按钮上使用水波纹效果会导致按钮隐藏，点击按钮会显示水波纹效果，黑色按钮会变成白色。请问我做错了什么？ - Vivek Kumar

Answer 1

我遇到了这个问题，我的问题是'selectableItemBackgroundBorderless'创建了一个矩形，而我的按钮是圆形。我不确定这是否回答了原来的问题，但以下是我找到的：在drawable-v21中将背景设置为此。

<ripple
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:color="?android:colorControlHighlight">
    <item android:id="@android:id/mask">
        <shape android:shape="oval">
            <solid android:color="?android:colorAccent" />
        </shape>
    </item>
</ripple>

假设你在使用实际图片按钮的选择器，并且在较低的API级别中存在@null。 波纹最明显出现在按钮的填充区域。 如果没有遮罩层，则涟漪是不受限制的，会占据整个屏幕。 如果不是圆形，可以使用任何形状。

- Travis Castillo

---

对我来说，它似乎不是无边框的，看起来像一个日食形状。它在视图边框内部。 - Shayan_Aryan

如果你为视图设置了边距，它可能会这样做。 - Travis Castillo

Answer 2

如果你像我一样懒，就利用默认波纹并忘记向后兼容性。基本上，有两种类型的背景波纹可以添加到你的视图中：

 ?android:selectableItemBackground // Ripple within view
 ?android:selectableItemBackgroundBorderless //Ripple outside view

不幸的是，这些涟漪总是灰色的。要根据您的主题进行调整，请转到父主题并更改colorControlHighlight颜色。

在您的应用程序主题中：

<item name="colorControlHighlight">#1bff3a</item>

这个值将改变默认波纹的颜色。

注意：在 Android 版本低于 21 的设备上，水波纹将会变成与你设置的相同颜色的普通选择器。

- amalBit

---

你提到了两种背景波纹，但是你列出了两个同名的？ - matfillion

这些是如何工作的？有更好的方法来自定义它们（大小和颜色）吗？ - android developer

@androiddeveloper 我们只能更改这些涟漪的颜色。我找不到任何可以自定义大小的属性。 - amalBit

@amalBit 有什么办法可以复制它的代码吗？也许，那里有可绘制物的尺寸… - android developer

@androiddeveloper 你可以尝试使用自定义涟漪效果 http://guides.codepath.com/android/ripple-animation - amalBit

Answer 3

正如 @alan 在他的评论中提到的那样。如果您创建了一个没有遮罩和子项的涟漪项，并将其作为视图背景添加，那么涟漪将绘制在第一个可用父级上，并可能延伸视图边界。

文档中提到了这一点

<!-- An unbounded red ripple. --/>
<ripple android:color="#ffff0000" />

- guy.gc

---

没问题，这很有效！您可能还希望在涟漪上设置android:radius。 - Martin Konicek