• No se han encontrado resultados

Manual 2015-I 05 - Desarrollo de Aplicaciones Móviles I (0557) v2.pdf

N/A
N/A
Protected

Academic year: 2021

Share "Manual 2015-I 05 - Desarrollo de Aplicaciones Móviles I (0557) v2.pdf"

Copied!
160
0
0

Texto completo

(1)

DESARROLLO DE

DESARROLLO DE

APLICACIONES

APLICACIONES

MÓVILES I

MÓVILES I

(2)

DESARROLLO

(3)

DESARROLLO

DESARROLLO DE DE APLICACIONES APLICACIONES MÓVILES MÓVILES I I 33

Índice

Índice

Presentación 05

Red de contenidos 07

UNIDAD 1. ANDROID: INTRODUCCIÓN A LA PLATAFORMA

UNIDAD 1. ANDROID: INTRODUCCIÓN A LA PLATAFORMA 09

1.1 Plataforma Android

1.1 Plataforma Android 09

1.1.1 Introducción a Android, versiones 11

1.1.2 Características y Arquitectura Android. 13

1.1.3 Máquina virtual Dalvik Virtual Machine y ART 15

1.1.4 Open Handset Alliance 17

1.1.5 Creación de emuladores 17

1.2

1.2 IDE AIDE Android ndroid StudioStudio 18

1.2.1 Android Studio características y funciones. 19

1.2.2 Creando la primera aplicación Hola Mundo. 23

1.2.3 Controles básicos Button, EditText, TextView 25

1.2.4 Depuración de código en Android. 29

Resumen de la unidad 31

UNIDAD 2. ANDROID: COMPONENTES

UNIDAD 2. ANDROID: COMPONENTES 32

2.1

2.1 FundamentoFundamentos de aplicaciones Andros de aplicaciones Androidid 34

2.1.1 Arquitectura de la plataforma Android. 35

2.1.2 Estructura de un proyecto Android. 35

2.1.3 Que es un Gradle 43

2.2

2.2 ComponenComponente de una pantalla: Views y ViewGroupste de una pantalla: Views y ViewGroups 44

2.2.1 Componente de una pantalla: Views y ViewGroups 44

2.2.2 Distribución de los ViewGroups: LinearLayout, AbsoluteLayout,

TableLayout, Relative Layout, FrameLayout y ScrollView. 45

2.2.3 Widgets 51

2.2.4 Controles básicos Android 51

2.3

2.3 ComponenComponente Activity e Intent: definición y característicaste Activity e Intent: definición y características 56

2.3.1 Activity 56

2.3.2 Ciclo de vida de la clase activity 58

2.3.3 Introducción a los Intent . 60

2.3.4 Funcionalidad y uso de Intents 61

2.3.5 Resolviendo problemas de pantalla. 63

2.4 Orientación del dispositivo

2.4 Orientación del dispositivo 66

2.4.1 Adaptación de la interface de usuario a la orientación del dispositivo 67

2.4.2 Manejar cambios en la orientación del dispositivo. 68

2.5 Diálogos y notificaciones

2.5 Diálogos y notificaciones 69

2.5.1 Notificaciones Toast 70

2.5.2 Notificaciones en la barra de estado. 71

2.5.3 Diálogos personalizados basados en clases. 73

UNIDAD 3. PERSISTENCIA DE DATOS EN ANDROID

UNIDAD 3. PERSISTENCIA DE DATOS EN ANDROID 84

3.1

3.1 Acceso a recursoAcceso a recursos y archivoss y archivos 85

3.1.1 Tipos de recursos en Android 86

3.1.2 Almacenamiento privado y compartido. 88

3.1.3 Grabar y cargar datos de Preferencias de Usuario. 89

3.1.4 File, FileOutputStream, OutputStreamWriter, PrintWriter 91 3.1.5 Environment uso de métodos básicos para acceso a recursos. 94 3.2

(4)

DESARROLLO

DESARROLLO DE DE APLICACIONES APLICACIONES MÓVILES MÓVILES I I 44

3.2.2 Introducción a SQLite 96

3.2.3 Gestión de bases de datos con SQLite. Uso del componente

SQLiteOpenHelper. 98

3.2.4 La clase ContentValues 99

3.2.5 Mantenimiento de datos Insert, Update, Delete rawQuery 100 3.3

3.3 Aplicando el Modelo Aplicando el Modelo Vista controlador con SVista controlador con SQLiteQLite

3.3.1 Clases de acceso a datos basados en el modelo vista controlador. 102

UNIDAD 4. NETWORKING EN ANDROID UNIDAD 4. NETWORKING EN ANDROID

4.1

4.1 ConsumiendConsumiendo servicios webo servicios web

4.1.1 SOAP (Simple Object Access Protocol) Mensajes SOAP, Estructura 104

4.1.2 Uso del protocolo HTTP para consumir web services. 106

4.1.3 Obtención de data de archivos XML. 108

4.1.4 Clases de acceso a web services 115

4.1.5 Thead Manejando hilos 117

UNIDAD 5. Servicios basados en localización UNIDAD 5. Servicios basados en localización

5.1 Manejo de fragments 5.1 Manejo de fragments

5.1.1 ¿Qué es Fragment? 129

5.1.2 Creating a Fragment, administrar Fragments,Flagment class 132 5.1.3 Eventos fragment, Aaplicación fragment

131 5.1

5.1 Servicios basados Servicios basados en localizaciónen localización

5.1.1 Utilizar Google Maps en la aplicación. 137

5.1.2 Obtención de la localización (coordenadas) del dispositivo. 138

5.1.3 Google Maps 139

5.1.4 Activar las API de Google Maps. 140

UNIDAD 6. SERVICIOS UNIDAD 6. SERVICIOS

6.1

6.1 Creando y Creando y administrando Sadministrando Servicioservicios

6.1.1 Qué es un servicio, 145

6.1.2 Intent Service, Bound Service. 147

6.1.3 Configurar el archivo de manifiesto. 148

6.1.4 Iniciar/Configurar servicios 149

UNIDAD 7. MULTIMEDIA Y

UNIDAD 7. MULTIMEDIA Y PUBLICACIÓNPUBLICACIÓN 7.1

7.1 Audio, Video y UAudio, Video y Uso de Dispositivos visualesso de Dispositivos visuales

7.1.1 Componente Media Player. Definición, características y aplicaciones. 151

7.1.2 Visualización de videos usando la vista Video. 152

7.1.3 Gráficos 2D y Aplicaciones Multimedia. 154

7.1.4 Grabación de audio y video: Uso de Intents para grabar video. 155 7.1

7.1 Publicación en Publicación en Google PlayGoogle Play

7.1.1 Google Play 156

7.1.2 Generación de APK firmado con el certificado digital. 157

7.1.3 Publicación de la aplicación. 158

(5)

DESARROLLO

DESARROLLO DE DE APLICACIONES APLICACIONES MÓVILES MÓVILES I I 55

Presentación

Presentación

El Taller de Desarrollo de Aplicaciones Móviles IDesarrollo de Aplicaciones Móviles I es un curso que pertenece a la línea de programación y desarrollo de aplicaciones siendo un curso de especialidad sólo en la carrera de Computación e Informática. Permite al alumno iniciarse en la programación de dispositivos móviles bajo el entorno Android Studio que ha sido optimizado para dispositivos móviles con sistema operativo Android.

El manual para el curso ha sido diseñado bajo la modalidad de unidades de aprendizaje, las que se desarrollan durante semanas determinadas. En cada una de ellas, hallará los logros, que debe alcanzar al final de la unidad; el tema tratado, el cual será ampliamente desarrollado; y los contenidos, que debe desarrollar, y ejercicios necesarios para poner en práctica los conceptos desarrollados en clase. Por último, encontrará las actividades que deberá desarrollar en cada sesión, que le permitirán reforzar lo aprendido en la clase.

El curso es práctico y consiste en un taller de programación. En la primera parte del curso, se revisan las características del sistema operativo Android así como las funcionalidades básicas con el fin de familiarizar al participante con la forma de trabajo y la arquitectura de aplicaciones bajo el sistema operativo Android y la relación que existe con las aplicaciones y/o servicios de google (Google Apps). Luego, se desarrollan aplicaciones que permitan el manejo del dispositivo móvil para ingresar, procesar y presentar información haciendo uso de las clases que proporciona la plataforma de desarrollo Android, luego se desarrollara persistencia de datos locales como almacenamiento en disco, bases de datos sqlite y en la nube vía web services, soap, rest. Se concluye con la publicación de aplicaciones haciendo uso de los servicios de google vía google play.

