矩形无界涟漪效果

Ali*_*Ali 5 android android-custom-view

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

我们也可以简单地使用我们自己的波纹绘制来自定义颜色:

<!-- An unbounded blue ripple. --/>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
    android:color="@color/blue" />
Run Code Online (Sandbox Code Playgroud)

结果是一个具有涟漪效应的无界圆,从中心涟漪到角落。

我尝试使用 Rectangle 而不是 Circle 来构建相同的效果,但我永远找不到相同的效果。例如,我尝试使用掩码视图进行以下操作:

<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>
Run Code Online (Sandbox Code Playgroud)

更多示例:http : //blog.stylingandroid.com/ripples-part-3/

结果是一个矩形,但不是unbounded。它将被绑定到视图边界(如文档中的掩码所解释的)以及涟漪效应是不同的(对我来说在 Android-M 预览版中)

我想知道是否有任何解决方案可以简单地构建具有与默认无界波纹相同波纹效果的无界矩形(如我上面所解释的)?

或者为了解决我应该去自定义视图的问题?

Squ*_*yMo 0

看来用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)
        }
    }
}
Run Code Online (Sandbox Code Playgroud)