在图像视图上设置涟漪效果

时间:2015-07-13 21:19:02

标签: java android android-5.0-lollipop ripple

获得以下图片视图:

<ImageView
    android:id="@+id/header"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true"
    android:scaleType="centerCrop"
    app:layout_collapseMode="parallax" 
    android:clickable="true"
    android:focusable="true"
    android:background="?android:attr/selectableItemBackground"/>

如果我没有在图像视图中设置位图,则Ripple效果很好。但是一旦我设置了这样的位图,涟漪效应就消失了:

ImageView iv=((ImageView)rootView.findViewById(R.id.header));
iv.setImageBitmap(myBitmap);

这是我的ripple.xml:

<ripple xmlns:android="http://schemas.android.com/apk/res/android" 
                  android:color="?android:colorControlHighlight">
    <item android:id="@android:id/mask">
        <shape android:shape="oval">
            <solid android:color="?android:colorAccent" />
        </shape>
    </item>
</ripple>

我猜这个位图隐藏了涟漪效应,我该如何让它可见?已经尝试过:

  1. 将android:background更改为android:foreground,这不起作用。
  2. 在此顶部配置另一个透明ImageView,但由于它是透明的,因此未显示纹波。
  3. 有什么想法吗?我见过Lollipop Contacts也是这样做的。

5 个答案:

答案 0 :(得分:26)

我有一个图片库(使用RecyclerViewGridLayoutManager构建)。使用Picasso设置图像。要为图片添加纹波我已将ImageViewFrameLayout 包裹在一起。项目布局为:

<FrameLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="120dp"
    android:foreground="@drawable/ripple"
    android:clickable="true"
    android:focusable="true"
    >
    <ImageView
        android:id="@+id/grid_item_imageView"
        android:layout_width="match_parent"
        android:layout_height="120dp"
        android:layout_gravity="center"
        android:scaleType="centerInside"
        />
</FrameLayout>

请注意 android:foreground 。它与android:background不同。我已经尝试了没有 android:clickable="true"android:focusable="true",而也可以,但它没有受到伤害。

然后将ripple.xml drawable添加到res/drawable

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="true">
        <shape android:shape="rectangle">
            <solid android:color="#7FF5AC8E" />
        </shape>
    </item>
    <item>
        <shape android:shape="rectangle">
            <solid android:color="@android:color/transparent" />
        </shape>
    </item>
</selector>

请注意,选择项目时,这会在图像顶部显示半透明颜色(适用于版本低于Android 5.0的设备)。如果您不想要它,可以将其删除。

然后将带有涟漪的ripple.xml drawable添加到res/drawable-v21

<ripple xmlns:android="http://schemas.android.com/apk/res/android"
        android:color="@color/coral">
</ripple>

您可以使用默认的涟漪效果而非自定义ripple.xml,但在图像上很难看到它,因为它是灰色的:

android:foreground="?android:attr/selectableItemBackground"

答案 1 :(得分:5)

你可以实现它,将drawable包装在RippleDrawable中。

ImageView iv=((ImageView)rootView.findViewById(R.id.header));
Drawable image = .... // your image.

RippleDrawable rippledImage = new   
         RippleDrawable(ColorStateList.valueOf(rippleColor), image, null);
iv.setImageDrawable(rippledImage)

答案 2 :(得分:3)

对于像我这样懒惰的人:

android:foreground="?android:attr/selectableItemBackground"

并根据您的风格自定义波纹颜色。

in values / styles.xml

<style name="colorControlHighlight_blue">
   <item name="colorControlHighlight">@color/main_blue_alpha26</item>
</style>

然后,在onCreateView()中充气之前的片段中:

@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
   getContext().getTheme().applyStyle(R.style.colorControlHighlight_blue, true); //blue ripple color
   View view = inflater.inflate(R.layout.my_fragment_layout, container, false);
   return view;
}

答案 3 :(得分:0)

通过圆形效果试试这个:

<ripple xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:color="@color/colorTema3"
tools:targetApi="lollipop">
<item android:id="@android:id/mask">
    <shape android:shape="rectangle">
        <solid android:color="@color/colorPurpleBarra" />
    </shape>
</item>
<item
    android:id="@android:id/background"
    android:drawable="@android:color/transparent" />

答案 4 :(得分:0)

我参加聚会有点晚了,但是我发现是在适用于TextView的每个版本的Android中工作

只需将此添加到您的textview

def dir_contains_ext(dir, ext):
    return any(
        files.endswith(ext)
        for file in files_in_dir(dir)
    )


dir_contains_ext('./W06', '.jpg')

并在样式文件中添加以下内容:

android:theme="@style/ClickableView"