Material Design Touch Ripple을 ImageButton에 적용 하시겠습니까?

95

잔물결 효과가 내장 된 롤리팝의 일반 버튼과 달리 정적 인 이미지이기 때문에 클릭시 터치 애니메이션으로 반응하지 않는 이미지 버튼이 있습니다. 머티리얼 디자인 리플 터치 효과를 이미지에 추가하고 싶지만 구현 방법을 찾을 수없는 것 같습니다. 이미지 위에 컬러 필터를 설정할 수 있지만 그것은 파급 효과가 아닙니다. 제가하려는 작업의 예는 Google Play 뮤직에서 앨범 표지 이미지를 잡고 이미지를 가로 질러 그림자 물결이 움직이는 경우입니다.

— 위생적인
소스

261

더 나은 결과를 위해 :

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

— i.shadrin
소스

7

이것이 더 나은 대답입니다. 원형의 느낌과 파급 효과를 제공합니다. 감사합니다.

— ElliotM

3

컬러 드로어 블에서도 작동해야합니까? 나에게는 배경을 적용해도 터치 효과가 보이지 않습니다. 내 테마가 Theme.AppCompat.Light.DarkActionBar에서 확장됩니다. 이것이 문제가 될 수 있습니까?

— 표시 이름

12

대신 배경은 잘 작동하는 모든 뷰에 전경을 사용합니다.

— Gopi Cg

1

누구든지 이것을 수행하고 배경색을 변경하는 방법을 찾았습니까? BackgroundTint 변경이 작동하지 않고 Foreground를 "? attr / selectableItemBackgroundBorderless"로 설정하면 버튼에 불쾌한 패딩이 생깁니다.

— Sev

1

어두운 배경을 사용하는 경우 잔물결이 충분히 보이지 않을 수 있습니다. 추가하여 밝은 색상의 잔물결로 변경합니다 android:theme="@style/Base.ThemeOverlay.AppCompat.Dark"(<API 21에서 작동). 다른 솔루션 은 stackoverflow.com/q/28605031/599535 를 참조하십시오 .

— Lifes

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

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

— 사 브리 메 비스
소스