Manual de Aplicaciones Moviles Presentado: Cristian Asael Godinez Hernandez #402 Materia: Desarrollo de Apicaciones Movile

1. Manual de Aplicaciones Moviles
Presenta
Godinez Hernandez Cristian Asael
Grupo
“402”
Escuela
Cecytem Plantel Tecámac

2. Introducción
Este manual está enfocado sobre todo a aquellas personas que no tienen una noción
muy clara de lo que es programar. Razón por la que seré muy específicoen todos y
cada uno de los pasos que hay que seguir para desarrollar nuestras primeras
aplicaciones móviles.
En realidad este programa no es muy complicado,más sin embargo sí muy tedioso al
momento de estar armando las aplicaciones ya que se te podrían presentar problemas
tales como:
 Que tu App no corra por un archivo no compatible (de cualquier tipo podría ser
una imagen, un video etc.)
 Que las imágenes simplemente no aparezcan
 Que tus sonidos quedentodos desacomodados
 Que no sepas como poner una imagen de fondo en la App
Pero no te desesperessoncosas que a todo buen programadorle pasan en sus
inicios, con el tiempo iras puliendo esos detallitos que te disgustan o que no
comprendes de la programación.
Bueno no te distraigo más,pasa a la siguiente hoja para empezara programar

3. ¿Qué es una App?
Una aplicación móvil, apli o app (en inglés) es una aplicación informática diseñada
para ser ejecutada en teléfonos inteligentes,tabletas y otros dispositivosmóviles.Por
lo general se encuentran disponiblesa través de plataformas de distribución, operadas
por las compañías propietarias de los sistemas operativos móviles como
 Android
 iOS
 BlackBerry OS
 Windows Phone
 entre otros.
Existen aplicaciones móviles gratuitas u otras de PAGO,donde en promedio el 20-
30% del costo de la aplicación se destina al distribuidor y el resto es para el
desarrollador. El término app se volvió popular rápidamente, tanto que en 2010 fue
listada como Word of the Year (Palabra del Año) por la American Dialect Society.
Tiendas de aplicaciones:
Existen diferentes tipos de tiendas para descargaraplicaciones, estas pueden ser
creadas por el mismo sistemaoperativo o por independientes.Las tiendas organizan
las aplicaciones y cada una tiene normas diferentes de retribución y publicación.
 Google Play
Google Play (anteriormente Android Market) es una plataforma de distribución de
software en línea desarrollado por Google Inc. para dispositivos consistema
operativo Android. Fue lanzado en octubre de 2008.Hasta octubre de 2012,Google
Play contaba con más de 700,000 aplicaciones.
En la plataforma se encuentran disponiblestanto aplicaciones gratuitas como de pago.
Su interfaz es sencilla y rápida de utilizar.
 App Store

4. La App Store fue el primer servicio de distribuciónde aplicaciones,siendo lanzada el
10 de julio de 2008.En 2012,el CEO de Apple,Tim Cook, anunció que existen más
de 650,000 aplicaciones disponiblespara dispositivos con iOS.
Desde su creación en 2008,más de un millón de aplicaciones estuvieron disponibles
en el App Store. Numerosas empresas utilizan este canal para distribuir las
aplicaciones colaborativas, de gestión y de productividad a los usuarios externos y
internos.
Apple transformó el mercado de las aplicaciones para dispositivosmóviles,
estrenándosecon un pequeño catálogode solamente 500 aplicaciones y logrando en
tan solo cuatro días 10 millones de aplicaciones descargadas.
En julio de 2012,Apple creó "App Store Volume purchasing for business". Disponible
únicamente en EEUU, este programa permite a las empresas compraraplicaciones en
grandes cantidades con el fin de distribuirlas a sus colaboradoresa través de
códigos promocionales.Es posible también integrar en esta tienda "business to
business",aplicaciones desarrolladas por terceros y que no son publicadas en el App
Store clásico.
 Windows Phone Store
La Windows Phone Store es la plataforma de distribución de Microsoft para los
dispositivos que cuentan con el sistemaoperativo móvil Windows Phone. Fue lanzado
en octubre de 2010.Para octubre de 2012,contaba con más de 120,000aplicaciones
disponibles.
En mayo de 2013 Microsoftanunció que ya contaba con más de 145.000aplicaciones
en Windows Phone Store
¿ADT?
Este es otro concepto que debes tener bien presente en todo el proceso es un plugin
para el IDE Eclipse que está diseñado para darle un potente entorno, integrado en el
que la construcciónde aplicaciones de Android.
ADT amplía las capacidades de Eclipse para que pueda configurar rápidamente
nuevos proyectos para Android, crear una interfaz de usuario de la aplicación, agregar
paquetes basados en la API de Android Framework, depurar sus aplicaciones

