Создавайте удивительные макеты сетки в Android
LazyVerticalGrid — очень полезный компонент, если вы хотите добавить представление сетки в свое приложение.
К сожалению, его нельзя поместить в другой контейнер с вертикальной прокруткой, поскольку он имеет поведение вертикальной прокрутки.
Если вы попытаетесь присоединиться к LazyColumn с LazyVerticalGrid, вы увидите следующее исключение:
java.lang.IllegalStateException: Vertically scrollable component was measured with an infinity maximum height constraints, which is disallowed. One of the common reasons is nesting layouts like LazyColumn and Column(Modifier.verticalScroll()). If you want to add a header before the list of items please add a header as a separate item() before the main items() inside the LazyColumn scope. There are could be other reasons for this to happen: your ComposeView was added into a LinearLayout with some weight, you applied Modifier.wrapContentSize(unbounded = true) or wrote a custom layout. Please try to remove the source of infinite constraints in the hierarchy above the scrolling container.
В этой статье мы исправим эту проблему и сделаем весь экран прокручиваемым.
В моем приложении WallUp у меня есть HomeScreen, который показывает несколько элементов. Некоторые из них являются сеточными, некоторые нет. Когда я пытаюсь реализовать этот экран в приложении, я столкнулся с указанной выше проблемой.
Я хотел, чтобы весь экран можно было прокручивать с элементами сетки, но я не мог объединить LazyGridView с LazyColumn.
Временное решение
Немного подумав, мне пришло в голову, что все элементы в структуре сетки разбиты на строки. Таким образом, мы можем реализовать эту структуру с помощью Row Composable.
Реализация
Прежде всего, нам нужно добавить функцию расширения gridItems в наше приложение.
"data" is a list of items that we are going to display as a grid. "columnColunt" is a count of grid inside Row.
Теперь мы можем использовать элементы сетки внутри LazyColumn, как показано ниже:
Заключение
В этой короткой статье мы рассмотрели проблему LazyVerticalGrid и вертикальной прокрутки с другими компонентами с вертикальной прокруткой.
Мы видели, что попытка объединить составной элемент с другими составными элементами с вертикальной прокруткой привела к сбою приложения.
В качестве обходного пути мы исправили это с помощью Row composable.
Я надеюсь, что вы сделали некоторые выводы, увидимся в других статьях.
