Jetpack:024-Jetpack中的滚动事件


我们在上一章回中介绍了Jetpack中事件相关的内容,本章回中主要 介绍事件中的滚动事件。闲话休提,让我们一起Talk Android Jetpack吧!

1. 概念介绍

我们在前面章回中介绍了Jetpack compose中的各种事件,不过这些事件主以点击事件为主,本章回中将介绍另外一种事件:滚动事件

我们在这里介绍的滚动事件是指对某个组件的发出的滚动事件,常用的场景是通过发出滚动事件让列表中的内容发生滚动。

2. 使用方法

滚动事件也分高级和低级,高级事件使用方便,不过缺少一些细节,低级事件相对高级事件更加强大一些,接下来我们将分别介绍这两种事件的使用方法。

2.1 高级事件

高级滚动事件使用verticalScrollhorizontalScroll修饰符表示,它们分别表示垂直和水平方向的滚动事件。在使用它们发出滚动事件时需要配合ScrollState这个状态值一起使用,我们将在后面的小节中通过示例代码来演示它的使用方法。

2.2 低级事件

低级滚动事件使用scrollable修饰符表示,它提供了名叫orientation的参数,通过该参数可以设置事件类型是垂直或者水平方向的滚动事件。在使用它发出滚动事件时需要配合ScrollableState这个状态值一起使用,我们将在后面的小节中通过示例代码来演示它的使用方法。

3. 示例代码

val scrollState = rememberScrollState()
    //指定滚动到的位置,这个值与滚动区域的大小有关,也就是代码中的120dp
    LaunchedEffect(Unit) { scrollState.animateScrollTo(60)}

    Column(
        modifier = Modifier
            .height(120.dp) //限定区域大小
            .background(color = Color.LightGray)
//                .verticalScroll(rememberScrollState())
            .verticalScroll(scrollState)
    ) {
       repeat(5) {
           Text(
               modifier = Modifier.padding(8.dp),
               text = "This is No: $it")
       }
    }

    //通过ScrollableState修饰符获取滚动的偏移值
    var scrollOffset by remember { mutableStateOf(0f)}
    Box(modifier = Modifier
        .height(80.dp)
        .scrollable(
            orientation = Orientation.Vertical,
            state = rememberScrollableState { consumeScrollDelta ->
                scrollOffset += consumeScrollDelta
                consumeScrollDelta
            }
        )
    ) { //在文本上显示滚动偏移值
        Text(text = if(scrollOffset == 0f) "ScrollableState"
            else scrollOffset.toString())
    }

上面的示例代码中演示了高级和低级滚动事件的用法,可以在高级事件的状态中指定滚动的初始位置,这样可以默认显示某个位置的内容。

我们在代码中创建了一个包含五个成员的列表,手指上下滑动时就发出了滚动事件,列表的内容会随之发生滚动。大家可以从下面的运行效果图中看到此效果。

低级事件的状态中包含有滚动事件的偏移值,当手指发生滑动时偏移值会发生变化,我们把偏移值显示在了与滚动事件绑定的Text上,不过该Text不会随着滚动事件的滚动而滚动,这是低级滚动事件与高级滚动事件最大的区别:滚动事件发生时内容不滚动。大家可以从下面的运行效果图中看到此效果。

在这里插入图片描述

4. 内容总结

最后,我们对本章回的内容做一个全面的总结:

  • 滚动事件和之前介绍的点击事件类似也分高级和低级两种;
  • 高级滚动事件使用verticalScroll和horizontalScroll修饰符表示;
  • 低级滚动事件使用scrollable修饰符表示,事件的水平和垂直类型通过它的参数来指定;
  • 高级滚动事件和低级滚动事件都需要配合状态值才能使用,这是它们的相同点;
  • 高级滚动事件和低级滚动事件的不同点:内容在高级事件中随着滚动事件的滚动而滚动,在低级事件中不滚动;

看官们,与Jetpack中滚动事件相关的内容就介绍到这里,欢迎大家在评论区交流与讨论!

  • 6
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

talk_8

真诚赞赏,手有余香

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值