“Creación del Hola Mundo en Android Studio”31 Cadenas de Texto En el diseño de la interface...

48
“Creación del Hola Mundo en Android Studio” Rogelio Ferreira Escutia

Transcript of “Creación del Hola Mundo en Android Studio”31 Cadenas de Texto En el diseño de la interface...

Page 1: “Creación del Hola Mundo en Android Studio”31 Cadenas de Texto En el diseño de la interface gráfica se prefiere usar variables de cadenas de texto. Estas cadenas se encuentran

“Creación del Hola Mundo en Android Studio”

Rogelio Ferreira Escutia

Page 2: “Creación del Hola Mundo en Android Studio”31 Cadenas de Texto En el diseño de la interface gráfica se prefiere usar variables de cadenas de texto. Estas cadenas se encuentran

2

Creación del Proyecto

Page 3: “Creación del Hola Mundo en Android Studio”31 Cadenas de Texto En el diseño de la interface gráfica se prefiere usar variables de cadenas de texto. Estas cadenas se encuentran

3

Creación del Proyecto

Page 4: “Creación del Hola Mundo en Android Studio”31 Cadenas de Texto En el diseño de la interface gráfica se prefiere usar variables de cadenas de texto. Estas cadenas se encuentran

4

Creación del Proyecto (1) Hacemos click encima del ícono del Android Studio:

Page 5: “Creación del Hola Mundo en Android Studio”31 Cadenas de Texto En el diseño de la interface gráfica se prefiere usar variables de cadenas de texto. Estas cadenas se encuentran

5

Creación del Proyecto (2) Aparece una ventana donde nos indica que se esta

cargando el Android Studio (esperar un momento):

Page 6: “Creación del Hola Mundo en Android Studio”31 Cadenas de Texto En el diseño de la interface gráfica se prefiere usar variables de cadenas de texto. Estas cadenas se encuentran

6

Creación del Proyecto (3) Aparece un menú y hacemos click en “Start a....”

Page 7: “Creación del Hola Mundo en Android Studio”31 Cadenas de Texto En el diseño de la interface gráfica se prefiere usar variables de cadenas de texto. Estas cadenas se encuentran

7

Creación del Proyecto (4) Nos pregunta el nombre del proyecto (My Application)

Page 8: “Creación del Hola Mundo en Android Studio”31 Cadenas de Texto En el diseño de la interface gráfica se prefiere usar variables de cadenas de texto. Estas cadenas se encuentran

8

Creación del Proyecto (5) Nos pregunta la versión de Android que vamos a

utilizar:

Page 9: “Creación del Hola Mundo en Android Studio”31 Cadenas de Texto En el diseño de la interface gráfica se prefiere usar variables de cadenas de texto. Estas cadenas se encuentran

9

Creación del Proyecto (6) Nos recomienda la 4.0.3 pero se puede seleccionar

una de las 21 APIs disponibles para Android:

Page 10: “Creación del Hola Mundo en Android Studio”31 Cadenas de Texto En el diseño de la interface gráfica se prefiere usar variables de cadenas de texto. Estas cadenas se encuentran

10

Creación del Proyecto (7) Nos pregunta si deseamos un Template (Blank Activiy)

Page 11: “Creación del Hola Mundo en Android Studio”31 Cadenas de Texto En el diseño de la interface gráfica se prefiere usar variables de cadenas de texto. Estas cadenas se encuentran

11

Creación del Proyecto (8) Nos pregunta el nombre para el Activity (MainActivity)

Page 12: “Creación del Hola Mundo en Android Studio”31 Cadenas de Texto En el diseño de la interface gráfica se prefiere usar variables de cadenas de texto. Estas cadenas se encuentran

12

Creación del Proyecto (9) A continuación se genera el proyecto (tarda un poco):

Page 13: “Creación del Hola Mundo en Android Studio”31 Cadenas de Texto En el diseño de la interface gráfica se prefiere usar variables de cadenas de texto. Estas cadenas se encuentran

13

Creación del Proyecto (10) Cuando termina nos aparece una ventana con Tips de

Android:

Page 14: “Creación del Hola Mundo en Android Studio”31 Cadenas de Texto En el diseño de la interface gráfica se prefiere usar variables de cadenas de texto. Estas cadenas se encuentran

14

Creación del Proyecto (11) Finalmente nos aparece la ventana principal donde

trabajaremos con el proyecto de Android que acabamos de crear:

Page 15: “Creación del Hola Mundo en Android Studio”31 Cadenas de Texto En el diseño de la interface gráfica se prefiere usar variables de cadenas de texto. Estas cadenas se encuentran

15

Page 16: “Creación del Hola Mundo en Android Studio”31 Cadenas de Texto En el diseño de la interface gráfica se prefiere usar variables de cadenas de texto. Estas cadenas se encuentran

Rogelio Ferreira Escutia

Instituto Tecnológico de MoreliaDepartamento de Sistemas y Computación

Correo: [email protected] [email protected]

Página Web: http://antares.itmorelia.edu.mx/~kaos/http://www.xumarhu.net/

Twitter: http://twitter.com/rogeplusFacebook: http://www.facebook.com/groups/xumarhu.net/

Page 17: “Creación del Hola Mundo en Android Studio”31 Cadenas de Texto En el diseño de la interface gráfica se prefiere usar variables de cadenas de texto. Estas cadenas se encuentran

17

Creación del Proyecto (1) Se selecciona: File > New > Proyect

Y aparece la siguiente pantalla donde seleccionamos “Android Application Project” y hacemos click en: “Next”

Page 18: “Creación del Hola Mundo en Android Studio”31 Cadenas de Texto En el diseño de la interface gráfica se prefiere usar variables de cadenas de texto. Estas cadenas se encuentran

18

Creación del Proyecto (2) Nos pregunta el nombre del proyecto y escribimos:

“android_hola_mundo”

Y luego hacemos click en: Next

Page 19: “Creación del Hola Mundo en Android Studio”31 Cadenas de Texto En el diseño de la interface gráfica se prefiere usar variables de cadenas de texto. Estas cadenas se encuentran

19

Creación del Proyecto (3) En esta pantalla no modificamos nada, la dejamos por

default como está.

Y luego hacemos click en: Next

Page 20: “Creación del Hola Mundo en Android Studio”31 Cadenas de Texto En el diseño de la interface gráfica se prefiere usar variables de cadenas de texto. Estas cadenas se encuentran

20

Creación del Proyecto (4) En esta pantalla tampoco modificamos nada, la

dejamos por default como está.

Y luego hacemos click en: Next

Page 21: “Creación del Hola Mundo en Android Studio”31 Cadenas de Texto En el diseño de la interface gráfica se prefiere usar variables de cadenas de texto. Estas cadenas se encuentran

21

Creación del Proyecto (5) En esta pantalla tampoco modificamos nada, la

dejamos por default como está.

Y luego hacemos click en: Next

Page 22: “Creación del Hola Mundo en Android Studio”31 Cadenas de Texto En el diseño de la interface gráfica se prefiere usar variables de cadenas de texto. Estas cadenas se encuentran

22

Creación del Proyecto (6) Por último nos pregunta el nombre del Activity

