GridView с разными размерами ячеек, стиль pinterest

Фон

GridView - это класс, который расширяет AdapterView, что означает, что он эффективно отображает ячейки в сетке, перерабатывая старые представления, которые будут отображаться как новые, когда пользователь прокручивает его.

Проблема

Иногда вы хотели бы получить специальный пользовательский интерфейс, который напоминает интерфейс Windows Phone Tiles UI, имеющий ячейки разных размеров друг над другом.

Что-то вроде этого:

AABB
AACC
AADD
AADD

каждая буква представляет собой часть его ячейки, поэтому ячейка A равна 2x4, ячейка B и ячейка C принимают по 2х каждый, а ячейка D - 2x2.

Это может быть даже больше, чем когда ячейка D закончила немного выше того, что я показал, а прямо под ней есть еще одна ячейка, поэтому конец D и конец A не обязательно выровнены.

пример приложения, имеющего этот стиль, pinterest.

GridView не допускает такой вещи.

На самом деле, каждое решение, которое я пробовал, имеет проблемы. Хотелось бы спросить, есть ли другие альтернативы или лучшие решения.

Что я нашел

Существует несколько способов решения этой проблемы:

Как класс, который расширяет AdapterView GridView имеет возможность иметь тип для каждого элемента (с помощью BaseAdapter), который позволит вам установить способ компоновки ячейка.

Тем не менее, он все еще ограничивает вас, так как вы получите строки элементов, один под другим. вы должны согласовать их.
GridLayout - относительно новый макет, и он довольно гибкий. Google опубликовал для него хорошую библиотеку совместимости, поддерживая API7 и выше.

Однако он не использует переработку просмотров, поэтому это плохой выбор, если вы хотите показать много предметов.

Если у вас много элементов, вам нужно будет создать для них все представления.
Библиотека QuiltView - выходит из GridLayout, поэтому в основном имеет такую же проблему, как и она.
StaggeredGridView - выглядит наиболее перспективным, но имеет много ошибок, особенно при изменении ориентации. такие ошибки включают пустые ячейки, плохую прокрутку и NPE (редко, но все же происходит). Я также не уверен, поддерживает ли он персонализированные ячейки вместо изображений.
другие решения, как упоминает здесь.

Вопрос

Кто-нибудь знает о другой альтернативе этой проблеме? Может быть, некоторые обходные пути для любого из решений, которые я показал?

EDIT: Я думаю, что о StaggeredGridView, прокрутка и исключения могут быть решены с помощью обычного ImageView, который вы задали его размер внутри getView. Я думаю, что причина для его работы странным образом заключается в том, что образец обновляет размер изображения после его загрузки из Интернета.

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

EDIT: на данный момент я считаю, что лучшим решением является использование Библиотека PinterestLikeAdapterView.

у него нет никаких проблем, которые я могу найти.

однако он не может заставить элементы принимать более 1 ширины ячейки. тем не менее, это очень хорошо.

EDIT: к сожалению, у него есть проблемы с notifyDataSetChanged. Я сообщил об этом здесь.

Ответ 1

Я думаю, RecyclerView с StaggeredGridLayoutManager может решить эту проблему, и если вы хотите иметь быстрый скроллер, вы можете попробовать эту библиотеку.

Итак, больше не требуется трюк, поскольку Google предоставил решение...

Ответ 2

Слишком поздно ответить?

проверить эту библиотеку из etsy. это выглядит очень многообещающе.

https://github.com/etsy/AndroidStaggeredGrid

Я думаю, что это более новая версия https://github.com/maurycyw/StaggeredGridView

.

Обновление.

Попробуйте использовать RecyclerView StaggeredGridLayoutManager из Google вместо

    RecyclerView recyclerView = (RecyclerView) findViewById(R.id.recycler_view);
    recyclerView.setLayoutManager(new StaggeredGridLayoutManager(2, StaggeredGridLayoutManager.VERTICAL));
    recyclerView.setItemAnimator(new DefaultItemAnimator());
    recyclerView.setAdapter(adapter);

Ответ 3

Вы можете выполнить это с помощью единого ListView, где каждая ячейка содержит другой шаблон сетки. Я сделал что-то похожее на то, что вы описываете, используя эту технику. Если размеры ячеек должны быть уникальными, это не сработает, но этого должно быть достаточно для описанного вами случая:

AABB
AACC
AADD
AADD

Создавая несколько шаблонов, подобных этому, с различными аранжировками A, B, C, D, вы можете случайным образом использовать их как ячейки ListView, а некоторые простые математические смещения позволят вашему адаптеру заполнять каждую подэлемент, чтобы выполнить что-то вроде следующее:

AABB
AACC
AADD
AADD

BBBB
ACCC
ADDD
ADDD

AAAA
BBCC
BBCC
DDDD

AABB
AACC
AADD
AADD

AABB
AACC
DDDD
DDDD