Patrón de panel de control Android

En el último post de blog de Android de Tim Bray menciona el patrón ui del "panel" (lo que se usa para la aplicación de Twitter, la aplicación de Facebook, etc. ¿Es este diseño tan simple como un GridView con botones o es algo más?

Actualizar:

El DashboardLayout fue lanzado por Roman Nurik anoche. Es un derivado del diseño utilizado en la aplicación Google IO 2010.

    El mejor ejemplo que puedes usar es la aplicación Android de Google I / O 2011. Implementan todos esos patrones de diseño en su aplicación. Puede encontrar el código en el siguiente enlace:

    http://code.google.com/p/iosched/source/browse/android/res/layout/fragment_dashboard.xml?r=27a82ff10b436da5914a3961df245ff8f66b6252

    La versión 2011 utiliza un diseño personalizado llamado 'DashboardLayout' en un fragmento que se comparte en los diseños específicos de teléfono y tableta. ¡La lógica en DashboardLayout es responsable de toda la magia de diseño automático!

    Código de DashboardLayout de la aplicación de IO 2010 era bastante buggy. Pero Roman Nurik lo ha arreglado y ahora es posible utilizar DashboardLayout fácilmente en su aplicación.

    Cómo:

    1. Agregue esta clase a su proyecto
    2. En tu diseño, solo tienes que soltar algunos botones dentro de DashboardLayout, similar a aquí .

    Pude conseguir un tablero similar usando un diseño relativo. Su aún un trabajo en progreso, por lo que su kilometraje puede variar.

    <?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/lay_wrapper" android:layout_width="fill_parent" android:layout_height="wrap_content" > <LinearLayout android:id="@+id/lay_action" android:layout_width="fill_parent" android:layout_height="wrap_content" android:background="#000000" > <TextView android:id="@+id/label_header" android:layout_width="wrap_content" android:layout_height="50px" android:text="@string/app_title" android:textColor="#000000" android:textSize="25sp" android:paddingLeft="10px" android:gravity="center_vertical" android:layout_gravity="center_vertical" /> </LinearLayout> <RelativeLayout android:id="@+id/lay_main" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_below="@id/lay_action" android:paddingTop="25px" android:layout_centerInParent="true"> <Button android:id="@+id/button1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/button1" android:padding="25dip" android:drawableTop="@drawable/button1" /> <Button android:id="@+id/button2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_toRightOf="@id/button1" android:text="@string/button2" android:padding="25dip" android:drawableTop="@drawable/button2" /> <Button android:id="@+id/button3" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_below="@id/button1" android:text="@string/button3" android:padding="25dip" android:drawableTop="@drawable/button3" /> <Button android:id="@+id/button4" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_toRightOf="@id/button3" android:layout_below="@id/button2" android:text="@string/button4" android:padding="25dip" android:drawableTop="@drawable/button4" /> </RelativeLayout> </RelativeLayout> 

    El diseño del tablero de instrumentos no funcionó para mí, así que sugiero una solución basada en diseño. Es solo un montón de diseños dentro de los diseños.

    La clave es la relatividad de los pesos entre los diseños de espaciado y los diseños de contenido.

    Simplemente puede mover iconos y definir otros diseños para tableros más grandes o más claros.

    Así es como se ve:

    retrato

    Y aquí está el xml:

     <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/dashboard" android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="vertical" > <FrameLayout style="@style/dashboard_space_vertical" /> <LinearLayout style="@style/dashboard_content_vertical" > <FrameLayout style="@style/dashboard_space_horizontal" > </FrameLayout> <LinearLayout style="@style/dashboard_content_horizontal" > <ImageView style="@style/dashboard_imageview" android:src="@android:drawable/sym_call_missed" /> <TextView style="@style/dashboard_textview" android:text="Text 1" /> </LinearLayout> <FrameLayout style="@style/dashboard_space_horizontal" /> <LinearLayout style="@style/dashboard_content_horizontal" > <ImageView style="@style/dashboard_imageview" android:src="@android:drawable/sym_call_missed" /> <TextView style="@style/dashboard_textview" android:text="Text 2" /> </LinearLayout> <FrameLayout style="@style/dashboard_space_horizontal" /> </LinearLayout> <FrameLayout style="@style/dashboard_space_vertical" /> <LinearLayout style="@style/dashboard_content_vertical" > <FrameLayout style="@style/dashboard_space_horizontal" /> <LinearLayout style="@style/dashboard_content_horizontal" > <ImageView style="@style/dashboard_imageview" android:src="@android:drawable/sym_call_missed" /> <TextView style="@style/dashboard_textview" android:text="Text 3" /> </LinearLayout> <FrameLayout style="@style/dashboard_space_horizontal" /> <LinearLayout style="@style/dashboard_content_horizontal" > <ImageView style="@style/dashboard_imageview" android:src="@android:drawable/sym_call_missed" /> <TextView style="@style/dashboard_textview" android:text="Text 4" /> </LinearLayout> <FrameLayout style="@style/dashboard_space_horizontal" /> </LinearLayout> <FrameLayout style="@style/dashboard_space_vertical" /> <LinearLayout style="@style/dashboard_content_vertical" > <FrameLayout style="@style/dashboard_space_horizontal" /> <LinearLayout style="@style/dashboard_content_horizontal" > <ImageView style="@style/dashboard_imageview" android:src="@android:drawable/sym_call_missed" /> <TextView style="@style/dashboard_textview" android:text="Text 5" /> </LinearLayout> <FrameLayout style="@style/dashboard_space_horizontal" /> <LinearLayout style="@style/dashboard_content_horizontal" > <ImageView style="@style/dashboard_imageview" android:src="@android:drawable/sym_call_missed" /> <TextView style="@style/dashboard_textview" android:text="Text 6" /> </LinearLayout> <FrameLayout style="@style/dashboard_space_horizontal" /> </LinearLayout> <FrameLayout style="@style/dashboard_space_vertical" /> </LinearLayout> 

    Aquí están los estilos:

     <resources> <style name="dashboard_space_vertical"> <item name="android:layout_width">fill_parent</item> <item name="android:layout_height">0px</item> <item name="android:layout_weight">1</item> </style> <style name="dashboard_content_vertical"> <item name="android:layout_width">fill_parent</item> <item name="android:layout_height">0px</item> <item name="android:layout_weight">3</item> <item name="android:layout_gravity">center</item> </style> <style name="dashboard_space_horizontal"> <item name="android:layout_width">0px</item> <item name="android:layout_height">fill_parent</item> <item name="android:layout_weight">2</item> <!-- <item name="android:background">@color/black</item> --> </style> <style name="dashboard_content_horizontal"> <item name="android:layout_width">0px</item> <item name="android:layout_height">fill_parent</item> <item name="android:layout_weight">3</item> <item name="android:orientation">vertical</item> <item name="android:layout_gravity">center</item> <item name="android:gravity">center</item> </style> <style name="dashboard_imageview"> <item name="android:layout_width">fill_parent</item> <item name="android:layout_height">fill_parent</item> <item name="android:layout_weight">1</item> <item name="android:scaleType">fitCenter</item> </style> <style name="dashboard_textview"> <item name="android:layout_width">fill_parent</item> <item name="android:layout_height">wrap_content</item> <item name="android:gravity">center</item> <item name="android:textSize">@dimen/dashboard_thumbnail_text_size</item> <item name="android:textStyle">bold</item> <item name="android:textColor">@color/blue</item> </style> </resources> 

    Espero que esto ayude a alguien. Disfrutar.

    Tal vez este enlace es útil, por favor revise el código fuente de la muestra adjunto en el blog.

    http://blahti.wordpress.com/2011/03/14/build-dashboard-ui-for-android/

    Se podría implementar con un TableLayout que contiene Image- y TextViews.

    La mejor y la forma más sencilla de crear Dashboard ..

    Muy bien explicado

    Cómo construir una interfaz de usuario Dashboard en Android

    Romannurik publicó recientemente un ViewGroup personalizado para hacer esto. El código está aquí .

    FlipAndroid es un fan de Google para Android, Todo sobre Android Phones, Android Wear, Android Dev y Aplicaciones para Android Aplicaciones.