Jetpack Compose 實現(xiàn)臨時用的滾輪選擇器 (WheelPicker)
目錄
在使用過 MIUI 13 鬧鐘中時間的滾動選擇后,感覺 Jetpack 自帶的「TimePickerDialog」使用起來也不是很順手, 于是想找一下有沒相關(guān)的實現(xiàn)。不過,列表選擇器倒有,可循環(huán)的滾輪選擇器貌似沒見著。無奈之下,只能自己嘗試 弄一個出來。雖然只懂一些 Jetpack 皮毛,但也就自己用,效率什么的不需要考慮。
最終,弄出來的也的確只能湊合著用,遠(yuǎn)不到項目可用的地步。
1. 實現(xiàn)「環(huán)形數(shù)組」(circular array)
略過,主要就 取余
2. 檢測手指滑動
Modifier.draggable
: 獲取偏移Modifier.offset
: 控件位置偏移
3. 顯示
Modifier.clipScrollableContainer(Orientation.Vertical)
: 超出 Layout 范圍的裁剪掉
使用 Layout
控制子控件位置(實際顯示會隱藏掉兩個),以及獲取子控件大小
到這一步,可以算得上是可用了,就差動畫和慣性滑動。
4. 動畫(實現(xiàn)過程不推薦)
由于采用 環(huán)形數(shù)組 的原因,想要每幀判斷一下是否需要更新數(shù)組。不過沒找到相關(guān)的用例, 只好在 Jetpack Recomposition 的時候更新數(shù)組。
Animatable.snapTo
: 滑動中直接設(shè)置偏移Animatable.animateTo
: 慣性滑動
5. 代碼
5.1. 環(huán)形數(shù)組
5.2. 滾輪選擇器
標(biāo)簽: