google / flexbox-layout

Flexbox for Android
Apache License 2.0
18.22k stars 1.79k forks source link

Can't manage to have 2 items in each column instead of 3 in first column and the last one alone it's own column #602

Open Viish opened 2 years ago

Viish commented 2 years ago

Hi,

I have an issue displaying 4 squared items in a FlexboxLayout. Depending on the screen size, either the 4 of them are stacked vertically (that's fine), or I have a column with 3 of them and the last one alone in it's own column and I'd expect to have 2 and 2.

Issues and steps to reproduce

Flexbox layout displaying 4 squared items:

<com.google.android.flexbox.FlexboxLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                app:flexDirection="column"
                app:flexWrap="wrap"
                app:alignItems="stretch"
                app:alignContent="stretch"
                app:justifyContent="space_between"
                app:showDivider="middle"
                app:dividerDrawable="@drawable/shape_conference_divider"/>

and the item layout

<androidx.constraintlayout.widget.ConstraintLayout
        android:layout_width="150dp"
        android:layout_height="150dp"
        app:layout_flexGrow="1">
<androidx.constraintlayout.widget.ConstraintLayout
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:background="@drawable/shape_remote_background"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintWidth_max="400dp"
            app:layout_constraintDimensionRatio="1:1">
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.constraintlayout.widget.ConstraintLayout>

As you can see, depending on screen height, layout is weird: PXL_20220302_155134672 MP

PXL_20220302_155155821 MP

Expected behavior

I'd expect to have two squares in one column and two other in the second column.

Version of the flexbox library

3.0.0

Link to code

https://github.com/BelledonneCommunications/linphone-android

Thanks in advance for your help.

Best regards,