【问题标题】:Item overlap in recyclerview回收站视图中的项目重叠
【发布时间】:2019-05-28 10:48:03
【问题描述】:

我想在回收站视图中将第一项与第二项重叠。

这就是我想要实现的目标:

这就是我的回收站视图现在的样子:

[]

绿色边框内的内容实际上是一个 recyclerView 和父 recyclerview 中的第一项,而评级栏布局是父 recyclerview 中的第二项。 请建议我如何将第一项重叠到第二项 我试过this

item_rating_layout:

 <?xml version="1.0" encoding="utf-8"?>
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        style="@style/LayoutHeightWrapWidthMatchStyling"
        android:layout_width="match_parent"
        android:gravity="center_horizontal"
        android:orientation="vertical"
        android:padding="@dimen/padding_large">

        <TextView
            android:id="@+id/tvRatingMessage"
            style="@style/TextStyleNormal.XXLarge"
            android:text="@string/rating_exp" />

        <RatingBar
            android:id="@+id/ratingBar"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_margin="@dimen/margin_medium"
            android:numStars="5"
            android:progressBackgroundTint="@color/gray"
            android:stepSize="1.0"
            android:progressTint="@color/primaryColor"
            android:rating="2.5" />

        <TextView
            android:id="@+id/tvWriteFeedBack"
            style="@style/TextStyleNormal.XXXLarge.primary"
            android:padding="@dimen/padding_medium"
            android:text="Write Feedback"
            android:visibility="gone" />

    </LinearLayout>

item_recycler_view:

 <?xml version="1.0" encoding="utf-8"?>
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        xmlns:tool="http://schemas.android.com/tools"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginStart="@dimen/margin_24dp"
        android:layout_marginEnd="@dimen/margin_24dp"
        android:background="@color/warranty_card_background">

        <androidx.core.widget.NestedScrollView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:fillViewport="true">

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:background="@drawable/btn_shap_without_solid_green"
                android:gravity="center_horizontal"
                android:orientation="vertical">


                <ImageView
                    android:id="@+id/ivProductImage"
                    android:layout_width="100dp"
                    android:layout_height="100dp"
                    android:layout_marginTop="@dimen/margin_medium"
                    android:scaleType="fitXY"
                    app:srcCompat="@drawable/ic_original_placeholder" />

                <TextView
                    android:id="@+id/tvName"
                    style="@style/TextStyleNormal.XXLarge.black"
                    android:textStyle="bold"
                    tool:text="Steelbird Air" />

                    <TextView
                        android:id="@+id/tvModel"
                        style="@style/TextStyleNormal.XXLarge"
                        tool:text="SBA-2 Horn Matt Black With Red " />

                <TextView
                    android:id="@+id/tvId"
                    style="@style/TextStyleNormal.XXLarge.gray"
                    android:text="@string/product_id" />

                <TextView
                    android:id="@+id/tvViewProductDetails"
                    style="@style/TextStyleNormal.XLarge.primary"
                    android:text="View product Details" />

                <androidx.recyclerview.widget.RecyclerView
                    android:id="@+id/rvWarrantyCard"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginStart="@dimen/margin_medium"
                    android:layout_marginBottom="@dimen/margin_medium">

                </androidx.recyclerview.widget.RecyclerView>
            </LinearLayout>
        </androidx.core.widget.NestedScrollView>
    </LinearLayout>

【问题讨论】:

  • 让项目重叠是相当棘手的。你不能在第一个项目的底部添加一点蓝色背景来模仿这种行为吗?

标签: android android-recyclerview android-linearlayout linearlayoutmanager


【解决方案1】:

您可以使用以下ItemDecoration:

  public class OverlapDecoration extends RecyclerView.ItemDecoration {

  private final static int vertOverlap = -90;

  @Override
  public void getItemOffsets (Rect outRect, View view, RecyclerView parent, RecyclerView.State state) {

    outRect.set(0, vertOverlap, 0, 0);

  }
}

现在,当您添加上述装饰时,您的下一行将被绘制在上一行之上。要纠正此问题,请使用 setReverseLayout(true) 将您的回收站视图设为反向

你可以参考my question,要求差不多

【讨论】:

    【解决方案2】:

    我通过在第一个项目的底部添加一些与评分栏背景相同的颜色以某种方式解决了我的问题。

    现在这是最终的 xml 外观:

    item_recycler_view:

    <?xml version="1.0" encoding="utf-8"?>
    
    <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        xmlns:tool="http://schemas.android.com/tools"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
    
        <LinearLayout
            android:id="@+id/llOverlapView"
            android:layout_width="match_parent"
            android:layout_height="50dp"
            android:layout_gravity="bottom"
            android:background="@color/rating_bar"
            android:orientation="vertical"/>
    
            <androidx.core.widget.NestedScrollView
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_marginStart="@dimen/margin_24dp"
                android:layout_marginEnd="@dimen/margin_24dp"
                android:fillViewport="true">
    
                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:background="@drawable/btn_shap_without_solid_green"
                    android:gravity="center_horizontal"
                    android:orientation="vertical">
    
    
                    <ImageView
                        android:id="@+id/ivProductImage"
                        android:layout_width="100dp"
                        android:layout_height="100dp"
                        android:layout_marginTop="@dimen/margin_medium"
                        android:scaleType="fitXY"
                        app:srcCompat="@drawable/ic_original_placeholder" />
    
                    <TextView
                        android:id="@+id/tvName"
                        style="@style/TextStyleNormal.XXLarge.black"
                        android:textStyle="bold"
                        tool:text="Steelbird Air" />
    
                    <TextView
                        android:id="@+id/tvModel"
                        style="@style/TextStyleNormal.XXLarge"
                        tool:text="SBA-2 Horn Matt Black With Red " />
    
                    <TextView
                        android:id="@+id/tvId"
                        style="@style/TextStyleNormal.XXLarge.gray"
                        android:text="@string/product_id" />
    
                    <TextView
                        android:id="@+id/tvViewProductDetails"
                        style="@style/TextStyleNormal.XLarge.primary"
                        android:text="View product Details" />
    
                    <androidx.recyclerview.widget.RecyclerView
                        android:id="@+id/rvWarrantyCard"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:layout_marginStart="@dimen/margin_medium"
                        android:layout_marginBottom="@dimen/margin_medium">
    
                    </androidx.recyclerview.widget.RecyclerView>
                </LinearLayout>
            </androidx.core.widget.NestedScrollView>
    </FrameLayout>
    

    非常感谢@Pawel

    【讨论】:

      【解决方案3】:

      使用主布局,否则使用框架布局

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 1970-01-01
        • 2022-06-14
        • 1970-01-01
        • 1970-01-01
        • 2018-03-16
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        相关资源
        最近更新 更多