如何在 Android 上设置文本视图或图像视图的涟漪效应?

我想在 Android Studio 中设置文本视图和图像视图的涟漪效应。我该怎么做呢?

124834 次浏览

你可以使用 机器人-波纹-背景

开始效果

final RippleBackground rippleBackground=(RippleBackground)findViewById(R.id.content);
ImageView imageView=(ImageView)findViewById(R.id.centerImage);
imageView.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
rippleBackground.startRippleAnimation();
}
});

停止动画:

rippleBackground.stopRippleAnimation();

为了 KOTLIN

val rippleBackground = findViewById(R.id.content) as RippleBackground
val imageView: ImageView = findViewById(R.id.centerImage) as ImageView
imageView.setOnClickListener(object : OnClickListener() {
fun onClick(view: View?) {
rippleBackground.startRippleAnimation()
}
})

使用库。这个就是其中之一。只需添加它的依赖项,并在每个需要连锁反应的元素之前,将下面的代码放在 xml 中:

<com.balysv.materialripple.MaterialRippleLayout
android:id="@+id/ripple"
android:layout_width="match_parent"
android:layout_height="wrap_content">

档号: http://developer.android.com/training/material/animations.html,

Http://wiki.workassis.com/category/android/android-xml/

<TextView
.
.
android:background="?attr/selectableItemBackgroundBorderless"
android:clickable="true"
/>


<ImageView
.
.
.
android:background="?attr/selectableItemBackgroundBorderless"
android:clickable="true"
/>

如果你希望涟漪被限制到 TextView/ImageView 的大小,使用:

<TextView
android:background="?attr/selectableItemBackground"
android:clickable="true"/>

(我觉得看起来好多了)

除了@Bikesh M Annur 的回答,一定要更新您的支持库。之前我使用的是23.1.1,但是什么都没有发生。将其更新为23.3.0取得了成功。

<TextView
android:id="@+id/txt_banner"
android:layout_width="match_parent"
android:layout_height="45dp"
android:layout_below="@+id/title"
android:background="@drawable/ripple_effect"
android:gravity="center|left"
android:paddingLeft="15dp"
android:text="@string/banner"
android:textSize="15sp" />

把这个添加到可绘制的

<?xml version="1.0" encoding="utf-8"?>


<!--this ripple animation only working for >= android version 21 -->


<ripple
xmlns:android="http://schemas.android.com/apk/res/android"
android:color="@color/click_efect" />

如果@Bikesh M Annur (给你)发布的解决方案得到了很好的投票,但对你不起作用,试着使用:

<TextView
...
android:background="?android:attr/selectableItemBackgroundBorderless"
android:clickable="true" />


<ImageView
...
android:background="?android:attr/selectableItemBackgroundBorderless"
android:clickable="true" />

此外,在使用 android:clickable="true"时,请添加 android:focusable="true",因为:

声明为可点击但未声明为可定焦的小部件不能通过键盘访问。

除了上面的答案之外,还增加了可定焦功能,以避免 UI 编辑器的警告

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

请参考以下连锁反应的答案。

在文本视图或视图上产生涟漪:

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

返回文章页面在按钮或者图像上激起涟漪译者:

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

最好的办法是:

    <ImageView
android:id="@+id/ivBack"
style="?attr/actionButtonStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="16dp"
android:src="@drawable/ic_back_arrow_black"
android:tint="@color/white" />

android:clickable="true" android:focusable="true"

对于涟漪效应

android:background="?attr/selectableItemBackgroundBorderless"

选择效果

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

按钮效应

android:adjustViewBounds="true" style="?android:attr/borderlessButtonStyle"

圆形波纹: android:background="?attr/selectableItemBackgroundBorderless"

矩形波纹: android:background="?attr/selectableItemBackground"

如果上面的解决方案对你的 文本视图不起作用,那么这个肯定会起作用:

    <com.google.android.material.button.MaterialButton
style="?attr/buttonBarButtonStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:minWidth="0dp"
android:minHeight="0dp"
android:paddingHorizontal="@dimen/padding_8dp"
android:text="Clickable Text"
android:textColor="your text color"
app:backgroundTint="@android:color/transparent"
app:rippleColor="ripple effect color" />

在这里,style="?attr/buttonBarButtonStyle"app:backgroundTint="@android:color/transparent"将使这个按钮作为透明的背景,使它看起来像 TextView 和其他一切将自动完成。

android:background="?android:selectableItemBackground"
android:focusable="true"
android:clickable="true"
<selector xmlns:android="http://schemas.android.com/apk/res/android" android:exitFadeDuration="@android:integer/config_shortAnimTime">
<item android:state_pressed="true">
<shape>
<solid android:color="@color/textHint"/>
</shape>
</item>
<item android:state_pressed="false">
<shape>
<solid android:color="@android:color/transparent"/>
</shape>
</item>
</selector>








<TextView
android:id="@+id/t9_key_6"
android:layout_height="80dp"
android:text="@string/number_six"
android:background="@drawable/keyboard_button_bg"
android:textSize="30sp" />

当你有一些背景或背景颜色属性设置时,selectableItemBackoundBorderless 无法工作。

android:background="?attr/selectableItemBackgroundBorderless"

但好消息是,它在前台也有效。

android:foreground="?attr/selectableItemBackgroundBorderless"