5. utilizando las herramientas del SDK de Android, e incluso exportar firmados (o no
firmados)archivos .apk con el fin de distribuir la aplicación.
El desarrollo en Eclipse con ADT es muy recomendable y es la manera más rápida
para empezar. Con la configuraciónguiada proyecto que proporciona, así como la
integración de herramientas, editores XML personalizados,y el panel de salida de
depuración, ADT le da un impulso increíble en el desarrollo de aplicaciones de Android

6. ¿Cómo exporto una aplicación?
Bien al finalizar la aplicación se tiene que exportar para poderusarse en cualquier
dispositivo compatible (Únicamente Android).
Esto es muy sencillo simplemente hay que hacer lo siguiente:
Dar en el botón File y luego en Export:
Luego solo seguiremoslos pasos:
-Le damos en Export Android Application
-Buscamos la aplicación que queremos

7. -Creamos un keystore y una contraseña
-Ahora solo llenaremos los siguientes campos (solo los necesarios)
-Por ultimo le daremos en Finish si todos los campos son correctos

8. -Ahora solo buscaremos enla ubicación donde guardamos la App y la pasaremos a
nuestro dispositivo,ya sea por medio de un cable USB o por medio de Bluetooth (Si tu
computadora lo tiene)

9. Acelerómetro
Esta es la primera aplicación que crearemos,el Acelerómetro es el sensor de tu
celular que le permite saber su posición,este se mueve en tres ejes X, Y, Z
(horizontalmente, verticalmente y diagonalmente respectivamente).
Para iniciar vamos a llevar a cabo el proceso que explicamos antes (¿Cómo creo una
carpeta nueva en ADT (Eclipse)?)
Una vez hecho eso vamos a declarar primero nuestras librerías así:
Ahora vamos a ir a nuestro Layout (La parte grafica de nuestra App, esta se haya en la carpeta
res>layout) y pondremos 3 TextView (Simplemente lo tomamos del apartado Form Widgets y lo
arrastramos hasta la simulación de pantalla) poniéndoles el siguiente id: x, y, z
respectivamente así:

10. Posteriormente pondremoslas siguientes líneas de código para que nos de uso del
sensory podamos ver esos movimientos reflejados en la pantalla por medio de los
TextView.
La primer parte de este código es declarar las variables a usar y los elementos
gráficos que usamos en el Layout:
Esto va justo después de las librerías que declaramos hasta arriba.
Luego les daremos función así (Esta parte va justo después de lo anterior):
Por ultimo ya que tenemos la parte gráficay la función de cada cosa lo vamos a
exportar y a instalar en nuestro dispositivo Android.
Se debe de ver más o menos así:

11. -Al moverlo debe de cambiar la cantidad de los tres campos X, Y, Z

12. Hola Mundo
Esta aplicación es muy sencilla ya que solo utilizaremos nuestro activity_main.xml
Ahora si solo exportemos e instalemos en nuestro celular:
Para que veamos algo parecido a esto:

13. Calculadora
Esta aplicación no es tan complicadapero si muy larga, pero no se preocupensolo
copienbien el código y no habrá problemaalguno.
Primero hagamos la parte gráfica,esta vez son muchos botones y 2 EditText así:
Ustedes ya saben cómo ponertodo esto de un modo rápido, solo arrastren los
componentesal simulador de Android y Listo. Solo no olviden ponerle id. a todos sus
componentes(aclaro en este caso solo es necesario darle función a las teclas de +, -,
*, / y al =, los demás tambiénimprimirán un numero pero nada mas).
Hora póngale función a todo desde el Java así:
Declaren Variables, Componentes visuales y Librerías

14. Ahora pongamos las funciones para activar nuestros EditText, para habilitar y
deshabilitar los botones al igual que informarnos que no hay ningún valor por medio de
un Toast en caso de que no se haya escrito nada.
Ahora el procesode Suma:

15. El procesode Resta:
El procesode Multiplicación:
El procesode División:
La impresiónde Números (1-5):

16. La impresiónde Números (6-0):
Función en los Símbolos (punto, borrar):
Función en los Símbolos (resultado,igual):

17. Por ultimo exportamos e Instalamos:
Debe de verse algo así:

