Android Constraint Layout height inside scrollview have no effect

Issue

In Android, I want to achieve a scroll view with fixed height on the screen, and the content inside also have a fixed height.

The scroll view height is 300dp, the direct child (relative layout) is 500dp, and the text view distance from top is 301dp. This means after I reached the text view, there is 200dp more bottom space for me to scroll from the relative layout height.

enter image description here

I manage to create the desired effect using the XML below.

    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="300dp" >

        <RelativeLayout
            android:layout_width="match_parent"
            android:background="#FFC0CB"
            android:layout_height="500dp" >

            <TextView
                app:layout_constraintTop_toTopOf="parent"
                app:layout_constraintLeft_toLeftOf="parent"
                app:layout_constraintRight_toRightOf="parent"
                app:layout_constraintBottom_toBottomOf="parent"
                android:id="@+id/new_realm_message"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginTop="301dp"
                android:text="long text" />
        </RelativeLayout>
    </ScrollView>

But here is the problem, if I change the relative layout to constraint layout, now the scrolling will only scroll up to the text View at height 310dp, not of showing the 200dp empty space at the bottom.

ConstraintLayout Scroll

Can someone explain why constraint layout is giving me this weird behavior?
According to Differences between ConstraintLayout and RelativeLayout, constraint layout “has dual power of both Relative Layout as well as Linear layout”, it should be able to achieve what relative layout can achieve.

Solution

Try this:

<ScrollView android:layout_width="match_parent"
android:layout_height="300dp">

<androidx.constraintlayout.widget.ConstraintLayout
    android:layout_width="match_parent"
    android:background="#FFC0CB"
    android:minHeight="500dp"
    android:layout_height="500dp" >

    <TextView
        android:id="@+id/new_realm_message"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="301dp"
        android:text="long text"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
</ScrollView>

It seems like there is a bug in constraint layout or layout height cannot be applied to constraint layout in a scroll view but you can use minimum height attribute in constraint layout.

Answered By – Ibrar Khan

Answer Checked By – Senaida (FlutterFixes Volunteer)

Leave a Reply

Your email address will not be published. Required fields are marked *