Cómo crear Google + tarjetas de interfaz de usuario en una vista de lista?
Quiero crear una listView de tarjetas, pero después de leer este blog post goolge-plus-layout , soy tarjetas son una solución viable para una lista de cualquier cosa. La parte de animación parece demasiado intensiva de memoria para cargar, diga un listview con más de 40 elementos simultáneamente.
¿Hay una mejor manera de lograr una tarjeta de interfaz de usuario en listView?
- Ajustar el ajuste de la panorámica no parece funcionar en JellyBean 4.2.2-4.1.2
- Cajón de navegación Elementos que no registran el evento de clic
- Haciendo clic en el fragmento invoca actividad detrás de él
- La selección de ListView permanece persistente después de salir del modo de selección
- Deslice ListView de lado como en la nueva aplicación de GMail
- ArrayAdapter de Android: agrega lista de cadenas en lugar de reemplazar
- Vista de lista expandible setOnChildClickListener no funciona
- ¿Cómo utilizar desplazamiento rápido en android?
- Custom getFilter en ArrayAdapter personalizado en android
- ¿Cuándo usar carga perezosa y cuándo no usar.?
- Botón Android Hecho en lugar de Siguiente
- ScrollView distrubing ListView dentro de LinearLayout
- Cómo filtrar ListView utilizando getFilter () en BaseAdapter
Puede crear un dibujable personalizado y aplicarlo a cada uno de los elementos de listview.
Yo uso este para las tarjetas en mi interfaz de usuario. No creo que haya problemas de rendimiento significativos con este enfoque.
El código dibujable (en drawable \ big_card.xml) tiene este aspecto:
<?xml version="1.0" encoding="utf-8"?> <layer-list xmlns:android="http://schemas.android.com/apk/res/android" > <item> <shape android:shape="rectangle" > <solid android:color="@color/second_grey" /> </shape> </item> <item android:bottom="10dp" android:left="10dp" android:right="10dp" android:top="10dp"> <shape android:shape="rectangle" > <corners android:radius="3dp" /> <solid android:color="@color/card_shadow" /> </shape> </item> <item android:bottom="12dp" android:left="10dp" android:right="10dp" android:top="10dp"> <shape android:shape="rectangle" > <corners android:radius="3dp" /> <solid android:color="@color/card_white" /> </shape> </item> </layer-list>
Aplicar el fondo a mis elementos listview como este:
<ListView android:id="@+id/apps_fragment_list" android:layout_width="fill_parent" android:layout_height="wrap_content" android:listSelector="@drawable/big_card" />
Si desea añadir esto como un fondo a cualquier vista (no sólo una lista), sólo tiene que hacer la costumbre dibujable que ver elemento de fondo:
<TextView android:id="@+id/any_view" android:layout_width="fill_parent" android:layout_height="wrap_content" android:background="@drawable/big_card" />
EDIT: Google proporciona una clase agradable llamada CardView . No lo comprobé, pero parece prometedor.
Esta es la manera anterior, que también funciona bien (eso es lo que escribí antes de la edición):
Hay un buen tutorial aquí y una buena muestra de ello aquí .
En resumen, estos son los archivos que puede crear:
ListView definición:
android:divider="@null" android:dividerHeight="10dp" android:listSelector="@android:color/transparent" android:cacheColorHint="@android:color/transparent" android:headerDividersEnabled="true" android:footerDividersEnabled="true"
también esto:
m_list.addHeaderView(new View(this)); m_list.addFooterView(new View(this));
Res / drawable / selector_card_background.xml
<?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:state_pressed="true" android:drawable="@drawable/layer_card_background_selected" /> <item android:drawable="@drawable/layer_card_background" /> </selector>
ListView artículo:
Res / layout / list_item_card.xml
<?xml version="1.0" encoding="utf-8"?> <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="wrap_content" android:paddingLeft="15dp" android:paddingRight="15dp" android:descendantFocusability="beforeDescendants"> <LinearLayout android:orientation="vertical" android:layout_width="match_parent" android:layout_height="wrap_content" android:paddingLeft="15dp" android:paddingTop="15dp" android:paddingBottom="15dp" android:paddingRight="15dp" android:background="@drawable/selector_card_background" android:descendantFocusability="afterDescendants"> <TextView android:id="@+id/text1" android:layout_width="wrap_content" android:layout_height="wrap_content"/> <TextView android:id="@+id/text2" android:layout_width="wrap_content" android:layout_height="wrap_content"/> <TextView android:id="@+id/text3" android:layout_width="wrap_content" android:layout_height="wrap_content"/> </LinearLayout> </FrameLayout>
Res / drawable / layer_card_background_selected.xml
<?xml version="1.0" encoding="utf-8"?> <layer-list xmlns:android="http://schemas.android.com/apk/res/android"> <item> <shape android:shape="rectangle"> <solid android:color="#CABBBBBB"/> <corners android:radius="2dp" /> </shape> </item> <item android:left="0dp" android:right="0dp" android:top="0dp" android:bottom="2dp"> <shape android:shape="rectangle"> <solid android:color="#CCCCCC"/> <corners android:radius="2dp" /> </shape> </item> </layer-list>
Res / drawable / layer_card_background.xml
<?xml version="1.0" encoding="utf-8"?> <layer-list xmlns:android="http://schemas.android.com/apk/res/android"> <item> <shape android:shape="rectangle"> <solid android:color="#CABBBBBB"/> <corners android:radius="2dp" /> </shape> </item> <item android:left="0dp" android:right="0dp" android:top="0dp" android:bottom="2dp"> <shape android:shape="rectangle"> <solid android:color="@android:color/white"/> <corners android:radius="2dp" /> </shape> </item> </layer-list>
Tal vez usted puede probar esta tarjetaPlusUI
He utilizado esto para algunos mi proyecto
Si todo lo que quieres es un ListView que simula las tarjetas, mira puedes usar un parche de 9 como fondo para tus listitems para que se parezcan a las tarjetas. Usted puede encontrar un parche 9 y algunos más consejos y explicaciones aquí: http://www.tiemenschut.com/simply-get-cards-ui-look/
Añadir divisor para el elemento Listview y relleno:
android:divider="@android:color/transparent" android:dividerHeight="1dip"
Agregue RelativeLayout en su LinearLayout para ListItem con el relleno deseado:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="100dp" android:orientation="vertical" android:padding="3dp" > <RelativeLayout android:layout_width="match_parent" android:layout_height="match_parent" android:background="@drawable/rowshadow" > <TextView android:id="@+id/title" android:layout_width="wrap_content" android:layout_height="wrap_content" ...
Agregar fondo al elemento de vista de lista, como:
<?xml version="1.0" encoding="utf-8"?> <layer-list xmlns:android="http://schemas.android.com/apk/res/android"> <item > <shape android:shape="rectangle"> <solid android:color="@android:color/darker_gray" /> <corners android:radius="0dp"/> </shape> </item> <item android:right="1dp" android:left="1dp" android:bottom="2dp"> <shape android:shape="rectangle"> <solid android:color="@android:color/white"/> <corners android:radius="0dp"/> </shape> </item> </layer-list>
Utilice https://github.com/elcrion/demo.cardlistview como ejemplo. Es de alguna manera cerca de google estilo
Hay una biblioteca que ayuda a crear tarjetas de interfaz de usuario en android https://github.com/gabrielemariotti/cardslib
Como " desarrollador android " menciona brevemente en su respuesta, la clase CardView se puede utilizar para crear fácilmente vistas de tarjeta.
Simplemente envuelva los widgets de interfaz de usuario en un elemento CardView y ya está listo. Vea la breve introducción al widget CardView en https://developer.android.com/training/material/lists-cards.html#CardView .
La clase CardView requiere una biblioteca de soporte v7 , recuerde agregar las dependencias a su archivo .gradle!
compile 'com.android.support:cardview-v7:21.0.+'
- Error al resolver: com.android.support.design:25.4.0
- ¿Cómo puedo desbloquear la pantalla mediante programación en Android?