【问题标题】:Add dividers and ripple effect for each GridLayout square为每个 GridLayout 正方形添加分隔线和波纹效果
【发布时间】:2018-11-19 20:33:36
【问题描述】:

我正在使用 RecyclerView + GridLayout(3 列)。现在,为了使网格的每个方格更“响应”,我希望每个方格都显示某种分隔线,并且用户点击的每个方格内都会产生涟漪效果。

编辑:我添加了android:foreground="?attr/selectableItemBackground",但没有任何反应。这是现在的单项xml代码:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:padding="6dip" >

    <ImageView
        android:foreground="?attr/selectableItemBackground"
        android:id="@+id/icon"
        android:layout_width="128dp"
        android:layout_height="118dp"
        android:layout_alignParentStart="true"
        android:layout_alignParentTop="true"
        android:layout_marginStart="12dp"
        android:layout_marginEnd="12dp"
        android:layout_marginTop="12dp"
        android:contentDescription="TODO"
        android:src="@drawable/ic_launcher_background" />
</RelativeLayout>

这是它目前的样子:

这就是我想要的样子:

这是目前修复后的工作方式,添加后:

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

【问题讨论】:

  • 代替 imageView 中的 android:foreground="?attr/selectableItemBackground" 在 RelativeLayout 中使用 android:background="?attr/selectableItemBackground" 并设置 android:clickable="true"。
  • 是的!你是对的,谢谢你

标签: android android-recyclerview rippledrawable


【解决方案1】:

如果你想自定义它,你可以像这样创建一个可绘制的波纹:

ripple.xml

<ripple xmlns:android="http://schemas.android.com/apk/res/android"
android:color="@color/colorPrimaryDark">
<item android:id="@android:id/mask">
    <shape android:shape="rectangle">
        <solid android:color="@color/colorPrimaryLight" />
        <!--<corners android:radius="@dimen/button_radius_large" />-->
    </shape>
</item>

<item android:id="@android:id/background">
    <shape android:shape="rectangle">
        <gradient
            android:angle="90"
            android:endColor="@color/background"
            android:startColor="@color/background"
            android:type="linear" />
        <!--<corners android:radius="10dp" />-->
    </shape>
</item>

并像这样在你的布局中使用它:

android:clickable="true"
android:background="@drawable/ripple"

或 你可以这样做:

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

【讨论】:

  • 谢谢!完成了这项工作,有点像,我在原始帖子的底部添加了一张新图片,向您展示了波纹的工作原理,但它只做一个矩形。是否有可能以某种方式填充图像周围的“正方形”?
  • 这是不可能的,除非您添加另一个布局,该布局直接位于您的 imageview 所在的父布局之上,然后在该布局上添加波纹效果。用相对布局来做。这只是一个建议:)
【解决方案2】:

您可以通过将 GridItemDecoration 添加到您的 recyclerview 来添加分隔符。我建议你使用this

单击项目时添加波纹的一种简单方法是在项目视图中添加具有 selectableItemBackground 值的前景:

android:foreground="?attr/selectableItemBackground"

【讨论】:

  • 我为单个项目添加了我的 xml,包括您提供的代码,但没有任何反应
  • 请为您的项目添加 setOnClickListener 并再次检查
  • @Fireio 或者您可以将 android:clickable="true" android:focusable="true" 添加到您的项目中。
【解决方案3】:

在 xml 中尝试这种方式的涟漪效应

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:padding="6dip"
        android:clickable="true"
        android:focusable="true"
        android:background="?attr/selectableItemBackground">

        <ImageView

            android:id="@+id/icon"
            android:layout_width="128dp"
            android:layout_height="118dp"
            android:layout_alignParentStart="true"
            android:layout_alignParentTop="true"
            android:layout_marginStart="12dp"
            android:layout_marginEnd="12dp"
            android:layout_marginTop="12dp"
            android:contentDescription="TODO"
            android:src="@drawable/ic_launcher_background" />
    </RelativeLayout>

并点击此链接查看项目之间的分隔符 How to add dividers and spaces between items in RecyclerView?

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2017-07-14
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2015-09-05
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多