Desarrollo de apps para móviles:Mi primera app: los componentes
Flor Palomares, PatriciaHuertas Fernández, José IgnacioMoreno León, Jesús Moriana Coronel, María
Septiembre 2012
1
Programamos Videojuegos y Apps
Estas diapositivas son una obra derivada del tutorial“Hello Purr”
disponible en http://appinventor.mit.edu/explore/content/hellopurr.html
©Programamos, Septiembre de 2013Algunos derechos reservados.
Este artículo se distribuye bajo la licencia“Reconocimiento-CompartirIgual 3.0 España" de CreativeCommons, disponible en
http://creativecommons.org/licenses/by-sa/3.0/es/deed.esEste documento (o uno muy similar)
está disponible en (o enlazado desde)http://programamos.es
Licencia
Nuestra primera app: HolaRonroneo
● En informática la primera aplicación que se desarrolla con un lenguaje suele llamarse HolaMundo.
● En este caso le daremos otro enfoque y la llamaremos Hola Ronroneo
● El objetivo de esta app será sencillo: al presionar sobre un gatito escucharemos cómo maulla.
Conceptos básicos: los componentes
● Los componentes son los elementos básicos que forman las apps en Android
● Son como los ingredientes de una receta
● Algunos son muy sencillos, como un botón o una etiqueta de texto
● Otros más complejos, como un tapiz o un acelerómetro
Conceptos básicos: las propiedades
● Los componentes tienen propiedades que pueden ajustarse para modificar su comportamiento o apariencia.
● Seleccionando un componente se pueden ver y cambiar sus propiedades.
HolaRonroneo: paso 1● ¡Vamos a crear nuestra app HolaRonroneo!● Desde la paleta arrastramos el componente 'Botón' a la pantalla1.● Como queremos que el botón tenga la imagen de un gato, en el panel de
propiedades, en 'Imagen' subiremos nuestra foto.
HolaRonroneo: paso 2
● En la propiedad 'Texto' del botón, borramos el texto para que solo se vea la cara de nuestro gato.
● Si no se muestra tu foto entera puedes modificar las propiedades alto y ancho con el valor “Fill Parent”
HolaRonroneo: paso 3
● Arrastramos el elemento label de la paleta al visor de la pantalla● En las propiedades de la etiqueta modificamos el texto para
escribir el mensaje: “Acaricia al gatito” (Pet the kitty)● Personaliza el color de fondo la etiqueta
HolaRonroneo: paso 4
● En la paleta, en la pestaña Media, arrastramos el componente Sonido al visor de la pantalla. Aparecerá en la parte de abajo del visor marcado como “componente no visible”
● En la propiedad Source del sonido debemos cargar el audio de un maullido
HolaRonroneo: ¡ya tenemos los componentes!
● ¡Buen trabajo!● Ya tenemos colocados los componentes de nuestra app y su
apariencia bien definida.● En la siguiente sesión aprenderemos a programar su
comportamiento.