Header Ads

  • Breaking News

    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.

    No comments

    Gracias por tu comentario

    Post Top Ad

    Post Bottom Ad