(6)

DESARROLLO

(7)

DESARROLLO

DESARROLLO DE DE APLICACIONES APLICACIONES MÓVILES MÓVILES I I 77

Red de contenidos

Red de contenidos

DESARROLLO DE APLICACIONES MÓVILES I

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Android: Introducción a la plataforma Android: Componentes Networking en Android

Unidad 5 Unidad 6 Unidad 7

Servicios basados en localización Multimedia y publicación Persistencia de datos en Android Servicios

(8)

DESARROLLO

(9)

DESARROLLO

DESARROLLO DE DE APLICACIONES APLICACIONES MÓVILES MÓVILES I I 99

Introducción a la plataforma

Introducción a la plataforma

L

LOGRO DE LA UNIDAD DE APRENDIZAJEOGRO DE LA UNIDAD DE APRENDIZAJE

Al término de la unidad, el alumno elabora aplicaciones haciendo uso del entorno de desarrollo Android Studio.

T TEMARIOEMARIO

1.3 Plataforma Android 1.3 Plataforma Android

1.3.1 Introducción a Android, versiones 1.3.2 Características y Arquitectura Android. 1.3.3 Máquina virtual Dalvik Virtual Machine y ART 1.3.4 Open Handset Alliance

1.3.5 Creación de emuladores

1.4 IDE Android Studio 1.4 IDE Android Studio

1.4.1 Android Studio características y funciones. 1.4.2 Creando la primera aplicación Hola Mundo. 1.4.3 Controles básicos Button, EditText, TextView 1.4.4 Depuración de código en Android.

A

ACTIVIDADES PROPUESTASCTIVIDADES PROPUESTAS

 Los alumnos identifican la arquitectura del sistema operativo android.  Los alumnos hacen uso del IDE principal de desarrollo Android Studio.

 Los alumnos crean la primera aplicación en Android y reconocen la diferencia

entre un activity, layout y las vistas básicas.

UNIDAD UNIDAD

1

1

(10)

DESARROLLO

(11)

DESARROLLO

DESARROLLO DE DE APLICACIONES APLICACIONES MÓVILES MÓVILES I I 11 11

1.1.

1.1. INTRODUCCIÓN

INTRODUCCIÓN A

A LA

LA PLATAFORMA

PLATAFORMA

1.1.1. Plataforma Android 1.1.1. Plataforma Android

Android es un sistema operativo móvil basado en el kernel 2.6 de Linux Android fue desarrollado para dispositivos móviles, tabletas,

relojes, televisores automóviles, actualmente es uno de los sistemas operativos más utilizados en el planeta. Inicialmente fue desarrollado por Andy Rubin figura 1, quien funda la compañía Android inc en estados unidos en Palo Alto, posterior a ello google adquiere completamente la compañía en el año 2005 posterior a ello se crea en grupo de empresas asociadas que patrocina Android como plataforma libre para dispositivos móviles y otros.

La decisión de estudia el desarrollo de aplicaciones para esta plataforma es que tiene el mayor potencial del mercado ya que no solo está orientado a dispositivos móviles sino a una aplica gama de dispositivos con el soporte de google a continuación se presenta una imagen de los dispositivos

que soportan Android figura 2.

Figura 2: Dispositivos que soportan Android Fuente: http://www.android.com/

Android está basado en capas que permiten administrar las funciones básicas de cualquier equipo móvil, en primer lugar tiene aplicaciones estándares como administrador de contactos, administrador de aplicaciones administrador de drivers, administrador de mensajes, administrador de archivos, álbum de fotos, administrador de llamadas configuración todo controlado desde tu cuenta de Gmail google; para cualquier instalación de aplicación se debe realizar por medio de google play. Debajo de ello se encuentran las librerías nativas para acceso a bases de datos, administración de recursos, drivers de audio, administrador de sistema, webkit navegador web nativo, etc. Por el lado de la máquina virtual se encuentra Virtual Dalvik y Art que es una de las mejoras que fueron creadas en octubre del año 2014, después de ello se tiene el kernel del sistema operativo tal como se puede apreciar en el gráfico que se presenta a continuación.

Figura 1: Andy Rubin

(12)

DESARROLLO

DESARROLLO DE DE APLICACIONES APLICACIONES MÓVILES MÓVILES I I 1212

Figura 3: Dispositivos que soportan Android Fuente.- Tomado de http://source.android.com/source/index.html Qué es una Aplicación Android?

Qué es una Aplicación Android?

Una aplicación desarrollada en Android es un programa que posee una o varias funciones específicas que lo hacen útil para un motivo. Son equivalentes a cualquier programa hecho para PC con la diferencia que tiene funcionalidades desarrolladas para el celular. Uno de los limitantes es el tamaño de pantalla y teclado aunque las últimas versiones de sistemas operativos tienen soporte para conectar teclado USB. Por otro lado cualquier aplicación se debe instalar por medio de Google Play, sin embargo se puede instalar una aplicación configurando instalar aplicaciones de fuentes no seguras. Por otro lado la plataforma Android tiene una gran cantidad de aplicaciones con más de 700 mil aplicaciones que se pueden descargar, muchas de ellas gratuitas.

Figura 4: Programas posibles para instalar en el celular Fuente.- Tomado de http://www.androidexperto.com

(13)

DESARROLLO

DESARROLLO DE DE APLICACIONES APLICACIONES MÓVILES MÓVILES I I 11 33

1.1.2

1.1.2 Características Características y y Arquitectura Arquitectura AndroidAndroid

Una aplicación desarrollada en Android es un programa que posee una o varias funciones específicas que lo hacen útil para un motivo. Son equivalentes a cualquier programa.

El sistema operativo Android, al igual que los propios teléfonos móviles, ha evolucionado rápidamente, acumulando una gran cantidad de versiones, desde la 1.0 para el QWERTY HTC G1, hasta la 4.0 que acaba de salir al mercado.

Entre las principales características tenemos:

 framework de aplicación que habilita la reutilización y reemplazo de componentes

 máquina virtual dalvik optimizada para móviles  navegador integrado basado en webkit

 gráficos optimizados por una librería gráfica 2d propia; gráficos 3d basados en la especificación opengl es 1.0

 sqlite para almacenamiento de datos estructurados

 soporte para gran variedad de archivos multimedia (mpeg4, h.264, mp3, aac, amr, jpg, png, gif)

 Telefonía gsm

 Bluetooth, edge, 3g y wifi (4g, wimax,)  Cámara, gps, compás, acelerómetro

 Entorno de desarrollo completo incluyendo emulador, herramientas de depuración, profiling de memoria y rendimiento y plugin para el ide eclipse

Competidores comunes Competidores comunes  Apple o iPhone OS  RIM o Blackberry  Microsoft o

Windows Mobile 6.5 Phone 7 Series  Symbian Foundation

o Symbian OS  Palm

(14)

DESARROLLO

DESARROLLO DE DE APLICACIONES APLICACIONES MÓVILES MÓVILES I I 1414

Cupcake: Android Versión 1.5 Cupcake: Android Versión 1.5

Características: Widgets, teclado QWERTY virtual, copy & paste, captura de vídeos y poder subirlos a YouTube directamente.

Donut: Android Versión 1.6 Donut: Android Versión 1.6

Características: Añade a la anterior la mejoría de la interfaz de la cámara, búsqueda por voz, y navegación en Google Maps.

Eclair: Android Versión 2.0/2.1 Eclair: Android Versión 2.0/2.1

Características: Mejoras en Google Maps, salvapantallas animado, incluye zoom digital para la cámara, y un nuevo navegador de internet.

Froyo: Android Versión 2.2 Froyo: Android Versión 2.2

Características: Incluye hostpot Wifi, mejora de la memoria, más veloz, Microsoft Exchange y video-llamada.

Ginger Bread: Android Versión 2.3 Ginger Bread: Android Versión 2.3

Características: Mejoras del consumo de batería, el soporte de vídeo online y el teclado virtual, e incluye soporte para pagos mediante NFC2

Honey Comb: Android Versión 3.0/3.4 Honey Comb: Android Versión 3.0/3.4

Características: Mejoras para tablets, soporte Flash y Divx, integra Dolphin, multitarea pudiendo cambiar de aplicación dejando las demás en espera en una columna, widgets y homepage personalizable.

Ice Cream Sandwich: Android Version 4.0 Ice Cream Sandwich: Android Version 4.0

