Android HorizontalScrollView
HorizontalScrollView can be defined as below –
"Android HorizontalScrollView is a FrameLayout. The class android.widget.HorizontalScrollView provides horizontal scroll view functionality. HorizontalScrollView is used to scroll the elements or views of the child in a horizontal direction. HorizontalScrollView supports only horizontal scrolling."
ScrollView is only used for vertical scrolling.
Attributes of Android HorizontalScrollView
Attributes of horizontalScrollView are same as ScrollView. So, you can check ScrollView attributes to get different HorizontalScrollView attributes.
At first, we will create android application. Then, we will use horizontalScrollView in this application.
Follow steps below to create new project. Please ignore the steps if you've already created a new application.
| S. No. | Steps |
| 1 | Open Android Studio. |
| 2 | Click on Start a new Android Studio Project Write application name as HorizontalScrollView. Then, click next button. |
| 3 | Select minimum SDK you need. However, we have selected 14 as minimum SDK. Then, click next button. |
| 4 | Then, select Empty Activity => click next => click finish. |
| 5 |
If you've followed above process correctly, you will get a newly created project successfully. However, you can also visit tutorial to Create a New Project to know steps in detail. |
Modify Values folder
Open res/values/strings.xml file. Then, add below code into it.
<resources>
<string name="app_name">HorizontalScrollView</string>
<string name="no_image">No Image</string>
</resources>
Download Drawable Resources
You will need some images, to be used in the application stored in the res/drawable folder . So drawable images are being used by imageViews inside HorizontalScrollView to create view.
HorizontalScrollView in xml file
Open res/layout/activity_main.xml file. Then, add below code into it.
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
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">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:orientation="horizontal">
<ImageView
android:id="@+id/image1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:contentDescription="@string/no_image"
android:src="@drawable/android_ukacademe" />
<ImageView
android:id="@+id/image2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginRight="20dp"
android:contentDescription="@string/no_image"
android:src="@drawable/csharp_ukacademe" />
<ImageView
android:id="@+id/image3"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginRight="20dp"
android:contentDescription="@string/no_image"
android:src="@drawable/aspdotnet" />
<ImageView
android:id="@+id/image4"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginRight="20dp"
android:contentDescription="@string/no_image"
android:src="@drawable/css_ukacademe" />
<ImageView
android:id="@+id/image5"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginRight="20dp"
android:contentDescription="@string/no_image"
android:src="@drawable/html_ukacademe" />
<ImageView
android:id="@+id/image6"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginRight="20dp"
android:contentDescription="@string/no_image"
android:src="@drawable/java_ukacademe" />
</LinearLayout>
</HorizontalScrollView>
</android.support.constraint.ConstraintLayout>
In activity_main.xml file, we have defined HorizontalScrollView. Then, we have defined views inside this HorizontalScrollView. Note that there is only one direct child, i.e. LinearLayout, of HorizontalScrollView. All the imageViews have been defined inside this linearLayout.
HorizontalScrollView in java file
Open src/main/java/com.ukacademe.horizontalscrollview/MainActivity.java file. Then, add below code into it.
package com.ukacademe.horizontalscrollview;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
}
}
We have not modified anything in MainActivity file. So, after creating project, it's like it was. Since the file of AndroidManifest.xml is very important in any android application, we are also going to see the content inside this file.
AndroidManifest.xml
Code inside src/main/AndroidManifest.xml file is as below –
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="com.ukacademe.horizontalscrollview">
<application
android:allowBackup="true"
android:icon="@mipmap/ic_launcher"
android:label="@string/app_name"
android:roundIcon="@mipmap/ic_launcher_round"
android:supportsRtl="true"
android:theme="@style/AppTheme">
<activity android:name=".MainActivity">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
</application>
</manifest>
When we run the application, we will get output as shown below.
Output
