Android ScrollView

Filed Under: Android

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

Android ScrollView 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:

Android TableLayout Output

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

android ScrollView example output

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

You can download the ScrollView Project from the following link: AndroidScrollLayout.zip

Reference: ScrollView Official Doc

Comments

  1. vinodh says:

    your tutorial is good. I need number of buttons grid view with scrollable…!!!!!!!!!!

Leave a Reply

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

close
Generic selectors
Exact matches only
Search in title
Search in content
Search in posts
Search in pages