principal y lo dejamos con el nombre por default (MainActivity.

Y por último hacemos click en: Finish

Page 23: “Creación del Hola Mundo en Android Studio”31 Cadenas de Texto En el diseño de la interface gráfica se prefiere usar variables de cadenas de texto. Estas cadenas se encuentran

23

Estructura del Proyecto

Page 24: “Creación del Hola Mundo en Android Studio”31 Cadenas de Texto En el diseño de la interface gráfica se prefiere usar variables de cadenas de texto. Estas cadenas se encuentran

24

Estructura Nombreandroid_hola_mundo

Lógica:MainActivity.java

Diseño:activity_main.xml

Cadenas de texto:strings.xml

Datos del Proyecto:AndroidManifest.xml

Page 25: “Creación del Hola Mundo en Android Studio”31 Cadenas de Texto En el diseño de la interface gráfica se prefiere usar variables de cadenas de texto. Estas cadenas se encuentran

25

Diseño del Programa

Page 26: “Creación del Hola Mundo en Android Studio”31 Cadenas de Texto En el diseño de la interface gráfica se prefiere usar variables de cadenas de texto. Estas cadenas se encuentran

26

Diseño El diseño (lo que aparece en pantalla) se encuentra en

el archivo:

activity_main.xml

La creación del diseño de la interface puede hacerse de 2 maneras diferentes:

1) Manera Gráfica (con el editor de pantallas)2) Creando código (modificando el código XML)

Page 27: “Creación del Hola Mundo en Android Studio”31 Cadenas de Texto En el diseño de la interface gráfica se prefiere usar variables de cadenas de texto. Estas cadenas se encuentran

27

Diseño El diseño (lo que aparece en pantalla) se encuentra en

el archivo:

activity_main.xml

La creación del diseño de la interface puede hacerse de 2 maneras diferentes:

1) Editor Gráfico (con el editor de pantallas)2) Creando código (modificando el código XML)

Page 28: “Creación del Hola Mundo en Android Studio”31 Cadenas de Texto En el diseño de la interface gráfica se prefiere usar variables de cadenas de texto. Estas cadenas se encuentran

28

Diseño (1 - Editor Gráfico)

Page 29: “Creación del Hola Mundo en Android Studio”31 Cadenas de Texto En el diseño de la interface gráfica se prefiere usar variables de cadenas de texto. Estas cadenas se encuentran

29

Diseño (2 – Creando Código)

Page 30: “Creación del Hola Mundo en Android Studio”31 Cadenas de Texto En el diseño de la interface gráfica se prefiere usar variables de cadenas de texto. Estas cadenas se encuentran

30

Cadenas de Texto

Page 31: “Creación del Hola Mundo en Android Studio”31 Cadenas de Texto En el diseño de la interface gráfica se prefiere usar variables de cadenas de texto. Estas cadenas se encuentran

31

Cadenas de Texto En el diseño de la interface gráfica se prefiere usar

variables de cadenas de texto.

Estas cadenas se encuentran en el archivo:

strings.xml

Esto es así para poder cambiar de idioma fácilmente dentro de un programa, solamente cambiando el archivo “strings.xml” por otro que contenga las mismas cadenas pero en otro idioma.

Para este ejemplo aparece la cadena hello world (por default) y su contenido es “Hello world!”

Page 32: “Creación del Hola Mundo en Android Studio”31 Cadenas de Texto En el diseño de la interface gráfica se prefiere usar variables de cadenas de texto. Estas cadenas se encuentran

32

Cadenas de texto

Page 33: “Creación del Hola Mundo en Android Studio”31 Cadenas de Texto En el diseño de la interface gráfica se prefiere usar variables de cadenas de texto. Estas cadenas se encuentran

33

Lógica del Programa

Page 34: “Creación del Hola Mundo en Android Studio”31 Cadenas de Texto En el diseño de la interface gráfica se prefiere usar variables de cadenas de texto. Estas cadenas se encuentran

34

Lógica del Programa La lógica del programa se encuentra en el archivo:

MainActivity.java

Aquí se codifica toda la lógica del programa, como la interacción, el manejo de los eventos y carga de pantallas.

Page 35: “Creación del Hola Mundo en Android Studio”31 Cadenas de Texto En el diseño de la interface gráfica se prefiere usar variables de cadenas de texto. Estas cadenas se encuentran

35

Lógica del Programa

Page 36: “Creación del Hola Mundo en Android Studio”31 Cadenas de Texto En el diseño de la interface gráfica se prefiere usar variables de cadenas de texto. Estas cadenas se encuentran

