Как создать пользовательский интерфейс Google + в виде списка?

Я хочу создать listView карт, но после прочтения этого блога goolge-plus-layout , я являюсь жизнеспособным решением для списка чего-либо. Анимационная часть кажется слишком загруженной памятью для загрузки, например, списком с более чем 40 элементами одновременно.

Есть ли лучший способ для достижения пользовательского интерфейса карт в ListView?

Вы можете создать пользовательский способ рисования и применить его к каждому элементу списка.

Я использую этот для карт в своем интерфейсе. Я не думаю, что с этим подходом возникают серьезные проблемы с производительностью.

Выбираемый код (в drawable \ big_card.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="@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> 

Я применяю фон к моим элементам списка, например:

 <ListView android:id="@+id/apps_fragment_list" android:layout_width="fill_parent" android:layout_height="wrap_content" android:listSelector="@drawable/big_card" /> 

Если вы хотите добавить это как фон к любому представлению (а не только к списку), вы просто сделаете пользовательский доступный для этого элемента фона View:

 <TextView android:id="@+id/any_view" android:layout_width="fill_parent" android:layout_height="wrap_content" android:background="@drawable/big_card" /> 

EDIT: Google предоставляет класс класса CardView . Я не проверял, но выглядит многообещающе.

Вот предыдущий способ, который также отлично работает (вот что я написал перед редактированием):

Здесь есть хороший учебник и хороший образец его здесь .

Короче говоря, это файлы, которые вы можете создать:

ListView определение:

 android:divider="@null" android:dividerHeight="10dp" android:listSelector="@android:color/transparent" android:cacheColorHint="@android:color/transparent" android:headerDividersEnabled="true" android:footerDividersEnabled="true" 

Также это:

 m_list.addHeaderView(new View(this)); m_list.addFooterView(new View(this)); 

Рез / рисуем / 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:

разреш / макет / 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> 

Рез / рисуем / 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> 

Рез / рисуем / 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> 

Возможно, вы можете попробовать этот cardPlusUI

Я использовал это для своего проекта

Если все, что вам нужно, это ListView, который имитирует образы карт, вы можете использовать 9-патч в качестве фона для своих списков, чтобы они выглядели как карты. Вы можете найти 9-патч и несколько советов и объяснений здесь: http://www.tiemenschut.com/simply-get-cards-ui-look/

Добавить разделитель для элемента Listview и дополнения:

  android:divider="@android:color/transparent" android:dividerHeight="1dip" 

Добавьте RelativeLayout в LinearLayout для ListItem с некоторым желаемым заполнением:

 <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" ... 

Добавьте фон в элемент списка, например:

 <?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> 

В качестве примера используйте https://github.com/elcrion/demo.cardlistview . Это как-то близко к стилю google

Существует библиотека, которая помогает создавать карты пользовательского интерфейса в android https://github.com/gabrielemariotti/cardslib

Поскольку « разработчик Android » вкратце упомянул в своем ответе, класс CardView можно использовать для легкого создания видов карт.

Просто оберните виджеты пользовательского интерфейса в элементе CardView, и вы готовы к работе. См. Краткое введение в виджет CardView на странице https://developer.android.com/training/material/lists-cards.html#CardView .

Для класса CardView требуется библиотека поддержки v7 , не забудьте добавить зависимости в ваш файл .gradle!

 compile 'com.android.support:cardview-v7:21.0.+'