As you may know, you can set a RecyclerView.ItemDecoration for RecyclerView's Items. However, I want to achieve something similar to that but for ConstraintLayout's Flow.

Currently, I can create multiple divider views and put them inside my flow after each normal view but that can be cumbersome when my Flow has multiple views and that's not DRY and is an example of repeating yourself. Also, it's worth noting that you cannot reference the same view more than once in Flow so you cannot create a divider view and reference it multiple times in different positions. Pragmatically I can create a custom background/style for TextView with a line under them to somehow replicate a divider but what if Flows children are not TextView?

<?xml version="1.0" encoding="utf-8"?>
<com.google.android.material.card.MaterialCardView xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_gravity="center"
    android:layout_margin="4dp"
    android:checkable="true">

    <androidx.constraintlayout.widget.ConstraintLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <androidx.constraintlayout.helper.widget.Flow
            android:id="@ id/product_item_detail_flow"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_marginStart="8dp"
            android:layout_marginTop="8dp"
            android:layout_marginBottom="8dp"
            android:orientation="vertical"
            android:padding="8dp"
            app:constraint_referenced_ids="product_item_category,materialDivider,product_item_name,materialDivider2,product_item_price"
            app:flow_verticalGap="8dp"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toStartOf="@ id/product_item_image"
            app:layout_constraintHorizontal_chainStyle="packed"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent" />

        <com.google.android.material.divider.MaterialDivider
            android:id="@ id/materialDivider"
            android:layout_width="0dp"
            android:layout_height="wrap_content" />

        <com.google.android.material.divider.MaterialDivider
            android:id="@ id/materialDivider2"
            android:layout_width="0dp"
            android:layout_height="wrap_content" />

        <TextView
            android:id="@ id/product_item_name"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:textSize="18sp"
            tools:text="@tools:sample/lorem" />

        <TextView
            android:id="@ id/product_item_category"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:textSize="14sp"
            tools:text="@tools:sample/lorem" />

        <TextView
            android:id="@ id/product_item_price"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:gravity="center"
            tools:text="@tools:sample/us_zipcodes" />

        <ImageView
            android:id="@ id/product_item_image"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:contentDescription="@string/product_image"
            android:scaleType="fitCenter"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintHorizontal_bias="0.5"
            app:layout_constraintStart_toEndOf="@ id/product_item_detail_flow"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintWidth_percent=".33"
            tools:srcCompat="@tools:sample/avatars" />
    </androidx.constraintlayout.widget.ConstraintLayout>

</com.google.android.material.card.MaterialCardView>

Consider another flow like this with multiple views that putting a divider after each item is not wise in my opinion:

So in short how can I create a divider item decoration for constraint layout's flow children?

Edit: both of these flows are actually item for a recyclerview

CodePudding user response：

I didn't find a way to achieve this using ConstraintLayout and Flow, however, this can be achieved using