New Tutorial 2022

View All Tutorials

---

Android - Simple Scrollview Example

Added May 2022

For this tutorial, we are going to learn how to add a Simple Layout Scrollview with System Generated Buttons

We are going to create a new app for this tutorial, and name is - Scrollview

---

Creating Our New App

Open AIDE, Select New Project, from the left menu, or center menu hierachy of files; and do the following:

Select


choose NEW ANDROID APP(Gradle/Android SDK/java/xml) if your using the newest version of AIDE.

Choose HELLO WORLD example app template(java/xml);if your using an older version of AIDE,

For app name; type 'Scrollview'

For app package name type: com.aac.example_scrollview

Click Create

Your new app is now created for you - named 'Scrollview'. For this app, you will have the 'little green Android image' as your app icon.
Once you add your apps' icon image and run your app with the updated and new pages you create, and the apps' other images; you'll see the customized 'App Icon' instead of little green Android icon.
Note: Not all tutorials have a customized icon or require new pages to be created.


AIDE automatically opens your new app in the editor for you.

Where Code is Coded

For our Scrollview app, we must edit the main.xml layout page, adding the code for all the buttons. And, we include the element for Scrollview. This allows for scrolling beyond the physical perimeter of the screen.

We use the 'setContentView' method to pass the layout code (main.xml) to the java class, MainActivity.java.

Photo of main.xml

All code for this tutorial is at the Example Code section on this page. Only copy and replace code for the pages mentioned that require updating.

At Example Code section on this page; any page notated as 'no edit required', means you don't have to copy and paste that page - added only for you to view it.

TIPS

Navigating The App Project Hierachy

To view A FILE do either: from right menu choose FILES or GOTO, this will show the apps files along the top of editor, dropdown, and left side menu. After editing a file, SAVE it, right side menu, choose SAVE.

Creating Pages

Check for the filename extensions of page your creating. If for example, your creating a new Java page, (java folder)you want to see pages already created in that folder that have the .java file extension. Click 'create new java class' to create your page.

For xml files, you must create these in the 'res/layout' folder of your app project. Click 'add new xml file', to create your page.

---

Additional Reading on coding, at Android Developer website
Gohere

EXAMPLE CODE - Code For This Tutorial.

JUST copy the code for this tutorial from the Example Code in this section. You only need to copy and paste for the pages that require editing. Those notated with 'No Edit Required' are included only for viewing; they do not have to be edited.

Example Code:
Copy Paste the Code
build.gradle No Edit Required apply plugin: 'com.android.application' android { compileSdkVersion 21 buildToolsVersion "21.1.0" defaultConfig { applicationId "com.aac.example_scrollview" minSdkVersion 16 targetSdkVersion 28 versionCode 1 versionName "1.0" } buildTypes { release { minifyEnabled false proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro' } } } dependencies { compile fileTree(dir: 'libs', include: ['*.jar']) } _____________ //because we didn't add an image for the icon the system by default uses the 'launcher' icon AndroidManifest.xml No Edit Required <?xml version="1.0" encoding="utf-8"?> <manifest xmlns:android="http://schemas.android.com/apk/res/android" package="com.aac.example_scrollview" > <application android:allowBackup="true" android:icon="@drawable/ic_launcher" android:label="@string/app_name" android:theme="@style/AppTheme" android:resizeableActivity = "true"> <activity android:name=".MainActivity" android:label="@string/app_name" > <intent-filter> <action android:name="android.intent.action.MAIN" /> <category android:name="android.intent.category.LAUNCHER" /> </intent-filter> </activity> </application> </manifest> ___________ // this is the layout page coding just copy and paste to replace whats at the page now main.xml <?xml version="1.0" encoding="utf-8"?> <LinearLayout 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" android:orientation="vertical" tools:context=".MainActivity"> <ScrollView android:layout_marginTop="1dp" android:layout_width="match_parent" android:layout_height="wrap_content" android:id="@+id/scrollViewvertical"> <LinearLayout android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" > <Button android:layout_width="match_parent" android:layout_height="wrap_content" android:text="Button 1" /> <Button android:layout_width="match_parent" android:layout_height="wrap_content" android:text="Button 2" /> <Button android:layout_width="match_parent" android:layout_height="wrap_content" android:text="Button 3" /> <Button android:layout_width="match_parent" android:layout_height="wrap_content" android:text="Button 4" /> <Button android:layout_width="match_parent" android:layout_height="wrap_content" android:text="Button 5" /> <Button android:layout_width="match_parent" android:layout_height="wrap_content" android:text="Button 6" /> <Button android:layout_width="match_parent" android:layout_height="wrap_content" android:text="Button 7" /> <Button android:layout_width="match_parent" android:layout_height="wrap_content" android:text="Button 8" /> <Button android:layout_width="match_parent" android:layout_height="wrap_content" android:text="Button 9" /> <Button android:layout_width="match_parent" android:layout_height="wrap_content" android:text="Button 10" /> <Button android:layout_width="match_parent" android:layout_height="wrap_content" android:text="Button 11" /> <Button android:layout_width="match_parent" android:layout_height="wrap_content" android:text="Button 12" /> <Button android:layout_width="match_parent" android:layout_height="wrap_content" android:text="Button 13" /> <Button android:layout_width="match_parent" android:layout_height="wrap_content" android:text="Button 14" /> <Button android:layout_width="match_parent" android:layout_height="wrap_content" android:text="Button 15" /> </LinearLayout> </ScrollView> </LinearLayout> ___________ MainActivity.java No Edit Required package com.aac.example_scrollview; import android.app.*; import android.os.*; public class MainActivity extends Activity { @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main); } } _____________ //you only require the app_name for this page strings.xml <?xml version="1.0" encoding="utf-8"?> <resources> <string name="app_name">ScrollView</string> </resources> __________ End Code Scrollview No images for this app

This free script provided by
JavaScript Kit

AIDE for creating Android Apps on your tablet or cell phone(android).
Free and Paid.
GoTo Aide

ANDROID STUDIO - for creating Android Apps on your desktop computer.
Free to Install and Use
Learn more - Android Studio

The Java XML files we code(example codes) and the Android Apps we create in our Free Tutorials are compatible with Android Studio and AIDE. Just choose Java XML as your Programming Language.


You May Like:
Make Sushi Rolls Taste World Wines Flavours and Aromas

---

Android Tutorial: A Scrollview Example

AndroidAppCoding.com, All Rights Reserved