非按钮视图上的 Android 波纹效果 + 高程
Posted
技术标签:
【中文标题】非按钮视图上的 Android 波纹效果 + 高程【英文标题】:Android Ripple Effect + Elevation on non-Button Views 【发布时间】:2015-03-27 08:38:51 【问题描述】:我正在尝试向 LinearLayout 添加触摸反馈,该反馈类似于 API 级别 21 中的常规按钮反馈,与 this 示例中的反馈非常相似,但到目前为止没有成功。
我已经定义了一个像这样的标准波纹可绘制:
<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>
并使用了 Google 提供的 StateListAnimator here:
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_enabled="true" android:state_pressed="true">
<objectAnimator
android:duration="@android:integer/config_shortAnimTime"
android:propertyName="translationZ"
android:valueTo="@dimen/touch_raise"
android:valueType="floatType" />
</item>
<item>
<objectAnimator
android:duration="@android:integer/config_shortAnimTime"
android:propertyName="translationZ"
android:valueTo="0dp"
android:valueType="floatType" />
</item>
在定义动画师和可绘制的波纹后,我将它们添加到我的 LinearLayout 中,如下所示:
<LinearLayout
android:id="@+id/linearLayout"
android:clickable="true"
android:focusable="true"
android:orientation="horizontal"
android:background="@drawable/ripple"
android:stateListAnimator="@anim/touch_elevation">
这个想法是将此 LinearLayout 用作按钮,因为我可以更简单地插入各种类型的文本并在其中处理 ImageView 定位(与按钮可绘制对象相反)。
根据this 问题,添加波纹效果或动画单独工作,只要视图的背景没有透明度。
我不确定这是否是与上述问题相关的问题,但鉴于标准按钮设法同时使用波纹和高度动画反馈,我认为在其他视图上也可以实现此效果。
任何对此问题的见解将不胜感激。
【问题讨论】:
如果您希望在用户点击您的LinearLayout
时应用涟漪效果,您需要使用适当的StateListDrawable
,而不是直接引用您的<ripple>
。
您现有的背景显示“立即显示涟漪”。这似乎是一个奇怪的选择。 Button
的背景是 StateListDrawable
,用于正常、按下、禁用、聚焦等不同的图像。你需要做同样的事情。
我想我明白了,但奇怪的是,正如我在问题中提到的那样,如果我只指定波纹作为背景,它会按预期工作。
两者会产生什么影响?
没有任何效果
【参考方案1】:
使用ForegroundLinearLayout。它允许将波纹或任何其他可绘制对象放在视图的前景中。与创建ForegroundRelativeLayout
等的方法相同(只需使此类从RelativeLayout
扩展)。
这是您的 stateListAnimator
和波纹可绘制的示例:
<your.package.ForegroundLinearLayout
android:layout_
android:layout_
android:layout_centerInParent="true"
android:gravity="center"
android:foreground="@drawable/bg_ripple"
android:background="#fff"
android:clickable="true"
android:stateListAnimator="@animator/animator_elevation">
<TextView
android:layout_
android:layout_
android:text="Hello world!"/>
</your.package.ForegroundLinearLayout>
结果:
编辑:ForegroundLinearLayout
存在于支持设计库中。所以你可以使用
android.support.design.internal.ForegroundLinearLayout
【讨论】:
【参考方案2】:在涟漪的 item 元素中没有android:id="@android:id/mask"
attribute 时,这两种效果一起工作(也许这个属性增加了一些透明度)。
【讨论】:
确实,这两种效果都可以在没有遮罩的情况下协同工作。这显然是同样的透明度问题。很抱歉,但我无法使用您的解决方案,因为我希望将这两种效果应用于任何项目。例如,在 CardView 上使用此解决方案(其中波纹必须是前景),会使视图的整个内容不可见。 我从没想过 android:id/mask 可能是我的以上是关于非按钮视图上的 Android 波纹效果 + 高程的主要内容,如果未能解决你的问题,请参考以下文章