Skip to content

Conversation

darrenaustin
Copy link
Contributor

When a MaterialApp's theme changes, it is animated over time (via the AnimatedTheme widget). This PR exposes the duration and curve used for this animation:

MaterialApp(
  theme: ThemeData.light(),
  darkTheme: ThemeData.dark(),
  themeMode: ThemeMode.dark,
  themeAnimationDuration: const Duration(milliseconds: 750),
  themeAnimationCurve: Curves.bounceInOut,
  // ...

Or if you want to turn off the animation altogether, you can set the duration to zero:

MaterialApp(
  theme: ThemeData.light(),
  darkTheme: ThemeData.dark(),
  themeMode: ThemeMode.dark,
  themeAnimationDuration: Duration.zero,
  // ...

Fixed: #105883

Pre-launch Checklist

  • I read the [Contributor Guide] and followed the process outlined there for submitting PRs.
  • I read the [Tree Hygiene] wiki page, which explains my responsibilities.
  • I read and followed the [Flutter Style Guide], including [Features we expect every widget to implement].
  • I signed the [CLA].
  • I listed at least one issue that this PR fixes in the description above.
  • I updated/added relevant documentation (doc comments with ///).
  • I added new tests to check the change I am making, or this PR is [test-exempt].
  • All existing and new tests are passing.

@flutter-dashboard flutter-dashboard bot added f: material design flutter/packages/flutter/material repository. framework flutter/packages/flutter repository. See also f: labels. labels Jul 11, 2022
Copy link
Contributor

@HansMuller HansMuller left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

What happens if these parameters are changed while a theme animation is underway?

Copy link
Member

@goderbauer goderbauer left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

@darrenaustin
Copy link
Contributor Author

What happens if these parameters are changed while a theme animation is underway?

In the underlying AnimatedTheme they will just replace the existing animation with a new one based on the changed curve and set the controller's duration to the new value:

@override
void didUpdateWidget(T oldWidget) {
super.didUpdateWidget(oldWidget);
if (widget.curve != oldWidget.curve) {
(_animation as CurvedAnimation).dispose();
_animation = _createCurve();
}
_controller.duration = widget.duration;

Do you think we need to call this out in the docs for MaterialApp?

@darrenaustin darrenaustin merged commit 50cde35 into flutter:master Jul 11, 2022
@darrenaustin darrenaustin deleted the material_theme_animation branch July 11, 2022 22:11
@HansMuller
Copy link
Contributor

#107383 (comment) sounds OK, I don't think we need to document that case.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

f: material design flutter/packages/flutter/material repository. framework flutter/packages/flutter repository. See also f: labels.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

ThemeExtension triggers multiple rebuilds

3 participants