应用程序进入后台状态时如何暂停时钟

问题描述

我使用react-native-reanimated和react-native-redash创建了一个进度条，该进度条运行良好，但是现在我想在应用程序进入后台状态以及应用程序进入后台状态时暂停进度或计时处于活动状态时，应使用最后一个位置和时间来恢复。

clock config

const runTiming = (clock,quizDurationTiming) => {
  const state = {
    finished: new Value(0),position: new Value(0),frameTime: new Value(0),time: new Value(0),}
  const config = {
    tovalue: new Value(1),duration: quizDurationTiming * 10,easing: Easing.in(Easing.ease),}

  return block([
    cond(
      not(clockRunning(clock)),set(state.time,0),timing(clock,state,config)
    ),cond(eq(state.finished,1),stopClock(clock)),state.position,])
}

const SpecialTestTimer = ({
  preparationTime,appState,quizDurationTiming,}) => {
  const [isCompleted,setIsCompleted] = useState(false)
  const clock = useClock()
  const progress = useValue(0)
  const [play,setPlay] = useState(true)
  const isProgress = useValue(0)

  useEffect(() => {
    if (appState == "active") setPlay(true)
    else setPlay(false)
  },[appState])

  useCode(() => set(isProgress,play ? 1 : 0),[play])

  useCode(
    () => [
      cond(and(progress,not(clockRunning(clock))),startClock(clock)),cond(and(not(progress),clockRunning(clock)),set(progress,runTiming(clock,quizDurationTiming)),],[]
  )
}

我写了这段代码，但是不能正常工作。当我进入屏幕clock尚未启动，但是当我进入background状态后进入应用程序时，则clock正在启动。

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）