Android,设置按钮的背景颜色会失去涟漪效果

Tom*_*hao 24 android click button effect ripple

在向Android按钮添加颜色后,它会失去其涟漪效果,使用户感觉有响应点击.我该如何解决?我已经搜索了很多解决方案,但我找不到一个不明确的明确解决方案.

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
                xmlns:tools="http://schemas.android.com/tools"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                tools:context=".ClockInOutFragment">


    <AnalogClock
        android:id="@+id/clock"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentEnd="true"
        android:layout_alignParentRight="true"
        android:layout_alignParentTop="true"
        android:layout_toRightOf="@+id/date_and_time"/>


    <RelativeLayout
        android:id="@+id/date_and_time"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="10dp">

        <TextView
            android:id="@+id/time_digits"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="12:10"
            android:textSize="45sp"/>

        <TextView
            android:id="@+id/am_pm"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignBaseline="@+id/time_digits"
            android:layout_toRightOf="@+id/time_digits"
            android:paddingLeft="3dp"
            android:text="PM"
            android:textSize="20sp"/>

        <TextView
            android:id="@+id/date"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_below="@+id/time_digits"
            android:text="Mon, July 11"
            android:textSize="22sp"/>
    </RelativeLayout>

    <!--Clock in and out buttons-->
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true"
        android:orientation="horizontal">

        <Button
            android:id="@+id/textView3"
            android:layout_width="0dp"
            android:layout_height="56dp"
            android:layout_weight="1"
            android:background="#4CAF50"
            android:gravity="center"
            android:text="Clock In"
            android:textAppearance="?android:attr/textAppearanceLarge"
            android:textColor="#FFFFFF"/>

        <!--Divider between the clock in and out button-->
        <View
            android:layout_width="1dp"
            android:layout_height="match_parent"
            android:background="#B6B6B6"/>

        <Button
            android:id="@+id/textView4"
            android:layout_width="0dp"
            android:layout_height="56dp"
            android:layout_weight="1"
            android:background="#FF5252"
            android:gravity="center"
            android:text="Clock Out"
            android:textAppearance="?android:attr/textAppearanceLarge"
            android:textColor="#FFFFFF"/>
    </LinearLayout>


</RelativeLayout>
Run Code Online (Sandbox Code Playgroud)

Ber*_*tel 31

您可以添加涟漪效果和背景颜色以及另外的波纹可绘制:

你的布局:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent">

    <Button
        android:id="@+id/button_connect"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="20dip"
        android:fontFamily="sans-serif"
        android:text="Connect"
        android:background="@drawable/ripple"
        android:textColor="#FFFFFF"
        android:textSize="18sp" />

</LinearLayout>
Run Code Online (Sandbox Code Playgroud)

ripple.xml(除了涟漪效果之外,您还可以添加背景颜色):

<?xml version="1.0" encoding="utf-8"?>
<!-- in drawable folder-->
<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>

    <item>
        <shape android:shape="rectangle">
            <!-- put your background color here-->
            <solid android:color="@color/default_color" />
        </shape>
    </item>

</ripple>
Run Code Online (Sandbox Code Playgroud)


Abh*_*sal 28

这样做的一个非常简单和直接的方式是设置?attr/selectableItemBackgroundandroid:foreground属性的按钮.以下xml完全有效并且有效

<Button
    android:id="@+id/btn"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@android:color/white"
    android:foreground="?attr/selectableItemBackground"/>
Run Code Online (Sandbox Code Playgroud)

  • 真好 但是,版本23不支持向后兼容。 (7认同)

the*_*ndr 14

不要改变Button的背景.改变主题.

<style name="ButtonGray">
    <item name="colorButtonNormal">@color/gray</item>
</style>
Run Code Online (Sandbox Code Playgroud)

并在您的xml文件中

<Button
     android:id="@+id/accept_button"
     android:layout_height="wrap_content"
     android:layout_width="0dp"
     android:layout_weight="1"
     android:text="@string/button_accept_group"
     android:theme="@style/ButtonGray"/>
Run Code Online (Sandbox Code Playgroud)

或者您可以在主应用主题中添加它

<style name="AppTheme"
           parent="Theme.AppCompat.Light.NoActionBar">
        <item name="colorButtonNormal">@color/primary_color</item>
</style>
Run Code Online (Sandbox Code Playgroud)

并且不需要更改按钮背景.

如果您想要完全自定义背景,则需要创建选择器.你可以设置涟漪效应.


小智 11

MaterialButton没有答案,所以我将其放在这里。

对于MaterialButton (com.google.android.material.button.MaterialButton),请使用“backgroundTint”和“rippleColor”。

<com.google.android.material.button.MaterialButton
    android:id="@+id/button_sign_in"
    android:layout_width="0dp"
    android:layout_height="55dp"
    app:backgroundTint="@android:color/white"
    app:rippleColor="?attr/colorControlHighlight"
Run Code Online (Sandbox Code Playgroud)

?attr/colorControlHighlight是默认的波纹颜色,您可以更改此值。


Gil*_*mer 6

只需使用:

android:backgroundTint="#4CAF50"
Run Code Online (Sandbox Code Playgroud)

代替:

android:background="#4CAF50"
Run Code Online (Sandbox Code Playgroud)

别忘了将您更改Buttonandroid.support.v7.widget.AppCompatButton

  • 这不适用于“androidx.appcompat.widget.AppCompatButton” (2认同)