18. Canvas
Esta app es extremadamente sencillo y no requiere gran trabajo
Primero hagamos la paste física así, para lo cual no usaremos nada lo dejaremos así
como esta:
Y ahora la parte de la función, esto es muy sencillo porque todo lo que haremos es
aparecer 3 figuras en pantalla:
Primero pongamos las librerías así:
Ahora pongamos las figuras en pantalla:

19. Una vez puesto eso,debe verse así:

20. Radio Button
Lo que vamos a hacer es algo muy similar al Checbox
Primero vamos a hacer el entorno gráfico,vamos s a usar los siguientes elementos:
Ahora una vez habiendo puesto eso debe de verse algo así(En este caso yo puse una
imagen de fondo) con el siguiente código
android:background=”"@drawable/nombre de la imagen"
Esto va debajo del xmlns: tools
Ahora si vamos a ver cómo debe de quedar (no olviden ponerle un id. a todo)
Ahora ya que es muy similar al Checbox el código de función también lo es (A
excepción de que en este caso al escoger una opción aparecerá una imagen):

21. Primeramente como siempre vamos a poner nuestras variables y nuestras librerías , a
fin de darle una función a los Buttons.
Luego les daremos la tarea de que cada Radio ponga una imagen al seleccionarlo
únicamente a el:
Así de igual manera al elegirlo nos aparecerá un Toast poniendo un mensaje en
pantalla para reconocer que se ha hecho el cambio.
Una vez hecho esto exportamos e instalamos la App, la cual debe de verse asi:

23. List View
Esta app es muy simple , la función que va a tener es tipo Base de Datos, aunque esta
solo almacenara mientras la usamos no después,una vez cerrando la app se borrara
todo lo hecho.
Primero hagamos la parte gráfica.
Para empezarabramos el nuevo proyecto y a continuación jalemos del apartado
Compositeun EditText, un Button y un List View.
Para que quede más o menos así:
Una vez hecho eso y puestos nuestros id. Vamos a darle función a todo
Primero pongámosle nuestras librerías, nuestros elementos gráficos y nuestras
variables nuevas:
Después démosle elefectoal botón y al ListViewpara que todo lo que escribamosen
el Edit Text aparezca:

24. Una vez acabados estos sencillos pasos vamos a exportar e instalar la app en nuestro
dispositivo Android,para que salga algo muy parecido a esto:
Notificación

25. Esto debe de ser algo que siempre deberías tomar en cuenta para hacer una
aplicación ya que por lo regular estas tienden a mandar notificaciones porque tu no??
Primeramente hagamos el entorno grafico para ello usaremos 2 .xml
En uno pondremos 1 Button que accionara la notificación y en el otro la notificaciónasí
que primero va
El Button:
Luego la Notificación asi:
Ahora si vamos a hacer la magia en 2 Java correspondientes a cada .xml
Primero el del botón iniciamos poniendo nuestras variables, elementos graficos y
nuestras librerías asi:

26. Luego ponemos lo que hará el botón:
Y por último traer la notificación:
Ahora si vayamos por el segundo Java donde se efectuara la acción de nuestra
Notificación

27. Ahora si exportemose instalemos en nuestro dispositivo.
Debe de verse algo así:

28. Spinner
Esto en si es otro elemento que solo podemosarrastras a nuestra pantalla y ya, lo
complicado casisiempre es darles una función
Para empezarhagamos lo visual primero.(Aclaro esto fue una adaptación que hice en
una de mis clases,está unido con la notificación pero es sencillo)
Para ello vamos a ocupar exactamente los mismos .xml de la notificación
Sin embargo vamos a cambiar un poco los Java:
Primer Java (aquí es donde estarán los cambios de la Aplicacion):

29. Como bien se habrán dado cuenta yo lo hizo con marcas y modelos de celulares n es
grande la diferenciasin embargo va a notarse en la Aplicaciónque debe de quedar
más o menos como en las siguientes imágenes:

31. Progress Bar
Este es un elemento muy ocupado en la mayoría de las Apps ya que sirve para
esperar mientras carga la App y es lo que aprenderemosa hacer.
Hagamos primero la interfaz grafica
Para lo que usaremos:
-Progress Bar
-Text View
-Button
Así:
Ahora hagamos la función de cada cosaprimeramente pongamos nuestras librerías y
nuestras variables:
Y luego nuestras funciones para que marque el avance y la barra se mueva:

32. Aquí hace falta una llave cerrada (es que no me cupo en la foto xD)
Una vez hecho esto va a quedar así:

