web-dev-qa-db-ja.com

ImageViewを含むRecyclerViewアイテムのリップル効果

次のグリッドアイテムを展開するRecyclerViewがあります。

<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="wrap_content"
    Android:layout_marginLeft="@dimen/children_tile_border"
    Android:layout_marginTop="@dimen/children_tile_border"
    Android:clickable="true"
    Android:focusable="true"
    Android:background="?selectableItemBackground"
    tools:ignore="RtlHardcoded">

        <com.example.app.ui.widget.SquareImageView
            Android:id="@+id/child_picture"
            Android:layout_width="match_parent"
            Android:layout_height="wrap_content"
            Android:visibility="visible"
            Android:layout_alignParentBottom="true"/>

        <LinearLayout
            Android:orientation="vertical"
            Android:layout_width="match_parent"
            Android:layout_height="68dp"
            Android:background="@color/tile_text_background"
            Android:gravity="center_vertical"
            Android:layout_alignParentBottom="true">

            ..............
        </LinearLayout>
</RelativeLayout>

ただし、SquareImageView's可視性を非表示に設定しない限り、リップル効果は表示されません。リップル効果はSquareImageViewの下に描かれているようです。 SquareImageView上に描画するにはどうすればよいですか?

42
Binoy Babu

以下のコードを親レイアウトに追加します

Android:clickable="true"
Android:focusable="true"
Android:background="?attr/selectableItemBackground" 

カスタムのリップル効果が必要な場合は、このripple_custom.xmlをdrawable-v21に追加します

<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:Android="http://schemas.Android.com/apk/res/Android"
    Android:color="@color/colorHighlight">

    <item
        Android:id="@Android:id/mask"
        Android:drawable="@color/windowBackground" />
</ripple>

古いバージョンをサポートするには、drawableにripple_custom.xmlを追加します

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:Android="http://schemas.Android.com/apk/res/Android">
    <item Android:state_pressed="true">
        <shape Android:shape="rectangle">
            <solid Android:color="@color/colorHighlight" />
        </shape>
    </item>
    <item>
        <shape Android:shape="rectangle">
            <solid Android:color="@Android:color/transparent" />
        </shape>
    </item>
</selector>
66
Jinu

変化する:

Android:background="?selectableItemBackground"

に:

Android:background="?android:attr/selectableItemBackground"

これをSquareImageViewに追加します

Android:clickable="false" 
12
Enzokie

FrameLayout内にRecyclerViewアイテムをラップし、Android:foregroundプロパティ。詳細については、 link の後にチェックアウトしてください。それは私にはかなりうまく機能します。

8
Sagar Trehan

CardView + ImageViewがある場合
CardViewに挿入するだけ

Android:focusable="true"
Android:foreground="?android:attr/selectableItemBackground"

また、RelativeLayout + ImageViewの場合
RelativeLayoutに挿入

Android:clickable="true"
Android:focusable="true"
Android:background="?attr/selectableItemBackground" 

または

Android:focusable="true"
Android:background="?attr/selectableItemBackground"

このコードは私のために働いた

2
Mahdi Hossaini

SquareImageViewはスペース全体を埋め尽くしています(widthmatch_parentで、heightwrap_contentです)SquareImageViewはクリックイベント。

私の場合は、RelativeLayout内のすべてのオブジェクトのクリック可能な状態をfalseに設定していました。

Android:clickable="false"

RelativeLayoutがアクティビティのクリックイベントを処理することを確認してください。私のコードでは、RelativeLayoutview vに設定し、onClick Listenerを設定して、リスト項目内のCheckBoxを処理します。

v.setOnClickListener(this);

うまくいけば、これがそれを読む人全員に役立つことを願っています。

1
Hugo Mulder

上記の答えは正しいです。しかし、代わりにAndroid:foregroundを使用することをお勧めします。imageViewの前面に波紋が表示されるからです。

ルートビューで、次を追加します。

Android:foreground="@drawable/ripple_effect_color_primary"
Android:clickable="true"
Android:focusable="true"

私はそれがそのような古いスレッドに対するかなり遅い答えであることを知っています。しかし、誰が知っているか、誰かが実際にそれを役に立つと思うかもしれません。

0
Sami Adam