1.先上效果图
2.具体代码就不说了,说说使用了什么操作
1.主页构成
Scaffold脚手架下方BottomBar下方改的BottonNavagation 使其支持自定义的指示器(就是中间那个框框)也有动画的喔~和自定义Item,
因为我觉得使用compose做demo比用xml做demo真的快很多。。。
提供了脚手架之后,将基本框架搭好后,就单纯的开发页面就可以了。
2.compose的基本摆盘
Column
Row
LazyColumn ... 不赘述了
3.使用主题换色的基操
简单来说就是: 自定义了Material的主题色,定义主色之后通过更改主题去切换不同的颜色
但是当我想去随意切换颜色之后就没那么容易了... material3的色盘内部set是internal的.所以只能去通过扩展该 material3的色盘..
CompositionLocalProvider(LocalExtendedColors provides ExtendedTheme.extendedColorsX) {
MaterialTheme(
colorScheme = colorScheme,
/* colors = ..., typography = ..., shapes = ... */
content = content
)
}
当我增加了该色盘后,就可以随意更改该色值.通过animateColorAsState就可以实现该效果啦!!!
gif图可能没办法看出来这个动画有多么顺滑.我只能说比德芙还顺滑.
4.圆形色盘的建立
不知道各位注意到右上方的渐变圆环嘛? 现在也暂时只能呈现三条色条.中间计算的结果真的弄得我头大。重新学习了一下高中关于圆的知识...最后总算可以点击定位到正确的位置拉!!! 这部分就是compose的自定义图像的绘画。
5.总结
compose真好用~焯喜欢的。MVI结构也学了一下,感觉焯配的. 再也没有那么怕写动画了..compose倒是感觉降低了一些学习的门槛...不过可能文档稍微欠缺了一些(或者我懒得看).有一些属性并没有那么容易想起来,需要用到的时候才去看一下 可以幻想一下,这个颜色置换放在backgroupColor中.非常有国风的感觉,我很喜欢.