Android ScrollView

Android ScrollView allows us to create a scrollable layout on the android screen.

Android ScrollView

ScrollView is a special type of FrameLayout that allows users to scroll through a list of views. It is useful when the layout occupies more space than the physical display. The ScrollView can contain only one child view or ViewGroup, which normally is a LinearLayout.

Note: Do not use a ListView together with the ScrollView. The ListView is designed to display a list of related information and is optimized for dealing with large lists. Also, ListView contains built-in scrolling capabilities.

1. ScrollView only supports vertical scrolling. We have to use HorizontalScrollView for horizontal scrolling.
2. The android:fillViewport property defines whether the scrollview should stretch its content to fill the viewport.

ScrollView XML Layout

<?xml version="1.0" encoding="utf-8"?>
<ScrollView
    android:id="@+id/widget54"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    xmlns:android="https://schemas.android.com/apk/res/android"
    >
    <LinearLayout
        android:layout_width="310px"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        >
        <Button
            android:id="@+id/button1"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:text="Back"
            />
        <Button
            android:id="@+id/button2"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:text="Button 1"
            />
        <Button
            android:id="@+id/button3"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:text="Button 2"
            />
        <TextView
            android:text="This textView is placed inside 
            a LinearLayout which is a child ViewGroup 
            contained in a ScrollView"
            android:layout_width="fill_parent"
            android:textSize="18sp"
            android:layout_height="750px"
            />
        <Button
            android:id="@+id/button4"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:text="Button 3"
            />
        <Button
            android:id="@+id/button5"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:text="Button 4"
            />
    </LinearLayout>
</ScrollView>

We have explicitly assigned a larger size of the layout_height of the TextView so that ScrollView comes into use.

Android ScrollView Example Project

This project consists of two Activities: MainActivity and SecondActivity.

The MainActivity displays the TableLayout.

package com.journaldev.layoutspartthree;

import android.app.Activity;
import android.content.Intent;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;

public class MainActivity extends Activity {

    Button next;

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

        next=(Button)findViewById(R.id.next);
        next.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Intent intent = new Intent(MainActivity.this, SecondActivity.class);
                startActivity(intent);
            }
        });

    }

    @Override
    public void onBackPressed() {
        finish();
    }
}

The SecondActivity.java contains the ScrollView with a LinearLayout inside it.

package com.journaldev.layoutspartthree;

import android.app.Activity;
import android.content.Intent;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;

public class SecondActivity extends Activity {

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

        back.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Intent intent= new Intent(SecondActivity.this,MainActivity.class);
                startActivity(intent);
            }
        });
    }
}

Output:

In the above image, the individual columns in all the three rows are highlighted.

The vertical scrollbars are visible on the right side of the screen.

Reference: ScrollView Official Doc