Sliding Drawer o cajón deslizable (?)
Lo que hace el Sliding Drawer es esconder contenido de un usuario dejando sólo una lengüeta visible, así el usuario puede deslizar la lengüeta para ver el contenido.
Como bien dice en http://developer.android.com este "cajón" se puede utilizar de manera vertical u horizontal. El xml está compuesto por dos hijos, uno referente al la lengüeta y otro al contenido de éste.
La plantilla que http://developer.android.com utiliza un imageView para la lengüeta, yo utilicé en este caso un botón, de manera de no tener que lidiar con imagenes. Pero lo pueden cambiar a un imageView si desean. A su vez, cambié el tipo del contenido de GridView a un simple TextView para agregar texto.
Primero, necesitan uno (o dos) templates para el fondo de la lengüeta y del contenido del cajón. En este caso yo use una plantilla de un fondo azul el cual debe colocarse en la carpeta drawable en un archivo llamado blue.xml por ejemplo.
El contenido de éste archivo es el siguiente:
Luego el xml del sliding drawer lo deben colocar dentro de un relativeLayout (o un FrameLayout) (en el xml del layout donde quieren que se vea)
Así quedó mi sliding drawer:
Lo que hace el Sliding Drawer es esconder contenido de un usuario dejando sólo una lengüeta visible, así el usuario puede deslizar la lengüeta para ver el contenido.
Como bien dice en http://developer.android.com este "cajón" se puede utilizar de manera vertical u horizontal. El xml está compuesto por dos hijos, uno referente al la lengüeta y otro al contenido de éste.
La plantilla que http://developer.android.com utiliza un imageView para la lengüeta, yo utilicé en este caso un botón, de manera de no tener que lidiar con imagenes. Pero lo pueden cambiar a un imageView si desean. A su vez, cambié el tipo del contenido de GridView a un simple TextView para agregar texto.
Primero, necesitan uno (o dos) templates para el fondo de la lengüeta y del contenido del cajón. En este caso yo use una plantilla de un fondo azul el cual debe colocarse en la carpeta drawable en un archivo llamado blue.xml por ejemplo.
El contenido de éste archivo es el siguiente:
<?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:state_pressed="true" > <shape> <solid android:color="#449def" /> <stroke android:width="1dp" android:color="#2f6699" /> <corners android:radius="3dp" /> <padding android:left="10dp" android:top="10dp" android:right="10dp" android:bottom="10dp" /> </shape> </item> <item> <shape> <gradient android:startColor="#449def" android:endColor="#2f6699" android:angle="270" /> <stroke android:width="1dp" android:color="#2f6699" /> <corners android:radius="4dp" /> <padding android:left="10dp" android:top="10dp" android:right="10dp" android:bottom="10dp" /> </shape> </item> </selector>
La lengüeta es lo que tiene el texto "ayuda". Los otros botones que ven son del proyecto en el que estoy trabajando, no tienen nada que ver con el sliding drawer |
Luego el xml del sliding drawer lo deben colocar dentro de un relativeLayout (o un FrameLayout) (en el xml del layout donde quieren que se vea)
Así quedó mi sliding drawer:
<SlidingDrawer android:id="@+id/drawer" android:layout_width="match_parent" android:layout_height="match_parent" android:handle="@+id/handle" android:content="@+id/content"> <Button android:id="@id/handle" android:layout_width="88dip" android:layout_height="44dip" android:background="@drawable/blue" android:text="ayuda" android:textColor="#ffffff"/> <TextView android:id="@id/content" android:layout_width="match_parent" android:layout_height="match_parent" android:background="@drawable/blue" android:textColor="#ffffff" android:text="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut condimentum commodo purus sit amet cursus. Pellentesque euismod nulla et mauris porttitor sit amet consectetur quam euismod. Proin augue ligula, commodo sit amet pellentesque at, bibendum in augue. Vestibulum a metus sit amet lacus porta molestie. Curabitur porta laoreet ipsum quis tincidunt. Nulla facilisi. Quisque dictum mollis ante id blandit. Nam in elit sit amet eros varius posuere id id dui. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Duis et nibh pretium nisl semper porta elementum sed justo. Sed et enim arcu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis ac nunc eu est adipiscing condimentum id nec nisl. Proin massa erat, ultrices at ullamcorper in, consectetur nec tortor. Sed sed erat ante. Morbi eu nunc mauris." /> </SlidingDrawer>