Como crear un ScrollView en Android

Android Studio - ScrollView

Hola amigos en este tutorial aprenderemos a utilizar el Container ScrollView de forma sencilla y comprensible. Para entender un poco mas de que trata este control. 

Contenedor de diseño para una jerarquía de vistas que el usuario puede desplazar, permitiendo que sea mayor que la presentación física. Un ScrollView es un FrameLayout, lo que significa que debe colocar un nodo hijo en él que contiene todo el contenido para desplazarse; Este nodo hijo puede ser un gestor de diseño con una jerarquía compleja de objetos. Un nodo hijo que se utiliza a menudo es LinearLayout en una orientación vertical, que presenta una matriz vertical de elementos de nivel superior que el usuario puede desplazarse.

Nunca debe utilizar un ScrollView con un ListView, porque ListView se encarga de su propio desplazamiento vertical. Lo que es más importante, al hacer esto, derrota todas las optimizaciones importantes de ListView para tratar listas grandes, ya que efectivamente obliga a ListView a mostrar toda su lista de elementos para llenar el contenedor infinito proporcionado por ScrollView.

La clase TextView también se encarga de su propio desplazamiento, por lo que no requiere ScrollView, pero utilizar los dos juntos es posible lograr el efecto de una vista de texto dentro de un contenedor más grande.

ScrollView sólo soporta desplazamiento vertical. Para desplazamiento horizontal, use HorizontalScrollView.

Crear Nuevo Proyecto Android Studio (Aquí).

Vamos a crear un nuevo proyecto para desarrollar nuestro ejemplo y una vez teniendo listo nuestro proyecto comenzaremos a desarrollar nuestra aplicación.

Diseñar Layout Interfaz ScrollView

Para crear nuestra aplicación seleccionaremos nuestro control ScrollView.

Ahora crearemos nuestro diseño en el Layout. Podemos utilizar múltiples controles con el fin de crear contenido que no pueda ser visible en la pantalla de nuestro teléfono y requiera mover la pantalla.

Y estos serian los controles que usaremos en conjunto con nuestro ScrollView. El código seria el siguiente.

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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" android:paddingLeft="@dimen/activity_horizontal_margin"
 android:paddingRight="@dimen/activity_horizontal_margin"
 android:paddingTop="@dimen/activity_vertical_margin"
 android:paddingBottom="@dimen/activity_vertical_margin" tools:context=".MainActivity">


 <ScrollView
 android:layout_width="match_parent"
 android:layout_height="wrap_content"
 android:id="@+id/scrollView">
 <LinearLayout
 android:layout_width="fill_parent"
 android:layout_height="fill_parent"
 android:id="@+id/LinearLayoutHorizontal"
 android:orientation="vertical">

 <TextView
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:layout_gravity="center"
 android:layout_margin="20dp"
 android:background="#f00"
 android:padding="20dp"
 android:text="TextView 1"
 android:textColor="#fff"
 android:textSize="20sp" />

 <TextView
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:layout_gravity="center"
 android:layout_margin="20dp"
 android:background="#0f0"
 android:padding="20dp"
 android:text="TextView 2"
 android:textColor="#fff"
 android:textSize="20sp" />

 <TextView
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:layout_gravity="center"
 android:layout_margin="20dp"
 android:background="#00f"
 android:padding="20dp"
 android:text="TextView 3"
 android:textColor="#fff"
 android:textSize="20sp" />

 <TextView
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:layout_gravity="center"
 android:layout_margin="20dp"
 android:background="#ff0"
 android:padding="20dp"
 android:text="Button 4"
 android:textColor="#fff"
 android:textSize="20sp" />

 <TextView
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:layout_gravity="center"
 android:layout_margin="20dp"
 android:background="#f0f"
 android:padding="20dp"
 android:text="TextView 5"
 android:textColor="#fff"
 android:textSize="20sp" />

 <TextView
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:layout_gravity="center"
 android:layout_margin="20dp"
 android:background="#f90"
 android:padding="20dp"
 android:text="TextView 6"
 android:textColor="#fff"
 android:textSize="20sp" />

 <TextView
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:layout_gravity="center"
 android:layout_margin="20dp"
 android:background="#f00"
 android:padding="20dp"
 android:text="TextView 7"
 android:textColor="#ff9"
 android:textSize="20sp" />

 <TextView
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:layout_gravity="center"
 android:layout_margin="20dp"
 android:background="#444"
 android:padding="20dp"
 android:text="TextView 8"
 android:textColor="#fff"
 android:textSize="20sp" />

 <TextView
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:layout_gravity="center"
 android:layout_margin="20dp"
 android:background="#ff002211"
 android:padding="20dp"
 android:text="TextView 9"
 android:textColor="#fff"
 android:textSize="20sp" />

 <TextView
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:layout_gravity="center"
 android:layout_margin="20dp"
 android:background="#0f0"
 android:padding="20dp"
 android:text="TextView 10"
 android:textColor="#fff"
 android:textSize="20sp" />

 </LinearLayout>

 </ScrollView>
</RelativeLayout>

El resultado seria el siguiente.

Crear Emulador AVD (Aquí).

Crearemos el emulador para ejecutar nuestra aplicación y listo nos mostrara el siguiente resultado.

Y este seria el resultado.

Descargar (Aquí).

Gracias por acompañarme en todo el transcurso que llevo y espero el contenido sea de tu agrado comparte este blog con tus amigos y promueve el conocimiento. Gracias!

"Hablar es barato. Enséñame el código"
- Linus Torvalds