How to make constraint layout scrollable by using ScrollView and HorizontalScrollView in your Android App?

In this video it shows the steps to make the constraint layout scrollable in both vertical and horizontal direction by adding ScrollView and HorizontalScrollView in your App’s constraint layout design respectively.

In this App it implements certain widgets in extreme bottom and right position in the layout to show the scrollable functionality of the layout. In the textView it uses layout_constraintVertical_chainStyle as “spread” to allow the textview to keep expanding in the bottom side to accommodate the long text within it.

I hope you like this video. For any questions, suggestions or appreciation please contact us at: https://programmerworld.co/contact/ or email at: programmerworld1990@gmail.com

Complete source code and other details:

package com.programmerworld.constraintlayoutscrollapp;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.widget.TextView;

public class MainActivity extends AppCompatActivity {

private TextView textView;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);

textView = findViewById(R.id.textView);

textView.setText("Programmer World\n" +
"Programmer World\n" +
"Programmer World\n" +
"Programmer World\n" +
"Programmer World\n" +
"Programmer World\n" +
"123456789\n" +
"Programmer World\n" +
"Programmer World\n" +
"Programmer World\n" +
"ABCDEGHIJKL" +
"Programmer World\n" +
"Programmer World\n");

}
}

<?xml version="1.0" encoding="utf-8"?>
<ScrollView 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="match_parent"
tools:context=".MainActivity">


<HorizontalScrollView
android:layout_width="match_parent"
android:layout_height="match_parent">


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


<TextView
android:id="@+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="6dp"
android:layout_marginTop="563dp"
android:text="Hello World!"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/button"
app:layout_constraintVertical_chainStyle="spread" />

<Button
android:id="@+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="136dp"
android:layout_marginTop="88dp"
android:text="Button"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_chainStyle="spread" />

<Button
android:id="@+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="309dp"
android:layout_marginTop="485dp"
android:text="Button"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />

<Button
android:id="@+id/button3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="116dp"
android:layout_marginTop="167dp"
android:text="Button"
app:layout_constraintStart_toEndOf="@+id/textView"
app:layout_constraintTop_toBottomOf="@+id/button2" />


</androidx.constraintlayout.widget.ConstraintLayout>

</HorizontalScrollView>
</ScrollView>

No changes required in Manifest, gradle or any other file.

Vertical Scrolling:

Horizontal scrolling:

Leave a Reply

%d bloggers like this:
Available for Amazon Prime