矩形无限波纹效果

Question

我知道我们可以通过将?android:attr/selectableItemBackgroundBorderless设置为背景属性来获得视图的无边界涟漪效果。

我们也可以简单地拥有自己的涟漪可绘制对象，以具有自定义颜色：

<!-- An unbounded blue ripple. --/>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
    android:color="@color/blue" />

结果是一个不受限制的圆形，涟漪效果从中心开始，涟漪到角落。

我尝试使用矩形而不是圆形构建相同的效果，但我从未找到相同的效果。例如，我尝试使用遮罩视图：

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

更多示例：http://blog.stylingandroid.com/ripples-part-3/ 结果是一个矩形，但不是无界的。它将被限制在视图边界内（如文档中对掩码的解释）。 同时，水波纹效果也有所不同（对我来说，在Android-M预览版中）。

我想知道是否有任何解决方案可以简单地构建无界矩形，具有与默认无界水波纹相同的水波纹效果（如上所述）？

或者为了解决这个问题，我应该选择自定义视图？

- Ali

Answer 1

使用xml似乎无法实现。但是可以通过代码实现：

1. 通过为其附加层（内容和蒙版）提供null，使波纹变得无限。
2. 扩大热点区域，以便圆形波纹超出视图的更大维度（宽度或高度）。
3. 在绘制之前用矩形剪切画布。

fun View.setSelectableItemBackgroundBorderlessRectangle(
    @Px left: Int = 0,
    @Px top: Int = 0,
    @Px right: Int = 0,
    @Px bottom: Int = 0,
) {
    doOnLayout { view ->
        val bounds = Rect(-left, -top, view.width + right, view.height + bottom)

        background = object : RippleDrawable(
            ColorStateList.valueOf(getColorFromAttr(android.R.attr.colorControlHighlight)),
            null,
            null
        ) {
            override fun draw(canvas: Canvas) {
                canvas.clipRect(bounds)
                super.draw(canvas)
            }
        }.apply {
            setHotspotBounds(bounds.left, bounds.top, bounds.right, bounds.bottom)
        }
    }
}

- SqueezyMo