1. ホーム
  2. android

[解決済み] ボタンがクリックされたときに、円形の波紋を作るには?

2022-04-28 09:39:11

質問

背景

Androidのダイヤラーアプリで、検索を開始し、EditTextの左側にある矢印ボタンをクリックすると、円形の波紋が表示されます。

問題点

私も持ってみましたが、長方形のものが出てきました。

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

質問

ボタンがクリックされたときに、円形の波紋のような効果を持たせるにはどうしたらよいでしょうか?新しいdrawableを作成しなければならないのでしょうか、それともそのためのビルトインの方法があるのでしょうか?

解決方法は?

すでに背景画像がある場合、selectableItemBackgroundBorderlessに近い見た目の波紋の例を紹介します。

            <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_pressed_ripple.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>