マテリアルデザインのタッチリップルをImageButtonに適用しますか？

95

リップル効果が組み込まれているロリポップの通常のボタンとは異なり、静止画像であるため、クリックしたときにタッチアニメーションで応答しない画像ボタンがあります。画像にマテリアルデザインのリップルタッチ効果を追加したいのですが、実装する方法が見つからないようです。画像の上にカラーフィルターを設定できますが、それは波及効果ではありません。私がやろうとしていることの例は、Google Playミュージックでアルバムのカバー画像を押したままにし、影の波紋が画像全体を移動する場合です。

— 衛生的な
ソース

259

より良い結果のために：

<ImageButton
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:src="@android:drawable/ic_button"
    android:background="?attr/selectableItemBackgroundBorderless"
/>

— i.shadrin
ソース

6

これはより良い答えです-円形の感触と波及効果を与えてください、ありがとう。

— ElliotM 2015年

3

これは色付きのドローアブルでも機能しますか？私にとって、背景を適用しているにもかかわらず、タッチ効果は表示されません。私のテーマはTheme.AppCompat.Light.DarkActionBarから拡張されていますが、これは問題でしょうか？

— 表示名

12

代わりに、バックグラウンドでそれをフォアグラウンドで使用し、すべてのビューで正常に動作します。

— Gopi Cg 2017年

1

誰かがこれを行う方法を見つけて、背景色も変更しましたか？BackgroundTintを変更しても機能せず、Foregroundを "？attr / selectableItemBackgroundBorderless"に設定すると、ボタンに厄介なパディングが発生します。

— 2017

1

暗い背景を使用している場合、波紋が十分に表示されない場合があります。追加することでそれを明るい色の波紋に変更しますandroid:theme="@style/Base.ThemeOverlay.AppCompat.Dark"（<API 21で動作します）。他のソリューションについては、stackoverflow.com / q / 28605031/599535をご覧ください。

— 静物

28

次のようにImageButtonに背景を追加するだけです。

<ImageButton
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:src="@android:drawable/btn_dialog"
    android:background="?android:attr/selectableItemBackground" />

— ニコラ
ソース

2

android：foreground = "？attr /

— selectableItemBackgroundBorderless

@MFQそれは？android：attr / selectableItemBackground

— Killer

1

@killer selectableItemBackgroundBorderless =ツールバーのアイコンをクリックした場合のように、境界のない円形の波紋を与えますが、selectableItemBackgroundは長方形の波紋を与えます。このドローベルを実装するアイコンを長くクリックした場合の違いを確認できます

— MFQ

6

i.shadrin（こちら）とNicolars（こちら）から良い回答を得ました。

彼らの答えの違いはそれ?attr/selectableItemBackgroundBorderlessがあなたにを与えることができるということですandroid.view.InflateExceptionので、それ?android:attr/selectableItemBackgroundが解決策です。

FWIW、なぜ例外が発生するのかわかりません。最初の答えはすべての古いプロジェクトでうまくいきましたが、最近のプロジェクトではうまくいきませんでした（おそらくアプリのテーマ= android:Theme.Material？が原因です）。

起こっていた奇妙なことは、波及効果が示されていても、それがImageButtonの境界を超えているため、解決策は次のとおりです。

のandroid:foreground="?android:attr/selectableItemBackgroundBorderless"代わりに使用するにはandroid:background="?android:attr/selectableItemBackgroundBorderless"

あなたが同じことに直面している場合、それがあなたを助けることを願っています。

— フィリペ・ブリト
ソース

3

背景がすでにあり、それを変更したくない場合は、前景を使用します。

<ImageButton
    android:layout_width="60dp"
    android:layout_height="match_parent"
    android:background="@drawable/preview_in_4k_background"
    android:src="@drawable/ic_full_screen_24px"
    android:layout_marginLeft="5dp"
    android:foreground="?attr/selectableItemBackgroundBorderless"
    android:layout_column="2"/>

— サブリメビッチ
ソース