Características: Multiplataforma (tablets, teléfonos móviles y notebooks), barras de estado, pantalla principal con soporte para 3D, widgets redimensionables, soporte USB para teclados, reconocimiento facial y controles para PS3.

Android - 4.4 KitKat Android - 4.4 KitKat

Android - 5.0 Lollipop Android - 5.0 Lollipop

Introduce la nueva plataforma en base de diseño, el nuevo concepto de Diseño Material (Material Design) y es la primera versión que integra Android Runtime (ART) de manera predeterminada.

(15)

DESARROLLO

DESARROLLO DE DE APLICACIONES APLICACIONES MÓVILES MÓVILES I I 11 55

1.1.3

1.1.3 Máquina Máquina virtual virtual Dalvik Dalvik Virtual Virtual Machine Machine y y ARTART

Dalvik Virtual Machine

Dalvik Virtual Machine

Dalvik

Dalvik es la máquina virtual que utiliza la plataforma para dispositivos móviles Android. Dalvik ha sido diseñada por Dan Bornstein con contribuciones de otros ingenieros de Google.

La Máquina Virtual DalvikMáquina Virtual Dalvik (DVMDVM) permite ejecutar aplicaciones programadas en Java. La DVM no afirma ser una máquina virtual de java (JVM) debido a que le ocasionaría problemas de licenciamiento, sin embargo cumple ese propósito. La mayoría de los programas escritos en Java 5 pueden correr sobre la DVM.

DVM sacrifica la portabilidad que caracteriza a Java para poder crear aplicaciones con un mejor rendimiento y menor consumo de energía, estas dos características son extremadamente importantes en dispositivos móviles, debido a que la capacidad de las baterías en estos dispositivos es limitada.

DVM está optimizada para requerir poca memoria y está diseñada para permitir ejecutar varias instancias de la máquina virtual simultáneamente, delegando en el sistema operativo subyacente el soporte de aislamiento de procesos, gestión de memoria e hilos.

Figura 7: Arquitectura de android

Fuente.- Tomado de http://santiagosolisvidal.blogspot.com/2012/08/arquitectura-de-android.html

(16)

DESARROLLO

DESARROLLO DE DE APLICACIONES APLICACIONES MÓVILES MÓVILES I I 1616

embargo, la herramientadx incluida en el SDK de Android permite transformar los archivos Class de Java compilados por un compilador Java al formato de archivos Dex.

El nombre de Dalvik fue elegido por Bornstein en honor a Dalvík, un pueblo de Eyjafjörður, Islandia, donde vivieron antepasados suyos.

Fuente: http://es.wikipedia.org/wiki/Dalvik Android Runtime (ART)

Android Runtime (ART)

Esta máquina virtual permite que las aplicaciones se compilen en código nativo, lo cual ayuda a que las aplicaciones se carguen más rápido y que traiga el soporte de procesadores de 64 bits. Google dice que con ART se estima que el desempeño mejore cuatro veces.

 Android Lollipop te permite configurar rápidamente tu nuevo dispositivo. Usando

NFC, podrás migrar tus cuentas con sólo unir tu nuevo dispositivo con el viejo.

 En el Nexus 6Nexus 6 y Nexus 9, el comando de voz de "OK Google" funciona hasta

cuando la pantalla está apagada.

 Permitirá restablecer la configuración de fábrica y borrar todos los datos de

manera remota, especialmente diseñado para esas ocasiones en las que perdemos los teléfonos o nos lo roban.

 Los nuevos dispositivos vienen con la encriptación automática activa para

proteger tu información en el caso de que te roben o pierdas el dispositivo.

 Menor latencia en la entrada de sonido permite que la música y los apps de

comunicaciones ofrezcan una mejor experiencia con mayor fluidez.

 Soporte de accesorios de sonido a través de USB.

 Funciones de fotografía profesional, incluyendo la captura completa de cuadros a

cerca de 30 cuadros por segundo, soporte de formatos Bayer RAW y YUV, control del sensor, lente y flash individualmente por cada cuadro, y la captura de metadata como modelos de ruido e información óptica.

Protocolo más eficiente en el consumo de energía para buscar dispositivos de

Bluetooth LE y los contadores(beacons).

 Soporte para 15 nuevos idiomas para incrementar el soporte a más de 68

idiomas.

(17)

DESARROLLO

DESARROLLO DE DE APLICACIONES APLICACIONES MÓVILES MÓVILES I I 11 77

1.1.4

1.1.4 Open Open Handset Handset AllianceAlliance

Es una alianza de empresas de manera comercial para patrocinar el desarrollo de Android hay 84 compañías que patrocinan el producto en beneficio de continuar

mejorando la plataforma Android. Algunos de sus miembros son Google, HTC, Dell, Intel, Motorola, Qualcomm, Texas Instruments, Samsung, LG, T-Mobile, Nvidia y Wind River Systems.

Figura 4: Lista de empresas open HandSet Alliance Fuente.- Tomado de http://2.bp.blogspot.com/

1.1.5

1.1.5 Creación Creación de de emuladoresemuladores

Para iniciar en el desarrollo de aplicaciones móviles con Android es necesario tener un emulador. Un emulador es una aplicación que simula ser un equipo físico para ello debemos hacer uso del administrador de máquinas virtuales. Para ello se debe hacer clic en el administrador de máquinas virtuales

En la pantalla se debe elegir una de los dispositivos y posterior a ello se debe descargar los drivers y/o librerías que sean necesarios.

(18)

DESARROLLO

DESARROLLO DE DE APLICACIONES APLICACIONES MÓVILES MÓVILES I I 1818

Para más detalles debes continuar con el material de la practica dirigida N° 1

Tema 2: IDE

Tema 2: IDE Android StudioAndroid Studio

Android Studio, es el IDE (Entorno de desarrollo integrado) que utilizaremos para crear nuestras aplicaciones es un ide mejorado al que se tenia de eclipse, esta basado en IntelliJ IDEA de JetBrains para facilitar la generación de código para los desarrolladores de android esta disponible para plataforma windows, MAC O/S y linux. Para descargar el ide android studio puedes ingresar al siguiente link:

http://developer.android.com/sdk/index.html

Lo más resaltante de androidstudio es la ayuda integrada

(19)

DESARROLLO

DESARROLLO DE DE APLICACIONES APLICACIONES MÓVILES MÓVILES I I 11 99

Fuente.- Tomado de http://developer.android.com/sdk/index.html

1.2.1 Android Studio características y funciones. 1.2.1 Android Studio características y funciones.

 Sistema de construcción de código basado en JetBrains flexible.  Construir variantes y generación de archivos apk múltiple.

 Plantillas de código para ayudarle a construir características de la aplicación comunes.

 editor de diseño Rich con soporte para arrastrar y soltar de edición tema.  Herramientas de pelusa para atrapar el rendimiento, facilidad de uso,

compatibilidad de versiones, y otros problemas.  Capacidades ProGuard y aplicación de firma.

 El soporte integrado para la plataforma de nube Google, por lo que es fácil de integrar Google Cloud Mensajería y App Engine.

 Soporte para construcción basada en Gradle.

 Consola de desarrollador: consejos de optimización, ayuda para la traducción, estadísticas de uso.

 Renderización en tiempo real.

 Soporte para programar aplicaciones para Android Wear. 

Herramientas Lint para detectar problemas de rendimiento, usabilidad, compatibilidad de versiones, y otros problemas.

 Refactorización especifica de Android y arreglos rápidos.

 Plantillas para crear diseños comunes de Android y otros componentes.

El entorno de desarrollo está preparado para crear cualquier tipo de aplicación en Android, entre ellos podemos tener para televisor, teléfonos, reloj, google glass y/o

(20)

DESARROLLO

DESARROLLO DE DE APLICACIONES APLICACIONES MÓVILES MÓVILES I I 2020

Figura 5: Soporte a aplicaciones por android studio

1.2.2 Creando la primera aplicación Hola Mundo. 1.2.2 Creando la primera aplicación Hola Mundo.

Ingresar a Android Studio y luego dar clic en el menú File/New Proyect

Application Name:

Application Name: Semana 01 Controles Company Domain:

Company Domain: SolucionesMoviles Proyect Location:

Proyect Location: C:\AppsMoviles_5toCiclo

Dar click en Next

Seleccionar el API y el dispositivo donde se ejecutará de la aplicación:

(21)

DESARROLLO

DESARROLLO DE DE APLICACIONES APLICACIONES MÓVILES MÓVILES I I 22 11

Dar click en next

En la siguiente pantalla se debe considerar la siguiente información: Activity Name: Nombre de clase que se relaciona a la pantalla (layout)

Layout Name: Nombre de diseño de pantalla

Title: título de la pantalla el que aparece cuando se ejecuta la aplicación Menú Resource Name: el nombre de archivo xml de menú asociado al layout.

Dar click en finalizar para completar el asistente. El proyecto que se crea

(22)

DESARROLLO

DESARROLLO DE DE APLICACIONES APLICACIONES MÓVILES MÓVILES I I 2222

Donde

A: Archivos del proyecto B: Diseño de pantalla en XML

C: Vistas de Text (XML) y Design (Diseño). Visa de diseño de pantalla

En esta vista se puede apreciar el desarrollo de la aplicación en Android donde cada rectángulo es una sección de apoyo de diseño de la aplicación.

Dónde: Dónde:

A: Cuadro de controlesB: Diseño de pantalla (Layout) C: Vista esquema de controles D: Vista propiedades de controles.

Hasta aquí nos quedamos con el ejercicio de crear la primera aplicación en Android Studio (Semana 01 Controles), a continuación vamos a revisar los principales

(23)

DESARROLLO

DESARROLLO DE DE APLICACIONES APLICACIONES MÓVILES MÓVILES I I 22 33

controles y sus propiedades para completar el desarrollo de nuestra primera aplicación.

1.2.3 Controles básicos Burton, Edites, TextView 1.2.3 Controles básicos Burton, Edites, TextView

Los controles más básicos que tenemos en Android son sin duda Burton, Edites y textview los cuales nos permitirán crear una aplicación básica como por ejemplo un login o un mantenimiento de datos. En esta primera parte vamos a revisar en forma preliminar los controles básicos que muestran lo siguiente:

 TextViewTextView.- es un control etiqueta que permite mostrar textos de solo lectura en la pantalla.

Para más detalles de los atributos y/o métodos puedes visitar la página oficial de Android ingresando a:

http://developer.android.com/reference/android/widget/TextView.html

Definir el control por código XML Definir el control por código XML

 EditesEdites.- es un control que permite ingresar datos está sujeto a aplicarle estilos (Patrones) para mejorar el uso del mismo.

Para más detalles de los atributos y/o métodos puedes visitar la página oficial de Android ingresando a:

http://developer.android.com/reference/android/widget/EditText.html

Figura 6: Controles Android

(24)

DESARROLLO

DESARROLLO DE DE APLICACIONES APLICACIONES MÓVILES MÓVILES I I 2424

Definir el control por código XML Definir el control por código XML

 BurtonBurton.- Botones de acción permite involucrar eventos comunes como click con el fin de que el usuario pueda realizar una tarea.

Definir el control por código XML Definir el control por código XML

Para más detalles de los atributos y/o métodos puedes visitar la página oficial de Android ingresando a:

http://developer.android.com/reference/android/widget/Button.html

Diseño de pantalla login Diseño de pantalla login

(25)

DESARROLLO

DESARROLLO DE DE APLICACIONES APLICACIONES MÓVILES MÓVILES I I 22 55

Finalmente el diseño de los controles quedará como se muestra:

Agregar los siguientes controles 1

1 2 2 2

Se debe agregar en el siguiente orden 1. Primero borrar todos los controles

existentes

2. Agregar el layout LinnerLayout (Vertical)

3. Agregar 1 large text

4. Agregar un Plain TextView (Plain TextView)

5. Agregar el control EditText (Plain Text)

6. Hacer el mismo procedimiento para los dos controles

7. Posterior a ellos agregar los controles Botones de comando.

Para cambiar las propiedades dar doble click en el control.

Donde Text es el texto a mostrarse e id es el nombre del control que se utilizara en el código.

(26)

DESARROLLO

DESARROLLO DE DE APLICACIONES APLICACIONES MÓVILES MÓVILES I I 2626

En la vista texto (código XML) quedará como se muestra:

<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"> <LinearLayout

(27)

DESARROLLO

DESARROLLO DE DE APLICACIONES APLICACIONES MÓVILES MÓVILES I I 22 77

Android:orientation="vertical" Android:layout_width="fill_parent" Android:layout_height="fill_parent" Android:layout_alignParentTop="true" Android:layout_alignParentStart="true"> <TextView Android:layout_width="wrap_content" Android:layout_height="wrap_content" Android:textAppearance="?android:attr/textAppearanceLarge" Android:text="Control de acceso" android:id="@+id/textView" /> <TextView Android:layout_width="wrap_content" Android:layout_height="wrap_content" Android:text="Usuario" android:id="@+id/textView2" /> <EditText Android:layout_width="match_parent" Android:layout_height="wrap_content" Android:ems="10" android:id="@+id/edtusuario" /> <TextView Android:layout_width="wrap_content" Android:layout_height="wrap_content" Android:text="Contraseña" android:id="@+id/textView3" /> <EditText android:layout_width="match_parent" android:layout_height="wrap_content" android:inputType="textPassword"

(28)

DESARROLLO

DESARROLLO DE DE APLICACIONES APLICACIONES MÓVILES MÓVILES I I 2828

android:id="@+id/edtcontrasenia" /> <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Aceptar" android:id="@+id/BtnAceptar" /> <Button style="?android:attr/buttonStyleSmall" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Cancelar" android:id="@+id/btnCancelar" /> </LinearLayout> </RelativeLayout>

(29)

DESARROLLO

DESARROLLO DE DE APLICACIONES APLICACIONES MÓVILES MÓVILES I I 22 99

1.4.5

1.4.5 Depuración Depuración de de código código en en Android.Android.

La depuración es una facilidad del IDE de Android Studio con el objetivo de hacer seguimiento al código fuente y verificar algún error no esperado, limpiar el programa, etc. Según Wikipedia la definición de depuración de programas es el proceso de identificar y corregir errores de programación. En inglés se le conoce comodebugging , es que se asemeja a la eliminación debichos (bugs), manera en que se conoce informalmente a los errores de programación. Se dice que el términobugproviene de

la época de los ordenadores de válvula termoiónica, en los cuales los problemas se generaban por los insectos que eran atraídos por las luces y estropeaban el equipo.

Ejecutar en modo depuración:

(30)

DESARROLLO

DESARROLLO DE DE APLICACIONES APLICACIONES MÓVILES MÓVILES I I 3030

(31)

DESARROLLO

DESARROLLO DE DE APLICACIONES APLICACIONES MÓVILES MÓVILES I I 33 11

Resumen

Resumen

1. El sistema operativo Android está basado en el núcleo del sistema operativo Android 2.6 y su creador es Andy Ruby.

2. Android es uno de los mejores sistemas operativos para dispositivos móviles por excelencia.

3. Las características del dispositivo móvil son basados en estándares abiertos. 4. La Open Handset Alliance es una estrategia comercial de apoyo mutuo para

mejorar la plataforma de estándares abiertos del sistema operativo móvil Android. 5. Android Studio es la herramienta más sofisticada para crear aplicaciones basadas

en Android.

6. La depuración busca ubicar errores en el código de nuestra aplicación y es una facilidad del IDE con el fin de corregir errores de código o limpiar el programa.

Puede revisar los siguientes enlaces para ampliar los conceptos vistos en esta unidad: o Recursos y documentación de la librería Android:

https://developer.android.com/index.html

o Introducción a la plataforma Android:

http://www.ibm.com/developerworks/ssa/library/os-android-devel/#resources

(32)

DESARROLLO

DESARROLLO DE DE APLICACIONES APLICACIONES MÓVILES MÓVILES I I 3232

ANDROID: COMPONENTES

ANDROID: COMPONENTES

L

LOGRO DE LA UNIDAD DE APRENDIZAJEOGRO DE LA UNIDAD DE APRENDIZAJE

Al término de la unidad, el alumno elabora aplicaciones que integran Activities, componentes visuales, Intents y recursos externos pertenecientes a la plataforma Android.

T TEMARIOEMARIO

2.1

2.1 FundamentoFundamentos de aplicaciones Andros de aplicaciones Androidid

2.1.1 Arquitectura de la plataforma Android.

2.1.2 Estructura de un proyecto Android. Archivos básicos, recursos, iconos. 2.1.3 Ciclo de vida de un Activity.

2.1.4 Componente Activity: definición y características. 2.1.5 Uso de recursos, acceso a String.XML.

2.1.6 Configuración del archivo de manifiesto.

2.2

2.2 ComponenComponente de una pantalla: Views y ViewGroupste de una pantalla: Views y ViewGroups

