flutter - Timer Animation Runs Too Fast When "Remove Animations" Accessibility Setting Enabled on Device - Sta

admin管理员组

文章数量:1318767

I am encountering an issue with the AnimationController API in Flutter. My app includes a timer animation, but I’ve noticed that when the "Remove Animations" option is enabled in the device’s accessibility settings, the animation runs extremely fast.

Watch the issue demonstration in this video: Timer Animation Fast Issue Video

Here’s a simplified snippet of my implementation:

late final timerAnimationController = AnimationController(
    vsync: this,
    reverseDuration: const Duration(seconds: inBetweenQuestionTimeInSeconds),
    duration: widget.quizType == QuizTypes.contest
        ? Duration(minutes: widget.contestTime)
        : Duration(seconds: context.read<SystemConfigCubit>().quizTimer(widget.quizType)),
  )..addStatusListener(currentUserTimerAnimationStatusListener);

Duration get timer =>
    timerAnimationController.duration! -
    timerAnimationController.lastElapsedDuration!;

String get remaining => (timerAnimationController.isAnimating)
    ? "${timer.inHours > 0 ? '${timer.inHours.toString().padLeft(2, '0')}:' : ''}"
    "${timer.inMinutes.remainder(60).toString().padLeft(2, '0')}:"
    "${timer.inSeconds.remainder(60).toString().padLeft(2, '0')}"
    : '';

timerAnimationController.forward();

AnimatedBuilder(
    builder: (context, c) => Container(
      decoration: BoxDecoration(
        borderRadius: BorderRadius.circular(20),
        border: Border.all(
          color: Theme.of(context)
              .colorScheme
              .onTertiary
              .withOpacity(0.4),
          width: 4,
        ),
      ),
      padding: const EdgeInsets.symmetric(
        horizontal: 10,
        vertical: 5,
      ),
      child: Text(
        remaining,
        style: TextStyle(
          color: Theme.of(context).primaryColor,
        ),
      ),
    ),
    animation: timerAnimationController,
  )
: TextCircularTimer(
    animationController: timerAnimationController,
    arcColor: Theme.of(context).primaryColor,
    color: Theme.of(context)
        .colorScheme
        .onTertiary
        .withOpacity(0.2),
  ),

@override
void dispose() {
  timerAnimationController
    ..removeStatusListener(currentUserTimerAnimationStatusListener)
    ..dispose();
 super.dispose();
}

What I’ve Tried

1. Checked MediaQuery.of(context).disableAnimations to detect the system setting and conditionally control animations.

2. Wrapped the AnimatedBuilder in a TickerMode with enabled: !animationsDisabled. Attempted to simulate the timer's state manually without animations when disableAnimations is true.

Expected Behavior

The timer animation should either:

1. Respect the defined duration even when "Remove Animations" is enabled, or

2. Skip the animation entirely but still display the correct timer value.

Actual Behavior

The animation runs extremely fast or skips forward, breaking the timer experience.

Question

How can I handle this scenario in Flutter to ensure a smooth and consistent behavior for my timer animation, even when "Remove Animations" is enabled in the system settings?

本文标签：