Taller de Android impartido durante el Super Happy Dev House en Ciudad Obregon, libre y actual para la version 21 de Android Development To

1. Developers Desarrollo en Android
NEXT >
@jmsalcido & @jeshuar &

2. Developers Contenido esperado…
ojo: hay teoría que debemos ver
:^)
NEXT >

3. Developers ¿Que sabes de Android?
*anímense a comentar*
NEXT >

4. Developers Que es Android
Android es el sistema operativo mas
popular para plataformas móviles.
Con Android puedes usar todas las
aplicaciones de Google que conoces y
utilizas y hay mas de 600,000 apps y
juegos disponibles para mantenerte
entretenido en la tienda:
- Google Play
NEXT >

5. Developers Por que es popular
Millones de personas ya usan
Android
por que es el núcleo de tú dispositivo.
NEXT >

6. Developers Conozcamos a Android
Android es conocido por estos dos
amigos:
Robot de Android, nosotros El Logo de Android no debe
lo llamamos Andy de cariño. usarse, ni su tipografia.
Pero eso es solo la marca.
NEXT >

7. Developers Las 3 D de Android
Quiero desarrollar YA.
Debemos
Tranquilo. hacer lo siguiente:
Hay  Diseñar
muchos pasos antes de siquiera
 Desarrollar
comenzar a desarrollar una app.
 Distribuir
Un montononal de TEORIA, que veremos
en los siguientes… 10 o 15 minutos.
DDD NEXT >

8. Developers Primer D, Diseño.
Como desarrolladores debemos conocer
las 3D de Android.
Comenzamos con la D de
D I S E Ñ O.
- UI (User Interface)
- UX (User eXperience)
NEXT >

9. Developers Tipografía
Tipografía Roboto.
Es muy importante recordar la
tipografía usada, ya que es
utilizada en diferentes tamaños
de pantalla y se creo con ese fin
especifico.
Se utiliza la tipografía: Roboto.
NEXT >

10. Developers UI – User Interface
Una app en Android tiene normalmente estos atributos:
1. Action Bar
2. View Control
3. Content Area
4. Split Action Bar
Los botones virtuales son:
- Back
- Home
- Apps abiertas
NEXT >

11. Developers UX – User eXperience
Los principios de diseño fueron desarrollados por el equipo de Android UX en Google
para mantener los intereses de los usuarios en mente. Es importante considerarlos y
usarlos.
Enchant Me Simplify My Life Make Me Amazing
NEXT >

12. Developers Android Puro
Muchos desarrolladores quieren distribuir varias apps en diferentes
plataformas al mismo tiempo, apps “multiplataforma”. Mientras planeas tu app
es importante recordar que cada plataforma tiene sus reglas y convenciones.
No hay que imitar elementos de la UI de otras plataformas
Uno de los errores mas comunes es utilizar
los bloques de la UI de otras plataformas
como iOS y Windows Phone 7 (8)
NEXT >

13. Developers Android Puro
No modificar los iconos de la plataforma o re-utilizar.
Hay iconos especiales para acciones como:
- Compartir
- Guardar
- Buscar
- Eliminar
- Favoritos
Estos son diferentes en cada plataforma, lo
ideal es no modificarlos pues el usuario esta
acostumbrado a ellos.
NEXT >

14. Developers Android Puro
No uses tab bars debajo del contenido.
iOS utiliza las barras de tabs debajo del
contenido, esa es una de sus propiedades.
En Android, se muestran en la Action Bar ó
arriba del contenido.
NEXT >

15. Developers Adios Diseño
Recordando el DISEÑO:
Enchant Me
Make Me Amazing Simplify My Life
Android Puro
NEXT >

16. Developers Segunda D, Desarrollo
La parte del código (yeei!!):
DESARROLLO
- Java
- XML
- Ambiente
- Eclipse y ADT
- Que es una app
- Desarrollar apps!
NEXT >