33. Sonidos de Animales
Esta es una aplicación muy fácilde hacer, el único requerimiento extra a lo que hemos
hecho es que hay que descargaruna imagen por sonido (obvio referente al sonido),
también hay que descargar los sonidos correspondientes ala imagen.
Las imágenes que descargues mételas en la carpeta drawable-mdpi y para ponerlas
en el Button pon el código Android:background=”@drawable/nombrede tu imagen”
dentro del código del Button
Ahora si hagamos lo visual vamos a jalar 9 Button a la pantalla en el siguiente orden:
En este caso lo vamos a hacer con animales y serán los que aparecen en la imagen y
le vamos a poner el nombre de cada animal en el id.
Una vez hecho esto vamos a ponerle los audios(los audios los vamos a meter en la
carpeta raw, si no existe la creamos)
Esto es del siguiente modo:
Primero vamos a poner nuestras librerías, nuestras variables para los sonidos y
toooodosnuestros botones con su efecto para función:

34. Y ahora a asignarles sus sonidos a los animales:
Faltan 2 llaves cerradas al final.
Cuando ya estánlas imágenes y los sonidos solo hay que exportar e instalar y listo:

36. Tab Host
Esto es algo ocupado para poner varias cosas en una App,por ejemplo en el caso de
los reproductoresesto es muy útil, pues así dividen las canciones de los artistas etc.
Para empezarhagamos 4 .xml y agreguemos lo siguiente:
.xml 1:
Agregaremosun TabHost y pondremoslos elementos que aparecen a la derecha:
En él .xml 3 y el 4:
Haremos exactamente lo mismo que en el primero, solo cambiando la imagen
Ahora hagamos los Java, de igual manera debende ser 4, uno para cada .xml
En el primero haremos lo siguiente.
Pondremos nuestras librerías, variables y elementos gráficos:
Ahora le pondremosuna función a los otros 3:

37. Si todo esta así tal cual lo pusimos arriba, ahora podremosavanzar y configurar los
otros 3 Java:

38. Si te das cuenta es muy fácilconfigurar los últimos 3 Java y prácticamente es el
mismo código. Ahora por último si ya te quedo todo esto,podemos exportare instalar:

39. Toglee Button
El Radio Button es un botón con la función de accionar algo en este caso serán3
linternas de colores distintos.
Para empezarvamos a tomar 3 Botones de estos del apartado Form Widgets y lo
arrastraremos hasta la simulación de pantalla de Android, donde le daremos un id. a
cada objeto para más adelante darle una función el Java
Iniciemos,habiendo hecho esto debe de verse asi:
Ahora vamos a darle función en el Java, esto en realidad no es difícil es solo un
código y muy sencillo:
Va más o menos así, para iniciar le vamos a poner librerías y variables y el resto de
cosas que ya saben que van al inicio del código:

40. Como podrándarse cuenta también declaramos los colores con los siguientes
nombres
- Rojo=rj
-Verde =vr
-Azul=az
Puede que se pregunten ¿Para que? Pues para poderdarle tonalidad a nuestras
lámparas como podránver en el siguiente código:

41. Lo ven es muy simple y ya con las tonalidades se verá muy bien tu App, que, si tiene
todo correcto ya puedes instalar en tu celular y se verá así:

42. Video View
Para esta App vamos a usar un video que quieras pero de duración menor a 5:00 min
para no hacerlo tan pesado
Y vamos a aprender a usar los controles de reproductorbásicos.
En si es una Aplicaciónmuy simple pero muy padre.
En la parte visual solo vamos a poner un Video View sacado del apartado Images &
Media
Va a quedar así:
Ahora para darle función primero vamos a guardar nuestro video en la carpeta Raw.
Una vez hecho esto debemosponerel código junto con nuestras librerías, variables y
nuestro componente gráfico:

43. Y así es como quedara:

44. Web View
Esta última Aplicacióndel manual la vamos a hacer muy sencilla también, para poder
descansar del trabajo ya hecho.
Iniciaremos haciendo el entorno gráfico,pondremos un Web View, arrastrando el
objeto del apartado Composite,así:
Y ahora la función para que pueda (como el nombre lo dice)visualizar un sitio web.
Primeramente vamos a poner lo de costumbre librerías, componentes,variables etc:
Y ahora sí, el código para poderver una página Web:

45. Es importante que en la parte donde dice loadURL cargues el Link de tu página bien o
no podrás ingresar al sitio correcto.
Una vez hecho esto correctamente,puedes exportar e instalar la Aplicación,que se
verá así: