UNIVERSIDAD TECNOLÓGICA DE QUERÉTARO

Transcripción

1 UNIVERSIDAD TECNOLÓGICA DE QUERÉTARO Nombre del Proyecto: Manual de prácticas para dispositivos basados en Android Nombre de la Empresa: UTEQ Memoria Que como parte de los requisitos para obtener el titulo de: Licencia en Desarrollo de Aplicaciones para Dispositivos Móviles Presenta ING. Pablo Dávila Rojas Asesor de la UTEQ ISC. Marco Antonio Arreguin Molina Asesor de la Empresa L.I. Víctor Manuel Aguilar Sánchez Santiago de Querétaro, Qro Mayo del

2 RESUMEN El avance de las nuevas tecnologías de la información ha permitido crear nuevas formas para agilizar los movimientos tanto en grandes empresas como a nivel personal. Los dispositivos móviles son aparatos de pequeño tamaño, con capacidades de procesamiento, con conexión permanente o intermitente a una red, con memoria limitada, diseñados específicamente para una función, pero que pueden llevar a cabo otras funciones más generales. El proyecto de nombre Manual de Prácticas para dispositivos basados en Android (En adelante Manual) a realizar para la Universidad Tecnológica de Querétaro está dividido en diez módulos de los cuales cada uno consta de varios temas en los que se explicará cada uno de los componentes y prácticas que se realizarán a lo largo del Manual. Esta memoria comprende el desarrollo de algunas aplicaciones y la realización de él marco teórico de cada una realizadas para dispositivos móviles con Sistema Operativo Android (En adelante Android). El trabajo fue dividido en tres etapas. La primera fue el análisis de requerimientos técnicos y los diferentes módulos o niveles en los que se desea trabajar. La segunda es el desarrollo de cada una de las aplicaciones con el 2

3 código fuente en lenguaje JAVA utilizando las librerías del Framework Android SDK. Finalmente, se realizó el marco teórico para cada una de las prácticas y conceptos de los componentes que se utilizaran para así implementar el diseño anteriormente mencionado. A continuación se muestran algunas palabras claves mencionadas en el documento: Android. Manual. Practica. 3

4 Abstract The advance of new information technologies has created new ways for smooth movement in both large companies and personal level. Mobile devices are small devices with processing capabilities, permanently or intermittently connected to a network, with memory, designed specifically for a function, but can perform other functions more generally. The proposed name Practices Manual for Android devices to perform to the Technological University of Querétaro is divided into ten modules, each of which consists of several submodules in which they explain each of the components and practices that will be made to throughout the Manual. This report includes the development of some applications and the realization of the theoretical framework of each made for mobile devices with Android OS. The work was divided into four stages. The first was the analysis of technical requirements and the different modules or levels at which you want to work. The second is the development of each of the applications with source code in Java using the Android SDK Framework libraries. Finally, we performed the theoretical framework for each of the practices and concepts of the components that were used in order to implement the above design. 4

5 DEDICATORIAS Estas líneas son dedicadas a las personas que han estado a mi lado a lo largo de mi vida, quienes día a día me han dado un gran ejemplo a seguir, y han visto siempre por mi bien brindándome una buena educación desde mi casa, y por más difícil que se llegue a suscitar una situación han tenido siempre las palabras claves y me han dicho que es duro fracasar en algo, pero es mucho peor no haberlo intentado. Ellos son mis padres Pablo Dávila y Dolores Rojas, les agradezco demasiado por apoyarme en cada momento, por sus consejos de perseverancia y fe; a su vez gracias a Dios que me ha dado vida y salud para estar logrado mis objetivos, y con el gran amor, apoyo y motivación de ellos he llegado hasta donde ahora estoy. A mis familiares que han sido una parte esencial en mi vida, demostrando valores, actitudes y virtudes que siempre ayudan a ser una mejor persona, gracias a toda mi familia que es la base de mi vida. 5

6 AGRADECIMIENTOS Agradezco a la Universidad Tecnológica de Querétaro y a todas las personas que pertenecen a tan digna institución, que fueron parte de mi formación académica. Agradezco a quienes asesoraron la realización de la estadía y de esta memoria, al ISC. Marco Antonio Arreguin Molina y al L.I. Víctor Manuel Aguilar Sánchez, quien fungió como asesor por parte de la empresa, en este caso la UTEQ. Agradezco a todas las personas que, en algún momento de mi vida, estuvieron presentes para darme consejos, apoyo y su amistad, José Manuel Saucedo Ponce, Raúl Zavaleta Zea, Juan Manuel Juárez Arteaga, Diana Guerra Molina y una lista interminable de personas. 6

7 I N D I C E Página Resumen... 2 Abstract. 4 Dedicatorias... 5 Agradecimientos... 6 Índice.. 7 I. INTRODUCCION.. 9 II. ANTECEDENTES.. 11 III. JUSTIFICACIÓN IV. OBJETIVOS. 13 V. ALCANCES. 15 VI. FUNDAMENTACIÓN TEÓRICA Herramientas de desarrollo...18 VII. PLAN DE ACTIVIDADES.. 23 VIII. RECURSOS MATERIALES Y HUMANOS. 24 Materiales.. 24 Humanos IX. DESARROLLO DEL PROYECTO Ambientar el equipo Antecedentes y Arquitectura Android

8 9.3 Conceptos Generales Practica Hola Usuario Uso de Layouts Componentes Básicos Bases de Datos SQLite Mapas en Android X. RESULTADOS OBTENIDOS XI. ANÁLISIS DE RIESGOS 200 XII. CONCLUSIONES XIII. RECOMENDACIONES. 203 XIV. REFERENCIAS BIBLIOGRÁFICAS 204 8

9 I. INTRODUCCIÓN El proyecto se realizará para la Universidad Tecnológica de Querétaro, la cual coordina dos proyectos más de aplicaciones móviles además de esta memoria los cuales son Manual de prácticas para Dispositivos IPhone y Manual de Practicas para dispositivos Black Berry. En la actualidad el desarrollo de sistemas móviles o la creación de sistemas de control y/o programación, son una importante alternativa de solución para la empresa establecida así como también para necesidades personales y es el desarrollo tecnológico el que le da pauta y forma a la ejecución de programas. La presente propuesta, permitirá al usuario iniciarse en el desarrollo de tales aplicaciones definiendo conceptos y realizando prácticas que le ayudaran a posteriormente desarrollar sus aplicaciones ya sea para el ámbito laboral o personal, el proyecto es denominado Manual de Practicas para Dispositivos Android. Esta guía de desarrollo utiliza un lenguaje de programación y una estructura basada en JAVA cuyas principales etapas identifican: análisis de requerimientos, diseño de la guía, construcción y definición de aplicaciones para el desarrollo de sistemas móviles para empresas o personales y por ultimo implementación de cada concepto y practica. 9

10 Este proyecto inicia refiriendo las principales características de la Universidad Tecnológica de Querétaro y su organización. Posteriormente se indica el análisis de necesidades, los objetivos y el plan de trabajo. Más adelante se presenta el análisis y la implementación del manual. Por último las conclusiones, dificultades y logros obtenidos. 10

11 II. ANTECEDENTES A lo largo de 18 años de trayectoria en Querétaro, la Universidad Tecnológica de Querétaro se ha consolidado como una Institución Educativa de calidad que ofrece una formación profesional, cuyo distintivo es la estrecha relación con el sector productivo. La UTEQ comienza sus labores docentes en septiembre de 1994, iniciando la formación de 146 alumnos en las áreas de Administración, Comercialización, Mantenimiento Industrial y Procesos de Producción. Trabajando en aulas prestadas por diversas instituciones de educación superior del estado. El 4 de septiembre de 1994 se inició la construcción de sus propias instalaciones en una extensión de 25 hectáreas ubicadas en la Colonia San Pedrito Peñuelas. Actualmente se imparten ocho carreras actualmente Tecnologías de la Información y Comunicación-, Tecnología Ambiental y más recientemente Servicio Posventa: Área Automotriz, todas avaladas por la preparación profesional y curricular del cuerpo docente, en su mayoría con estudios de maestría y doctorado en áreas afines a las materias que imparten y en los atributos del modelo educativo, mismo que incluye actividades culturales y deportivas para la formación integral del estudiantado. 11

12 III. JUSTIFICACION La guía para el desarrollo de aplicaciones en android servirá como apoyo en la construcción de aplicaciones móviles utilizando la versión 2.2 del software de Android. Cada una de las unidades contendrá diferentes ejemplos y prácticas para una mejor comprensión tanto de los componentes como de la estructura para poder desarrollar en esta plataforma, abarca toda la funcionalidad básica a través de aplicaciones útiles y concisas. Aunque existen en el mercado varias opciones que ofrecen herramientas similares; la Universidad Tecnológica de Querétaro necesitaba una guía que permitiera explicar y definir muy detalladamente cada uno de los componentes y conceptos para el desarrollo en el Sistema Operativo Android y además practicas mejor elaboradas y que el usuario pueda tener un mejor entendimiento de cada una de estas y así también poder implementarlo en el sector productivo. Las explicaciones y los ejemplos incluidos en esta guía darán a los usuarios los conocimientos necesarios para desarrollar aplicaciones móviles atractivas utilizando el actual SDK y aprender el funcionamiento de Eclipse como IDE para desarrollar cada una de las aplicaciones destinadas a dispositivos móviles Android. 12

13 IV. OBJETIVOS Objetivo general Realizar un manual que permita tener una visión muy específica y detallada del sistema operativo Android así como prácticas que permitan al usuario generar aplicaciones propias y para su empresa. Objetivo Particular Realizar unidades en donde se visualicen prácticas básicas e intermedias con el Sistema Operativo Android así como marco teórico de cada una de ellas para una mejor comprensión de cada uno de los temas a tratar y tener una mejor perspectiva de lo que es Android. A continuación se muestra una lista de prácticas que se realizaran: Practica 1 - Hola Mundo. Practica 2 - Hola Usuario. Practica 3 - Caja de texto con FrameLayout. Practica 4 - Texto e imagen en FrameLayout. Practica 5 - Componentes en LinearLayout. Practica 6 - Segunda practica con LinearLayout. Practica 7 - TableLayout con propiedades básicas. Practica 8 - Dispersar componentes con TableLayout. 13

14 Practica 9 - Implementación de RelativeLayout. Practica 10 - Implementar propiedades en RelativeLayout. Practica 11 - Manejo de eventos para botones. Practica 12 - Interacción de clases con botones. Practica 13 - Manejo de un ToggleButton. Practica 14 - ImageButton. Practica 15 - Uso de selector. Practica 16 - Implementación de una Calculadora básica. Practica 17 - ImageView, TextView y EditText. Practica 18 - Agenda básica con SQLite. Practica 19 - Mapa en pantalla principal. Practica 20 - Manipulación de mapas. 14

15 V. ALCANCES Los componentes y las prácticas, deben ser específicamente realizados y detallados en cada una de las unidades así como la documentación y el código fuente debe considerar la posibilidad de implementación, al ser colocados en los niveles intermedio y avanzado. La documentación debe ser clara, con posibilidad de ser retomada por otros desarrolladores para sus futuras modificaciones. El código fuente de cada una de la unidades será realizada en lenguaje JAVA y el SDK Android con programación orientada a objetos. Cada una de las unidades genera diferentes prácticas y conceptos dependiendo del tema principal. Las prácticas realizadas en cada una de las unidades podrán ser comprendidas fácilmente por el usuario con conocimientos previos del Lenguaje de programación JAVA. Para cada una de las prácticas se realizara un marco teórico que describa los componentes que se utilizaran para esta. Se planteará un problema y una solución para cada una de las prácticas y tener un mejor razonamiento. 15

16 A continuación se describen cada una de las unidades que contendrá esta memoria y que ayudaran con el aprendizaje de este sistema operativo: I. Ambientar el equipo. En esta unidad se mostrará paso a paso como realizar el entorno del ambiente de desarrollo e instalar las herramientas necesarias para comenzar a programar aplicaciones Android. II. Antecedentes y Arquitectura de Android. Esta unidad servirá para conocer más acerca de la arquitectura del Sistema Operativo Android así como la descripción de cada uno de los elementos que lo compone. III. Conceptos Generales. Se describirán algunos de los componentes principales que componen el IDE para desarrollar en esta plataforma y la utilización de cada uno de estos. IV. Practica Hola Usuario. En Esta unidad se realizará la primera práctica con algunos componentes básicos de Android. V. Uso de Layouts. En esta unidad se elaborará la Descripción e implementación de cada uno de los cuatro layouts que compone Android: FrameLayout, LinearLayout, TableLayout, RelativeLayout. 16

17 VI. Componentes Básicos. En esta unidad se realizarán prácticas y conceptos de los controles básicos que pone a la disposición la plataforma de desarrollo de este Sistema Operativo. VII. Bases de Datos SQLite. En esta unidad se comenzara con la implementación de bases de datos, se describirán sus componentes y practicas con inserciones, modificaciones y eliminación de registros. VIII. Mapas en Android. En esta Unidad se implementaran mapas para un dispositivo con Android mediante Google Maps. 17

