动效背后的代码。
Jolt 0.1.0-rc.11来自项目的完整源文件，固定到已核对的版本。请结合下面的依赖说明进行适配。
在 NativeScript-Vue setup 中调用 useCarouselClock，并传入异步 advance 回调。参照 PageIndicator.vue，将 progress 绑定到指示器的 scaleX，originX 设为 0。导航前调用 hold，场景稳定后调用 start；将 playing/toggle 接到有标签的控件。在 setup 时检测到减少动态效果或屏幕阅读器则默认暂停。保留代次保护、motion scope 和卸载清理。暂停保留当前计时，手动导航重置下次阅读间隔。此 hook 不提供视图、滑动导航或偏好变更监听；协调方式见 useOnboarding.ts。
useCarouselClock.ts
import { onUnmounted, ref } from 'nativescript-vue'
import { isA11yEnabled } from '@nativescript/core/accessibility'
import { motionScope, motionValue, reducedMotion, set, type Animation } from '@rafaelaugusto/jolt'
export const CAROUSEL_DURATION = 4000
/** The indicator and advance share one Jolt clock: no interval or per-frame JS. */
export function useCarouselClock(advance: () => Promise<void>) {
const progress = motionValue(0)
const playing = ref(!reducedMotion() && !isA11yEnabled())
const motion = motionScope()
let timer: Animation | undefined
let ready = false
let generation = 0
if (!playing.value) motion.suspend()
function hold() {
ready = false
generation++
timer?.stop()
timer = undefined
set(progress, 0)
}
function start() {
hold()
ready = true
if (!playing.value || motion.disposed) return
const current = generation
timer = motion.animate(progress, 1, { duration: CAROUSEL_DURATION, ease: 'linear' })
void timer.finished.then(completed => {
if (current !== generation || !completed || motion.disposed) return
timer = undefined
if (ready && playing.value) void advance()
})
}
function toggle() {
playing.value = !playing.value
if (playing.value) {
motion.resume()
if (ready && !timer) start()
} else motion.suspend()
}
onUnmounted(() => { generation++; motion.dispose() })
return { progress, playing, start, hold, toggle }
}