PROGRAMACIÓN MULTIDISPOSITIVO EN ANDROID

Seminario impartido por Juan Miguel Muñoz Rondán para Javahispano y Paradigma Tecnologico en la Universidad CEU San Pablo de Madrid, Abril 2013
Más detalles en http://www.paradigmatecnologico.com/seminarios/programacion-multidispositivo-en-android/

Transcript

1. PROGRAMACIÓN MULTIDISPOSITIVO EN ANDROID Juan Miguel Muñoz Rondán 1
2. BIBLIOGRAFÍA  Android in Action (Third Edition)  http://www.manning.com/ableson3/  Programming Android (2nd Edition)  http://shop.oreilly.com/product/0636920010364.do  Android developers  http://developer.android.com/index.html 2
3. ESTILOS (WINDOWS PHONE)
4. ESTILOS (IPHONE)
5. ESTILOS (ANDROID)
6. FRAGMENTACIÓN 6
7. FRAGMENTACIÓN: VERSIONES Abril 2013 7
8. FRAGMENTACIÓN : PANTALLAS 8
9. INDICE 1. Android 4.0, estandadarización de estilos. 2. Métricas. 3. Componentes multidispositivos: Action Bar. 4. Componentes para la programación para tablets: Fragments. 5. Patrones para la programación multidispositivo. 9
10. ANDROID 4.0 ESTILOS 10
11. ESTANDARIZACIÓN VISUAL 11 Status Bar Action Bar Content Area Navigation Bar
12. ESTANDARIZACIÓN VISUAL  Usar elementos de Android (no imitar a otras plataformas)  No utilizar botón “back”
13. ESTANDARIZACIÓN VISUAL  No utilizar TabBars en la parte baja de la pantalla.  No usar icono “arrow”
14. MÉTRICAS 14
15. TAMAÑO Y DENSIDAD  Tamaño de pantalla  Es el tamaño real de la pantalla (inches) pulgadas.  La medida la proporciona la diagonal.  Densidad  Cantidad de pixeles dentro de una porción real.  Se utiliza dpi (dots per inch) puntos por pulgada. 15
16. DENSITY-INDEPENDENT PIXELS  Dp (Density-Independent Pixels)  Representa un punto de tamaño real.  Independiente de la densidad de puntos por pulgada.  1dp = 1px (mdpi)  Sp (Scale-independent Pixels)  Como dp, salvo que su tamaño depende del tamaño de la fuente en la preferencias  Indicado para los textos. 16
17. CUALIFICADORES DE RECURSOS  Un cualificador indica a Android que tipo de recurso debe utilizar.  Carpeta <resources_name>-<config_qualifier>  Resources_name es el nombre del directorio de recursos estandar (layout, drawable).  Config_qualifier especifica una característica para que se utilice esta carpeta en los dispositivos que lo cumplan 17
18. CUALIFICADORES DE RECURSOS 18  -ldpi, -mdpi, -hdpi, -xdpi  -small, -normal, -large, -xlarge  -land, -port  -sw<N>dp (-sw600dp, -sw720dp)
19. TIPOS DE TAMAÑO  Small  426dp x 320dp  Normal  470dp x 320dp  Large  640dp x 480dp  Xlarge (Extra Large)  960dp x 720 19
20. TIPOS DE DENSIDADES 20  ldpi  Low density (~120dpi)  mdpi  Medium density (~160dpi)  hdpi  High density (~240dpi)  xhdpi  Extra high density (~320dpi)  Xxhdpi  Extra extra high density  Densidad no especificada (~480dpi) 2.0 1.5 1.0 0.75 Patrón “48dp”
21. TABLA TAMAÑOS Y DENSIDADES 21
22. ACTION BAR 22
23. ACTION BAR Main Action Bar 23 View controls Bottom Bar
24. ACTION BAR Main Action Bar 24
25. ACTION BAR : MAIN ACTION BAR 25  App icon  Icono de aplicación .  Proporciona una acceso a la vista jerárquicamente superior.  Aunque parecido, el botón “back” no vuelve a la vista jerárquicamente superior, sino a la vista anterior.
26. ACTION BAR : MAIN ACTION BAR 26  View control  Permite la navegación hacía las diferentes vistas.  Tiene el nombre de la vista actual.  Además del spinner existe la navegación por tabs.
27. ACTION BAR : MAIN ACTION BAR 27  Action buttons  Muestra iconos de las funciones más importantes.  Tres tipos de iconos:  Frecuentes. Siempre aparecen.  Importantes. Aparecen si hay espacio  Típico. No aparecerá nunca y se ubicaran en la lista de botones poco frecuentes.
28. ACTION BAR : MAIN ACTION BAR 28  Action overflow  Muestra iconos de las funciones menos importantes.  Dependiendo del tamaño y de la orientación del dispositivo se mostrarán más o menos iconos.
29. ACTION BAR: ACTION BUTTONS 29  Menos de 360dp = 2 iconos.  360-499dp = 3 iconos  500-599dp = 4 iconos  Más de 600dp = 5 iconos
30. ACTION BAR Main Action Bar 30 Tab Bar
31. ACTION BAR : VIEW CONTROLS 31  Fixed Tab  Fácil mecanismo para cambiar de vista.  Siempre visibles.  Tres pestañas recomendadas.  Scrolled Tab  Se usan cuando hay muchas vistas disponibles.  Ocupan todo el ancho de pantalla  Spiner  Es un menu drop-down.  No hay una barra visible.  Ocupan menos espacio.
32. ACTION BAR Main Action Bar 32 View controls Bottom Bar
33. ACTION BAR: BOTTOM BAR  Barra inferior, utilizada cuando se requiere mostrar más iconos que los que se permiten en el action bar. 33
34. ACTION BAR: COMPATIBILIDAD  Dispositivos con “antiguo” botón menu. 34
35. ACTION BAR: COMPATIBILIDAD  Aplicaciones con “antiguo” menu. 35
36. ACTION BAR  Aporta:  Uso intuitivo de la aplicación.  Desarrollo para diferentes dispositivos (teléfonos o tablets), mucho más rápido y sencillo.  Hacen las interfaces Android más atractivas y homogéneas. 36
37. FRAGMENTS 37
38. TABLET  Mucho “aire” en las interfaces de usuario.  Solución:  Esconder Vistas y mostrarlas desde una Activity  Los desarrolladores demandaban una solución con un comportamiento consistente.  Elementos reutilizables  Fragments 38
39. FRAGMENTS  Un Fragment se encarga de controlar el comportamiento de una porción de la interfaz de usuario de una Activity. 39
40. FRAGMENTS  Tiene su propio ciclo de vida.  Su ciclo de vida está totalmente ligado al ciclo de vida de una Activity.  Recibe eventos de entrada.  No tienen contexto propio. Su contexto es el de la activity a la que están ligados.  Se podría definir como una “sub-activity”. 40
41. FRAGMENTS. CICLO DE VIDA • OnAtach. • Cuando el fragment es asociado a su activity. • onCreate. • Estado inicial de la creación del fragment. • onCreateView. • Cuando el fragment se le ha asociado la vista. • onActivityCreated. • Cuando la activity padre ha competado su propio onCreate(). • onStart. • Cuando el fragment esta visible. • onResume. • Cuando la fragmente puede interactuar con el usuario 41
42. FRAGMENTS. CICLO DE VIDA • OnPause. • Cuando el fragment ha dejado de interactuar con el usuario • onStop. • Cuando el fragment ya no es visible por el usuario • onDestroyView. • Cuando el fragment limpia los recursos asociados con su vista. • onDestroy. • Estado final del fragment. • onDetach. • Se llama justo antes de dejar de estár asociado a la activity 42
43. FRAGMENTS. ASOCIAR A LA ACTIVITY  Mediante XML: <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/main_view" android:orientation="horizontal" android:layout_width="match_parent" android:layout_height="match_parent"> <fragment class="com.paradigma.seminario.ListFragment" android:id="@+id/frag_summary_listview" android:tag="summary_listview" android:layout_width=" match_parent " android:layout_height="match_parent" android:layout_weight="1" android:padding="10dp" /> </LinearLayout> 43
44. FRAGMENTS. ASOCIAR A LA ACTIVITY  Programáticamente con Fragment Manager <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android” android:orientation="horizontal" android:layout_width="match_parent" android:layout_height="match_parent"> <FrameLayout android:id="@+id/frame_fragment” android:layout_width="0dp" android:layout_height="match_parent" /> </LinearLayout> ExampleFragment exampleEragment = new ExampleFragment(); FragmentManager fragmentManager = getFragmentManager(); FragmentTransaction transacion = fragmentManager.beginTransaction(); transacion.add( R.id.frameFragment1, exampleEragment ); transaction.addToBackStack(null); transacion.commit(); 44
45. FRAGMENTS.TIPOS  Fragment  ListFragment  Fragment con métodos para la visualización de una lista de elementos.  WebFragment  Fragment para visualizar una web.  DialogFragment  Fragment para un dialog.  PreferenceFragment  Muestra una lista de objetos por categorías. 45
46. FRAGMENTS. COMUNICACIÓN  Utilizando un listener public class SummaryListFragment extends ListFragment { OnArticleSelectedListener mListener; … @Override public void onAttach(Activity activity) { super.onAttach(activity); try { mListener = (OnArticleSelectedListener) activity; } catch (ClassCastException e) { throws … } } 46 public interface OnArticleSelectedListener { public void onArticleSelected(String url); }
47. FRAGMENTS. COMUNICACIÓN  La activity padre debe implementar la intefaz del listener y operar cuando se llame al listener. public class MainActivity extends Activity implements SummaryListFragment.OnArticleSelectedListener{ … @Override public void onArticleSelected(String url_selected) { current_url = url_selected; launchDetailWebFragment(); } 47
48. SOPORTE PARA VERSIONES ANTIGUAS  El uso de Fragments apareció en la versión 3.0.  Más de la mitad de los dispositivos funcionan sobre una versión anterior a la 3.0. 48  Android provee una biblioteca de soporte:  android.support.v4 (Soporte para v4 o superior).  android.support.v13 (Soporte para v13 o superior).
49. FRAGMENTS. RECOMENDACIONES  No utilizar asociaciones de Fragments programáticas o dínamicas en XML <fragments>  No utilizar constructores con parámetros, todos deben ser sin parámetros.  Reutilizar Fragments.  No es recomendable el uso de “Fragments para todo”. Si la aplicación es solo para móvil, debería construirse utilizando únicamente activities. 49
50. TÉCNICAS PARA EL DESARROLLO MULTIDISPOSITIVO EN ANDROID 50
51. SOPORTE PARA TABLETS Y MÓVILES 51
52. SOPORTE PARA TABLETS Y MÓVILES  Uso de cualificadores para determinar en tiempo de ejecución los recursos de los distintos tipos de dispositivos.  Recursos distintos dependiendo del dispositivo en tiempo real.  res/values-large/layouts.xml  res/values/layouts.xml 52
53. SOPORTE PARA TABLETS Y MÓVILES  res/layout/main.xml 53
54. SOPORTE PARA TABLETS Y MÓVILES  res/layout-large/main.xml 54
55. SOPORTE PARA TABLETS Y MÓVILES  Ejecución de código según el tipo de dispositivo 55
56. MULTI-PANE LAYOUTS  Mecanismo de integración de varias vistas para adaptarse a los diferentes tamaños de pantallas.  Tipos: Adaptación Collapse Show/Hide
57. GRACIAS POR SU ATENCIÓN 57 juanminet@gmail.com jmmunoz@paradigmatecnologico.com