StickyTimeLine快速上手如何5分钟搭出吸顶时间轴附Kotlin与Java示例代码【免费下载链接】StickyTimeLine:book:StickyTimeLine is timeline view for android.项目地址: https://gitcode.com/gh_mirrors/st/StickyTimeLineStickyTimeLine 是一款专为 Android 打造的吸顶时间轴Sticky TimeLine开源库让分组标题在滚动时自动吸附在屏幕顶部。它同时支持传统 View 系统和 Jetpack Compose 两套技术栈只需一行 Gradle 依赖、几行回调代码5 分钟即可在应用里搭出带时间线 圆点 吸顶分组头的漂亮列表非常适合做音乐专辑年表、股票行情流水、历史事件时间线等场景。一分钟认识 StickyTimeLine它解决了什么问题想象一个按年份分组的历史列表滚动时2025 年这个分组标题会钉在列表顶部不动直到下一组标题顶上来才切换——这就是吸顶Sticky效果。自己实现这个效果通常需要处理复杂的偏移计算和 ItemDecoration 绘制而 StickyTimeLine 把这些全部封装好了吸顶分组标题分组头自动置顶切换平滑时间轴 圆点内置竖线、圆点、描边还支持自定义 Drawable 圆点双向支持View 系统的TimeLineRecyclerView和 Compose 的StickyTimeLineLazyColumn/StickyTimeLineLazyRow高度可定制线条颜色、粗细、圆点半径、分组背景色等 10 余个属性随意调零性能负担基于 RecyclerView 复用机制和 Compose 懒加载实现长列表也流畅快速上手3 步搭出你的第一条时间轴第 1 步引入 Gradle 依赖根据你的技术栈二选一版本以 Maven Central 最新为准// View 系统 implementation io.github.sangcomz:StickyTimeLine:x.x.x // Jetpack Compose implementation io.github.sangcomz:stickytimeline-compose:x.x.x 提示想直接运行完整 Demo 学习可以git clone本仓库后打开 Android Studioapp模块是 View 版示例sample-compose模块是 Compose 版示例。第 2 步在布局中加入时间轴组件View 系统中只需在 XML 里声明一个TimeLineRecyclerView它继承自 RecyclerView核心逻辑见 TimeLineRecyclerView.ktxyz.sangcomz.stickytimelineview.TimeLineRecyclerView android:idid/recycler_view android:layout_widthmatch_parent android:layout_heightwrap_content /第 3 步实现 SectionCallback 并交给组件告诉库哪些位置是新分组、分组头显示什么。接口定义在 SectionCallback.kt只有两个方法recyclerView.addItemDecoration(object : SectionCallback { // 当前项与前一项的分组键不同即视为新分组的开头 override fun isSection(position: Int) singerList[position].debuted ! singerList[position - 1].debuted // 返回分组头的标题与副标题 override fun getSectionHeader(position: Int): SectionInfo? SectionInfo(singerList[position].debuted, singerList[position].group) }) recyclerView.adapter SingerAdapter(layoutInflater, singerList, R.layout.recycler_row)完成此时运行应用分组标题就会在滚动中自动吸顶。完整可运行代码可参考示例工程 MainActivity.kt。Compose 版本用声明式代码搭建吸顶时间轴如果你在用 Jetpack Compose对应组件是 StickyTimeLineLazyColumn.kt竖向和 StickyTimeLineLazyRow.kt横向思路一样数据 → 分组 → 三个内容槽位。StickyTimeLineLazyColumn( items sortedMusicList, groupBy { it.year }, // 按年份分组 makeHeaderItem { key, _ - key }, sectionHeader { year - Text(year, style TextStyle(fontSize 18.sp, fontWeight FontWeight.Bold)) }, itemContent { music - Card { Column { Text(music.title); Text(music.artist) } } }, timeLineDot { // 时间轴圆点 Box(Modifier.size(24.dp).background(Color.Gray, CircleShape)) } )三个槽位各司其职sectionHeader画分组头会吸顶、itemContent画列表项、timeLineDot画圆点。横向布局只需换成StickyTimeLineLazyRow并改写headerContent/dotContent更多参数见示例工程 sample-compose 的 MainActivity.kt。常用属性速查让时间轴更贴合你的设计View 系统的全部属性定义在 attrs.xml直接在 XML 里写就能改样式属性作用默认值timeLineColor时间轴线条颜色#51ae45timeLineWidth线条粗细4dptimeLineDotColor圆点颜色#51ae45timeLineDotRadius圆点半径8dpcustomDotDrawable用自定义图片替换圆点nullsectionTitleTextColor分组标题颜色#414fcasectionSubTitleTextColor分组副标题颜色#d16767timeLineModevertical或horizontal方向verticalisSticky是否启用吸顶true举个例子把时间轴改成粉色主题 圆形图标圆点xyz.sangcomz.stickytimelineview.TimeLineRecyclerView android:layout_widthmatch_parent android:layout_heightwrap_content app:timeLineColor#E91E63 app:timeLineDotColor#E91E63 app:customDotDrawabledrawable/ic_buzz /实战效果这些 App 正在使用它除了官方示例StickyTimeLine 也已经被多款上架应用采用。新手避坑指南3 个注意事项只支持 LinearLayoutManagerView 版本请搭配LinearLayoutManager使用Grid 等其他 LayoutManager 暂不支持吸顶偏移计算依赖线性布局。列表项父视图不要设置 margin间距请交给组件内部处理否则会干扰吸顶与线条的对齐。数据要先按分组键排序isSection/groupBy依赖同组数据连续排列先排序再绑定 Adapter 才能正确分组。项目结构一览模块说明stickytimelineview/View 系统核心库TimeLineRecyclerView ItemDecorationstickytimelineview-compose/Jetpack Compose 版核心库data/示例数据模型与仓库歌手、音乐app/View 系统完整示例Kotlin Javasample-compose/Compose 完整示例pic/效果演示动图吸顶逻辑由 VerticalSectionItemDecoration.kt 与 HorizontalSectionItemDecoration.kt 负责绘制线条、圆点并计算吸顶偏移感兴趣的同学可以直接读源码。总结StickyTimeLine 把 Android 里最经典的分组吸顶列表做成了开箱即用的组件View 系统加一个TimeLineRecyclerView、实现两个回调方法Compose 世界写一个StickyTimeLineLazyColumn五分钟就能让音乐年表、行情流水、事件时间线获得专业级的吸顶体验。依赖一行、代码几行、效果拉满——这正是它值得一试的理由。【免费下载链接】StickyTimeLine:book:StickyTimeLine is timeline view for android.项目地址: https://gitcode.com/gh_mirrors/st/StickyTimeLine创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考