2.2.1 Componente de una pantalla: Views y ViewGroups.

2.2.2 Distribución de los ViewGroups: LinearLayout, AbsoluteLayout, TableLayout, Relative Layout, FrameLayout y ScrollView.

2.2.3 Controles ImageView, ImageButton, Spinner, Checkbox, ProgressBar.

2.3

2.3 ComponenComponente Intent: definición y te Intent: definición y característicascaracterísticas

2.3.1 Uso de Intents para gestionar Actividades. 2.3.2 Resolviendo colisión de Intent Filter.

2.3.3 Invocación a otras aplicaciones usando Intents. 2.3.4 Uso del PendingIntent y notificaciones.

2.4 Orientación del dispositivo 2.4 Orientación del dispositivo

2.4.1 Adaptación de la interface de usuario a la orientación del dispositivo. 2.4.2 Manejar cambios en la orientación del dispositivo.

2.4.3 Diseño de interface de usuario con Views avanzados: ListView.

2.5 Diálogos y notificaciones 2.5 Diálogos y notificaciones

2.5.1 Dialog Window y Progress Dialog.

2.5.2 Diálogos personalizados basados en clases. 2.5.3 Toast, formatos, uso de estilos.

2.5.4 Menús, fuentes.

UNIDAD UNIDAD

2

2

(33)

DESARROLLO

DESARROLLO DE DE APLICACIONES APLICACIONES MÓVILES MÓVILES I I 33 33

A

ACTIVIDADES PROPUESTASCTIVIDADES PROPUESTAS

 Los alumnos identifican la arquitectura de las aplicaciones en Android.  Los alumnos identifican y usan los distintos diseños de pantalla.

 Los alumnos identifican los principales controles a utilizar para desarrollar una

aplicación básica.

 Los alumnos identifica y manejan el ciclo de vida de las activitys.  Los alumnos identifican y hacen uso de los controles básicos.

 Los alumnos programan los eventos de botones de comando en una aplicación

(34)

DESARROLLO

DESARROLLO DE DE APLICACIONES APLICACIONES MÓVILES MÓVILES I I 3434

2.1.

2.1. FUNDAMENTOS

FUNDAMENTOS DE

DE APLICACI

APLICACIONES

ONES ANDROID

ANDROID

Cuando creamos una aplicación para Android la estructura del proyecto es muy similar a cualquier proyecto creado en la plataforma java, ya que el lenguaje es Java, para los que conocen C#.Net, java, VB.net será muy sencillo familiarizarse con la plataforma para ello primero vamos analizar la estructura de un proyecto en Android Studio.

2.1.1. Plataforma Android 2.1.1. Plataforma Android

La plataforma Android es la más utilizada en la actualidad, por ello es muy importante estar de acorde con los avances de la tecnología, el año que paso se consideró uno de los años en el que la plataforma Android se consagro en el mercado como uno de los sistemas operativos más revolucionarios del mercado por ello en esta sección vamos a hacer un comparativo con los competidores más cercanos como son iPhone de Apple y Windows pone de Microsoft. El siguiente grafico presenta

Figura 9: Lista de plataformas moviles en competencia según Garnert Fuente.- Tomado de http://www.androidcurso.com/index.php/

(35)

DESARROLLO

DESARROLLO DE DE APLICACIONES APLICACIONES MÓVILES MÓVILES I I 33 55

Por otro lado es importante dentro de la comparación revisar la cuota de mercado de cada una de las plataformas en el año 2014. Podemos destacar la desaparición de la plataforma Symbian de Nokia, el declive continuo de BlackBerry, el estancamiento de la plataforma de Windows, que parece que no despega, y el afianzamiento de la cuota de mercado de Apple en torno al 20%. Finalmente, cabe señalar el espectacular ascenso de la plataforma Android, que en cinco años ha alcanzado una cuota de mercado en torno al 85%

Figura 10: cuota de mercado de las plataformas movile según Garnert Fuente.- Tomado de http://www.androidcurso.com/index.php/

2.1.2.

2.1.2. Estructura Estructura de un de un proyecto proyecto en Aen Androidndroid

Cuando creamos un proyecto en Android Studio se presenta tal como se muestra en la figura 11, en la parte izquierda, podemos observar todos los elementos creados inicialmente para el nuevo proyecto Android,

sin embargo por defecto lo vemos agrupados en idea, app, gradle. Para entender mejor la estructura del proyecto vamos a cambiar momentáneamente la forma en la que Android Studio nos la muestra. Para ello, pulsaremos sobre la lista desplegable situada en la parte superior izquierda, y cambiaremos la vista de

(36)

DESARROLLO

DESARROLLO DE DE APLICACIONES APLICACIONES MÓVILES MÓVILES I I 3636

proyecto a “Project”.

Al cambiar la vista, los mismos archivos se presentan de otra manera como se observa en la siguiente figura:

En los siguientes contenidos se describirá los elementos principales de esta estructura.

Lo primero que debemos distinguir son los conceptos de proyecto ymódulo. La entidad

proyecto es única, y engloba a todos los demás elementos. Dentro de un proyecto podemos incluir variosmódulos, que pueden representar aplicaciones distintas, versiones diferentes de una misma aplicación, o distintos componentes de un sistema (aplicación móvil, aplicación servidor, librerías). En la mayoría de los casos, trabajaremos con un proyecto que contendrá un sólo módulo correspondiente a nuestra aplicación principal. Por ejemplo en este caso que estamos creando tenemos

el proyecto “ AppsMoviles_5toCiclo” que contiene al módulo “app” que contendrá todo

el software de la aplicación de ejemplo.

(37)

DESARROLLO

DESARROLLO DE DE APLICACIONES APLICACIONES MÓVILES MÓVILES I I 33 77

A continuación describiremos los contenidos principales de nuestro módulo principal.

Carpeta

Carpeta /app/src/main/ja/app/src/main/javava

Esta carpeta contendrá todo el código fuente de la aplicación, clases auxiliares, etc. Inicialmente, Android Studio creará por nosotros el código básico de la pantalla (actividad oactivity ) principal de la aplicación, que recordemos que en nuestro caso era MainActivity, y siempre bajo la estructura del paquete java definido durante la creación del proyecto.

Carpeta

Carpeta /app/src/main/res/app/src/main/res//

Contiene todos los ficheros de recursos necesarios para el proyecto: imágenes, layouts, cadenas de texto, etc. Los diferentes tipos de recursos se pueden distribuir entre las siguientes subcarpetas:

No todas estas carpetas tienen por qué aparecer en cada proyecto Android, tan sólo las que se necesiten. Iremos viendo durante el curso qué tipo de elementos se pueden incluir en cada una de ellas y cómo se utilizan.

Como ejemplo, para un proyecto nuevo Android como el que hemos creado, tendremos por defecto los siguientes recursos para la aplicación:

Figura 14: Vista proyecto/Modulo

(38)

DESARROLLO

DESARROLLO DE DE APLICACIONES APLICACIONES MÓVILES MÓVILES I I 3838

Carpeta Descripción

Carpeta Descripción

/res/drawable/

Contiene las imágenes [y otros elementos gráficos] usados en por la aplicación. Para poder definir diferentes recursos dependiendo de la resolución y densidad de la pantalla del dispositivo se suele dividir en varias subcarpetas:

 /drawable (recursos independientes de la densidad)  /drawable-ldpi (densidad baja)

 /drawable-mdpi (densidad media)  /drawable-hdpi (densidad alta)  /drawable-xhdpi (densidad muy alta)  /drawable-xxhdpi (densidad muy muy alta :)

/res/layout/

Contiene los ficheros de definición XML de las diferentes pantallas de la interfaz gráfica. Para definir distintoslayouts dependiendo de la orientación del dispositivo se puede dividir también en subcarpetas:

 /layout (vertical)  /layout-land (horizontal) /res/anim/

Contienen la definición de las animaciones utilizadas por la aplicación. /res/animator/

/res/color/ Contiene ficheros XML de definición de colores según estado. /res/menu/ Contiene la definición XML de los menús de la aplicación. /res/xml/ Contiene otros ficheros XML de datos utilizados por la aplicación. /res/raw/ que no se incluyan en el resto de carpetas de recursos.Contiene recursos adicionales, normalmente en formato distinto a XML, /res/values/ ejemplo cadenas de texto (Contiene otros ficheros XML de recursos de la aplicación, como porstrings.xml ), estilos (styles.xml ), colores

(colors.xml ), arrays de valores (arrays.xml ), tamaños (dimens.xml ), etc.

