在JetPack中为Lazycolumn创建一个快速的粘页脚
#kotlin #android #mobile #tristan

目录

  1. The problem
  2. Creating the sticky footer
  3. Issues with the code

我在Google Playstore上的应用程序

github代码

简介

  • 本系列将是对我在开发Android应用程序时面临的任何问题或任何观察结果的非正式演示。本系列中的每个博客文章都将是独特的,并且与其他博客文章是独一无二的,因此请随时环顾四周。

问题

  • 如果您像我一样与LazyColumn一起工作,那么您可能会熟悉stickyHeader。这使我们能够创建这样的代码:
LazyColumn {
            stickyHeader {
               Text("BEHOLD THE STICKY HEADER!")
                }
            items(35) { index ->
                Text(text = "Item: $index",fontSize = 30.sp)
            }

        }

  • 上面的代码将允许标题即使用户滚动到Lazycolumn
  • 的底部,标题也可以留在屏幕上
  • 但是stickyFooter在哪里?!?!?!

粘页脚

  • 事实证明没有stickFooter{} API,这有点令人失望。但这意味着我们只需要与Box合成的Box变得有些创意。最终,我们只是将一个盒子包裹在LazyColumn周围,然后将页脚代码放在盒子的底部。像这样:
@Composable
fun FooterTesting(){
    Box(modifier = Modifier.fillMaxSize()){
        LazyColumn(){
             stickyHeader {
                  Text("BEHOLD THE STICKY HEADER!")
                }
            items(35) { index ->
                Text(text = "Item: $index",fontSize = 30.sp)
            }
        }
        Column(
            modifier = Modifier.fillMaxWidth().align(Alignment.BottomCenter).background(Color.Red),
        ){
            Text("It is I, The Sticky Footer", fontSize = 30.sp)
        }

    }

}

  • 我想在这里指出两件事。 1)盒子缠绕在懒惰的圆顶周围。 2) out粘性页脚代码不在懒惰的范围内,但在框内

此代码的问题:

  • 如果有任何问题,可以在Google问题跟踪器上找到HERE

结论

  • 感谢您抽出宝贵的时间阅读我的博客文章。如果您有任何疑问或疑虑,请在下面发表评论或在Twitter上与我联系。