如何使一个圆形波纹按钮时，被点击？

小开

创建并设置一个可绘制的涟漪作为背景。

<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
android:color="@color/grey_15">
<item android:id="@android:id/mask">
<shape android:shape="oval">
<solid android:color="?android:colorPrimary"/>
</shape>
<color android:color="@color/white"/>
</item>
</ripple>

小开

如果您使用 AppCompat 主题，那么您可以将视图的背景设置为:

android:background="?selectableItemBackgroundBorderless"

这将增加21及以上的圆形纹路和21以下的广场背景。

小开

您可以使用 xml 中的 android:radius属性创建可绘制的圆波纹。

例如:

<ripple xmlns:android="http://schemas.android.com/apk/res/android"
android:color="your_color"
android:radius="your_radius" />

注意，你的 your_radius应该小于你的视图宽度和高度。例如: 如果你有大小为 60dp x 60dp的视图，your_radius应该接近 30dp(宽度/2或高度/2)。

使用 Android 5.0及以上版本。

小开

另一个具有圆形涟漪效果的属性，特别适用于动作条:

android:background="?actionBarItemBackground"

UPD : 波纹颜色可以通过这个属性改变:

<!--somewhere in styles-->
<item name="colorControlHighlight">your_color_here</item>

但是请记住，这个属性适用于所有默认的连锁反应。

小开

最佳答案

如果你已经有了背景图片，这里有一个涟漪的例子，看起来很像 selectableItemBackoundBorderless:

            <ImageButton
android:id="@+id/btn_show_filter_dialog"
android:layout_width="24dp"
android:layout_height="24dp"
android:background="@drawable/ic_filter_state"/>

Ic _ filter _ state. xml:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:state_pressed="true"
android:state_enabled="true"
android:drawable="@drawable/state_pressed_ripple"/>
<item
android:state_enabled="true"
android:drawable="@drawable/ic_filter" />
</selector>

State _ press _ riple.xml: (白色背景上不透明度设置为10%)1AFFFFFF

 <?xml version="1.0" encoding="UTF-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="oval">
<solid android:color="#1AFFFFFF"/>
</shape>
<color android:color="#FFF"/>
</item>
</ripple>

小开

如果需要更通用的 XML 文件，我有两个文件:

1) 波纹背景连密码:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:state_pressed="true"
android:state_enabled="true"
android:drawable="@drawable/ripple_circular_shape"/>
</selector>

2) 波纹圆形波纹圆形波纹圆形波纹连密码:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:color="@color/btn_state_pressed_text_color"
android:shape="oval">
<solid android:color="@color/btn_state_pressed_text_color" />
</shape>

最后用法: android:foreground="@drawable/ripple_btn_background"

小开

只需将这个背景添加到视图中

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

小开

试试:

android:background="@android:color/transparent"
android:clickable="true"
android:focusable="true"
android:foreground="?actionBarItemBackground"

小开

只需在活动 xml 中添加此项

           <ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="?android:attr/actionBarItemBackground"
app:srcCompat="@drawable/ic_arrow_drop_down_black_24dp" />

小开

如果你想要涟漪效应不会跨越圆的边界，你可以检查这个代码。对我来说很有效。只要记住，你必须用涟漪蓝色表示 id =@android: id/掩码。Xml

<ImageButton
android:id="@+id/send_password_to_mail_image_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/ripple_blue"
android:src="@drawable/ic_filter" />

ripple_blue.xml

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


<item android:id="@android:id/mask">


<shape android:shape="oval">
<solid android:color="@color/colorWindowBackground"/>
</shape>


</item>


<item android:id="@android:id/background">


<shape android:shape="oval">
<solid android:color="@color/colorWindowBackground"/>
</shape>


</item>


</ripple>

color.xml

<resources xmlns:tools="http://schemas.android.com/tools">
<color name="colorWindowBackground">#F2F5FC</color>
<color name="colorRipple">#0288d1</color>
</resources>

小开

在 Kotlin/爪哇，你可以这样做

fun View.applyCircularRippleEffect() {
val backgroundResId = context.getResource(android.R.attr.actionBarItemBackground)


if (backgroundResId != 0) {
setBackgroundResource(backgroundResId)
isClickable = true
isFocusable = true
}
}


// getResource extension
fun Context.getResource(resourceId: Int): Int {
val out = TypedValue()
theme.resolveAttribute(resourceId, out, true)


return out.resourceId
}

小开

我还在我的一个项目中修复了这个问题。android:foreground="?attr/selectableItemBackgroundBorderless"负责纹波效应，这就是为什么它被设置在前景和 android:clipToPadding="false"将防止纹波效应切断，使其长方形。将保持你的纹波效应圆形。

<ImageButton
android:id="@+id/navButton"
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_gravity="center_vertical"
android:layout_marginLeft="8dp"
android:foreground="?attr/selectableItemBackgroundBorderless"
android:clipToPadding="false"
android:src="@drawable/search_ic_back_arrow"/>

小开

更新2021:

你需要使用背景的背景

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

例如:

 <androidx.appcompat.widget.AppCompatImageButton
android:layout_width="56dp"
android:layout_height="56dp"
android:background="?android:attr/actionBarItemBackground"
android:src="@drawable/ic_copy" />

如何使一个圆形波纹按钮时，被点击？

背景资料

问题是

那个问题

只需将这个背景添加到视图中