Como se puede observar, existen algunas carpetas en cuyo nombre se incluye un

sufijo adicional, como por ejemplo “values-w820dp”. Estos, y otros sufijos, se emplean

para definir recursos independientes para determinados dispositivos según sus características. De esta forma, por ejemplo, los recursos incluidos en la carpeta

(39)

DESARROLLO

DESARROLLO DE DE APLICACIONES APLICACIONES MÓVILES MÓVILES I I 33 99

“values-w820dpw820dp” se aplicarían sólo a pantallas con más de 820dp de ancho, o los

incluidos en una carpeta llamada“values-v11v11” se aplicarían tan sólo a dispositivos

cuya versión de Android sea la 3.0 (API 11) o superior. Al igual que los sufijos “-w” y “– v” existen otros muchos. Para referirse a otras características del terminal, puede consultarse la lista completa en la siguiente url:

http://developer.android.com/guide/topics/resources/providing-resources.html

Otro de los recursos creados por defecto cabe destacar los layouts, en nuestro caso

sólo tendremos por ahora el llamado “activity_main.xml ”, que contiene la definición de la interfaz gráfica de la pantalla principal de la aplicación. Si hacemos doble clic sobre este fichero Android Studio nos mostrará esta interfaz en su editor gráfico, y como podremos comprobar, en principio contiene los controles que agregamos en el primer ejercicio:

Pulsando sobre las pestañas inferiores “Design” y “Text” podremos alternar entre el

editor gráfico (tipo arrastrar-y-soltar), mostrado en la imagen anterior, y el editor XML que se muestra en la imagen siguiente:

(40)

DESARROLLO

DESARROLLO DE DE APLICACIONES APLICACIONES MÓVILES MÓVILES I I 4040

Durante el curso utilizaremos ambos casos, el más efectivo es vía código XML, ya que a veces el diseñador puede tener complicaciones o demorar dependiendo de la complejidad del diseño de pantalla.

Fichero

Fichero /app/src/main/A/app/src/main/AndroidManifest.xmlndroidManifest.xml

Contiene la definición en XML de muchos de los aspectos principales de la aplicación, como por ejemplo su identificación (nombre, ícono, etc.), sus componentes (pantallas, servicios, etc.), o los permisos necesarios para su ejecución. Veremos más adelante más detalles de este fichero. En el caso de nuestra aplicación creada se tiene el

siguiente código en el archivo manifiesto.

Figura 18: Vista código fuente

(41)

DESARROLLO

DESARROLLO DE DE APLICACIONES APLICACIONES MÓVILES MÓVILES I I 44 11

Fichero /app/build.gradle Fichero /app/build.gradle

Contiene información necesaria para la compilación del proyecto, por ejemplo la versión del SDK de Android utilizada para compilar, la mínima versión de Android que soportará la aplicación, referencias a las librerías externas utilizadas, etc. Más adelante veremos también más detalles de este fichero.

En un proyecto pueden existir varios ficherosbuild.gradle, para definir determinados parámetros a distintos niveles. Por ejemplo, en nuestro proyecto podemos ver que existe un ficherobuild.gradle a nivel de proyecto, y otro a nivel de módulo dentro de la carpeta /app. El primero de ellos definirá parámetros globales a todos los módulos del proyecto, y el segundo sólo tendrá efecto para el módulo correspondiente.

Carpeta /app/libs Carpeta /app/libs

Puede contener las librerías Java externas (ficheros.jar ) que utilice nuestra aplicación. Normalmente haremos referencia a dichas librerías en el ficherobuild.gradle descrito en el punto anterior, de forma que entren en el proceso de compilación de nuestra aplicación. Veremos algún ejemplo más adelante.

Carpeta /app/build/ Carpeta /app/build/

Contiene una serie de elementos de código generados automáticamente al compilar el proyecto. Cada vez que compilamos nuestro proyecto, la maquinaria de compilación de Android genera por nosotros una serie de ficheros fuente Java dirigidos, entre otras muchas cosas, al control de los recursos de la aplicación.Importante: dado que estos ficheros se generan automáticamente tras cada compilación del proyecto es importante que no se modifiquen manualmente bajo ninguna circunstancia.

A destacar sobre todo el fichero que aparece desplegado en la imagen anterior,

llamado “R.java”, donde se define la clase R. Esta clase R contendrá en todo momento una serie de constantes con los identificadores (ID) de todos los recursos de la aplicación incluidos en la carpeta /app/src/main/res/, de forma que podamos acceder fácilmente a estos recursos desde nuestro código a través de dicho dato. Así, por

(42)

DESARROLLO

DESARROLLO DE DE APLICACIONES APLICACIONES MÓVILES MÓVILES I I 4242

ejemplo, la constante R.layout.activity_main contendrá el ID del layout

“activity_main.xml ” contenido en la carpeta /app/src/main/res/layout/.

Vista Android Vista Android

El siguiente gráfico presenta un proyecto creado en Android Studio en la vista Android

Donde Donde A:

A: Archivo de manifiesto archivo xml de configuración de aplicaciones. B:

B: Activity, Clase que se asocia con el diseño de pantalla (layout)

C:

C: Clase de prueba que permite hacer pruebas unitarias.

D:

D: Imágenes (iconos) de diferentes tamaños que se utilizará para cuando la aplicación se ejecute en un celular, Tablet, televisor etc. se cambia de imagen según el tamaño de la pantalla.

E:

E: layout, Pantalla (s) que se tiene en el proyecto, todos los diseños de pantalla están basado en XML.

F:

F: Archivo xml con el cual se configura el menú para el diseño de pantalla principal. G:

G: Archivo de recursos que almacena cadenas de arreglo, como puede ser el caso de países, estado civil, sexo, etc.

String.XMl almacena las variables o valores de las propiedades de los controles que se utilizan para diseñar la aplicación.

H:

H: Archivos de estilos, permite diseñar estilos que pueden ser utilizados de manera muy

similar a una hoja de estilos en una página web. Figura 22: Vista Archivos de proyecto Figura 21: Vista Android

(43)

DESARROLLO

DESARROLLO DE DE APLICACIONES APLICACIONES MÓVILES MÓVILES I I 44 33

¿Qué es un Gradle? ¿Qué es un Gradle?

Con el lanzamiento de Android Studio, también apareció un nuevo concepto llamado Gradle que da Excelentes mejoras para hacer que el desarrollo de una aplicación en Android sea más rápido. Gradle es un sistema de construcción avanzado, así como un set de herramientas de construcción avanzada que permite la creación de una lógica de construcción personalizada a través de plugins.

Estas son algunas de sus características que hicieron elegir Gradle al equipo de Android:

 Buena estampación de la API permitiendo integración con el IDE.

 Lenguaje específico del Dominio (DSL) para describir y manipular la lógica de construcción.

 Muy flexible. Permite utilizar mejores prácticas pero no fuerza su propia manera de hacer las cosas.

 Incorpora gestor de dependencias a través de Maven y/o Ivy.

 Los Plugins pueden exponer su propio DSL y su propia API para crear archivos para su uso.

 Construye archivos basados en Groovy y permite la mezcla de elementos declarativos a través de la DSL y la utilización de código para manipular los elementos de la DSL para proporcionar lógica personalizada.

(44)

DESARROLLO

DESARROLLO DE DE APLICACIONES APLICACIONES MÓVILES MÓVILES I I 4444

2.6 Componente de una pantalla: Views

2.6 Componente de una pantalla: Views y ViewGroupsy ViewGroups

Componente de una pantalla:

Componente de una pantalla: Views y ViewGroupsViews y ViewGroups

La interfaz de usuario se define en un archivo XML que se almacena en la carpeta res/layout, cada una de las pantallas, se crea por código XML y estándares XML. También es posible diseñar una pantalla usando código Java, sin embargo puede resultar complejo y poco eficiente, por ello el IDE Android Studio facilita el diseño de pantallas, cada uno representando a un "subclase" específica de view. Se pueden crear pantallas de la misma manera que se diseñan páginas HTML.

Cada archivo describe un layout (una pantalla) y cada layout a su vez puede contener otros elementos (vistas o controles). Para gestionar la interfaz de usuario, Android introduce los siguientes términos:

View View

Una view es un objeto cuya clase es android.view.View. Es una estructura de datos cuyas propiedades contienen los datos de la capa, la información específica del área rectangular de la pantalla y permite establecer el layout. Una view tiene: layout, drawing, focus change, scrolling, etc.

