Animation and timers

The dot moves and fades using native animations. Pause stops the animation and the elapsed timer. Resume starts them again. After four seconds the hint changes once.

useAnimatedValue creates values bound directly to widget properties. Animated.parallel changes position and opacity together; Animated.sequence follows the outward timing animation with a spring back; Animated.loop repeats the sequence. The effect stops its animation during cleanup. Easing.inOut(Easing.quad) controls the timing curve.

useInterval and useTimeout come from @kog/react. Pass null to disarm either hook, including reactively as shown here. They clean up automatically when their component unmounts. The native animation engine advances widget properties without JavaScript per frame.

The Animated API also supports decay, delay, stagger, interpolation, ValueXY, and custom animated component wrappers. Animated.event, arithmetic operators, and color interpolation are unsupported and throw.