Multiple Views Inside a ScrollView in Android
Last Updated :
25 Aug, 2022
In Android, a ScrollView is a view group that is used to make vertically scrollable views. A scroll view contains a single direct child only. In order to place multiple views in the scroll view, one needs to make a view group(like LinearLayout) as a direct child and then we can define many views inside it. A ScrollView supports Vertical scrolling only, so in order to create a horizontally scrollable view, HorizontalScrollView is used. In this article, we are going to learn how to add multiple views inside a ScrollView.
Note: This Android article covered in both Java and Kotlin languages.
Step by Step Implementation
Step 1: Create a New Project in Android Studio
To create a new project in Android Studio please refer to How to Create/Start a New Project in Android Studio.
Step 2: Working with the activity_main.xml file
Navigate to app > res > layout > activity_main.xml and add the below code to it. Comments are added in the code to get to know in detail.
XML
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
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">
<!-- using ScrollView -->
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/white">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<!-- using Linear Layout To add
multiple views inside it -->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<Button
android:id="@+id/textView"
android:layout_width="match_parent"
android:layout_height="150dp"
android:textSize="30dp"
android:textColor="@color/purple_700"
android:textAlignment="center"
android:backgroundTint="@color/white"
android:text="GeeksforGeeks"
android:layout_marginTop="10dp"/>
<Button
android:id="@+id/textView2"
android:layout_width="match_parent"
android:layout_height="150dp"
android:textSize="30dp"
android:textColor="@color/purple_700"
android:textAlignment="center"
android:text="GeeksforGeeks"
android:backgroundTint="@color/white"
android:layout_marginTop="10dp"/>
<Button
android:id="@+id/textView3"
android:layout_width="match_parent"
android:layout_height="150dp"
android:textSize="30dp"
android:layout_marginTop="10dp"
android:textColor="@color/purple_700"
android:textAlignment="center"
android:backgroundTint="@color/white"
android:text="GeeksforGeeks" />
<TextView
android:id="@+id/textView4"
android:layout_width="match_parent"
android:layout_height="150dp"
android:textSize="60dp"
android:textColor="@color/purple_700"
android:textAlignment="center"
android:layout_marginTop="10dp"
android:padding="3dp"
android:background="#8C8A8A"
android:text="GeeksforGeeks"/>
<TextView
android:id="@+id/textView5"
android:layout_width="match_parent"
android:layout_height="150dp"
android:textSize="60dp"
android:textColor="@color/purple_700"
android:layout_marginTop="10dp"
android:textAlignment="center"
android:padding="3dp"
android:background="#8C8A8A"
android:text="GeeksforGeeks"/>
<TextView
android:id="@+id/textView6"
android:layout_width="match_parent"
android:layout_height="150dp"
android:textSize="60dp"
android:textColor="@color/purple_700"
android:layout_marginTop="10dp"
android:textAlignment="center"
android:padding="3dp"
android:background="#8C8A8A"
android:text="GeeksforGeeks"/>
</LinearLayout>
</LinearLayout>
</ScrollView>
</androidx.constraintlayout.widget.ConstraintLayout>
Step 3: Working with the MainActivity file
Navigate to app > java > your app's package name > MainActivity file and add the below code to it. Comments are added in the code to get to know in detail.
Java
package com.example.gfgvalidator;
import android.graphics.Color;
import android.graphics.drawable.ColorDrawable;
import android.os.Bundle;
import androidx.appcompat.app.ActionBar;
import androidx.appcompat.app.AppCompatActivity;
public class MainActivity extends AppCompatActivity {
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
// for changing the background color of title bar
ActionBar aBar = getSupportActionBar();
ColorDrawable cd = new ColorDrawable(Color.parseColor("#FF00FF00"));
if (aBar != null) {
aBar.setBackgroundDrawable(cd);
}
}
}
package com.example.gfgvalidator;
import android.graphics.Color;
import android.graphics.drawable.ColorDrawable;
import android.os.Bundle;
import androidx.appcompat.app.ActionBar;
import androidx.appcompat.app.AppCompatActivity;
class MainActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
// for changing the background color of title bar
val aBar = supportActionBar
val cd = ColorDrawable(Color.parseColor("#FF00FF00"))
aBar?.setBackgroundDrawable(cd)
}
}
Output:
Similar Reads
ScrollView in Android In Android, a ScrollView is a view group that is used to make vertically scrollable views. A scroll view contains a single direct child only. In order to place multiple views in the scroll view, one needs to make a view group(like LinearLayout) as a direct child and then we can define many views ins
2 min read
NestedScrollView in Android with Example NestedScrollView is an advanced version of ScrollView, that supports nested scrolling operations allowing it to act as both a parent and child. NestedScrollView is used when there is a need for a scrolling view insidee which view to scroll. Let's discuss a NestedScrollView in Android by taking an ex
2 min read
RecyclerView Multiple View Types in Android with Example We've all used RecyclerView in Android to display a list in our applications. RecyclerView is used to display emails in the Gmail app, feeds on Facebook and Instagram, and messages in WhatsApp, among other things. However, as being an Android Developer you would have come across a fact that when we
5 min read
Horizontal Scrollview in Android ScrollView is a very essential part of Android App Development and can be seen in almost every Application. One of the most popular areas where its implementation can be seen is in the stories bar at the top of Instagram. In this article, we will learn how we can implement a Horizontal ScrollView in
2 min read
How to Make TextView Scrollable in Android? In Android, a TextView is a primary UI element used to display text present in the form of numbers, strings, and paragraphs. However, for a large amount of information to be displayed size adjustment doesn't work. So in this article, we will show you how to make TextView scrollable on Android. Follo
8 min read