如何在 Android 的 textview 或 imageview 上设置涟漪效果？

Question

我想在 Android Studio 中为 textview 和 imageview 设置涟漪效果。我该怎么做？

Answer 1

开始效果

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()
    }
})

Answer 2

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

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

Answer 3

参考：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"
/>

Answer 4

如果您希望将波纹限制在 TextView/ImageView 的大小范围内，请使用：

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

（我觉得更好看）

Answer 5

除了@Bikesh M Annur 的回答之外，请务必更新您的支持库。以前我使用的是 23.1.1，但没有任何反应。将它更新到 23.3.0 就成功了。

Answer 6

<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" />

Answer 7

如果@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" 因为：

"无法通过键盘访问声明为可点击但未声明为可聚焦的小部件。"

Answer 8

除了上述答案外，还添加了可聚焦以避免UI编辑器的警告

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

Answer 9

涟漪效应请参考以下答案。

Textview 或视图上的纹波：

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

Button 或 Imageview 上的波纹：

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

Answer 10

最佳添加方式：

    <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" />

Answer 11

添加 android:clickable="true" android:focusable="true"

涟漪效应

android:background="?attr/selectableItemBackgroundBorderless"

可选效果

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

对于按钮效果

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

Answer 12

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

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

Answer 13

如果上述解决方案对您的 TextView 不起作用，那么这肯定会起作用：

    <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，其他所有操作都会自动完成。

Answer 14

android:background="?android:selectableItemBackground"
android:focusable="true"
android:clickable="true"

Answer 15

<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" />

Answer 16

selectableItemBackgroundBorderless 在设置了某些背景或背景颜色时不起作用属性。它对我不起作用。

android:background="?attr/selectableItemBackgroundBorderless"

但好消息是它也适用于前台。

android:foreground="?attr/selectableItemBackgroundBorderless"

如何在 Android 的 textview 或 imageview 上设置涟漪效果？

How to set a ripple effect on textview or imageview on Android?

android

textview

android-imageview

material-design