17. Developers Desarrollo
Hay algunas abreviaciones y conceptos que usaremos:
- ADT : Android Developer Tools
- AVD : Android Virtual Device
- Actividad: Uno de los componentes
de una aplicación.
Llamaremos actividades a las
“ventanas” de momento.
NEXT >

18. Developers Ah!, las herramientas!!!
Primero que nada, hay que descargar las herramientas:
* no sean gachos con la banda ancha, pásenlo entre ustedes *
Descargar ADT
NEXT >

19. Developers Herramientas
Las herramientas descargadas
contienen lo siguiente:
- Eclipse & ADT (IDE)
- UI Builder (IDE)
- Android SDK
- Pruebas & Debug (IDE)
NEXT >

20. Developers Java
Se cree que Google decidió usar Java por las siguientes
razones:
- Lenguaje conocido
- No hay punteros
- Corre en una maquina virtual
- Cantidad enorme de herramientas para java
- La diferencia entre C y Java no es tanta,
si fuera así, compilar en ASM es la solución
Nota: Android no corre java en tiempo de ejecución. Solamente el código
es java.
NEXT >

21. Developers XML
Se utiliza XML por que es un lenguaje sencillo de convertir y
manipular, este lenguaje puede ser convertido a un archivo
binario tan pequeño que se puede montar en un dispositivo
móvil sin ninguna preocupación.
Muchas herramientas para la creación de UI utilizan XML para
definir los elementos utilizados.
Es un lenguaje muy legible.
Parecido a HTML.
NEXT >

22. Developers Ambiente
Android y sus desarrolladores han
evolucionado mucho gracias a
Google.
Google proporciona hoy en día un
paquete llamado ADT, donde se
proveen las herramientas necesarias:
- SDK de Android
- Eclipse (IDE)
- Plugins necesarios (Eclipse)
NEXT >

23. Developers Eclipse y ADT
Vista común de
Eclipse, el IDE que
Google recomienda
para el desarrollo de
apps.
NEXT >

24. Developers Eclipse y ADT
Abrimos ADV Manager presionando el pequeño celularcito:
NEXT >

25. Developers Eclipse y ADT
Abrimos ADV Manager presionando el pequeño celularcito:
Llenamos los datos de
la siguiente manera.
NEXT >

26. Developers Proyecto de Android
Código
Librerías
Recursos
Manifiesto
NEXT >

27. Developers Que es una app
Una app de Android esta escrita en Java, el SDK compila este código y
sus recursos en un paquete llamado Android Package (APK).
Una app tiene 4 tipos de componentes (unidades que conformar un sistema):
- Actividades
- Servicios
- Content Providers
- Broadcast Receivers
NEXT >

28. Developers Creando nuestra primera app
- Creamos un proyecto en ADT
- Le damos Start/Inicio a nuestro AVD:
Prueba
- Creamos un nuevo proyecto de
Android.
NEXT >

29. Developers Creando nuestra primera app
Llenaremos los datos
como lo vemos en la
imagen.
Es importante recordar el
campo Minimum
Required SDK es la
versión mas baja que
será soportada por
nuestra app.
NEXT >

30. Developers Creando nuestra primera app
Seguimos al asistente…
NEXT >
NEXT >

31. Developers Creando nuestra primera app
Seguimos al asistente…
NEXT >
NEXT >

32. Developers Creando nuestra primera app
Seguimos al asistente…
NEXT >
NEXT >

33. Developers Creando nuestra primera app
Tendremos esta
ventana en ADT.
Este es el editor de
UI.
NEXT >

34. Developers Creando nuestra primera app
Para ejecutar nuestra app
solo clickeamos en:
NEXT >

35. Developers Examinando el código…
package personal.nombre.prueba;
import android.os.Bundle;
import android.app.Activity;
public class MainActivity extends Activity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
}
}
NEXT >

36. Developers Modificando nuestra primer app.
Vamos a utilizar solo 2
elementos disponibles
para crear
aplicaciones, un botón y
una entrada de texto
simple.
Y usaremos 2 ventanas
para lograr esto.
NEXT >