La clase view es útil como clase base para los widgets, que son unas subclases ya implementadas que dibujan los elementos en la pantalla. Los widgets contienen sus propias medidas, pero puedes usarlas para construir tu interfaz más rápidamente. La lista de widgets que puedes utilizar incluye Text, EditText, InputMethod, MovementMethod, Button, RadioButton, CheckBox, y ScrollView.

Viewgroups Viewgroups

Un viewgroup es un objeto de la clase android.view.Viewgroup, como su propio nombre indica, un viewgroup es un objeto especial de view cuya función es contener y controlar la lista de views y de otros viewgroups. Los viewgroups te permiten añadir estructuras a la interfaz y acumular complejos elementos en la pantalla que son diseccionados por una sola entidad.

La clase viewgroup es útil como base de la clase layouts, que son subclases implementadas que proveen los tipos más comunes de los layouts de pantalla. Los layouts proporcionan una manera de construir una estructura para una lista de views.

(45)

DESARROLLO

DESARROLLO DE DE APLICACIONES APLICACIONES MÓVILES MÓVILES I I 44 55

Árbol estructurado de la interfaz UI Árbol estructurado de la interfaz UI

En la plataforma Android tú defines una Activity del UI usando un árbol de nodos view y viewgroups, como vemos en la imagen de abajo. El árbol puede ser tan simple o complejo como necesites hacerlo, y se puede desarrollar usando los widgets y layouts que Android proporciona o creando tus propios views.

Figura 23: Jerarquía visual de Android Fuente: http://www.gitsinformatica.com/android.html

Los views y viewgroups deben estar contenidos en los layouts, los cuales contienen otros elementos presentes en una vista. Dentro de cada layout podemos poner todos los elementos necesarios, incluidos otros layouts. Así conseguiremos estructurar la pantalla de la manera deseada. Existen una gran variedad de layouts, en función de su posicionamiento en la pantalla y se describen a continuación algunos de ellos:

Distribución de los

Distribución de los ViewGroupsViewGroups

Los layouts son elementos no visuales destinados a controlar la distribución, posición y dimensiones de los controles que se insertan en su interior. Estos componentes extienden a la clase base ViewGroup, como muchos otros componentes contenedores, es decir, capaces de contener a otros controles. En el post anterior conocimos la existencia de un tipo concreto de layout, LinearLayout, aunque Android nos proporciona algunos otros.

(46)

DESARROLLO

DESARROLLO DE DE APLICACIONES APLICACIONES MÓVILES MÓVILES I I 4646

FrameLayout FrameLayout

Éste es el más simple de todos los layouts de Android. Un FrameLayout coloca todos sus controles hijos alineados con su esquina superior izquierda, de forma que cada control quedará oculto por el control siguiente (a menos que éste último tenga transparencia). Por ello, suele utilizarse para mostrar un único control en su interior, a modo de contenedor (placeholder) sencillo para un sólo elemento sustituible, por ejemplo una imagen.

Los componentes incluidos en un FrameLayout podrán establecer sus propiedades Android: layout_width y android:layout_height, que podrán tomar los valores

“fill_parent” (para que el control hijo tome la dimensión de su layout contenedor) o

“wrap_content” (para que el control hijo tome la dimensión de su contenido). Ejemplo: <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent"> <EditText android:id="@+id/TxtNombre" android:layout_width="fill_parent" android:layout_height="fill_parent" /> </FrameLayout> LinearLayout LinearLayout

El siguiente layout Android en cuanto a nivel de complejidad es el LinearLayout. Este layout apila unos tras otros todos sus elementos hijos de forma horizontal o vertical según se establezca su propiedad Android: orientation. Al igual que en un FrameLayout, los elementos contenidos en un LinearLayout pueden establecer sus propiedades Android: layout_width y android:layout_height para determinar sus dimensiones dentro del layout. Pero en el caso de un LinearLayout, tendremos otro parámetro con el que jugar, la propiedad android:layout_weight.

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/Android" android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="vertical"> <EditText android:id="@+id/TxtNombre" android:layout_width="fill_parent" android:layout_height="fill_parent" /> <Button android:id="@+id/BtnAceptar" android:layout_width="wrap_content" android:layout_height="fill_parent" /> </LinearLayout>

(47)

DESARROLLO

DESARROLLO DE DE APLICACIONES APLICACIONES MÓVILES MÓVILES I I 44 77

Esta propiedad nos va a permitir dar a los elementos contenidos en el layout unas dimensiones proporcionales entre ellas. Esto es más difícil de explicar que de comprender con un ejemplo. Si incluimos en un LinearLayout vertical dos cuadros de

texto (EditText) y a uno de ellos le establecemos un layout_weight=”1″ y al otro un layout_weight=”2″ conseguiremos como efecto que toda la superficie del layout quede

ocupada por los dos cuadros de texto y que además el segundo sea el doble (relación entre sus propiedades weight) de alto que el primero.

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="vertical"> <EditTextandroid:id="@+id/TxtDato1" android:layout_width="fill_parent" android:layout_height="fill_parent" android:layout_weight="1"/> <EditTextandroid:id="@+id/TxtDato2" android:layout_width="fill_parent" android:layout_height="fill_parent" android:layout_weight="2"/> </LinearLayout>

A pesar de la simplicidad aparente de este layout resulta ser lo suficiente versátil como para sernos de utilidad en muchas ocasiones.

TableLayout TableLayout

Un TableLayout permite distribuir sus elementos hijos de forma tabular, definiendo las filas y columnas necesarias, y la posición de cada componente dentro de la tabla. La estructura de la tabla se define de forma similar a como se hace en HTML, es decir, indicando las filas que compondrán la tabla (objetos TableRow), y dentro de cada fila las columnas necesarias, con la salvedad de que no existe ningún objeto especial para definir una columna (algo así como un TableColumn) sino que directamente insertaremos los controles necesarios dentro del TableRow y cada componente insertado (que puede ser un control sencillo o incluso otro ViewGroup) corresponderá a una columna de la tabla. De esta forma, el número final de filas de la tabla se corresponderá con el número de elementos TableRowinsertados, y el número total de columnas quedará determinado por el número de componentes de la fila que más componentes contenga.

Por norma general, el ancho de cada columna se corresponderá con el ancho del mayor componente de dicha columna, pero existen una serie de propiedades que nos ayudarán a modificar este comportamiento:

(48)

DESARROLLO

DESARROLLO DE DE APLICACIONES APLICACIONES MÓVILES MÓVILES I I 4848

 android:stretchColumnsandroid:stretchColumns. Indicará las columnas que pueden expandir para absorber el espacio libre dejado por las demás columnas a la derecha de la pantalla.

 android:shrinkColumnsandroid:shrinkColumns. Indicará las columnas que se pueden contraer para dejar espacio al resto de columnas que se puedan salir por la derecha de la pantalla.

 android:collapseColumnsandroid:collapseColumns. Indicará las columnas de la tabla que se quieren ocultar completamente.

Todas estas propiedades del TableLayout pueden recibir una lista de índices de

columnas separados por comas (ejemplo: android:stretchColumns=”1,2,3″) o un

asterisco para indicar que debe aplicar a todas las columnas (ejemplo:

android:stretchColumns=”*”).

Otra característica importante es la posibilidad de que una celda determinada pueda ocupar el espacio de varias columnas de la tabla (análogo al atributo colspan de HTML). Esto se indicará mediante la propiedad android:layout_span del componente concreto que deberá tomar dicho espacio.

Veamos un ejemplo con varios de estos elementos:

<TableLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent" android:stretchColumns="1"> <TableRow> <TextViewandroid:text="Celda 1.1"/> <TextViewandroid:text="Celda 1.2"/> </TableRow> <TableRow> <TextViewandroid:text="Celda 2.1"/> <TextViewandroid:text="Celda 2.2"/> </TableRow> <TableRow> <TextViewandroid:text="Celda 3" android:layout_span="2"/> </TableRow> </TableLayout> RelativeLayout RelativeLayout

El último tipo de layout que vamos a ver es el RelativeLayout. Este layout permite especificar la posición de cada elemento de forma relativa a su elemento padre o a cualquier otro elemento incluido en el propio layout. De esta forma, al incluir un nuevo

(49)

DESARROLLO

DESARROLLO DE DE APLICACIONES APLICACIONES MÓVILES MÓVILES I I 44 99