18 VI. Fundamentación Teórica La elaboración de una guía de este tipo, se logra gracias a la existencia de algunas tecnologías en las que está basado este proyecto: el lenguaje JAVA, SDK, Android, SQLite, Eclipse, XML y la Programación Orientada a Objetos. 6.1 Herramientas de desarrollo JAVA: Java es un lenguaje de programación y la primera plataforma informática creada por Sun Microsystems en Es la tecnología subyacente que permite el uso de programas punteros, como herramientas, juegos y aplicaciones de negocios. Java se ejecuta en más de 850 millones de ordenadores personales de todo el mundo y en miles de millones de dispositivos, como dispositivos móviles y aparatos de televisión. Existe un gran número de aplicaciones y sitios Web que no funcionan a menos que Java esté instalado, y muchas más que se crean a diario. Java es rápido, seguro y fiable. De portátiles a centros de datos, de consolas de juegos a súper equipos científicos, de teléfonos móviles a Internet, Java está en todas partes. [ ANDROID: Android es sistema operativo para móviles basado en Linux y diseño única y exclusivamente para teléfonos móviles (o smartphones) y tablets. Además, pero no es gran medida, también hay otros dispositivos que 18

19 funcionan con Android como pueden ser: relojes, reproductores de MP3, ordenadores, netbooks e incluso televisores. Google compró Android en el año 2005, formalizándose así el primero paso de Google al mundo de la telefonía móvil, aunque en este entonces Android no era nada conocido. Android es muy joven todavía, empezó sus andanzas allá por el año 2005 y la empresa ha crecido tanto que en el segundo trimestre del 2010, Android consigue ser el sistema operativo de teléfonos inteligentes de Estados Unidos. [ SDK: El kit de desarrollo de software o más conocido como SDK es por norma general un conjunto de herramientas de desarrollo de software que permite a un programador crear programas y aplicaciones para un sistema o plataforma concretos. Suelen incluir un soporte para la detección de errores, un entorno de desarrollo integrado y otro tipo de utilidades. Suelen incluir también algún tipo de explicación de lo que contiene, algunos códigos de ejemplos y un manual de uso. La mayoría de los kits de desarrollo de software son gratuitos y se distribuyen libremente por internet para así fomentar la colaboración de los desarrolladores para mejorar su producto y para que utilicen su lenguaje. También se utiliza como herramienta de márketing, ya que por ejemplo, si animan a la gente a programar sus propias aplicaciones, comprarán productos para verlos porque también les agradará seguir creando para ellos. [ 19

20 SQLite: SQLite es una biblioteca en el proceso que implementa un autónomo, sin servidor, configuración cero y transaccional motor de base de datos SQL. El código de SQLite es en el dominio público y por lo tanto es libre para el uso para cualquier propósito, comercial o privado. SQLite se encuentra actualmente en más aplicaciones de las que se puede contar, entre ellos varios proyectos de alto perfil. SQLite es un sistema integrado de base de datos SQL. A diferencia de la mayoría de las otras bases de datos SQL, SQLite no tiene un proceso servidor independiente. SQLite lee y escribe directamente a los archivos de disco normal. Una completa base de datos SQL con varias tablas, índices, triggers y vistas, está contenida en un archivo de disco único. El formato de archivo de base de datos es multi-plataforma que libremente puede copiar una base de datos entre los sistemas de 32-bit y 64-bit o entre big-endian y littleendian arquitecturas. Estas características hacen que SQLite sea una elección popular como un formato de archivo de aplicación. [ ECLIPSE (IDE): Eclipse es una comunidad de código abierto, cuyos proyectos se centran en la construcción de una plataforma de desarrollo abierta compuesta por marcos extensibles, herramientas y tiempos de ejecución para la construcción, implementación y administración de software a través del ciclo de vida. La Fundación Eclipse es una organización sin fines de lucro, corporación 20

21 miembro de apoyo que aloja los proyectos de Eclipse y ayuda a cultivar tanto una comunidad de código abierto y un ecosistema de productos y servicios complementarios. El Proyecto Eclipse fue creado originalmente por IBM en noviembre de 2001 y apoyado por un consorcio de proveedores de software. La Eclipse Foundation se creó en enero de 2004 como una organización independiente sin fines de lucro para actuar como administrador de la comunidad Eclipse. La organización independiente sin fines de lucro fue creada para permitir que un proveedor neutral y abierto, transparente a la comunidad se estableciera en torno a Eclipse. Hoy en día, la comunidad Eclipse se compone de individuos y organizaciones de una sección transversal de la industria del software. [ XML: XML es un Lenguaje de Etiquetado Extensible muy simple, pero estricto que juega un papel fundamental en el intercambio de una gran variedad de datos. Es un lenguaje muy similar a HTML pero su función principal es describir datos y no mostrarlos como es el caso de HTML. XML es un formato que permite la lectura de datos a través de diferentes aplicaciones. 21

22 Las tecnologías XML son un conjunto de módulos que ofrecen servicios útiles a las demandas más frecuentes por parte de los usuarios. XML sirve para estructurar, almacenar e intercambiar información. [ Programación Orientada a Objetos (POO): La programación orientada a objetos, intenta simular el mundo real a través del significado de objetos que contiene características y funciones. Los lenguajes orientados a objetos se clasifican como lenguajes de quinta generación. Como su mismo nombre indica, la programación orientada a objetos se basa en la idea de un objeto, que es una combinación de variables locales y procedimientos llamados métodos que juntos conforman una entidad de programación. [ 22

23 VII. Plan de Actividades En la figura 7.1 se muestra el cronograma de las actividades que se llevaran a cabo para realizar el proyecto. Figura 7.1 Cronograma de actividades. En la figura 7.2 se muestra la secuencia de las actividades que se llevaran a cabo para el desarrollo del manual. Figura 7.2 Diagrama de secuencia de las actividades 23

24 VIII. Recursos Materiales y Humanos Materiales: Computadora procesador Intel Core i5, 4GB RAM: Computadora que se utilizará para el desarrollo del proyecto. Sistema Operativo Windows 7 Home Premium: Sistema operativo que estará instalado en la computadora descrita anteriormente. Eclipse EE: Entorno de desarrollo en que se desarrollarán las practicas en JAVA y Android. SDK Android: Se permitirá instalar las librerías pertenecientes a Android y poder usarlas para desarrollar los componentes de la aplicación. Humanos: Analista Programador: Es aquella persona que escribe, depura y mantiene el código fuente de un programa informático, es decir, del conjunto de instrucciones que ejecuta el hardware de una computadora para realizar una tarea determinada. La programación es una de las principales disciplinas dentro de la informática. En la mayoría de los países, programador es también una categoría profesional reconocida. 24

25 IX. Desarrollo del Proyecto El desarrollo del proyecto completo se llevó a cabo por un analista programador, tal como se menciona en la sección de recursos humanos, sin embargo en esta parte se reportan solamente los niveles asignados al autor: Análisis de requerimientos, diseño y estructura de la guía e implementación. Cabe mencionar que para cada tarea o actividad que se realizó una revisión minuciosa previa sobre: JAVA, Android, Eclipse. Cada una de las unidades se elaboro con una descripción detallada y de fácil comprensión para el usuario y le permita desarrollar aplicaciones necesarias para su entorno laboral o simplemente conocer más a fondo este Sistema Operativo y todas las herramientas que ofrece para el desarrollo de componentes. A continuación en la figura 9.1 muestra un diagrama en el cual se puede visualizar un poco de la estructura del manual de prácticas y tener una visión más detallada de su desarrollo e implementación. 25

26 Figura 9.1 Diagrama de estructura de practicas 26

27 9.1 Ambientar el equipo Para comenzar con el ambiente de desarrollo Android primeramente se deberá descargar el IDE (Entorno de Desarrollo Integral) que nos permitirá programar las prácticas, para este caso utilizaremos ECLIPSE, que se puede descargar desde su sitio oficial [ Una vez teniendo el IDE y al abrirlo, desplegamos el menú de ayuda (Help) que se encuentra en la barra de herramientas de la parte superior y seleccionamos Install new Software de igual manera que se muestra en la figura 9.2. Instalar nuevo software Figura 9.2 Instalar nuevo software 27

28 En la pantalla que se despliega se oprime el botón Add esto nuevamente despliega un pequeño recuadro en el cual se pide que se introduzca el nombre del Plugin y su localización, esto se puede obtener del sitio de Android [ Una vez introducidos el nombre y la localización se oprime OK tal y como se muestra en la figura 9.3. Agregar ubicación y nombre Figura 9.3 Agregar ubicación para instalación del plugin 28

29 Al oprimir OK se muestran algunos complementos o herramientas para instalar en el IDE como se muestra en la figura 9.4 y click en Next. Siguiente Figura 9.4 Revisar complementos Al continuar en la siguiente pantalla se pueden revisar los elementos que se instalaran, en este caso son cuatro: Android DDMS Android Development Tools Android Hierarchy Viewer Android Traceview Esto se puede observar en la figura 9.5, y enseguida se oprime Next para continuar con la instalación. 29

30 Siguiente Figura 9.5 Elementos que serán instalados Al oprimir Next se muestra una pantalla en donde se visualizan los términos de la licencia y cada uno de los términos y condiciones para el uso, reproducción y distribución, finalmente se pide que se acepten los términos de licencia. Se escoge la opción de aceptar los términos de licencia de acuerdos y se oprime Finish para poder continuar. Esto se muestra en la figura

31 Siguiente Figura 9.6 Revisar Licencias Se comienza con la instalación de los complementos y herramientas Android, durante la instalación se muestra un recuadro para continuar con la instalación o ver los detalles de todas las herramientas que se instalaron o se instalaran en el IDE. Este proceso se puede observar en la figura

32 Figura 9.7 Advertencia de Seguridad Se oprime OK y al terminar la instalación se pide que se reinicie el programa. Y se le da click Restar Now, esto se muestra en la figura 9.8. Figura 9.8 Reiniciar Eclipse Una vez reiniciado el programa se muestra una ventana en donde se escogerá la primera opción Install new SDK y se debe palomear los dos cuadros que se muestran y la ubicación o el destino en donde se creara la carpeta SDK con los componentes. Nuevamente oprimir Next. Este procedimiento se muestra en la figura

33 Donde se localizara el sdk Figura 9.9 Instalar nuevo SDK En la siguiente figura 9.10 se muestra la pantalla en el cual se tiene dos opciones en donde dice que si se desea enviar estadísticas de uso de Google, se selecciona la segunda opción No ya que por el momento no se requiere enviar algún tipo de información y se oprime Finish. Y una vez que se oprima Finish se terminaran de cargar todos los componentes, y finalmente estará instalado el SDK de Android y solo quedara instalar algunos paquetes que complementen algunos componentes. 33

34 Figura 9.10 Enviar Estadísticas de Uso Se continúa con la instalación del SDK como se muestra en la figura Figura 9.11 Instalando SDK Una vez terminada la instalación se procederá a instalar algunos paquetes para la o las versiones que se va a utilizar para programar. 34

35 Se selecciona la opción de Aceptar y se oprime el botón Install y en la parte posterior se muestran todos los complementos que se van instalando como se observa en la figura Aceptar los términos Figura 9.12 Elegir Paquetes para Instalar Ahora se procederá a instalar los paquetes o complementos faltantes del SDK, para esto se desplegará el menú Window de la barra de herramientas que se encuentra en la parte superior y se seleccionará la opción de Android SDK Manager el cual servirá para terminar de configurar por completo el ambiente de Android en el IDE Eclipse. El procedimiento para este paso se puede observar en la figura

36 Andministrador del SDK de Android Figura 9.13 Instalar Paquetes con SDK Manager Se abrirá una ventana en la cual se deberá esperar un momento a que se carguen todos los paquetes, en los cuales se pueden mostrar doce paquetes de diferentes versiones, en este caso no se instalaran todos los paquetes ya que llevaría demasiado tiempo en la instalación y además de que no se usaran todos las herramientas para desarrollar las prácticas en este manual. En la figura 9.14 se puede observar la carga de todos estos paquetes para así poder escoger los que se necesiten. 36

37 Figura 9.14 Carga de Paquetes Una vez que se hallan cargado los paquetes se puede observan toda una lista de todas las versiones del sistema operativo de la cual se seleccionará la de Android 2.2 (API 8) y Android (API 15). Al desplegar las flechas que se observan a un lado se pueden ver los componentes que se instalaran y finalmente se seleccionan o se palomean los cuadros y se oprime Install packages para terminar la instalación de los componentes faltantes esto se visualiza en la figura

38 Seleccionar Paquetes a Instalar Figura 9.15 Instalar Paquetes Posteriormente se mostrara un recuadro en donde se muestra la descripción de los paquetes y licencia: Descripción de paquete, Descripción del archivo, y el sitio en donde se guardara. Se aceptara la licencia de paquetes a instalar, para esto se escoge la opción de aceptar y se oprime el botón Install como se aprecia en la figura

39 Aceptar Términos Figura 9.16 Elegir Paquetes SDK para Instalar Ahora se continuara con la creación de un AVD (Android Virtual Device) o el simulador del móvil con sistema operativo Android, se despliega nuevamente el menú Window de la barra de herramientas y se selecciona la opción de AVD Manager, como se muestra en la figura Esto permitirá emular en la computadora el dispositivo móvil para probar cada una de las prácticas a los que apuntan las aplicaciones que se realizaran a lo largo del manual. 39

40 Seleccionar Administrador de AVDs Figura 9.17 AVD Manager Se mostrara una pantalla en donde se oprimirá New y se mostrara una ventana en la cual se configurará el AVD, en donde se tecleara el nombre que elija el usuario, en la opción de Target se escogerá Android 2.2 API Level 8, en SD Card la cantidad de memoria que elija el desarrollador, en Size el tamaño que se requiera para el simulador y se oprime Create AVD. Esto se muestra en la figura Name: En esta casilla se determinara el nombre que se le dará al AVD. Target: En esta se especifica que versión de Android tendrá el AVD. SD Card: Aquí se dará un determinado número de almacenamiento a la SD virtual. Skin: Esta determina la resolución de la pantalla de nuestro AVD. 40

41 Crear AVD Figura 9.18 Crear AVD Se mostrara una ventana (como se puede observar en la figura 9.19) en la que aparece el nombre del AVD con las características que se le dieron y en la parte derecha de la ventana se tienen seis opciones que se pueden usar para el AVD: New: Permite crear un nuevo AVD. Edit: Con esta opción se pueden editar las características del AVD que se tengan en la lista. Delete: Borrar o eliminar cualquier AVD en existencia. 41

42 Repair: Para reparar el AVD en caso de alguna falla. Details: Muestra los detalles del AVD. Start: Para comenzar a usar el AVD. En la parte debajo de la pantalla muestra algunas indicaciones que podrían aparecer en la lista de los AVD: Indica que el dispositivo virtual de Android es válido. Indica que el AVD no pudo ser cargado y se pueden ver los detalles al oprimir Details para ver el error. Indica que un AVD puede ser reparable. AVD o Simulador creado Figura 9.19 Lista de AVDs 42

43 Dar click en Start y se mostrara un pequeño recuadro en donde podemos alterar manualmente las medidas del AVD o dejarlas predeterminadas. Si se requiere se alteraran las medidas sino se lanza el AVD oprimiendo el botón Launch como se muestra en la figura Por defecto, la casilla Scale display to real size no está marcada, y la ventana del emulador de Android se abrirá normalmente. El tamaño de la pantalla del dispositivo que desea emular, en pulgadas. Para determinar el dpi del monitor hacer clic en el botón? para abrir una calculadora y ayudar a determinar cuál es el valor de dpi. Figura 9.20 Configurar Opciones 43

44 Finalmente se podrá visualizar el AVD o simulador, se tendrá que esperar un momento a que se cargue completamente como se puede observar en la figura Figura 9.21 Simulador de Dispositivo Móvil 44

45 9.2 Antecedentes y Arquitectura Android Fue desarrollado inicialmente por Android Inc., una firma comprada por Google en Es el principal producto de la Open Handset Alliance, un conglomerado de fabricantes y desarrolladores de hardware, software y operadores de servicio. En julio de 2005, Google adquirió Android Inc., una pequeña compañía de Palo Alto, California fundada en Entre los cofundadores de Android que se fueron a trabajar a Google están Andy Rubin (co-fundador de Danger), Rich Miner (co-fundador de Wildfire Communications, Inc.), Nick Sears (alguna vez VP en T-Mobile), y Chris White (quien encabezó el diseño y el desarrollo de la interfaz en WebTV). En aquel entonces, poco se sabía de las funciones de Android Inc. fuera de que desarrollaban software para teléfonos móviles. Esto dio pie a rumores de que Google estaba planeando entrar en el mercado de los teléfonos móviles. La arquitectura Android está formada por varias capas que facilitan al desarrollador la creación de aplicaciones. Además, esta distribución permite acceder a las capas más bajas mediante el uso de librerías para que así el desarrollador no tenga que programar a bajo nivel las funcionalidades necesarias para que una aplicación haga uso de los componentes de hardware de los teléfonos. 45

46 Cada una de las capas utiliza elementos de la capa inferior para realizar sus funciones, es por ello que a este tipo de arquitectura se le conoce también como pila. Para un mejor entendimiento, a continuación se muestra el diagrama de la arquitectura de Android. En la figura 9.22 se muestra un diagrama de la Arquitectura del sistema operativo Android. Figura 9.22 Diagrama de Arquitectura Android Kernel de Linux. El núcleo del sistema operativo Android está basado en el kernel de Linux versión 2.6, similar al que puede incluir cualquier distribución 46

47 de Linux, como Ubuntu, solo que adaptado a las características del hardware en el que se ejecutará Android, es decir, para dispositivos móviles. El núcleo actúa como una capa de abstracción entre el hardware y el resto de las capas de la arquitectura. El desarrollador no accede directamente a esta capa, sino que se deben utilizar las librerías disponibles en capas superiores. De esta forma también se evitara el hecho de quebrarse la cabeza para conocer las características precisas de cada teléfono. Si necesitamos hacer uso de la cámara, el sistema operativo se encarga de utilizar la que incluya el teléfono, sea cual sea. Para cada elemento de hardware del teléfono existe un controlador (o driver) dentro del kernel que permite utilizarlo desde el software. El kernel también se encarga de gestionar los diferentes recursos del teléfono (energía, memoria, etc.) y del sistema operativo en sí: procesos, elementos de comunicación (networking), etc. Librerías. La siguiente capa que se sitúa justo sobre el kernel, la componen las bibliotecas nativas de Android, también llamadas librerías. Están escritas en C o C++ y compiladas para la arquitectura hardware específica del teléfono. Estas normalmente están hechas por el fabricante, quien también se encarga de instalarlas en el dispositivo antes de ponerlo a la venta. El objetivo de las librerías es proporcionar funcionalidad a las aplicaciones para tareas que se 47

48 repiten con frecuencia, evitando tener que codificarlas cada vez y garantizando que se llevan a cabo de la forma más eficiente. Entre las librerías incluidas habitualmente se encuentran OpenGL (motor gráfico), Bibliotecas multimedia (formatos de audio, imagen y video), Webkit (navegador), SSL (cifrado de comunicaciones), FreeType (fuentes de texto), SQLite (base de datos), entre otras. Entorno de ejecución. El entorno de ejecución de Android no se considera una capa en sí mismo, dado que también está formado por librerías. Aquí se encuentran las librerías con las funcionalidades habituales de Java así como otras específicas de Android. El componente principal del entorno de ejecución de Android es la máquina virtual Dalvik. Las aplicaciones se codifican en Java y son compiladas en un formato específico para que esta máquina virtual las ejecute. La ventaja de esto es que las aplicaciones se compilan una única vez y de esta forma estarán listas para distribuirse con la total garantía de que podrán ejecutarse en cualquier dispositivo Android que disponga de la versión mínima del sistema operativo que requiera la aplicación. Cabe aclarar que Dalvik es una variación de la máquina virtual de Java, por lo que no es compatible con el bytecode Java. Java se usa únicamente como lenguaje de programación, y los ejecutables que se generan con el SDK 48

49 de Android tienen la extensión.dex que es específico para Dalvik, y por ello no podemos correr aplicaciones Java en Android ni viceversa. Framework de aplicaciones. La siguiente capa está formada por todas las clases y servicios que utilizan directamente las aplicaciones para realizar sus funciones. La mayoría de los componentes de esta capa son librerías Java que acceden a los recursos de las capas anteriores a través de la máquina virtual Dalvik. Siguiendo el diagrama se puede 49odrán49ar: 1. Activity Manager. Se encarga de administrar la pila de actividades de nuestra aplicación así como su ciclo de vida. 2. Windows Manager. Se encarga de organizar lo que se mostrará en pantalla. Básicamente crea las superficies en la pantalla que posteriormente pasarán a ser ocupadas por las actividades. 3. Content Provider. Esta librería es muy interesante porque crea una capa que encapsula los datos que se compartirán entre aplicaciones para tener control sobre cómo se accede a la información. 4. Views. En Android, las vistas los elementos que nos ayudarán a construir las interfaces de usuario: botones, cuadros de texto, listas y hasta elementos más avanzados como un navegador web o un visor de Google Maps. 5. Notification Manager. Engloba los servicios para notificar al usuario cuando algo requiera su atención mostrando alertas en la barra de estado. Un dato 49

50 importante es que esta biblioteca también permite jugar con sonidos, activar el vibrador o utilizar los LEDs del teléfono en caso de tenerlos. 6. Package Manager. Esta biblioteca permite obtener información sobre los paquetes instalados en el dispositivo Android, además de gestionar la instalación de nuevos paquetes. Con paquete se refiere a la forma en que se distribuyen las aplicaciones Android, estos contienen el archivo.apk, que a su vez incluyen los archivos.dex con todos los recursos y archivos adicionales que necesite la aplicación, para facilitar su descarga e instalación. 7. Telephony Manager. Con esta librería se 50odrán realizar llamadas o enviar y recibir SMS/MMS, aunque no permite 50odrán50ar o eliminar la actividad que se muestra cuando una llamada está en curso. 8. Resource Manager. Con esta librería se 50odrán gestionar todos los elementos que forman parte de la aplicación y que están fuera del código, es decir, cadenas de texto traducidas a diferentes idiomas, imágenes, sonidos o layouts. 9. Location Manager. Permite determinar la posición geográfica del dispositivo Android mediante GPS o redes disponibles y trabajar con mapas. 10. Sensor Manager. Permite manipular los elementos de hardware del teléfono como el acelerómetro, giroscopio, sensor de luminosidad, sensor de campo magnético, brújula, sensor de presión, sensor de proximidad, sensor de temperatura, etc. 50

51 11. Cámara. Con esta librería se puede hacer uso de la(s) cámara(s) del dispositivo para tomar fotografías o para grabar vídeo. 12. Multimedia. Permiten reproducir y visualizar audio, vídeo e imágenes en el dispositivo. Aplicaciones. En la última capa se incluyen todas las aplicaciones del dispositivo, tanto las que tienen interfaz de usuario como las que no, las nativas (programadas en C o C++) y las administradas (programadas en Java), las que vienen preinstaladas en el dispositivo y aquellas que el usuario ha instalado. En esta capa encontramos también la aplicación principal del sistema: Inicio (Home) o lanzador (launcher), porque es la que permite ejecutar otras aplicaciones mediante una lista y mostrando diferentes escritorios donde se pueden colocar accesos directos a aplicaciones o incluso widgets, que son también aplicaciones de esta capa. El potencial de Android se sitúa en el control total que se le da al usuario para que haga de su teléfono un dispositivo a su medida. Una vez vista la arquitectura, empezaremos con lo fundamental para desarrollar una aplicación: Los Componentes Principales de Android. Los componentes 51

52 básicos de una aplicación son: activities, intents, views, services, content providers y broadcast receivers. Si el usuario domina bien estos términos puede saltar directo al código. En La figura 9.23 se puede observar los componentes antes mencionados. Figura 9.23 Componentes Principales Activities: son componentes de la interfaz que corresponde a una pantalla. Podemos visualizarlo como un mazo de cartas en el que tenemos varias cartas pero solamente una está hasta arriba. Una aplicación para una lista de cosas por hacer puede tener una actividad para ingresar las cosas por hacer y otra actividad para mostrar el listado, en conjunto estas actividades conforman la aplicación. Content Providers: representan la abstracción para almacenar y obtener datos permanentes e incluso entre aplicaciones diferentes. El sistema incluye algunos proveedores de contenido útiles (audio, video, etc) y además pueden desarrollarse nuevos. Services: son componentes que ejecutan operaciones en segundo plano y no tienen una interfaz de usuario. Por ejemplo, al escuchar música, hay un 52

53 servicio encargado de la reproducción que se ejecuta de fondo y la aplicación que manipulamos le manda mensajes a este servicio diciéndole que se detenga, pause o reproduzca la siguiente canción. Interfaces: son los componentes de la interfaz de usuario, diferentes vistas pueden agruparse a través de grupos logrando una jerarquía, esto se logra a través de la disposición de los componentes a través de un archivo XML. Broadcast Receivers: son componentes que responden a avisos y anuncios de difusión (broadcast). Estos avisos provienen del sistema (batería baja, una llamada entrante, etc) y de aplicaciones (pasando avisos de una aplicación a otra). Aun que no muestran una interfaz de usuario algunas veces utilizan barras de progreso para mostrar avances. Estos se activan a través de mensajes asincrónicos llamados intents (mencionados arriba). Resources: Son recursos tales como imágenes y cadenas en el código de aplicación, de modo que se pueda mantener de forma independiente. La externalización de los recursos también permite proporcionar recursos alternativos que soportan configuraciones de dispositivos específicos, como idiomas o tamaños de pantalla, que se convierte cada vez más importante a medida que surgen más dispositivos con Android disponible con diferentes configuraciones. 53

54 Intents: Son mensajes que provocan notificaciones o cambios de estatus, que al ser recibidos por actividades o servicios pueden levantar procesos. De esta forma se unen componentes dentro de la misma aplicación o de diferentes aplicaciones. Broadcast-Intent: Transmitir mensajes entre los componentes con el método sendbroadcast y hace una aplicación más abierta, mediante la difusión de las aplicaciones actuales y otras. Intent-Filter: Para informar al sistema de las intenciones implícitas que puede manejar el sistema ya sea: actividades, servicios y receptores de radiodifusión que pueden tener uno o más filtros de intención. Cada filtro se describe como capacidad del componente y un conjunto de intentos que el componente está dispuesto a recibir. En efecto, los filtros son las intenciones de un tipo deseado, filtrando los intentos no deseados. Manifest: El archivo AndroidManifest.xml es donde se configura la aplicación, se agregan actividades, se asignan permisos, etc. 54

55 9.3 Conceptos Generales Para poder comprender cómo se construye una aplicación Android, se conocerá un poco la estructura general de un proyecto. Cuando se crea un nuevo proyecto Android en Eclipse se genera automáticamente la estructura de carpetas necesaria para poder generar posteriormente la aplicación. Esta estructura será común a cualquier aplicación, independientemente de su tamaño y complejidad. En la figura 9.24 se visualizan los elementos creados inicialmente para un nuevo proyecto Android: Figura 9.24 Elementos que componen un Proyecto Carpeta /src/ Contiene todo el código fuente de la aplicación, código de la interfaz gráfica, clases auxiliares, etc. Inicialmente, Eclipse creará el código básico de la pantalla (Activity) principal de la aplicación, siempre bajo la estructura del paquete java definido como se muestra en la figura

56 Figura 9.25 Carpeta src Carpeta /res/ Contiente todos los ficheros de recursos necesarios para el proyecto: imágenes, vídeos, cadenas de texto, etc. Los diferentes tipos de recursos que se deberán distribuir entre las siguientes carpetas: /res/drawable/. Contienen las imágenes de la aplicación. Se puede dividir en /drawable-ldpi, /drawable-mdpi y /drawable-hdpi para utilizar diferentes recursos dependiendo de la resolución del dispositivo. /res/layout/. Contienen los ficheros de definición de las diferentes pantallas de la interfaz gráfica. Se puede dividir en /layout y /layout-land para definir distintos layouts dependiendo de la orientación del dispositivo. /res/anim/. Contiene la definición de las animaciones utilizadas por la aplicación. /res/menu/. Contiene la definición de los menús de la aplicación. /res/values/. Contiene otros recursos de la aplicación como por ejemplo cadenas de texto (strings.xml), estilos (styles.xml), colores (colors.xml), etc. /res/xml/. Contiene los ficheros XML utilizados por la aplicación. /res/raw/. Contiene recursos adicionales, normalmente en formato distinto a XML, que no se incluyan en el resto de carpetas de recursos. 56

57 Como ejemplo, para un proyecto nuevo Android, se crean los siguientes recursos para la aplicación que se muestran en la figura 9.26: Figura 9.26 Recursos para la Aplicación Carpeta /gen/ Contiene una serie de elementos de código generados automáticamente al compilar el proyecto como se muestra en la figura Cada vez que se genera un proyecto, la maquinaria de compilación de Android genera una serie de ficheros fuente en java dirigido al control de los recursos de la aplicación. 57

58 Figura 9.27 Carpeta gen El más importante es el que se puede observar en la imagen anterior, es el fichero R.java, y la clase R. Esta clase R contendrá en todo momento una serie de constantes con los ID de todos los recursos de la aplicación incluidos en la carpeta /res/, de forma que se puede acceder fácilmente a estos recursos desde nuestro código a través de este dato. Así, por ejemplo, la constante R.drawable.icon contendrá el ID de la imagen icon.png contenida en la carpeta/res/drawable/. Veamos como ejemplo la clase R creada por defecto para un proyecto nuevo: package net.sgoliver; public final class R { public static final class attr { public static final class drawable { public static final int icon=0x7f020000; public static final class layout { public static final int main=0x7f030000; public static final class string { public static final int app_name=0x7f040001; public static final int hello=0x7f040000; 58

59 Carpeta /assets/ Contiene todos los demás ficheros auxiliares necesarios para la aplicación (y que se incluirán en su propio paquete), como por ejemplo ficheros de configuración, de datos, etc. La diferencia entre los recursos incluidos en la carpeta /res/raw/ y los incluidos en la carpeta /assets/ es que para los primeros se generará un ID en la clase R y se deberá acceder a ellos con los diferentes métodos de acceso a recursos. Para los segundos sin embargo no se generarán ID y se podrá acceder a ellos por su ruta como a cualquier otro fichero del sistema. Se Usara uno u otro según las necesidades de la aplicación. Fichero AndroidManifest.xml Contiene la definición en XML de los aspectos principales de la aplicación, como por ejemplo su identificación (nombre, versión, icono, etc.), sus componentes (pantallas, mensajes, etc.), o los permisos necesarios para su ejecución. Default.Properties Archivo que posee la configuración del proyecto, nunca se debe editar manualmente, para editar las propiedades del proyecto, hay que oprimir el botón derecho de la carpeta del proyecto y seleccionar Properties. 59

60 9.4 Practica Hola Usuario Primeramente se creara la practica clásica Hola Mundo en la cual es solo editar algunas líneas de código que ya viene por default al crear un nuevo proyecto en Android. Para comenzar se creara un nuevo proyecto en Eclipse, en la barra de herramientas se despliega el menú File después nuevamente se despliega el menú New y se selecciona Android Project. En la figura 9.28 se muestra el procedimiento. Seleccionar Proyecto Android Figura 9.28 Elegir la opción de Android Project 60

61 En caso de que en el menú New no aparezca la opción de Android Project, se escogerá la opción Other, se abre una ventana con varias opciones y se despliega la carpeta Android y se puede observar la opción Android Project. En la ventana que se despliega pide poner un nombre de proyecto, esto se observa en la figura Escribir nombre del Proyecto Figura 9.29 Crear proyecto Android 61

62 En la pantalla siguiente se tiene que escoger la plataforma en la que requiere construir el proyecto, en este caso se selecciona Android 2.2. Como se muestra en la figura Escoger el SDK para el Target y Siguiente Figura 9.30 Elegir un SDK En la siguiente pantalla se pide que se tecleen los campos de nombre de la aplicación y el nombre del paquete y finalmente click en Finish. Esto se muestra en la figura

63 Agregar las características del Proyecto Finalizar Figura 9.31 Configurar el nuevo Proyecto Android Una vez creado el proyecto se puede observar, que se creó código que ya viene por default, algunos archivos.java y otros.xml que se encuentran dentro de las carpetas anteriormente descritas En la figura 9.32 se muestra la pantalla con código java y un lado aparecen todas las carpetas en donde se guardan estos archivos java y xml. 63

64 Figura 9.32 Código Java y carpetas generadas A continuación se muestra el código fuente de cada uno de los archivos java y xml y en la cual se realizara la primera practica. Practica 1: HelloWorldActivity.java package pablo.davila.hello.world; import android.app.activity; import android.os.bundle; public class HelloWorldActivity extends Activity { public void oncreate(bundle savedinstancestate) { super.oncreate(savedinstancestate); setcontentview(r.layout.main); 64

65 R.java package pablo.davila.hello.world; public final class R { public static final class attr { public static final class drawable { public static final int ic_launcher=0x7f020000; public static final class layout { public static final int main=0x7f030000; public static final class string { public static final int app_name=0x7f040001; public static final int hola=0x7f040000; Main.xml <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android=" android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="vertical" > <TextView android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="@string/hola" /> </LinearLayout> 65

66 strings.xml <?xml version="1.0" encoding="utf-8"?> <resources> <string name="hola">hola Mundo, Hola mundo desde Android!</string> <string name="app_name">holamundo</string> </resources> HelloWorldManifest.xml <?xml version="1.0" encoding="utf-8"?> <manifest xmlns:android=" package="pablo.davila.hello.world" android:versioncode="1" android:versionname="1.0" > <uses-sdk android:minsdkversion="8" /> <application > <activity android:name=".helloworldactivity" > <intent-filter> <action android:name="android.intent.action.main" /> <category android:name="android.intent.category.launcher" /> </intent-filter> </activity> </application> </manifest> 66

67 Finalmente este es resultado de la primera práctica y además clásica de todos los lenguajes el Hola Mundo y que se muestra en la figura Figura 9.33 Hola Mundo desde Android Ahora se comenzara una siguiente practica parecida a la de Hola mundo pero con algunas modificaciones A continuación se muestra el código fuente de esta aplicación. 67

68 Practica 2: HolaUsuarioActivity.java package mx.com.tesis.usuario.edu; import android.app.activity; import android.content.intent; import android.os.bundle; import android.view.view; import android.view.view.onclicklistener; import android.widget.button; import android.widget.edittext; public class HolaUsuarioActivity extends Activity { private EditText txtnombre; private Button public void oncreate(bundle savedinstancestate) { super.oncreate(savedinstancestate); setcontentview(r.layout.main); txtnombre = (EditText)findViewById(R.id.txtNombre); btnenviar = (Button)findViewById(R.id.btnHola); btnenviar.setonclicklistener(new OnClickListener() public void onclick(view v) { // TODO Auto-generated method stub Intent intent = new Intent(HolaUsuarioActivity.this, MensajeSaludo.class); Bundle bundle = new Bundle(); bundle.putstring("nombre", txtnombre.gettext().tostring()); intent.putextras(bundle); startactivity(intent); ); 68

69 MensajeSaludo.java package mx.com.tesis.usuario.edu; import android.app.activity; import android.os.bundle; import android.widget.textview; public class MensajeSaludo extends Activity{ private TextView txtview; public void oncreate(bundle savedinstancestate) { super.oncreate(savedinstancestate); setcontentview(r.layout.saludo_mensaje); txtview = (TextView)findViewById(R.id.txtMensaje); Bundle bundle = getintent().getextras(); txtview.settext("hola " + bundle.getstring("nombre")); R.java package mx.com.tesis.usuario.edu; public final class R { public static final class attr { public static final class drawable { public static final int ic_launcher=0x7f020000; public static final class id { public static final int btnhola=0x7f050001; public static final int txtmensaje=0x7f050002; public static final int txtnombre=0x7f050000; public static final class layout { public static final int main=0x7f030000; public static final int saludo_mensaje=0x7f030001; public static final class string { public static final int app_name=0x7f040002; public static final int enviar=0x7f040001; public static final int escribe_nombre=0x7f040000; 69

70 main.xml <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android=" android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="vertical" > <TextView android:layout_width="fill_parent" android:layout_height="wrap_content" /> <EditText android:layout_width="fill_parent" android:layout_height="wrap_content" /> <Button android:layout_width="wrap_content" android:layout_height="wrap_content" /> </LinearLayout> saludo_mensaje.xml <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android=" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" > <TextView android:layout_width="fill_parent" android:layout_height="wrap_content"/> </LinearLayout> 70

71 strings.xml <?xml version="1.0" encoding="utf-8"?> <resources> <string name="escribe_nombre">escribe tu nombre:</string> <string name="enviar">enviar</string> <string name="app_name">holausuario</string> </resources> AndroidManifest.xml <?xml version="1.0" encoding="utf-8"?> <manifest xmlns:android=" package="mx.com.tesis.usuario.edu" android:versioncode="1" android:versionname="1.0" > <uses-sdk android:minsdkversion="8" /> <application > <activity android:name=".holausuarioactivity" > <intent-filter> <action android:name="android.intent.action.main" /> <category android:name="android.intent.category.launcher" /> </intent-filter> </activity> <activity android:name=".mensajesaludo"></activity> </application> </manifest> 71

72 En la figura 9.34, se muestra la primera pantalla en la ejecución del programa, en la cual pide que se escriba el nombre del usuario. Figura 9.34 Pantalla Escribir nombre En la figura 9.35 se muestra la pantalla de respuesta al oprimir el botón de Enviar, lo cual es la cadena de texto concatenado con la palabra Hola. 72

73 Figura 9.35 Pantalla de respuesta del botón Enviar 73

74 9.5 Uso de Layouts 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. 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 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). 74

75 Para que quede más claro el tema de FrameLayout se realizaran algunas prácticas sencillas que ayudaran a comprender mejor este argumento. Practica 3: FrameP1Activity.java package mx.frame.layout.pract1; import android.app.activity; import android.os.bundle; public class FrameP1Activity extends Activity public void oncreate(bundle savedinstancestate) { super.oncreate(savedinstancestate); setcontentview(r.layout.main); R.java package mx.frame.layout.pract1; public final class R { public static final class attr { public static final class drawable { public static final int ic_launcher=0x7f020000; public static final class layout { public static final int main=0x7f030000; public static final class string { public static final int app_name=0x7f040002; public static final int boton=0x7f040001; public static final int frame=0x7f040000; 75

76 main.xml <?xml version="1.0" encoding="utf-8"?> <FrameLayout xmlns:android=" android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="vertical" > <EditText android:layout_width="fill_parent" android:layout_height="wrap_content"/> </FrameLayout> AndroidManifest.xml <?xml version="1.0" encoding="utf-8"?> <manifest xmlns:android=" package="mx.frame.layout.pract1" android:versioncode="1" android:versionname="1.0" > <uses-sdk android:minsdkversion="8" /> <application > <activity android:name=".framep1activity" > <intent-filter> <action android:name="android.intent.action.main" /> <category android:name="android.intent.category.launcher" /> </intent-filter> </activity> </application> </manifest> 76

77 En la figura 9.36 se muestra el primer ejemplo de un FrameLayout. Figura 9.36 Caja de texto en FrameLayout Ahora se realizara una práctica en la que se puede observar que se tiene el ImageView y el TextView para llenar la matriz (fill) en el diseño tanto horizontal como vertical. La gravedad especifica dónde aparece el texto dentro de su contenedor, en este caso esta en el centro. Si no se hubiera creado una gravedad, el texto habría aparecido en la parte superior izquierda de la pantalla. 77

78 Practica 4: FrameP2Activity.java package mx.frame.layout.practica2; import android.app.activity; import android.os.bundle; public class FrameP2Activity extends Activity { /** Called when the activity is first created. public void oncreate(bundle savedinstancestate) { super.oncreate(savedinstancestate); setcontentview(r.layout.main); R.java package mx.frame.layout.practica2; public final class R { public static final class attr { public static final class drawable { public static final int ic_launcher=0x7f020000; public static final class layout { public static final int main=0x7f030000; public static final class string { public static final int app_name=0x7f040001; public static final int texto=0x7f040000; 78

79 main.xml <?xml version="1.0" encoding="utf-8"?> <FrameLayout xmlns:android=" android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="vertical" > <ImageView android:scaletype="fitcenter" android:layout_height="fill_parent" android:layout_width="fill_parent"/> <TextView android:textsize="24sp" android:textcolor="#000000" android:layout_height="fill_parent" android:layout_width="fill_parent" android:gravity="center"/> </FrameLayout> strings.xml <?xml version="1.0" encoding="utf-8"?> <resources> <string name="texto">segunda Practica con FrameLayout</string> <string name="app_name">framelayoutp2</string> </resources> 79

80 AndroidManifest.xml <?xml version="1.0" encoding="utf-8"?> <manifest xmlns:android=" package="mx.frame.layout.practica2" android:versioncode="1" android:versionname="1.0" > <uses-sdk android:minsdkversion="8" /> <application > <activity android:name=".framep2activity" > <intent-filter> <action android:name="android.intent.action.main" /> <category android:name="android.intent.category.launcher" /> </intent-filter> </activity> </application> </manifest> En la figura 9.37 se muestra el resultado ya con el código ejecutado en el simulador, el texto de: Segunda Practica con FrameLayout anteponiéndose a una imagen guardada en una de las carpetas que se encuentran dentro de res. 80

81 Figura 9.37 Imagen y texto en un FrameLayout Para concluir, este layout consiste en un marco que ocupa toda la pantalla, y donde los controles se dispondrán a partir de la esquina superior izquierda, por lo que es probable que haya elementos que se queden ocultos detrás de otros. 81

82 LinearLayout El siguiente layout Android en cuanto a nivel de complejidad es el LinearLayout. Este layout apila uno tras otro 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, se tendrá otro parámetro con el que jugar, la propiedad android:layout_weight. Esta propiedad permite 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 se incluye en un LinearLayout vertical dos cuadros de texto (EditText) y a uno de ellos se le establece un layout_weight= 1 y al otro un layout_weight= 2 se conseguirá 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. Así pues, a pesar de la simplicidad aparente de este layout resulta ser lo suficiente versátil como para ser de utilidad en muchas ocasiones. 82

83 Ahora se realizara una práctica con LinearLayout en la cual se visualizan tres componentes: dos EditText y un Boton. Practica 5 LinearP1Activity.java package mx.linear.layout.pract1; import android.app.activity; import android.os.bundle; public class LinearP1Activity extends Activity public void oncreate(bundle savedinstancestate) { super.oncreate(savedinstancestate); setcontentview(r.layout.main); R.java package mx.linear.layout.pract1; public final class R { public static final class attr { public static final class drawable { public static final int ic_launcher=0x7f020000; public static final class layout { public static final int main=0x7f030000; public static final class string { public static final int app_name=0x7f040003; public static final int dos=0x7f040002; public static final int texto=0x7f040000; public static final int uno=0x7f040001; 83

84 main.xml <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android=" android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="vertical" > <EditText android:layout_width="fill_parent" android:layout_height="fill_parent" android:layout_weight="2" /> <EditText android:layout_width="fill_parent" android:layout_height="fill_parent" android:layout_weight="2" /> <Button android:layout_width="fill_parent" android:layout_height="fill_parent" android:layout_weight="2"/> </LinearLayout> strings.xml <?xml version="1.0" encoding="utf-8"?> <resources> <string name="texto">boton</string> <string name="uno">uno..</string> <string name="dos">dos..</string> <string name="app_name">linearlayoutp1</string> </resources> 84

85 AndroidManifest.xml <?xml version="1.0" encoding="utf-8"?> <manifest xmlns:android=" package="mx.linear.layout.pract1" android:versioncode="1" android:versionname="1.0" > <uses-sdk android:minsdkversion="8" /> <application > <activity android:name=".linearp1activity" > <intent-filter> <action android:name="android.intent.action.main" /> <category android:name="android.intent.category.launcher" /> </intent-filter> </activity> </application> </manifest> En la figura 9.38 se muestra el resultado de la primera práctica con el LinearLayout donde se muestra un componente abajo del otro y prácticamente con las mismas dimensiones cada uno de ellos. 85

86 Figura 9.38 Resultado de la primera practica con LinearLayout En la siguiente practica se realizara un LinearLayout solo que sustituyendo una de sus propiedades la cual es: android:layout_weight por android:width la cual permitirá implementar la dimensión de cada uno de los componentes que se requiera usar o al que se le desee modificar sus dimensiones. 86

87 Practica 6 LinearP2Activity.java package mx.linear.layout.pract2; import android.app.activity; import android.os.bundle; public class LinearP2Activity extends Activity { /** Called when the activity is first created. public void oncreate(bundle savedinstancestate) { super.oncreate(savedinstancestate); setcontentview(r.layout.main); R.java package mx.linear.layout.pract2; public final class R { public static final class attr { public static final class drawable { public static final int ic_launcher=0x7f020000; public static final class layout { public static final int main=0x7f030000; public static final class string { public static final int apellido=0x7f040003; public static final int app_name=0x7f040005; public static final int h_apellido=0x7f040004; public static final int h_nombre=0x7f040002; public static final int nombre=0x7f040001; public static final int siguiente=0x7f040000; 87

88 main.xml <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android=" android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="vertical" > <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" /> <EditText android:width="150dp" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" /> <EditText android:width="150dp" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <Button android:layout_width="wrap_content" android:layout_height="wrap_content" /> </LinearLayout> strings.xml <?xml version="1.0" encoding="utf-8"?> <resources> <string name="siguiente">siguiente</string> <string name="nombre">nombre:</string> <string name="h_nombre">nombre..</string> <string name="apellido">apellido:</string> <string name="h_apellido">apellido..</string> <string name="app_name">linearlayoutp2</string> </resources> 88

89 AndroidManifest.xml <?xml version="1.0" encoding="utf-8"?> <manifest xmlns:android=" package="mx.linear.layout.pract2" android:versioncode="1" android:versionname="1.0" > <uses-sdk android:minsdkversion="8" /> <application > <activity android:name=".linearp2activity" > <intent-filter> <action android:name="android.intent.action.main" /> <category android:name="android.intent.category.launcher" /> </intent-filter> </activity> </application> </manifest> En la figura 9.39 se muestra la ejecución de la segunda práctica con el LinearLayout, en el que se muestra un pequeño formulario de tan solo dos campos y utilizando la propiedad android:width. 89

90 Figura 9.39 Ejecución de la segunda practica con LinearLayout 90

91 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 (como untablecolumn) 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 TableRow insertados, 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: 91

92 android: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:shrinkcolumns. Indicará las columnas que se pueden contraer para dejar espacio al resto de columnas que se puedan salir por la derecha de la palntalla. android: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. 92

93 Practica 7 TableP3Activity.java package mx.table.layout.pract1; import android.app.activity; import android.os.bundle; public class TableP3Activity extends Activity { /** Called when the activity is first created. public void oncreate(bundle savedinstancestate) { super.oncreate(savedinstancestate); setcontentview(r.layout.main); R.java package mx.table.layout.pract1; public final class R { public static final class attr { public static final class drawable { public static final int ic_launcher=0x7f020000; public static final class layout { public static final int main=0x7f030000; public static final class string { public static final int app_name=0x7f040005; public static final int celda1_1=0x7f040000; public static final int celda1_2=0x7f040001; public static final int celda2_1=0x7f040002; public static final int celda2_2=0x7f040003; public static final int celda3=0x7f040004; 93

94 main.xml <?xml version="1.0" encoding="utf-8"?> <TableLayout xmlns:android=" android:layout_width="fill_parent" android:layout_height="fill_parent" android:stretchcolumns="1" > <TableRow> <TextView <TextView /> </TableRow> strings.xml <TableRow> <TextView /> <TextView /> </TableRow> <TableRow> <EditText android:layout_span="2"/> </TableRow> </TableLayout> <?xml version="1.0" encoding="utf-8"?> <resources> <string name="celda1_1">celda 1.1</string> <string name="celda1_2">celda 1.2</string> <string name="celda2_1">celda 2.1</string> <string name="celda2_2">celda 2.2</string> <string name="celda3">celda 3</string> <string name="app_name">tablelayoutp3</string> </resources> </TableLayout> 94

95 AndroidManifest.xml <?xml version="1.0" encoding="utf-8"?> <manifest xmlns:android=" package="mx.table.layout.pract1" android:versioncode="1" android:versionname="1.0" > <uses-sdk android:minsdkversion="8" /> <application > <activity android:name=".tablep3activity" > <intent-filter> <action android:name="android.intent.action.main" /> <category android:name="android.intent.category.launcher" /> </intent-filter> </activity> </application> </manifest> Ahora se muestra el resultado de la practica con TableLayout en donde se muestran tres filas con dos columnas y la implementación de las propiedades android:layout_span="2 y android:stretchcolumns="1". 95

96 Figura 9.40 Primera practica con TableLayout En la siguiente práctica se muestra un layout mas detallado de un TableLayout ya que se compone de cinco filas y diferentes componenetes distribuidos en tres columnas e incluso una propiedad nueva la cual es <View android:layout_height="2dip" android:background="#ff0000" />. Esta propiedad permitirá dibujar una línea de color rojo en el lugar donde se indique en el Layout. 96

97 Practica 8 TableP2Activity.java import android.app.activity; import android.os.bundle; public class TableP2Activity extends Activity { /** Called when the activity is first created. public void oncreate(bundle savedinstancestate) { super.oncreate(savedinstancestate); setcontentview(r.layout.main); R.java package mx.table.layout.pract2; public final class R { public static final class attr { public static final class drawable { public static final int ic_launcher=0x7f020000; public static final class layout { public static final int main=0x7f030000; public static final class string { public static final int app_name=0x7f040008; public static final int columna1_1=0x7f040000; public static final int columna1_2=0x7f040001; public static final int columna1_y_2=0x7f040002; public static final int columna2_1=0x7f040003; public static final int columna2_2=0x7f040004; public static final int columna2_3=0x7f040005; public static final int columna3=0x7f040006; public static final int columna4=0x7f040007; 97

98 main.xml <?xml version="1.0" encoding="utf-8"?> <TableLayout xmlns:android=" android:layout_width="fill_parent" android:layout_height="fill_parent"> <!-- 2 columnas --> <TableRow android:layout_width="wrap_content" android:layout_height="wrap_content" android:padding="5dip" > <TextView android:text="@string/columna1_1" android:textappearance="?android:attr/textappearancelarge" /> <Button android:text="@string/columna1_2" /> </TableRow> <!-- edittext span 2 columnas --> <TableRow android:layout_width="wrap_content" android:layout_height="wrap_content" android:padding="5dip" > <EditText android:layout_span="2" android:hint="@string/columna1_y_2" /> </TableRow> <!-- Dibuja una linea roja --> <View android:layout_height="2dip" android:background="#ff0000" /> <!-- 3 columnas --> <TableRow android:layout_width="wrap_content" android:layout_height="wrap_content" android:padding="5dip" > 98

99 <TextView android:textappearance="?android:attr/textappearancelarge" /> <Button /> <Button /> </TableRow> <!-- Desplegar este boton en la 3rd columna via layout_column --> <TableRow android:layout_width="wrap_content" android:layout_height="wrap_content" android:padding="5dip" > <Button android:layout_column="2" /> </TableRow> <!-- Desplegar este boton en la 2nd columna via layout_column --> <TableRow android:layout_width="wrap_content" android:layout_height="wrap_content" android:padding="5dip" > <Button android:layout_column="1" /> </TableRow> </TableLayout> 99

100 strings.xml <?xml version="1.0" encoding="utf-8"?> <resources> <string name="columna1_1">columna 1</string> <string name="columna1_2">columna 2</string> <string name="columna1_y_2">columna 1 y 2</string> <string name="columna2_1">columna 1</string> <string name="columna2_2">columna 2</string> <string name="columna2_3">columna 3</string> <string name="columna3">columna 3</string> <string name="columna4">columna 2</string> <string name="app_name">tablelayoutp2</string> </resources> AndroidManifest.xml <?xml version="1.0" encoding="utf-8"?> <manifest xmlns:android=" package="mx.table.layout.pract2" android:versioncode="1" android:versionname="1.0" > <uses-sdk android:minsdkversion="8" /> <application android:icon="@drawable/ic_launcher" android:label="@string/app_name" > <activity android:name=".tablep2activity" 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> 100

101 Figura 9.41 Segunda practica con TableLayout Para concluir este tema, el TableLayout es un modelo de organización basado en una implementacion con tablas. El diseño se organiza en filas (elemento TableRow) y dentro de cada fila, pondremos los elementos. 101

102 RelativeLayout El último tipo de layout que se va 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 elemento X se puede indicar por ejemplo que debe colocarse debajo del elemento Y y alineado a la derecha del layout padre. En un RelativeLayout se encuentran un sinfín de propiedades para colocar cada control justo donde se requiera. Estas son las principales propiedades tanto del RelativeLayout como para otros Layouts: 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. 102

103 android:layout_alignparentbottom. android:layout_centerhorizontal. android:layout_centervertical. android:layout_centerinparent. 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. 103

104 Practica 9 RelativeP1Activity.java package mx.relative.layout.pract1; import android.app.activity; import android.os.bundle; public class RelativeP1Activity extends Activity { /** Called when the activity is first created. public void oncreate(bundle savedinstancestate) { super.oncreate(savedinstancestate); setcontentview(r.layout.main); R.java package mx.relative.layout.pract1; public final class R { public static final class attr { public static final class drawable { public static final int ic_launcher=0x7f020000; public static final class id { public static final int BtnAceptar=0x7f050001; public static final int TxtNombre=0x7f050000; public static final class layout { public static final int main=0x7f030000; public static final class string { public static final int app_name=0x7f040002; public static final int enviar=0x7f040001; public static final int escribir=0x7f040000; 104

105 main.xml <?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android=" android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="vertical" > <EditText android:layout_width="fill_parent" android:layout_height="wrap_content" /> <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignparentleft="true" /> </RelativeLayout> strings.xml <?xml version="1.0" encoding="utf-8"?> <resources> <string name="escribir">escribir..</string> <string name="enviar">enviar</string> <string name="app_name">relativelayoutp1</string> </resources> 105

106 AndroidManifest.xml <?xml version="1.0" encoding="utf-8"?> <manifest xmlns:android=" package="mx.relative.layout.pract1" android:versioncode="1" android:versionname="1.0" > <uses-sdk android:minsdkversion="8" /> <application > <activity android:name=".relativep1activity" > <intent-filter> <action android:name="android.intent.action.main" /> <category android:name="android.intent.category.launcher" /> </intent-filter> </activity> </application> </manifest> En la figura 9.42 se muestra el resultado de la primera practica que se realizo con RelativeLayout con solo algunas de las propiedades con las que cuenta este. 106

107 Figura 9.42 Primera Práctica con RelativeLayout En la siguiente práctica con RelativeLayout se usaran más de las propiedades que se pueden implementar para este layout. Se detalla un poco más este concepto de los RelativeLayout ya que contiene más componentes y más propiedades que la practica anterior. 107

108 Practica 10 RelativeP2Activity.java package mx.relative.layout.pract2; import android.app.activity; import android.os.bundle; public class RelativeP2Activity extends Activity { /** Called when the activity is first created. public void oncreate(bundle savedinstancestate) { super.oncreate(savedinstancestate); setcontentview(r.layout.main); R.java public final class R { public static final class attr { public static final class drawable { public static final int ic_launcher=0x7f020000; public static final class id { public static final int btnbutton1=0x7f050000; public static final int btnbutton2=0x7f050001; public static final int btnbutton3=0x7f050002; public static final int btnsubmit=0x7f050005; public static final int edittext1=0x7f050004; public static final int textview1=0x7f050003; public static final class layout { public static final int main=0x7f030000; 108

109 public static final class string { public static final int app_name=0x7f040006; public static final int boton1=0x7f040000; public static final int boton2=0x7f040001; public static final int boton3=0x7f040002; public static final int name=0x7f040004; public static final int send=0x7f040005; public static final int user=0x7f040003; main.xml <?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android=" android:layout_width="fill_parent" android:layout_height="fill_parent" > <Button android:id="@+id/btnbutton1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/boton1"/> <Button android:id="@+id/btnbutton2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/boton2" android:layout_torightof="@+id/btnbutton1"/> <Button android:id="@+id/btnbutton3" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/boton3" android:layout_below="@+id/btnbutton1"/> 109

110 <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_margintop="94dp" android:textappearance="?android:attr/textappearancelarge" /> <EditText android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignparentright="true" /> <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignparentright="true" /> </RelativeLayout> strings.xml <?xml version="1.0" encoding="utf-8"?> <resources> <string name="boton1">boton 1</string> <string name="boton2">boton 2</string> <string name="boton3">boton 3</string> <string name="user">ususario:</string> 110

111 <string name="name">nombre:</string> <string name="send">enviar</string> <string name="app_name">relativelayoutp2</string> </resources> AndroidManifest.xml <?xml version="1.0" encoding="utf-8"?> <manifest xmlns:android=" package="mx.relative.layout.pract2" android:versioncode="1" android:versionname="1.0" > <uses-sdk android:minsdkversion="8" /> <application > <activity android:name=".relativep2activity" > <intent-filter> <action android:name="android.intent.action.main" /> <category android:name="android.intent.category.launcher" /> </intent-filter> </activity> </application> </manifest> En la figura 9.43 se muestra el resultado de la segunda práctica con RelativeLayout en donde se usan más de las propiedades antes nombradas. 111

112 Figura 9.43 Segunda practica con RelativeLayout 112

113 9.6 Componentes Básicos En esta unidad se comenzara a trabajar con los diferentes controles que pone a disposición la plataforma de desarrollo de este sistema operativo. Se comenzara con los controles más básicos y posteriormente con algunos algo más elaborados. El SDK de Android 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 figura 9.34 se puede observar el aspecto por defecto de estos tres controles. Figura 9.44 Aspecto de los tres botones Control Button Un control de tipo Button es el botón más básico que se puede utilizar. Una de sus principales propiedades es la propiedad android:text. Además de esta propiedad se pueden utilizar muchas otras como el color de fondo (android:background), estilo de fuente (android:typeface), color de fuente (android:textcolor), tamaño de fuente (android:textsize), etc. 113

114 Aunque estos controles pueden lanzar muchos otros eventos, el más común de todos ellos y el que se quiere capturar en la mayoría de las ocasiones es el evento onclick. Para definir la lógica de este evento se tendrá que implementar definiendo un nuevo objetoview.onclicklistener() y asociándolo al botón mediante el método setonclicklistener(). Practica 11 ButtonActivity.java package mx.control.button.pract1; import android.app.activity; import android.os.bundle; import android.view.view; import android.view.view.onclicklistener; import android.widget.button; import android.widget.textview; public class ButtonActivity extends Activity { private TextView text; private Button public void oncreate(bundle savedinstancestate) { super.oncreate(savedinstancestate); setcontentview(r.layout.main); boton = (Button)findViewById(R.id.BtnEnviar); text = (TextView)findViewById(R.id.TextCambia); boton.setonclicklistener(new OnClickListener() public void onclick(view v) { // TODO Auto-generated method stub text.settext("se pulso el boton"); boton.settext("regresar"); ); 114

115 R.java package mx.control.button.pract1; public final class R { public static final class attr { public static final class drawable { public static final int ic_launcher=0x7f020000; public static final class id { public static final int BtnEnviar=0x7f050000; public static final int TextCambia=0x7f050001; public static final class layout { public static final int main=0x7f030000; public static final class string { public static final int app_name=0x7f040002; public static final int hello=0x7f040000; public static final int send=0x7f040001; main.xml <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android=" android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="vertical" > <Button android:id="@+id/btnenviar" android:text="@string/send" android:layout_width="fill_parent" android:layout_height="wrap_content" /> <TextView android:id="@+id/textcambia" android:text="@string/hello" android:layout_width="fill_parent" android:layout_height="wrap_content" /> </LinearLayout> 115

116 strings.xml <?xml version="1.0" encoding="utf-8"?> <resources> <string name="hello">hola</string> <string name="send">enviar</string> <string name="app_name">controlbutton</string> </resources> AndroidManifest.xml <?xml version="1.0" encoding="utf-8"?> <manifest xmlns:android=" package="mx.control.button.pract1" android:versioncode="1" android:versionname="1.0" > <uses-sdk android:minsdkversion="8" /> <application > <activity android:name=".buttonactivity" > <intent-filter> <action android:name="android.intent.action.main" /> <category android:name="android.intent.category.launcher" /> </intent-filter> </activity> </application> </manifest> En la figura 9.45 y 9.46 se muestran el resultado de esta primera práctica con el ControlButton. En donde al oprimir el botón se deshabilita este. 116

117 Figura 9.45 Pantalla antes de oprimir el botón Figura 9.46 Pantalla después de oprimir el botón 117

118 Practica 12 Ahora se realizara una práctica un poco más compleja en donde se manejan varios botones y algunas propiedades nuevas y otras que ya se habían visto. ButtonP2Activity.java import android.app.activity; import android.content.intent; import android.os.bundle; import android.view.view; import android.view.view.onclicklistener; import android.widget.button; public class ButtonP2Activity extends Activity { /** Called when the activity is first created. */ private Button b1; private Button b2; private Button b3; private Button public void oncreate(bundle savedinstancestate) { super.oncreate(savedinstancestate); setcontentview(r.layout.main); addbuttons(); buttonsev(); public void addbuttons() { b1 = (Button)findViewById(R.id.bot1); b2 = (Button)findViewById(R.id.bot2); b3 = (Button)findViewById(R.id.bot3); b4 = (Button)findViewById(R.id.bot4); 118

119 public void buttonsev() { b1.setonclicklistener(new OnClickListener() public void onclick(view v) { // TODO Auto-generated method stub Intent intent = new Intent(ButtonP2Activity.this, BlueActivity.class); startactivity(intent); ); b2.setonclicklistener(new OnClickListener() public void onclick(view v) { // TODO Auto-generated method stub Intent intent = new Intent(ButtonP2Activity.this, RedActivity.class); startactivity(intent); ); b3.setonclicklistener(new OnClickListener() public void onclick(view v) { // TODO Auto-generated method stub Intent intent = new Intent(ButtonP2Activity.this, BlackActivity.class); startactivity(intent); ); b4.setonclicklistener(new OnClickListener() public void onclick(view v) { // TODO Auto-generated method stub Intent intent = new Intent(ButtonP2Activity.this, OrangeActivity.class); startactivity(intent); ); 119

120 BlackActivity.java package mx.control.button.pract2; import android.app.activity; import android.content.intent; import android.os.bundle; import android.view.view; import android.view.view.onclicklistener; import android.widget.button; public class BlackActivity extends Activity { private Button public void oncreate(bundle savedinstancestate) { super.oncreate(savedinstancestate); setcontentview(r.layout.black_layout); btnblack = (Button)findViewById(R.id.bot_reg3); btnblack.setonclicklistener(new OnClickListener() public void onclick(view v) { // TODO Auto-generated method stub Intent intent = new Intent(BlackActivity.this, ButtonP2Activity.class); startactivity(intent); ); Esta es a una de las clases a la cual se va a enviar al oprimir el botón con la etiqueta de Negro y al mismo tiempo el fondo de la pantalla será de este color. 120

121 BlueActivity.java package mx.control.button.pract2; import android.app.activity; import android.content.intent; import android.os.bundle; import android.view.view; import android.view.view.onclicklistener; import android.widget.button; public class BlueActivity extends Activity { private Button btnblue; public void oncreate(bundle savedinstancestate) { super.oncreate(savedinstancestate); setcontentview(r.layout.blue_layout); btnblue = (Button)findViewById(R.id.bot_reg1); btnblue.setonclicklistener(new OnClickListener() public void onclick(view v) { // TODO Auto-generated method stub Intent intent = new Intent(BlueActivity.this, ButtonP2Activity.class); startactivity(intent); ); Esta es a una de las clases a la cual se va a enviar al oprimir el botón con la etiqueta de Azul y al mismo tiempo el fondo de la pantalla será de este color. 121

122 OrangeActivity.java package mx.control.button.pract2; import android.app.activity; import android.content.intent; import android.os.bundle; import android.view.view; import android.view.view.onclicklistener; import android.widget.button; public class OrangeActivity extends Activity { private Button public void oncreate(bundle savedinstancestate) { super.oncreate(savedinstancestate); setcontentview(r.layout.orange_layout); btnorange = (Button)findViewById(R.id.bot_reg4); btnorange.setonclicklistener(new OnClickListener() public void onclick(view v) { // TODO Auto-generated method stub Intent intent = new Intent(OrangeActivity.this, ButtonP2Activity.class); startactivity(intent); ); Esta es a una de las clases a la cual se va a enviar al oprimir el botón con la etiqueta de Naranja y al mismo tiempo el fondo de la pantalla será de este color. 122

123 RedActivity.java package mx.control.button.pract2; import android.app.activity; import android.content.intent; import android.os.bundle; import android.view.view; import android.view.view.onclicklistener; import android.widget.button; public class RedActivity extends Activity { private Button public void oncreate(bundle savedinstancestate) { super.oncreate(savedinstancestate); setcontentview(r.layout.red_layout); btnred = (Button)findViewById(R.id.bot_reg2); btnred.setonclicklistener(new OnClickListener() public void onclick(view v) { // TODO Auto-generated method stub Intent intent = new Intent(RedActivity.this, ButtonP2Activity.class); startactivity(intent); ); Esta es a una de las clases a la cual se va a enviar al oprimir el botón con la etiqueta de Rojo y al mismo tiempo el fondo de la pantalla será de este color. 123

124 R.java package mx.control.button.pract2; public final class R { public static final class attr { public static final class drawable { public static final int ic_launcher=0x7f020000; public static final class id { public static final int bot1=0x7f050002; public static final int bot2=0x7f050003; public static final int bot3=0x7f050004; public static final int bot4=0x7f050005; public static final int bot_reg1=0x7f050001; public static final int bot_reg2=0x7f050007; public static final int bot_reg3=0x7f050000; public static final int bot_reg4=0x7f050006; public static final class layout { public static final int black_layout=0x7f030000; public static final int blue_layout=0x7f030001; public static final int main=0x7f030002; public static final int orange_layout=0x7f030003; public static final int red_layout=0x7f030004; public static final class string { public static final int app_name=0x7f040006; public static final int boton1=0x7f040000; public static final int boton2=0x7f040001; public static final int boton3=0x7f040002; public static final int boton4=0x7f040003; public static final int regresar=0x7f040004; public static final int texto=0x7f040005; 124

125 main.xml <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android=" android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="vertical" android:background="#ffffff" android:gravity="center"> <Button android:layout_width="fill_parent" android:layout_height="wrap_content" /> <Button android:layout_width="fill_parent" android:layout_height="wrap_content" /> <Button android:layout_width="fill_parent" android:layout_height="wrap_content" /> <Button android:layout_width="fill_parent" android:layout_height="wrap_content" /> </LinearLayout> 125

126 black_layout.xml <?xml version="1.0" encoding="utf-8"?> <FrameLayout xmlns:android=" android:layout_width="fill_parent" android:layout_height="fill_parent" android:background="#000000"> <Button android:layout_width="170dp" android:layout_height="wrap_content" /> </FrameLayout> blue_layout.xml <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android=" android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="vertical" android:background="#0000ff"> <Button android:layout_width="fill_parent" android:layout_height="0dp" android:layout_weight="2" /> <TextView android:gravity="center top" android:layout_width="fill_parent" android:layout_height="0dp" android:layout_weight="2"/> </LinearLayout> 126

127 orange_layout.xml <?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android=" android:layout_width="fill_parent" android:layout_height="fill_parent" android:background="#ff4500"> <TextView android:layout_width="fill_parent" android:layout_height="wrap_content" android:textcolor="#000000" /> <Button android:layout_width="fill_parent" android:layout_height="wrap_content" /> </RelativeLayout> red_layout.xml <?xml version="1.0" encoding="utf-8"?> <TableLayout xmlns:android=" android:layout_width="fill_parent" android:layout_height="fill_parent" android:stretchcolumns="1" android:background="#ff0000"> <TableRow android:gravity="center" android:background="#ff0000"> <Button android:layout_width="fill_parent" android:layout_height="wrap_content" </TableRow> </TableLayout> 127

128 strings.xml <?xml version="1.0" encoding="utf-8"?> <resources> <string name="boton1">azul</string> <string name="boton2">rojo</string> <string name="boton3">negro</string> <string name="boton4">naranja</string> <string name="regresar">regresar</string> <string name="texto">boton</string> <string name="app_name">controlbuttonp2</string> </resources> AndroidManifest.xml <?xml version="1.0" encoding="utf-8"?> <manifest xmlns:android=" package="mx.control.button.pract2" android:versioncode="1" android:versionname="1.0" > <uses-sdk android:minsdkversion="8" /> <application > <activity android:name=".buttonp2activity" > <intent-filter> <action android:name="android.intent.action.main" /> <category android:name="android.intent.category.launcher" /> </intent-filter> </activity> <activity android:name=".blueactivity"></activity> <activity android:name=".orangeactivity"></activity> <activity android:name=".blackactivity"></activity> <activity android:name=".redactivity"></activity> </application> </manifest> 128

129 En la figura 9.47 se muestra la pantalla principal en la que se pude observar los cuatro botones. Al oprimir cada uno de estos llevara a una diferente pantalla o layout del color que tiene la etiqueta de cada uno de los botones. Figura 9.47 Menú de botones de colores 129

130 Control ToggleButton Un control de tipo ToggleButton es un tipo de botón que puede permanecer en dos estados, pulsado/no_pulsado. Sus principales propiedades son: android:texton y android:textoff. En el caso de un botón de tipo ToggleButton suele ser de utilidad conocer en qué estado ha quedado el botón tras ser pulsado, para lo que se puede utilizar el método ischecked(). Practica 13 package mx.toggle.button.pract1; import android.app.activity; import android.graphics.color; import android.os.bundle; import android.view.view; import android.view.view.onclicklistener; import android.widget.textview; import android.widget.toast; import android.widget.togglebutton; public class ToggleP1Activity extends Activity { /** Called when the activity is first created. */ private ToggleButton togglebtn; private TextView public void oncreate(bundle savedinstancestate) { super.oncreate(savedinstancestate); setcontentview(r.layout.main); togglebtn = (ToggleButton)findViewById(R.id.togB1); texto = (TextView)findViewById(R.id.text); 130

131 togglebtn.setonclicklistener(new OnClickListener() { public void onclick(view v) { if(togglebtn.ischecked()) { texto.settext("boton: ON"); texto.setbackgroundcolor(color.red); Toast.makeText(getBaseContext(), "El boton esta en "+togglebtn.gettext().tostring(), Toast.LENGTH_LONG).show(); else { texto.settext("boton: Off"); texto.setbackgroundcolor(color.blue); Toast.makeText(getBaseContext(), "El boton esta en "+togglebtn.gettext().tostring(), Toast.LENGTH_LONG).show(); ); R.java package mx.toggle.button.pract1; public final class R { public static final class attr { public static final class drawable { public static final int ic_launcher=0x7f020000; public static final class id { public static final int text=0x7f050001; public static final int togb1=0x7f050000; public static final class layout { public static final int main=0x7f030000; public static final class string { public static final int app_name=0x7f040001; public static final int hello=0x7f040000; 131

132 main.xml <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android=" android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="vertical" android:gravity="center"> <ToggleButton android:layout_width="wrap_content" android:layout_height="wrap_content" android:texton="abre" android:textoff="cierra" /> <TextView android:layout_width="fill_parent" android:layout_height="wrap_content" /> </LinearLayout> AndroidManifest.xml <?xml version="1.0" encoding="utf-8"?> <manifest xmlns:android=" package="mx.toggle.button.pract1" android:versioncode="1" android:versionname="1.0" > <uses-sdk android:minsdkversion="8" /> <application > <activity android:name=".togglep1activity" > <intent-filter> <action android:name="android.intent.action.main" /> <category android:name="android.intent.category.launcher" /> </intent-filter> </activity> </application> </manifest> 132

133 En la figura 9.48 se muestra la practica con ToggleButton, en la cual cambia el texto tanto de la etiqueta del botón como el texto que aparece abajo y así también el color de este. Figura 9.48 Práctica con ToggleButton 133

134 Control ImageButton En un control de tipo ImageButton se puede definir una imagen a mostrar en vez de un texto, para lo que se deberá asignar la propiedad android:src. Normalmente se asigna esta propiedad con el descriptor de algún recurso que se haya incluido en la carpeta /res/drawable. Practica 14 ImageP1Activity.java package mx.image.button.pract1; import android.app.activity; import android.os.bundle; import android.view.view; import android.view.view.onclicklistener; import android.widget.imagebutton; import android.widget.textview; public class ImageP1Activity extends Activity { private ImageButton imgbtn; private TextView public void oncreate(bundle savedinstancestate) { super.oncreate(savedinstancestate); setcontentview(r.layout.main); imgbtn = (ImageButton)findViewById(R.id.imgBtn); textview = (TextView)findViewById(R.id.text); imgbtn.setonclicklistener(new OnClickListener() { public void onclick(view v) { // TODO Auto-generated method stub textview.settext("boton Pulsado"); 134

135 R.java package mx.image.button.pract1; public final class R { public static final class attr { public static final class drawable { public static final int ic_launcher=0x7f020000; public static final int ok=0x7f020001; public static final class id { public static final int imgbtn=0x7f050000; public static final int text=0x7f050001; public static final class layout { public static final int main=0x7f030000; public static final class string { public static final int app_name=0x7f040002; public static final int call=0x7f040000; public static final int pulsar=0x7f040001; main.xml <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android=" android:layout_width="fill_parent" android:layout_height="fill_parent" android:gravity="center" android:orientation="vertical" > <ImageButton android:id="@+id/imgbtn" android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@drawable/ok" android:contentdescription="@string/call" /> <TextView android:id="@+id/text" android:layout_width="wrap_content" android:layout_height="wrap_content" android:textcolor="#ffffff" android:text="@string/pulsar" /> </LinearLayout> 135

136 strings.xml <?xml version="1.0" encoding="utf-8"?> <resources> <string name="call">llamar</string> <string name="pulsar">pulsar</string> <string name="app_name">imagebuttonp1</string> </resources> AndroidManifest.xml <?xml version="1.0" encoding="utf-8"?> <manifest xmlns:android=" package="mx.image.button.pract1" android:versioncode="1" android:versionname="1.0" > <uses-sdk android:minsdkversion="8" /> <application > <activity android:name=".imagep1activity" > <intent-filter> <action android:name="android.intent.action.main" /> <category android:name="android.intent.category.launcher" /> </intent-filter> </activity> </application> </manifest> 136

137 En la figura 9.49 se muestra el resultado de la práctica con un ImageButton en el cual aparece la imagen en el botón y al pulsarlo cambia la etiqueta de la parte de abajo. Figura 9.49 Resultado de práctica con ImageButton 137

138 Personalizar el aspecto un botón y otros controles En la figura anterior se observo el aspecto que presentan por defecto los tres tipos de botones disponibles. Pero, y si se requiere personalizar su aspecto más allá de cambiar un poco el tipo o el color de la letra o el fondo? Para cambiar la forma de un botón se podria simplemente asignar una imagen a la propiedad android:background, pero esta solución no serviría de mucho porque siempre se mostraría la misma imagen incluso con el botón pulsado, dando poca sensación de elemento clickable. La solución perfecta pasaría por tanto por definir diferentes imágenes de fondo dependiendo del estado del botón. Android da total libertad para hacer esto mediante el uso de selectores. Un selector se define mediante un fichero XML localizado en la carpeta /res/drawable,y en él se pueden establecer los diferentes valores de una propiedad determinada de un control dependiendo de su estado. Por ejemplo, si se quiere dar un aspecto plano a un botón ToggleButton, se pueden diseñar las imágenes necesarias para los estados pulsado (en el ejemplo toggle_on.png) y no pulsado (en el ejemplo toggle_off.png) y crear un selector. 138

139 Otros tres componentes básicos imprescindibles en las aplicaciones: las imágenes (ImageView), las etiquetas (TextView) y por último los cuadros de texto (EditText). Practica 15 Para guardar este selector se creara un fichero el cual se llamara ítem_style.xml, se colocara como un recurso más en la carpeta de recursos /res/drawable. En la figura 9.50 se muestra una imagen después de la creación de estos elementos. Figura 9.50 Creación de elementos para selector 139

140 Para esta práctica solo se mostrara el código de los ficheros.xml que se modificaron para el resultado de tal práctica. main.xml <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android=" android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="vertical" > <ToggleButton android:texton="on" android:textoff="off" android:padding="10dip" android:layout_width="wrap_content" android:layout_height="wrap_content" </LinearLayout> item_style.xml <?xml version="1.0" encoding="utf-8"?> <selector xmlns:android=" > <item android:state_checked="false" /> <item android:state_checked="true" /> </selector> 140

141 En la figura 9.51 se muestra el resultado de la practica con un selector en donde se usa en un ToggleButton que al presionarlo cambia su etiqueta y aunque es muy sencilla cabe decir que es muy útil para grandes aplicaciones ya que se tiene un mejor control en el código. Figura 9.51 Práctica con la propiedad selector 141

142 Practica 16 Esta práctica será un poco más compleja en donde se utilizaran varios componentes y propiedades vistas y algunas nuevas. La practica consiste en realizar una calculadora con las funciones básicas que son: Suma, Resta, División y Multiplicación. CalculadoraActivity.java package mx.calculator.basic.pract; import android.app.activity; import android.os.bundle; import android.view.view; import android.view.view.onclicklistener; import android.widget.button; import android.widget.edittext; public class CalculadoraActivity extends Activity { /** Called when the activity is first created. */ private Button btnuno; private Button btndos; private Button btntres; private Button btncuatro; private Button btncinco; private Button btnseis; private Button btnsiete; private Button btnocho; private Button btnnueve; private Button btncero; private Button btnclear; private Button btnigual; private Button btndivision; private Button btnmultiplica; private Button btnresta; private Button btnsuma; 142

143 private EditText edittext; private Double aux1; private Double aux2; private Double res; private String cadena; private int numclick = public void oncreate(bundle savedinstancestate) { super.oncreate(savedinstancestate); setcontentview(r.layout.main); AddButtons(); AccionBotones(); metodosuma(); metodoigual(); metodoresta(); metodomultiplica(); metododivision(); public void AddButtons() { btnuno = (Button)findViewById(R.id.btn1); btndos = (Button)findViewById(R.id.btn2); btntres = (Button)findViewById(R.id.btn3); btncuatro = (Button)findViewById(R.id.btn4); btncinco = (Button)findViewById(R.id.btn5); btnseis = (Button)findViewById(R.id.btn6); btnsiete = (Button)findViewById(R.id.btn7); btnocho = (Button)findViewById(R.id.btn8); btnnueve = (Button)findViewById(R.id.btn9); btncero = (Button)findViewById(R.id.btn0); btnclear = (Button)findViewById(R.id.btnCle); btnigual = (Button)findViewById(R.id.btnIgu); btndivision = (Button)findViewById(R.id.btnDiv); btnmultiplica = (Button)findViewById(R.id.btnMult); btnresta = (Button)findViewById(R.id.btnRes); btnsuma = (Button)findViewById(R.id.btnSum); edittext = (EditText)findViewById(R.id.edText); edittext.setenabled(false); 143

144 public void AccionBotones() { btnuno.setonclicklistener(new OnClickListener() public void onclick(view v) { // TODO Auto-generated method stub numclick = numclick + 1; if(numclick == 1) { edittext.settext(btnuno.gettext().tostring()); else edittext.settext(btnuno.gettext().tostring().concat(editt ext.gettext().tostring())); ); btndos.setonclicklistener(new OnClickListener() public void onclick(view v) { // TODO Auto-generated method stub numclick = numclick +1; if(numclick == 1) { edittext.settext(btndos.gettext().tostring()); else edittext.settext(btndos.gettext().tostring().concat(editt ext.gettext().tostring())); ); btntres.setonclicklistener(new OnClickListener() public void onclick(view v) { // TODO Auto-generated method stub numclick = numclick +1; if(numclick == 1) { edittext.settext(btntres.gettext().tostring()); 144

145 else edittext.settext(btntres.gettext().tostring().concat(edit Text.getText().toString())); ); btncuatro.setonclicklistener(new OnClickListener() public void onclick(view v) { // TODO Auto-generated method stub numclick = numclick +1; if(numclick == 1) { edittext.settext(btncuatro.gettext().tostring()); else edittext.settext(btncuatro.gettext().tostring().concat(ed ittext.gettext().tostring())); ); btncinco.setonclicklistener(new OnClickListener() public void onclick(view v) { // TODO Auto-generated method stub numclick = numclick +1; if(numclick == 1) { edittext.settext(btncinco.gettext().tostring()); else edittext.settext(btncinco.gettext().tostring().concat(edi ttext.gettext().tostring())); ); btnseis.setonclicklistener(new OnClickListener() { 145

146 @Override public void onclick(view v) { // TODO Auto-generated method stub numclick = numclick +1; if(numclick == 1) { edittext.settext(btnseis.gettext().tostring()); else edittext.settext(btnseis.gettext().tostring().concat(edit Text.getText().toString())); ); btnsiete.setonclicklistener(new OnClickListener() public void onclick(view v) { // TODO Auto-generated method stub numclick = numclick +1; if(numclick == 1) { edittext.settext(btnsiete.gettext().tostring()); else edittext.settext(btnsiete.gettext().tostring().concat(edi ttext.gettext().tostring())); ); btnocho.setonclicklistener(new OnClickListener() public void onclick(view v) { // TODO Auto-generated method stub numclick = numclick +1; if(numclick == 1) { edittext.settext(btnocho.gettext().tostring()); else edittext.settext(btnocho.gettext().tostring().concat(edit Text.getText().toString())); ); 146

147 btnnueve.setonclicklistener(new OnClickListener() public void onclick(view v) { // TODO Auto-generated method stub numclick = numclick +1; if(numclick == 1) { edittext.settext(btnnueve.gettext().tostring()); else edittext.settext(btnnueve.gettext().tostring().concat(edi ttext.gettext().tostring())); ); btncero.setonclicklistener(new OnClickListener() public void onclick(view v) { // TODO Auto-generated method stub numclick = numclick +1; if(numclick == 1) { edittext.settext(btncero.gettext().tostring()); else edittext.settext(btncero.gettext().tostring().concat(edit Text.getText().toString())); ); btnclear.setonclicklistener(new OnClickListener() public void onclick(view v) { // TODO Auto-generated method stub edittext.settext("0"); numclick = 0; aux1=0.0; aux2=0.0; ); 147

148 public void metodosuma() { btnsuma.setonclicklistener(new OnClickListener() public void onclick(view v) { // TODO Auto-generated method stub numclick = 0; cadena = "Suma"; aux1 = Double.parseDouble(editText.getText().toString()); ); public void metodoresta() { btnresta.setonclicklistener(new OnClickListener() public void onclick(view v) { // TODO Auto-generated method stub numclick = 0; cadena = "Resta"; aux1 = Double.parseDouble(editText.getText().toString()); ); public void metodomultiplica() { btnmultiplica.setonclicklistener(new OnClickListener() public void onclick(view v) { // TODO Auto-generated method stub numclick = 0; cadena = "Multiplica"; aux1 = Double.parseDouble(editText.getText().toString()); ); 148

149 public void metododivision() { btndivision.setonclicklistener(new OnClickListener() public void onclick(view v) { // TODO Auto-generated method stub numclick = 0; cadena = "Division"; aux1 = Double.parseDouble(editText.getText().toString()); ); public void metodoigual() { btnigual.setonclicklistener(new OnClickListener() public void onclick(view v) { // TODO Auto-generated method stub if(cadena.equals("suma")) { aux2 = Double.parseDouble(editText.getText().toString()); res = aux1 + aux2; edittext.settext(res.tostring()); if(cadena.equals("resta")) { aux2 = Double.parseDouble(editText.getText().toString()); res = aux1 - aux2; edittext.settext(res.tostring()); if(cadena.equals("multiplica")) { aux2 = Double.parseDouble(editText.getText().toString()); res = aux1 * aux2; edittext.settext(res.tostring()); 149

150 if(cadena.equals("division")) { aux2 = Double.parseDouble(editText.getText().toString()); res = aux1 / aux2; edittext.settext(res.tostring()); ); R.java package mx.calculator.basic.pract; public final class R { public static final class attr { public static final class drawable { public static final int ic_launcher=0x7f020000; public static final class id { public static final int btn0=0x7f05000e; public static final int btn1=0x7f050001; public static final int btn2=0x7f050002; public static final int btn3=0x7f050003; public static final int btn4=0x7f050005; public static final int btn5=0x7f050006; public static final int btn6=0x7f050007; public static final int btn7=0x7f050009; public static final int btn8=0x7f05000a; public static final int btn9=0x7f05000b; public static final int btncle=0x7f05000d; public static final int btndiv=0x7f050004; public static final int btnigu=0x7f05000f; public static final int btnmult=0x7f050008; public static final int btnres=0x7f05000c; public static final int btnsum=0x7f050010; public static final int edtext=0x7f050000; 150

151 public static final class layout { public static final int main=0x7f030000; public static final class string { public static final int app_name=0x7f040010; public static final int cinco=0x7f040005; public static final int clear=0x7f04000a; public static final int cuatro=0x7f040004; public static final int div=0x7f04000b; public static final int dos=0x7f040002; public static final int igu=0x7f04000f; public static final int mul=0x7f04000c; public static final int nueve=0x7f040009; public static final int ocho=0x7f040008; public static final int res=0x7f04000d; public static final int seis=0x7f040006; public static final int siete=0x7f040007; public static final int sum=0x7f04000e; public static final int textcero=0x7f040000; public static final int tres=0x7f040003; public static final int uno=0x7f040001; main.xml <?xml version="1.0" encoding="utf-8"?> <TableLayout xmlns:android=" android:layout_width="fill_parent" android:layout_height="fill_parent"> <TableRow android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_weight="1" > 151

152 <EditText android:layout_width="fill_parent" android:layout_height="fill_parent" android:inputtype="numberdecimal" android:textcolor="#ffffff" android:gravity="right" android:layout_span="4" android:layout_weight="1" /> </TableRow> <TableRow android:layout_width="fill_parent" android:layout_height="fill_parent" android:layout_weight="1" > <Button android:layout_width="fill_parent" android:layout_height="fill_parent" android:layout_weight="1" /> <Button android:layout_width="fill_parent" android:layout_height="fill_parent" android:layout_weight="1" /> <Button android:layout_width="fill_parent" android:layout_height="fill_parent" android:layout_weight="1" /> <Button android:layout_width="fill_parent" android:layout_height="fill_parent" android:layout_weight="2" /> </TableRow> 152

153 <TableRow android:layout_width="fill_parent" android:layout_height="fill_parent" android:layout_weight="1" > <Button android:layout_width="fill_parent" android:layout_height="fill_parent" android:layout_weight="1" /> <Button android:layout_width="fill_parent" android:layout_height="fill_parent" android:layout_weight="1" /> <Button android:layout_width="fill_parent" android:layout_height="fill_parent" android:layout_weight="1" /> <Button android:layout_width="fill_parent" android:layout_height="fill_parent" android:layout_weight="2" /> </TableRow> <TableRow android:layout_width="fill_parent" android:layout_height="fill_parent" android:layout_weight="1" > <Button android:layout_width="fill_parent" android:layout_height="fill_parent" android:layout_weight="1" /> 153

154 <Button android:layout_width="fill_parent" android:layout_height="fill_parent" android:layout_weight="1" /> <Button android:layout_width="fill_parent" android:layout_height="fill_parent" android:layout_weight="1" /> <Button android:layout_width="fill_parent" android:layout_height="fill_parent" android:layout_weight="2" /> </TableRow> <TableRow android:layout_width="fill_parent" android:layout_height="fill_parent" android:layout_weight="1" > <Button android:layout_width="fill_parent" android:layout_height="fill_parent" android:layout_weight="1" /> <Button android:layout_width="fill_parent" android:layout_height="fill_parent" android:layout_weight="1" /> 154

155 <Button android:layout_width="fill_parent" android:layout_height="fill_parent" android:layout_weight="1" /> <Button android:layout_width="fill_parent" android:layout_height="fill_parent" android:layout_weight="2" /> </TableRow> </TableLayout> strings.xml <?xml version="1.0" encoding="utf-8"?> <resources> <string name="textcero"> 0 </string> <string name="uno"> 1 </string> <string name="dos"> 2 </string> <string name="tres"> 3 </string> <string name="cuatro"> 4 </string> <string name="cinco"> 5 </string> <string name="seis"> 6 </string> <string name="siete"> 7 </string> <string name="ocho"> 8 </string> <string name="nueve"> 9 </string> <string name="clear"> C </string> <string name="div"> / </string> <string name="mul"> * </string> <string name="res"> - </string> <string name="sum"> + </string> <string name="igu"> = </string> <string name="app_name">calculadora</string> </resources> 155

156 AndroidManifest.xml <?xml version="1.0" encoding="utf-8"?> <manifest xmlns:android=" package="mx.calculator.basic.pract" android:versioncode="1" android:versionname="1.0" > <uses-sdk android:minsdkversion="8" /> <application > <activity android:name=".calculadoraactivity" > <intent-filter> <action android:name="android.intent.action.main" /> <category android:name="android.intent.category.launcher" /> </intent-filter> </activity> </application> </manifest> En la figura 9.52 se muestra el resultado de esta práctica. Es una calculadora la cual realiza las funciones básicas. 156

157 Figura 9.52 Práctica Calculadora 157

158 Control ImageView El control ImageView permite mostrar imágenes en la aplicación. La propiedad más interesante es android:src, que permite indicar la imagen a mostrar. Nuevamente, lo normal será indicar como origen de la imagen el identificador de un recurso de la carpeta /res/drawable, por ejemplo Además de esta propiedad, existen algunas otras útiles en algunas ocasiones como las destinadas a establecer el tamaño máximo que puede ocupar la imagen, android:maxwidth y android:maxheight. Control TextView El control TextView es otro de los clásicos en la programación de GUIs, las etiquetas de texto, y se utiliza para mostrar un determinado texto al usuario. Al igual que en el caso de los botones, el texto del control se establece mediante la propiedad android:text. A parte de esta propiedad, la naturaleza del control hace que las más interesantes sean las que establecen el formato del texto mostrado, que al igual que en el caso de los botones son las siguientes: android:background(color de fondo), android:textcolor (color del texto), android:textsize (tamaño de la fuente) y android:typeface (estilo del texto: negrita, cursiva). 158

159 Control EditText El control EditText es el componente de edición de texto que proporciona la plataforma Android. Permite la introducción y edición de texto por parte del usuario, por lo que en tiempo de diseño la propiedad más interesante a establecer, además de su posición/tamaño y formato, es el texto a mostrar, atributo android:text. De igual forma, desde nuestro código podremos recuperar y establecer este texto mediante los métodos gettext() y settext(nuevotexto) respectivamente. Un detalle que no puede pasar desapercibido. Se habian fijado en que se ha tenido que hacer un tostring() sobre el resultado de gettext()? La explicación para esto es que el método gettext() no devuelve un String sino un objeto de tipo Editable, que a su vez implementa la interfaz Spannable. Y esto nos lleva a la característica más interesante del control EditText, y es que no sólo permite editar texto plano sino también texto enriquecido o con formato. Para la siguiente práctica se usaran los tres componentes mencionados anteriormente, su estructura en xml así como su aplicación lógica en java. 159

160 Practica 17 ImageViewActivity.java package mx.image.view.practs; import android.app.activity; import android.os.bundle; import android.widget.edittext; import android.widget.imageview; import android.widget.textview; public class ImageViewActivity extends Activity { /** Called when the activity is first created. public void oncreate(bundle savedinstancestate) { super.oncreate(savedinstancestate); setcontentview(r.layout.main); /* Este codigo es para la logica de la aplicacion * para la propiedad ImageView */ ImageView img= (ImageView)findViewById(R.id.ImgFoto); img.setimageresource(r.drawable.ic_launcher); /* Este codigo es para la logica de la aplicacion * para la propiedad TextView */ TextView lbletiqueta = (TextView)findViewById(R.id.LblEtiqueta); String texto = lbletiqueta.gettext().tostring(); texto += "123"; lbletiqueta.settext(texto); /* Este codigo es para la logica de la aplicacion * para la propiedad EditText */ EditText txttexto = (EditText)findViewById(R.id.TxtTexto); String edit = txttexto.gettext().tostring(); txttexto.settext("hola mundo!"); 160

161 R.java package mx.image.view.practs; public final class R { public static final class attr { public static final class drawable { public static final int ic_launcher=0x7f020000; public static final class id { public static final int ImgFoto=0x7f050000; public static final int LblEtiqueta=0x7f050001; public static final int TxtTexto=0x7f050002; public static final class layout { public static final int main=0x7f030000; public static final class string { public static final int app_name=0x7f040003; public static final int escribir=0x7f040002; public static final int etiq=0x7f040001; public static final int logo=0x7f040000; main.xml <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android=" android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="vertical" > <ImageView android:id="@+id/imgfoto" android:contentdescription="@string/logo" android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@drawable/ic_launcher" /> 161

162 <TextView android:layout_width="fill_parent" android:layout_height="wrap_content" android:background="#aa44ff" android:typeface="monospace" /> <EditText android:layout_width="fill_parent" android:layout_height="wrap_content" android:ems="10" /> </LinearLayout> strings.xml <?xml version="1.0" encoding="utf-8"?> <resources> <string name="logo">logo de Android</string> <string name="etiq">esta es una Etiqueta</string> <string name="escribir">escribir..</string> <string name="app_name">imageview</string> </resources> AndroidManifest.xml <?xml version="1.0" encoding="utf-8"?> <manifest xmlns:android=" package="mx.image.view.practs" android:versioncode="1" android:versionname="1.0" > <uses-sdk android:minsdkversion="8" /> <application > 162

163 <activity android:name=".imageviewactivity" > <intent-filter> <action android:name="android.intent.action.main" /> <category android:name="android.intent.category.launcher" /> </intent-filter> </activity> </application> </manifest> En la figura 9.53 se muestra el resultado de la implementación con estos tres componentes. Figura 9.53 Práctica con ImageView, TextView y EditText 163

164 9.7 Bases de Datos SQLite. La plataforma Android proporciona dos herramientas pricipales para el almacenamiento y consulta de datos estructurados: Bases de Datos SQLite Content Providers En este tema solamente se centrara en la primera opción, SQLite, que abarcará todas las tareas relacionadas con el almacenamiento de los datos propios de la aplicación. El segundo de los mecanismos, los Content Providers, que se trataran más adelante, facilitarán la tarea de hacer visibles esos datos a otras aplicaciones y, de forma recíproca, de permitir la consulta de datos publicados por terceros desde la aplicación. SQLite es un motor de bases de datos muy popular en la actualidad por ofrecer características tan interesantes como su pequeño tamaño, no necesitar servidor, precisar poca configuración, ser transaccional y por supuesto ser de código libre. Android incorpora una serie de herramientas necesarias para la creación y gestión de bases de datos SQLite, y entre ellas una completa API para llevar a cabo de manera sencilla todas las tareas necesarias. Sin embargo, en este tema solo se tocara sobre bases de datos en Android. 164

165 Por el momento se limitara a ver el código necesario para crear una base de datos, se insertara algún dato de prueba, y ver cómo se puede comprobar que todo funciona correctamente. En Android, la forma típica para crear, actualizar, y conectar con una base de datos SQLite será a través de una clase auxiliar llamada SQLiteOpenHelper, o para ser más exactos, de una clase propia que derive de ella y que se debe personalizar para adaptarse a las necesidades concretas de la aplicación. La clase SQLiteOpenHelper tiene tan sólo un constructor, que normalmente no se necesitara sobrescribir, y dos métodos abstractos, oncreate() y onupgrade(), que se deberán personalizar con el código necesario para crear la base de datos y para actualizar su estructura respectivamente. Ahora se realizara una práctica de una pequeña agenda básica utilizando cuatro botones y dos EditText. Con los cuales permitirá hacer las cuatro básicas acciones: Guardar, Llamar, Eliminar BD y Cerrar BD. Y para cada una de las acciones de los botones lanzara un cuadro de dialogo diferente con alertas o mensajes. 165

166 Practica 18 BaseDatos.java package mx.crea.base.pract1; import android.app.activity; import android.app.alertdialog; import android.content.contentvalues; import android.content.dialoginterface; import android.content.intent; import android.database.sqlite.sqlitedatabase; import android.net.uri; import android.os.bundle; import android.util.log; import android.view.view; import android.widget.button; import android.widget.edittext; import android.widget.toast; public class BaseDatos extends Activity { private EditText editnombre; private EditText edittelefono; private Button botonguardar; private Button botonllamar; private Button botoneliminarbd; private Button botoncerrar; private SQLiteDatabase basedatos; private static final String TAG = "bdagenda"; private static final String nombrebd = "agenda"; private static final String tablacontacto = "contacto"; //guardamos en un String toda la creación de la tabla private static final String creartablacontacto = "create table if not exists " + " contacto (codigo integer primary key autoincrement, " + " nombre text not null, telefono text not null unique);"; 166

167 @Override public void oncreate(bundle savedinstancestate) { //Asignamos a cada objeto visual creado a su respectivo elemento de main.xml super.oncreate(savedinstancestate); setcontentview(r.layout.main); editnombre = (EditText) findviewbyid(r.id.txtnombre); edittelefono = (EditText) findviewbyid(r.id.txttelefono); botonguardar = (Button) findviewbyid(r.id.btguardar); botonllamar = (Button) findviewbyid(r.id.btllamar); botoneliminarbd = (Button) findviewbyid(r.id.bteliminarbd); botoncerrar = (Button) findviewbyid(r.id.btcerrar); //Guardar el contacto actual en la agenda botonguardar.setonclicklistener(new View.OnClickListener() { public void onclick(view v) { //Abrir la base de datos, se creará si no existe abrirbasedatos(); //Insertar una fila o registro en la tabla "contacto" //si la inserción es correcta devolverá true boolean resultado = insertarfila(editnombre.gettext().tostring(), edittelefono.gettext().tostring()); if(resultado) Toast.makeText(getApplicationContext(), "Contacto añadido correctamente", Toast.LENGTH_LONG).show(); else Toast.makeText(getApplicationContext(), "No se ha podido guardar el contacto", Toast.LENGTH_LONG).show(); ); 167

168 botonllamar.setonclicklistener(new View.OnClickListener() { public void onclick(view v) { //Mostrar un mensaje de confirmación antes de realizar la llamada AlertDialog.Builder alertdialog = new AlertDialog.Builder(BaseDatos.this); alertdialog.setmessage(" Desea realizar la llamada al contacto?"); alertdialog.settitle("llamar a contacto..."); alertdialog.seticon(android.r.drawable.ic_dialog_alert); alertdialog.setcancelable(false); alertdialog.setpositivebutton("sí", new DialogInterface.OnClickListener() { public void onclick(dialoginterface dialog, int which) { try { EditText num=(edittext)findviewbyid(r.id.txttelefono); String number = "tel:" + num.gettext().tostring().trim(); Toast.makeText(getApplicationContext(), "Llamando al " + num.gettext().tostring().trim(), Toast.LENGTH_LONG).show(); Intent callintent = new Intent(Intent.ACTION_CALL, Uri.parse(number)); startactivity(callintent); catch (Exception e) { Toast.makeText(getApplicationContext(), "No se ha podido realizar la llamada", Toast.LENGTH_LONG).show(); ); 168

169 alertdialog.setnegativebutton("no", new DialogInterface.OnClickListener() { public void onclick(dialoginterface dialog, int which) { Toast.makeText(getApplicationContext(), "Llamada cancelada", Toast.LENGTH_LONG).show(); ); alertdialog.show(); ); //Eliminar la base de datos de la agenda botoneliminarbd.setonclicklistener(new View.OnClickListener() { public void onclick(view v) { //Mostrar un mensaje de confirmación antes de eliminar la base de datos AlertDialog.Builder alertdialog = new AlertDialog.Builder(BaseDatos.this); alertdialog.setmessage(" Desea eliminar la base de datos por completo?"); alertdialog.settitle("eliminar agenda..."); alertdialog.seticon(android.r.drawable.ic_dialog_alert); alertdialog.setcancelable(false); alertdialog.setpositivebutton("sí", new DialogInterface.OnClickListener() { public void onclick(dialoginterface dialog, int which) { try { Toast.makeText(getApplicationContext(), "Eliminando base de datos: " + nombrebd, Toast.LENGTH_LONG).show(); 169

170 boolean resultado = deletedatabase(nombrebd); if(resultado) Toast.makeText(getApplicationContext(), "Base de datos eliminada correctamente", Toast.LENGTH_LONG).show(); else Toast.makeText(getApplicationContext(), "No se ha podido eliminar la base de datos", Toast.LENGTH_LONG).show(); catch (Exception e) { Toast.makeText(getApplicationContext(), "No se ha podido eliminar la base de datos", Toast.LENGTH_LONG).show(); ); alertdialog.setnegativebutton("no", new DialogInterface.OnClickListener() { which) public void onclick(dialoginterface dialog, int { Toast.makeText(getApplicationContext(), "Eliminación de base de datos cancelada", Toast.LENGTH_LONG).show(); ); ); alertdialog.show(); 170

171 //Cerrar aplicación Android botoncerrar.setonclicklistener(new View.OnClickListener() { public void onclick(view v) { finish(); ); //Procedimiento para abrir la base de datos //si no existe se creará, también se creará la tabla contacto private void abrirbasedatos() { try { basedatos = openorcreatedatabase(nombrebd, MODE_WORLD_WRITEABLE, null); basedatos.execsql(creartablacontacto); catch (Exception e) { Log.i(TAG, "Error al abrir o crear la base de datos" + e); //Método que realiza la inserción de los datos en nuestra tabla contacto private boolean insertarfila(string nombre, String telefono) { ContentValues values = new ContentValues(); values.put("nombre",nombre ); values.put("telefono", telefono); Toast.makeText(getApplicationContext(), "Nombre: " + nombre + ", " + "teléfono: " + telefono, Toast.LENGTH_LONG).show(); return (basedatos.insert(tablacontacto, null, values) > 0); 171

172 R.java package mx.crea.base.pract1; public final class R { public static final class attr { public static final class drawable { public static final int ic_launcher=0x7f020000; public static final class id { public static final int btcerrar=0x7f050007; public static final int bteliminarbd=0x7f050006; public static final int btguardar=0x7f050004; public static final int btllamar=0x7f050005; public static final int textview1=0x7f050000; public static final int textview2=0x7f050002; public static final int txtnombre=0x7f050001; public static final int txttelefono=0x7f050003; public static final class layout { public static final int main=0x7f030000; public static final class string { public static final int app_name=0x7f040001; public static final int cerrar_bd=0x7f040005; public static final int eliminar_bd=0x7f040004; public static final int escribe_nombre=0x7f040007; public static final int escribe_numero=0x7f040009; public static final int guardar=0x7f040002; public static final int hello=0x7f040000; public static final int llamar=0x7f040003; public static final int nombre=0x7f040006; public static final int telefono=0x7f040008; 172

173 main.xml <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android=" android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="vertical" > <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:textsize="20dp" /> <EditText android:layout_width="fill_parent" android:layout_height="wrap_content" /> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:textsize="20dp" /> <EditText android:layout_width="fill_parent" android:layout_height="wrap_content" /> <Button android:layout_width="fill_parent" android:layout_height="wrap_content" /> 173

174 <Button android:layout_width="fill_parent" android:layout_height="wrap_content" /> <Button android:layout_width="fill_parent" android:layout_height="wrap_content" /> <Button android:layout_width="fill_parent" android:layout_height="wrap_content" /> </LinearLayout> Strings.xml <?xml version="1.0" encoding="utf-8"?> <resources> <string name="hello">hello World, CreaBDActivity!</string> <string name="app_name">sqlitecreabd</string> <string name="guardar">guardar</string> <string name="llamar">llamar</string> <string name="eliminar_bd">eliminar BD</string> <string name="cerrar_bd">cerrar BD</string> <string name="nombre">nombre:</string> <string name="escribe_nombre">escribe Nombre..</string> <string name="telefono">telefono:</string> <string name="escribe_numero">escribe Numero..</string> </resources> 174

175 AndroidManifest.xml <?xml version="1.0" encoding="utf-8"?> <manifest xmlns:android=" package="mx.crea.base.pract1" android:versioncode="1" android:versionname="1.0" > <uses-sdk android:minsdkversion="8" android:targetsdkversion="8"/> <application > <activity android:name=".basedatos" > <intent-filter> <action android:name="android.intent.action.main" /> <category android:name="android.intent.category.launcher" /> </intent-filter> </activity> </application> </manifest> En la figura 9.54 se muestra el resultado de la práctica realizada con base de datos SQLite. 175

176 Figura 9.54 Agenda con SQLite Para verificar que la base de datos se creo, se necesitara abrir la perspectiva DDMS en la parte superior derecha de eclipse en este caso es la siguiente ruta: data/data/mx.crea.base.pract1/databases/agenda. Este procedimiento se muestra en la figura 9.55, y es muy sencillo ya que solo hay que localizar el nombre del paquete que se encuentra en el proyecto creado. 176

177 Fichero agenda Botones de acciones para fichero Figura 9.55 Verificar creación de Base de Datos Ahora para verificar que efectivamente los datos se insertaron en la base, entonces se debe transferir la base de datos a la PC y consultarla con cualquier administrador de bases de datos SQLite. Este método es sencillo. El fichero de la base de datos se puede transferir a la PC utilizando el botón de descarga situado en la esquina superior derecha del explorador de archivos (remarcado en rojo en la imagen anterior). Junto a este botón aparecen otros dos para hacer la operación contraria (copiar un fichero local al sistema de archivos del emulador) y para eliminar ficheros del emulador. Una vez descargado el fichero al sistema local, se puede utilizar cualquier administrador de SQLite para abrir y consultar la base de datos, por ejemplo SQLite Administrator ( 177

178 Ahora en la figura 9.56 se muestra el resultado de la consulta realizada desde el SQLite Administrator y claro una vez descargado el fichero al sistema local. Figura 9.56 Consultar datos del fichero creado 178

179 9.8 Mapas en Android Antes de empezar a utilizar el servicio de mapas de Google es necesario realizar algunas tareas previas. En primer lugar, hay que asegurarse de que se tiene instalado el paquete correspondiente a la versión de Android para la que se desarrollara enriquecido con las APIs de Google. Estos paquetes se llaman normalmente Google APIs by Google, Android API x, revisión y. Esto se puede comprobar y descargar si es necesario desde Eclipse accediendo al Android SDK and AVD Manager. En este caso, se utilizara el paquete correspondiente a Android 2.2 (API 8) + Google APIs. En la figura 9.56 se muestra este procedimiento. Seleccionar Paquete Google APIs Figura 9.56 Instalar paquete de APIs de Google. 179

180 Para poder probar nuestras aplicaciones en el emulador también se tendra que crear un nuevo AVD que utilice este paquete como target como se muestra en la figura Figura 9.57 Crear AVD con el Target Google API 180

181 Y por supuesto, al crear nuestro proyecto de Eclipse también se tendrá que seleccionarlo como target en las propiedades como en la figura Seleccionar Google APIs Figura 9.57 Seleccionar el Target Google API Con todo esto ya se tendría creado el proyecto de Eclipse y se estaría preparado para poder ejecutar aplicaciones en el emulador sobre la versión correcta de Android y las APIs necesarias de Google. Por tanto, ya se podría centrar en la utilización de dichas APIs. 181

182 Esto último también requiere algunos pasos previos. Para poder utilizar la API de Google Maps se requiere la obtención previa de una clave de uso (API Key), que estará asociada al certificado con el que se firma digitalmente la aplicación. Esto quiere decir que si se cambia el certificado con el que se firmara la aplicación (algo que se hace normalmente como paso previo a la publicación de la aplicación en el Market) se tendra que cambiar también la clave de uso de la API. Por tanto, para poder depurar aplicaciones en el emulador que hagan uso de Google Maps se tendra que solicitar una clave asociada al certificado de depuración. Para ello, en primer lugar se debe localizar el fichero donde se almacenan los datos del certificado de depuración, llamado debug.keystore. Se puede saber la ruta de este fichero accediendo a las preferencias de Eclipse, sección Android, apartado Build (mostrado en la siguiente imagen), y copiar la ruta que aparece en el campo Default Debug Keystore. En la figura 9.58 se muestra el procedimiento para localizar esta ruta. 182

183 Keystore por default Figura 9.58 Ubicar la ruta debug.keystore Una vez que se conoce la localización del fichero debug.keystore, se va a acceder a él mediante la herramienta keytool.exe de java para obtener el hash MD5 del certificado. Esto se hará desde la línea de comandos de Windows mediante el siguiente comando que se muestra en la figura

184 Generacion de MD5 Figura 9.59 Obtener el hash MD5 Se copiara el dato que aparece identificado como Huella digital de certificado (MD5) y con éste se tendrá acceso a la web de Google ( para solicitar una clave de uso de la API de Google Maps para depurar las aplicaciones (si posteriormente se va a publicar la aplicación en el Market se debera solicitar otra clave asociada al certificado real que se utilizara). Dicha web solicitará la marca MD5 del certificado y proporcionará la clave de uso de la API, como se muestra en la siguiente Figura