guillaume guillaume - 19 days ago 5
Android Question

Bottom of ScrollView clipped when using ConstraintLayout

I have an issue using a

ScrollView
inside
ConstraintLayout
(
constraint-layout:1.0.0-beta3
)

The content of my ScrollView isn't showed entirely.

Here is my layout:

<android.support.constraint.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/activity_test"
android:layout_width="match_parent"
android:layout_height="match_parent">

<LinearLayout
android:id="@+id/header"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toTopOf="parent"
android:background="#212121">

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Constraint Layout"
android:textSize="45sp"/>

</LinearLayout>

<ScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintTop_toBottomOf="@+id/header"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent">

<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">

<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="BUTTON"
android:layout_marginTop="800dp"/>


</LinearLayout>

</ScrollView>

</android.support.constraint.ConstraintLayout>


And here is the result

enter image description here

As you can see the button isn't visible and I reached the bottom of my ScrollView.

It seems to works well with LinearLayout with layout below

<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/activity_test"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">

<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:background="#212121">

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Linear Layout"
android:textSize="45sp"/>

</LinearLayout>

<ScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content">

<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">

<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="BUTTON"
android:layout_marginTop="800dp"/>


</LinearLayout>

</ScrollView>

</LinearLayout>


And result is

enter image description here

With LinearLayout end of ScrollView is reachable.

Is there a bug with ConstraintLayout or do I made something wrong?

Answer

I changed the height of the ScrollView to match_parent and added a bottom constraint. This seemed to make it work correctly.

    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/header"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent">

Note: Having a height of wrap_content on a vertically scrolling view usually doesn't end well, in any layout.

Comments