如何创建倾斜的列表项

5

我有一个水平的RecyclerView,看起来像这样(显然)

-------------------------------
|     |     |     |     |     |
|  1  |  2  |  3  |  4  |  5  |
|     |     |     |     |     |
-------------------------------

我愿意这样做:
------------------------------
|      /     /     /     /    |
|  1  /  2  /  3  /  4  /  5  |
|    /     /     /     /      |
-------------------------------

什么是创建类似于此 RecyclerView 的最佳方法?
注意:我不是要创建倾斜的分隔线,而是要创建一个倾斜的布局。我所说的倾斜是指掩盖而非旋转。物品应该有一个match_parentImageView和一个TextView。两者都应该看起来是直的,没有旋转。同时请注意第一个和最后一个物品。
这是一个示例:

sample


不太清楚你的问题。请提供更多的解释或者展示你想要做什么的图片。 - C0D3LIC1OU5
我已经添加了一个示例图像。 - osrl
@osrl,太酷了!还有很棒的问题! - clearlight
3个回答

3
我建议您使用Squint
创建一个包含以下代码的布局xml。此布局文件通过显示图像和文本在回收视图中呈现单个行。
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
              xmlns:squint="http://schemas.android.com/apk/res-auto"
              android:orientation="vertical" 
                android:layout_marginLeft="-25dp"
              android:layout_width="wrap_content"
              android:layout_height="wrap_content">

    <com.intrusoft.squint.DiagonalView
        android:id="@+id/diagonalView"
        android:layout_width="150dp"
        android:layout_height="150dp"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
        android:scaleType="centerCrop"
        squint:angle="10"
        squint:diagonalDirection="bottom_to_top"
        squint:gravity="right"/>

    <TextView
        android:background="#80000000"
        android:layout_width="150dp"
        android:layout_height="30dp"
        android:gravity="center"
        android:textColor="#FFF"
        android:id="@+id/txtName"
        android:layout_alignBottom="@+id/diagonalView"
        android:layout_alignLeft="@+id/diagonalView"
        android:layout_alignStart="@+id/diagonalView"/>

</RelativeLayout>

编写自定义适配器后,您需要按以下方式准备RecyclerView。
 LinearLayoutManager layoutManager = new LinearLayoutManager(this, LinearLayoutManager.HORIZONTAL, false); // make it horizontal

 recyclerView.setLayoutManager(layoutManager);

成功应用这些操作后,我得到了以下的图片。 enter image description here

这个解决方案可能不是完美的解决方案。还有一些缺陷,比如android:layout_marginLeft="-25dp"。但至少可以给你一个想法。


是的,那不是完美的解决方案,但你给了我灵感。你应该得到奖励。谢谢;) - osrl
我在使用负边距时遇到了一些问题。因此,我使用了一个“ItemDecoration”来重叠项目。也许你应该编辑你的答案。https://dev59.com/X14c5IYBdhLWcg3wssFs#29067942 我还使用(并编辑)了这个库https://github.com/florent37/DiagonalLayout/,因为我已经在使用自定义ImageView。 - osrl
负边距不是一个健康的解决方案。我很高兴你找到了正确的答案。 - Burak Cakir

0

1
DividerItemDecoration 是专门用于分隔线的。我想你可能是指 ItemDecoration。https://developer.android.com/reference/android/support/v7/widget/RecyclerView.ItemDecoration.html - Pztar
我不是在尝试创建一个倾斜的分隔符。我正在尝试创建一个倾斜的布局。所谓的倾斜是指掩盖。 - osrl
@osrl,所以不要使用DividerItemDecoration,而是像Pztar说的那样使用ItemDecoration - pskink
这将如何掩盖这些项目? - osrl
它不会掩盖,而是重新定位它们,使它们重叠在一起,掩盖必须在自定义项目视图中完成。 - pskink

0

看起来你不能真正地使用RecyclerView,因为这些视图不能重叠。此时,您可能需要考虑扩展水平的ScrollView,并将图像和其他元素拼接成一个长视图,通过覆盖onDraw方法进行滚动。您可以在onTouch方法覆盖中处理点击事件。不过这似乎是一个相当大的项目,特别是如果您有很多图像并且需要管理内存。


分割线应包括项目的图像视图。同时,这种方式下分割线不可被点击。 - osrl

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接