36

Ejecución del Programa

Page 37: “Creación del Hola Mundo en Android Studio”31 Cadenas de Texto En el diseño de la interface gráfica se prefiere usar variables de cadenas de texto. Estas cadenas se encuentran

37

Ejecución del Programa Hacemos click en Run y aparece la siguiente ventana

donde seleccionamos:

Android Application

Y hacemos click en:

OK

Page 38: “Creación del Hola Mundo en Android Studio”31 Cadenas de Texto En el diseño de la interface gráfica se prefiere usar variables de cadenas de texto. Estas cadenas se encuentran

38

Ejecución (Pantalla 1)

Page 39: “Creación del Hola Mundo en Android Studio”31 Cadenas de Texto En el diseño de la interface gráfica se prefiere usar variables de cadenas de texto. Estas cadenas se encuentran

39

Ejecución (Pantalla 2)

Page 40: “Creación del Hola Mundo en Android Studio”31 Cadenas de Texto En el diseño de la interface gráfica se prefiere usar variables de cadenas de texto. Estas cadenas se encuentran

40

Ejecución (Pantalla 4)

Page 41: “Creación del Hola Mundo en Android Studio”31 Cadenas de Texto En el diseño de la interface gráfica se prefiere usar variables de cadenas de texto. Estas cadenas se encuentran

41

Ejecución (Pantalla 5)

Page 42: “Creación del Hola Mundo en Android Studio”31 Cadenas de Texto En el diseño de la interface gráfica se prefiere usar variables de cadenas de texto. Estas cadenas se encuentran

42

Modificación del Programa

Page 43: “Creación del Hola Mundo en Android Studio”31 Cadenas de Texto En el diseño de la interface gráfica se prefiere usar variables de cadenas de texto. Estas cadenas se encuentran

43

Modificar Mensaje Ahora modificaremos el mensaje que sale en pantalla.

Dentro del directorio:res > values

Se encuentra el archivostrings.xml

Y modificamos la línea:

Y la cambiamos por:

<string name="hello_world">Hello world!</string>

<string name="hello_world">Hola Crayola!!!</string>

Page 44: “Creación del Hola Mundo en Android Studio”31 Cadenas de Texto En el diseño de la interface gráfica se prefiere usar variables de cadenas de texto. Estas cadenas se encuentran

44

Modificar Mensaje Ahora corremos nuevamente el programa en nuestro

emulador y observaremos los cambios:

Page 45: “Creación del Hola Mundo en Android Studio”31 Cadenas de Texto En el diseño de la interface gráfica se prefiere usar variables de cadenas de texto. Estas cadenas se encuentran

45

Ejecución del Programaen el Dispositivo Móvil

Page 46: “Creación del Hola Mundo en Android Studio”31 Cadenas de Texto En el diseño de la interface gráfica se prefiere usar variables de cadenas de texto. Estas cadenas se encuentran

46

Archivo a Transferir Todo el proyecto realizado queda guardado en sun

solo archivo que tiene el mismo nombre del proyecto con extensión “.apk”:

“android_hola_mundo.apk”

Este archivo se encuentra en

Bin > res

Y este archivo hay que transferirloal dispositivo móvil

Page 47: “Creación del Hola Mundo en Android Studio”31 Cadenas de Texto En el diseño de la interface gráfica se prefiere usar variables de cadenas de texto. Estas cadenas se encuentran

47

Transferencia Bluetooth Transferimos el archivo por medio de Bluetooth a

nuestro dispositivo móvil (puede ser por cualquier otro medio):

Page 48: “Creación del Hola Mundo en Android Studio”31 Cadenas de Texto En el diseño de la interface gráfica se prefiere usar variables de cadenas de texto. Estas cadenas se encuentran

48

Ejecución en el Dispositivo real Ejecutado en un Samsung Galaxy Fit con Android 2.2