37. Developers Construyendo la UI
Las interfaces graficas de Android están construidas usando una
jerarquía de vistas.
- View: Una sola unidad de vista.
- ViewGroup: Grupo de vistas que puede contener mas grupos.
NEXT >

38. Developers Agregando un LinearLayout
Un LinearLayout es un viewgroup que deja poner vistas en orientación
horizontal ó vertical.
Borraremos el contenido del archivo res/layout/activity_main.xml y
escribiremos el contenido del siguiente snippet de codigo.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal" >
</LinearLayout>
NEXT >

39. Developers Agregando un TextField
Un TextField es un campo que puede ser modificado por el usuario.
Dentro del Layout agregado anteriormente agregamos el siguiente
código:
<EditText android:id="@+id/edit_message"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:hint="@string/edit_message" />
Los atributos de cada Objeto XML son importantes.
NEXT >

40. Developers Strings como recursos
Modificaremos el archivo res/values/strings.xml que es el archivo que
contiene los strings que estarán guardados como recursos.
<string name="edit_message">Enter a message</string>
<string name="button_send">Send</string>
Guardar los strings como recurso facilitara la internacionalización de
nuestra app.
NEXT >

41. Developers Agregando un botón
Agregaremos un botón después del TextField anterior.
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/button_send" />
Todo esto lo podemos crear con el editor de Eclipse, pero es mejor escribirlo
para aprender.
NEXT >

42. Developers ¿cómo vamos?
La vista del editor grafico, nos debe
mostrar la siguiente interfaz.
NEXT >

43. Developers Se ve como que feíto…
Para hacer que la caja de texto
tome mas espacio, es necesario
aplicarle PESO a nuestra vista.
Agregamos lo siguiente al
EditText:
android:layout_weight="1"
Y se vera como el snippet de:
https://gist.github.com/jmsalcido/5016020
NEXT >

44. Developers Haciendo funcionar el botón Send
Para hacer funcionar el botón Send necesitamos hacer lo siguiente:
- Agregarle la función onClick al boton en el objeto XML
android:onClick="sendMessage"
- Agregarle la rutina/método al archivo que nos genero Eclipse en la carpeta src/
public void sendMessage(View view) {
// Responder al evento
}
NEXT >

45. Developers Haciendo funcionar el botón Send
Necesitaremos hacer uso de los Intents y conocer lo que es una Actividad.
Que es un Intent Que es una actividad
NEXT >

46. Developers Haciendo funcionar el botón Send
Primero crearemos la actividad nueva, siguiendo el asistente. Le damos
a:
NEXT >

47. Developers Haciendo funcionar el botón Send
Necesitamos hacer que nuestra aplicación obtenga el texto del campo y lo mande por
un Intent, agregaremos el siguiente código al método sendMessage de MainActivity:
public final static String EXTRA_MESSAGE = "com.example.myfirstapp.MESSAGE";
public void sendMessage(View view) {
Intent intent = new Intent(this, DisplayMessageActivity.class);
EditText editText =
(EditText) findViewById(R.id.edit_message);
String message = editText.getText().toString();
intent.putExtra(EXTRA_MESSAGE, message);
startActivity(intent);
}
NEXT >

48. Developers Haciendo funcionar el botón Send
En la segunda actividad: DisplayMessageActivity
super.onCreate(savedInstanceState);
// Obtener el intent y el mensaje
Intent intent = getIntent();
String message = intent.getStringExtra(MainActivity.EXTRA_MESSAGE);
// Crear TextView
TextView textView = new TextView(this);
textView.setTextSize(40);
textView.setText(message);
// Darle la vista a la activity
setContentView(textView);
NEXT >

49. Developers Terminada la primer app
NEXT >

50. Developers <jesus>
NEXT >

51. Developers NO estamos locos
No, no estamos locos, toda la información la pueden encontrar en:
http://developer.android.com/
En ingles, obviamente.
NEXT >

52. Developers CODEAR!!!
Quien se anime a codear una app hoy, en
hora buena vamos a darle y la
distribuimos, ¿qué les parece?
NEXT >

53. Developers <Titulo>

54. Developers titel
NEXT >