elemento X podremos indicar por ejemplo que debe colocarse debajo del elemento Y, y alineado a la derecha del layout padre. Veamos esto en el ejemplo siguiente:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android android:layout_width="fill_parent" android:layout_height="fill_parent"> <EditTextandroid:id="@+id/TxtNombre" android:layout_width="fill_parent" android:layout_height="wrap_content"/> <Buttonandroid:id="@+id/BtnAceptar" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_below="@id/TxtNombre" android:layout_alignParentRight="true"/> </RelativeLayout>

En el ejemplo, el botón Btn Aceptar se colocará debajo del cuadro de texto TxtNombre

(android:layout_below=”@id/TxtNombre”) y alineado a la derecha del layout padre (android:layout_alignParentRight=”true”), además de dejar un margen a su izquierda

de 10 pixeles (android:layout_marginLeft=”10px”).

Al igual que estas tres propiedades, en un RelativeLayout tendremos un sinfín de propiedades para colocar cada control justo donde queramos. Veamos las principales [creo que sus propios nombres explican perfectamente la función de cada una]: Posición relativa a otro control:

 android:layout_above.  android:layout_below.  android:layout_toLeftOf.  android:layout_toRightOf.  android:layout_alignLeft.  android:layout_alignRight.  android:layout_alignTop.  android:layout_alignBottom.  android:layout_alignBaseline.  Posición relativa al layout padre:  android:layout_alignParentLeft.  android:layout_alignParentRight.  android:layout_alignParentTop.  android:layout_alignParentBottom.  android:layout_centerHorizontal.  android:layout_centerVertical. android:layout_centerInParent.

(50)

DESARROLLO

DESARROLLO DE DE APLICACIONES APLICACIONES MÓVILES MÓVILES I I 5050

 Opciones de margen (también disponibles para el resto de layouts):  android:layout_margin.

 android:layout_marginBottom.  android:layout_marginTop.  android:layout_marginLeft.  android:layout_marginRight.

 Opciones de espaciado o padding (también disponibles para el resto de layouts):  android:padding.  android:paddingBottom.  android:paddingTop.  android:paddingLeft.  android:paddingRight.

Otros elementos comunes que extienden a ViewGroup, como por ejemplo las vistas de tipo lista (ListView), de tipo grid (GridView), y en pestañas (TabHost/TabWidget).

(51)

DESARROLLO

DESARROLLO DE DE APLICACIONES APLICACIONES MÓVILES MÓVILES I I 55 11

Widgets Widgets

Un widget es el conjunto de componentes visuales que permite crear las aplicaciones en Android. Entre dichos componentes tenemos Button, TextView, EditText y el package donde se importa todos los controles, que es android.widget.

Figura 24: componenteswidget en los celulares

Fuente: http://bitelia.com/2014/01/widgets-android

Botones (Button) Botones (Button)

El SDK de Android nos proporciona tres tipos de botones: el Clásico (Button), el de tipo on/off (ToggleButton), y el que puede contener una imagen (ImageButton). En la imagen siguiente vemos el aspecto por defecto de estos tres controles:

(52)

DESARROLLO

DESARROLLO DE DE APLICACIONES APLICACIONES MÓVILES MÓVILES I I 5252

Propiedades Propiedades android:id android:id

Esto ya lo vimos en el tema anterior, esta propiedad es el ID del control, con el que podremos identificarlo de forma única más tarde en nuestro código. Vemos que el

identificador lo escribimos precedido de “@+id/”. Esto tendrá como efecto que al compilarse el proyecto se genere automáticamente una nueva constante en la clase R para dicho control.

android:text android:text.

Texto del control. En Android, el texto de un control se puede especificar directamente, o bien utilizar alguna de las cadenas de texto definidas en los recursos del proyecto (fichero strings.xml), en cuyo caso indicaremos su identificador precedido del prefijo

“@string/”.

android:layout_height

android:layout_height y android:layout_widthy android:layout_width

Dimensiones del control con respecto al layout que lo contiene. Esta propiedad tomará

normalmente los valores “wrap_content” para indicar que las dimensiones del control se ajustarán al contenido del mismo, o bien “fill_parent” para indicar que el ancho o el

alto del control se ajustarán al ancho o alto del layout contenedor respectivamente.

Unidades de medida para

Unidades de medida para esta propiedadesta propiedad px

px. Píxeles, corresponde a píxeles reales en la pantalla. en.

Cm

Cm - basado en el tamaño físico de la pantalla. mm

mm. Milímetros - en función del tamaño físico de la pantalla. pt.

pt. Puntos - 1/72 de una pulgada en función del tamaño físico de la pantalla. sp

sp. Escala de píxeles independientes - esto es como la unidad de DP, pero también es escalado por la preferencia del usuario tamaño de la fuente. Se recomienda utilizar esta unidad al especificar tamaños de fuente, por lo que se ajusta tanto para la densidad de pantalla y preferencias del usuario.

android:layout_margin android:layout_margin

Este parámetro indica el espacio entre el control (en este caso botón) y su padre en este caso el Layout.

android:padding android:padding

(53)

DESARROLLO

DESARROLLO DE DE APLICACIONES APLICACIONES MÓVILES MÓVILES I I 55 33

Este parámetro indica el espacio entre Texto o Imágenes que pongamos dentro del control (en este caso el botón) y el propio control.

android:gravity android:gravity

Esta es la gravedad del control, la verdad es que es una forma srcinal de poner la alineación, si entre las comillas de este parámetro pulsamos la famosa combinación de teclas Control+Espacio, eclipse nos dará todos los parámetros que podemos usar aquí, si ponemos solo "center" se centrara su contenido tanto vertical como horizontal. android:drawable

android:drawable

Con este parámetro pondremos una imagen al botón, que no es lo mismo que el ImageButton, que todo el botón es en sí una imagen, con esto ponemos una especie de icono dentro del botón, por ejemplo si queremos poner el típico Play, Stop las flechas de avance o retroceso... existen variantes de este parámetro para poner la imagen a la derecha o izquierda, arriba o abajo.

android:Text android:Text

Con este parámetro definimos el texto del botón, podemos usar un recurso R usando "@String/texto o directamente un texto entre comillas.

android:TextSize android:TextSize

Indicamos un tamaño, si no ponemos esto, se selecciona un tamaño por defecto standard, si te parece grande o pequeño ve probando usando la unidad dp que vimos en el tema anterior.

android:backgroud android:backgroud

Con este parámetro definimos el color de fondo del Botón.

android:OnClick android:OnClick

Esta es una propiedad que nos ayuda con el Listener, al final de la lección hablo de esto, que es la parte Java del Botón, esto nos facilita la vida, lo malo es que solo se puede utilizar a partir de la API 6 de Android, no creo que vayas a hacer un proyecto con esta API yo uso esta opción, es menos lioso.

(54)

DESARROLLO

DESARROLLO DE DE APLICACIONES APLICACIONES MÓVILES MÓVILES I I 5454

Ejemplo de botón con estilo

Evento del botón de comando

EditText EditText

EditText (caja de edición de texto) es un cuadro de texto para ingresar datos en Android este control tiene patrones definidos para permitir el ingreso de información

correcta según el tipo de ingreso definido.

android:hint.

android:hint. Con este parámetro pondremos un texto por defecto mientras el campo este vacío, es decir, él lo que ve el usuario antes de que el escriba nada.

Referencias

Documento similar

En definitiva, la tarea de la Lingüística del texto hoy en día es “describir, tan  realista y 

Por ejemplo, con este tipo de controles se podrá validar la información introducida por el usuario en un campo, de tal forma que esta se corresponda con un determinado formato

En junio de 1980, el Departamento de Literatura Española de la Universi- dad de Sevilla, tras consultar con diversos estudiosos del poeta, decidió propo- ner al Claustro de la

Sanz (Universidad Carlos III-IUNE): &#34;El papel de las fuentes de datos en los ranking nacionales de universidades&#34;.. Reuniones científicas 75 Los días 12 y 13 de noviembre

(Banco de España) Mancebo, Pascual (U. de Alicante) Marco, Mariluz (U. de València) Marhuenda, Francisco (U. de Alicante) Marhuenda, Joaquín (U. de Alicante) Marquerie,

Volviendo a la jurisprudencia del Tribunal de Justicia, conviene recor- dar que, con el tiempo, este órgano se vio en la necesidad de determinar si los actos de los Estados

b) El Tribunal Constitucional se encuadra dentro de una organiza- ción jurídico constitucional que asume la supremacía de los dere- chos fundamentales y que reconoce la separación

En este proyecto se ha unificado el desarrollo de aplicaciones para dispositivos móviles S40 de Nokia con la tecnología NFC, dando como resultado la aplicación “Smart-Info UPCT”,