Не отражаются последние элементы в LazyColumn в Jetpack Compose

Question

Все привет!

Пытаюсь освоить Jetpack Compose. Выполняю пример с https://developer.android.google.cn/codelabs/jetpack-compose-layouts#5

    override fun onCreateView(
    inflater: LayoutInflater,
    container: ViewGroup?,
    savedInstanceState: Bundle?
): View {
    return ComposeView(requireContext()).apply {
        setContent {
            //Column(modifier = Modifier.background(Color.LightGray)) {
                //Text(text = "!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!", modifier = Modifier.weight(1f))
                val scrollState = rememberLazyListState()

                LazyColumn(state = scrollState, modifier = Modifier
                    .background(Color.Cyan).fillMaxWidth()) {
                    items(100) {
                        Text("Item #$it")
                    }
                }
            //}

        }
    }
}

Но почему-то последние элементы не помещаются на экран. P.S Я пролистал в самый конец, если что

если добавить в Lazycolumn размер

LazyColumn(state = scrollState, modifier = Modifier.background(Color.Cyan).fillMaxWidth().height(350.dp)) {         
 items(100) {
   Text("Item #$it")
 }
}

то недостающие элементы появятся, но странно, что растянулось по высоте экрана. Скорее всего из-за того, что Lazycolumn корневой элемент. Тогда добавляем в самое начало Column и вставляем туда LazyColumn и получаем все тоже самое - не все элементы помещаются на экран

    override fun onCreateView(
    inflater: LayoutInflater,
    container: ViewGroup?,
    savedInstanceState: Bundle?
): View {
    return ComposeView(requireContext()).apply {
        setContent {
            Column(modifier = Modifier.background(Color.LightGray)) {
                //Text(text = "!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!", modifier = Modifier.weight(1f))
                val scrollState = rememberLazyListState()

                LazyColumn(state = scrollState, modifier = Modifier
                    .background(Color.Cyan).fillMaxWidth()/*.height(350.dp)*/) {
                    items(100) {
                        Text("Item #$it")
                    }
                }
            }

        }
    }
}

Может кто сталкивался? В идеале хочу реализовать так, чтобы LazyColumn выступал в роли таблицы, которую можно пролистать, а в начале шапка, которая остается на месте

Answer 1

Основываясь на официальной документации, вам нужно обернуть ваш корневой layout в ProvideWindowInsets, которая предоставит innerPaddingModifier и далее использовать modifier для задания отступа от нижней панели навигации.

 ProvideWindowInsets {
    AppTheme {
        Scaffold () { innerPaddingModifier ->
            LazyColumn(modifier = Modifier.padding(innerPaddingModifier)) {
                items(100) {
                    Text("Item #$it")
                }
            }
        }
    }

БЛОГ НА HUSL

Не отражаются последние элементы в LazyColumn в Jetpack Compose

Ответы (1 шт):