Contenido Reciente


Ejemplo Android de Control Text View y Sus Propiedades



En Esta práctica vamos a crear un proyecto para explorar los tipos de vistas de proyecto y conocer la función de los directorios principales src/manin/java, src/main/res y src/main/res/values. Explicado paso a paso aunque a algunos parezca aburrido. 

Objetivos de la práctica:
  • Desarrollar ejercicio Android Studio con varios controles Text View dentro de un Relative Layout.
  • Conocer el uso de las propiedades de los controles Relative Layout y Text View.
Ejemplo Android de Control Text View
Ejemplo del Control Text View que vamos a crear.


En el proceso vamos a revisar las siguientes propiedades del control RelativeLayout
  • Background
  • LayoutWidth
  • LayoutHeight

También las siguientes propiedades del control TextView.
  •  Background
  • Layout:CenterInParent
  • LayoutWidth
  • LayoutHeight
  • MaxHeight
  • MaxLenght
  • MaxWidth
  • MinHeight
  • Text
  • TextColor
  • TextAlingnment
  • TextSize
 

Creación del Proyecto, Ejemplo Text View

Crear un nuevo proyecto con las siguientes características:
Aplication name: ProyectoSaludo
Company domain: myapp.saludo.com
Package main: com.saludo.myapp.proyectosaludo
Projet location: C:\Users\pavillalta\AndroidStudioProjects\ProyectoSaludo

nuevo-proyecto-android-studio
En la siguiente pantalla Minimun SDK seleccione API 17: Android 4.2 (Jelly Bean).
nuevo-proyecto-android-studio-minimun-sdk-api
En esta ventana explore la compatibilidad que tendrá la App. En este caso al seleccionar la API mínima la App quedaría con compatibilidad para API 17, 18,19 y 21.
nuevo-proyecto-android-studio-versiones-plataformas

En la siguiente pantalla, seleccione Blank Activity. Las activity son el sinónimo de ventana, por el momento vamos a crear una, porque la App de ejemplo solo necesita una activity.
nuevo-proyecto-android-new-activity
Antes de continuar visualice los diferentes tipo de activity que podemos crear en un proyecto. Se cuentan con al menos once disponibles.

En la siguiente ventana en el campo Activity Name escribir SaludoActivity. Los demás elementos de la ventana se complementan automáticamente quedando como la siguiente imagen. Modifique el campo Title a Saludo.
nuevo-proyecto-android-propiedades-de-activity

Damos en Finish, esperar la creación del proyecto. Tarda unos minutos.

nuevo-proyecto-android-gradle-configure-projet


Explorando Tipos de Vistas del Proyecto Android


Cuando el proyecto esté creado seleccione la Vista Projet.
La vista Android reduce la cantidad de archivos en el árbol del proyecto.
Expanda el directorio principal App.
Ubíquese en el directorio src y después en main.
Los dos directorios de interés son Java y res, ambos están dentro de directorio main.
proyecto-android-studio-vistas-de-proyecto

El directorio java contiene los archivos de código fuente extensión .java
El directorio res contiene layout, las activity extensión .xml


Directorio Values y el Archivo String.xml


También otro directorio importante que vamos a trabajar es values, este se encuentra dentro del directorio res. En values se encuentran los archivos string.xml que son donde se guardan las cadenas de texto que utilizamos en los controles.
Por el momento en el archivo string.xml solo tenemos dos cadenas de texto llamadas app_name y hello_word, que corresponden al texto que muestra el Text View y el Titulo de la Activity.

<resources>
    <
string name="app_name">ProyectoSaludo</string>
    <
string name="hello_world">Hello world!</string>
    <
string name="action_settings">Settings</string>
</
resources>

proyecto-android-studio-archivo-string


Editando Cadenas de Proyecto en el Archivo String.xml


En este punto podemos comenzar a modificar código, es posible hacerlo desde el archivo xml ó en la vista de diseño. Por ejemplo modifique los string de título y de Text View para ver el resultado.
<resources>
    <string name="app_name">Proyecto Saludo en Pantalla</string>
    <string name="hello_world">Hola, esto es un string!</string>
    <string name="action_settings">Settings</string>
</resources>

Visualice nuevamente el archivo activity_saludo.xml dando doble clic sobre él. Los cambios implementados en el archivo string.xml se habrán actualizado.
proyecto-android-studio-archivo-string-xml

Los elementos mostrados en verde dentro del archivo string.xml son los nombres de las cadenas de texto, por ejemplo modifique los nombres de ambas cadenas.
<resources>
    <string name="titulo">Proyecto Saludo en Pantalla</string>
    <string name="saludo">Hola, esto es un string!</string>
    <string name="action_settings">Settings</string>
</resources>

Observar nuevamente que en el archivo activity_saludo.xml, se pierden las cadenas de texto del Título y del Text View.
proyecto-android-studio-archivo-string-xml

Para resolver el problema damos doble clic sobre el control y asignamos nuevamente el nombre que le corresponde de la cadena de texto. 
proyecto-android-studio-archivo-recursos-string

También corregir el nombre del proyecto y de la activity en el archivo AndroidManifest.xml porque estaría generando error por el cambio de variable app_name.
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
   
package="com.saludo.myapp.proyectosaludo" >

    <
application
       
android:allowBackup="true"
       
android:icon="@mipmap/ic_launcher"
       
android:label="@string/titulo"
        android:theme="@style/AppTheme" >
        <
activity
           
android:name=".SaludoActivity"
           
android:label="@string/titulo" >
            <intent-filter>
                <
action android:name="android.intent.action.MAIN" />
                <
category android:name="android.intent.category.LAUNCHER" />
            </
intent-filter>
        </
activity>
    </
application>


</
manifest>


Revisando el diseño de la Avtivity en diferentes dispositivos


En la sección de dispositivos, seleccione los dispositivos disponibles para ver la apariencia del diseño en cada uno. Por ejemplo el dispositivo Nexus 9 tendrá el siguiente resultado.

proyecto-android-studio-probando-dispositivos-nexus9

Diseño de la Aplicación de Saludo en Pantalla Control Text View


Modificar el diseño de la Activity agregando los siguientes Text View. Debe crear las variables y asignarle un String a cada una.
Nombre de string
Contenido a mostrar.
nombre
Pedro Antonio Villalta (Escribe un nombre)
codigo
USIS000000 (Escribe un código)
asignatura
Programación III, Ciclo II/2015
entorno
Programando en Android Studio

La primera opción es agregar los controles TextView, pero vemos que las propiedades tendrían que modificarse. Puede seleccionar el primer TextView, copiar y pegarlo tres veces.
proyecto-android-studio-controles-text-view

Modificar el archivo string.xml
proyecto-android-studio-creacion-de-cadenas-string

Asignar a cada uno de los TextView el string que le corresponde. Seleccione los cuatro objetos y busque la propiedad textSize asignando valor de 22dp. Practique la propiedad Layout:CenterInParent  de los TextView.

El diseño completo (en el archivo activity_saludo.xml se han creado los cuatro objetos TextView).

proyecto-android-studio-creacion-de-cadenas-string

Este ejercicio es la primera parte del ejemplo que estoy desarrollando para explicar el funcionamiento de los dos controles básicos de Android, el Text View y Text Field.

Para contribuir con el blog, puedes dejar comentarios acerca de aspectos a mejorar o comparte publicaciones en redes sociales.