Skip to content
This repository has been archived by the owner on Jun 13, 2024. It is now read-only.

[State Restoration] TabController and AnimationController usage #403

Merged
merged 2 commits into from
Jan 5, 2021
Merged

[State Restoration] TabController and AnimationController usage #403

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
7810a14
Fix up usage of tab and animation controllers with state restoration
shihaohong Jan 4, 2021
92cf66b
Add code comments
shihaohong Jan 4, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
82 changes: 16 additions & 66 deletions lib/codeviewer/code_segments.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -38056,6 +38056,14 @@ class CodeSegments {
TextSpan(style: codeStyle.baseStyle, text: ' '),
TextSpan(style: codeStyle.stringStyle, text: '\u0027tab_index\u0027'),
TextSpan(style: codeStyle.punctuationStyle, text: ');'),
TextSpan(style: codeStyle.baseStyle, text: '\u000a _tabController'),
TextSpan(style: codeStyle.punctuationStyle, text: '.'),
TextSpan(style: codeStyle.baseStyle, text: 'index '),
TextSpan(style: codeStyle.punctuationStyle, text: '='),
TextSpan(style: codeStyle.baseStyle, text: ' tabIndex'),
TextSpan(style: codeStyle.punctuationStyle, text: '.'),
TextSpan(style: codeStyle.baseStyle, text: 'value'),
TextSpan(style: codeStyle.punctuationStyle, text: ';'),
TextSpan(style: codeStyle.baseStyle, text: '\u000a '),
TextSpan(style: codeStyle.punctuationStyle, text: '}'),
TextSpan(style: codeStyle.baseStyle, text: '\u000a\u000a '),
Expand Down Expand Up @@ -38161,39 +38169,6 @@ class CodeSegments {
TextSpan(style: codeStyle.baseStyle, text: ' '),
TextSpan(style: codeStyle.punctuationStyle, text: '{'),
TextSpan(style: codeStyle.baseStyle, text: '\u000a '),
TextSpan(
style: codeStyle.commentStyle,
text:
'// Ensures that the tab controller\u0027s index is updated with the'),
TextSpan(style: codeStyle.baseStyle, text: '\u000a '),
TextSpan(
style: codeStyle.commentStyle,
text: '// state restorable tab index value.'),
TextSpan(style: codeStyle.baseStyle, text: '\u000a '),
TextSpan(style: codeStyle.keywordStyle, text: 'if'),
TextSpan(style: codeStyle.baseStyle, text: ' '),
TextSpan(style: codeStyle.punctuationStyle, text: '('),
TextSpan(style: codeStyle.baseStyle, text: '_tabController'),
TextSpan(style: codeStyle.punctuationStyle, text: '.'),
TextSpan(style: codeStyle.baseStyle, text: 'index '),
TextSpan(style: codeStyle.punctuationStyle, text: '!='),
TextSpan(style: codeStyle.baseStyle, text: ' tabIndex'),
TextSpan(style: codeStyle.punctuationStyle, text: '.'),
TextSpan(style: codeStyle.baseStyle, text: 'value'),
TextSpan(style: codeStyle.punctuationStyle, text: ')'),
TextSpan(style: codeStyle.baseStyle, text: ' '),
TextSpan(style: codeStyle.punctuationStyle, text: '{'),
TextSpan(style: codeStyle.baseStyle, text: '\u000a _tabController'),
TextSpan(style: codeStyle.punctuationStyle, text: '.'),
TextSpan(style: codeStyle.baseStyle, text: 'index '),
TextSpan(style: codeStyle.punctuationStyle, text: '='),
TextSpan(style: codeStyle.baseStyle, text: ' tabIndex'),
TextSpan(style: codeStyle.punctuationStyle, text: '.'),
TextSpan(style: codeStyle.baseStyle, text: 'value'),
TextSpan(style: codeStyle.punctuationStyle, text: ';'),
TextSpan(style: codeStyle.baseStyle, text: '\u000a '),
TextSpan(style: codeStyle.punctuationStyle, text: '}'),
TextSpan(style: codeStyle.baseStyle, text: '\u000a\u000a '),
TextSpan(style: codeStyle.keywordStyle, text: 'final'),
TextSpan(style: codeStyle.baseStyle, text: ' tabs '),
TextSpan(style: codeStyle.punctuationStyle, text: '='),
Expand Down Expand Up @@ -38474,6 +38449,14 @@ class CodeSegments {
TextSpan(style: codeStyle.baseStyle, text: ' '),
TextSpan(style: codeStyle.stringStyle, text: '\u0027tab_index\u0027'),
TextSpan(style: codeStyle.punctuationStyle, text: ');'),
TextSpan(style: codeStyle.baseStyle, text: '\u000a _tabController'),
TextSpan(style: codeStyle.punctuationStyle, text: '.'),
TextSpan(style: codeStyle.baseStyle, text: 'index '),
TextSpan(style: codeStyle.punctuationStyle, text: '='),
TextSpan(style: codeStyle.baseStyle, text: ' tabIndex'),
TextSpan(style: codeStyle.punctuationStyle, text: '.'),
TextSpan(style: codeStyle.baseStyle, text: 'value'),
TextSpan(style: codeStyle.punctuationStyle, text: ';'),
TextSpan(style: codeStyle.baseStyle, text: '\u000a '),
TextSpan(style: codeStyle.punctuationStyle, text: '}'),
TextSpan(style: codeStyle.baseStyle, text: '\u000a\u000a '),
Expand Down Expand Up @@ -38579,39 +38562,6 @@ class CodeSegments {
TextSpan(style: codeStyle.baseStyle, text: ' '),
TextSpan(style: codeStyle.punctuationStyle, text: '{'),
TextSpan(style: codeStyle.baseStyle, text: '\u000a '),
TextSpan(
style: codeStyle.commentStyle,
text:
'// Ensures that the tab controller\u0027s index is updated with the'),
TextSpan(style: codeStyle.baseStyle, text: '\u000a '),
TextSpan(
style: codeStyle.commentStyle,
text: '// state restorable tab index value.'),
TextSpan(style: codeStyle.baseStyle, text: '\u000a '),
TextSpan(style: codeStyle.keywordStyle, text: 'if'),
TextSpan(style: codeStyle.baseStyle, text: ' '),
TextSpan(style: codeStyle.punctuationStyle, text: '('),
TextSpan(style: codeStyle.baseStyle, text: '_tabController'),
TextSpan(style: codeStyle.punctuationStyle, text: '.'),
TextSpan(style: codeStyle.baseStyle, text: 'index '),
TextSpan(style: codeStyle.punctuationStyle, text: '!='),
TextSpan(style: codeStyle.baseStyle, text: ' tabIndex'),
TextSpan(style: codeStyle.punctuationStyle, text: '.'),
TextSpan(style: codeStyle.baseStyle, text: 'value'),
TextSpan(style: codeStyle.punctuationStyle, text: ')'),
TextSpan(style: codeStyle.baseStyle, text: ' '),
TextSpan(style: codeStyle.punctuationStyle, text: '{'),
TextSpan(style: codeStyle.baseStyle, text: '\u000a _tabController'),
TextSpan(style: codeStyle.punctuationStyle, text: '.'),
TextSpan(style: codeStyle.baseStyle, text: 'index '),
TextSpan(style: codeStyle.punctuationStyle, text: '='),
TextSpan(style: codeStyle.baseStyle, text: ' tabIndex'),
TextSpan(style: codeStyle.punctuationStyle, text: '.'),
TextSpan(style: codeStyle.baseStyle, text: 'value'),
TextSpan(style: codeStyle.punctuationStyle, text: ';'),
TextSpan(style: codeStyle.baseStyle, text: '\u000a '),
TextSpan(style: codeStyle.punctuationStyle, text: '}'),
TextSpan(style: codeStyle.baseStyle, text: '\u000a\u000a '),
TextSpan(style: codeStyle.keywordStyle, text: 'final'),
TextSpan(style: codeStyle.baseStyle, text: ' tabs '),
TextSpan(style: codeStyle.punctuationStyle, text: '='),
Expand Down
14 changes: 2 additions & 12 deletions lib/demos/material/tabs_demo.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -48,6 +48,7 @@ class __TabsScrollableDemoState extends State<_TabsScrollableDemo>
@override
void restoreState(RestorationBucket oldBucket, bool initialRestore) {
registerForRestoration(tabIndex, 'tab_index');
_tabController.index = tabIndex.value;
}

@override
Expand Down Expand Up @@ -76,12 +77,6 @@ class __TabsScrollableDemoState extends State<_TabsScrollableDemo>

@override
Widget build(BuildContext context) {
// Ensures that the tab controller's index is updated with the
// state restorable tab index value.
if (_tabController.index != tabIndex.value) {
_tabController.index = tabIndex.value;
}

final tabs = [
GalleryLocalizations.of(context).colorsRed,
GalleryLocalizations.of(context).colorsOrange,
Expand Down Expand Up @@ -143,6 +138,7 @@ class __TabsNonScrollableDemoState extends State<_TabsNonScrollableDemo>
@override
void restoreState(RestorationBucket oldBucket, bool initialRestore) {
registerForRestoration(tabIndex, 'tab_index');
_tabController.index = tabIndex.value;
}

@override
Expand Down Expand Up @@ -171,12 +167,6 @@ class __TabsNonScrollableDemoState extends State<_TabsNonScrollableDemo>

@override
Widget build(BuildContext context) {
// Ensures that the tab controller's index is updated with the
// state restorable tab index value.
if (_tabController.index != tabIndex.value) {
_tabController.index = tabIndex.value;
}

final tabs = [
GalleryLocalizations.of(context).colorsRed,
GalleryLocalizations.of(context).colorsOrange,
Expand Down
7 changes: 1 addition & 6 deletions lib/studies/crane/backdrop.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -171,6 +171,7 @@ class _BackdropState extends State<Backdrop>
@override
void restoreState(RestorationBucket oldBucket, bool initialRestore) {
registerForRestoration(tabIndex, 'tab_index');
_tabController.index = tabIndex.value;
}

@override
Expand Down Expand Up @@ -210,12 +211,6 @@ class _BackdropState extends State<Backdrop>

@override
Widget build(BuildContext context) {
// Ensures that the tab controller's index is updated with the
// state restorable tab index value.
if (_tabController.index != tabIndex.value) {
_tabController.index = tabIndex.value;
}

final isDesktop = isDisplayDesktop(context);
final textScaleFactor = GalleryOptions.of(context).textScaleFactor(context);

Expand Down
7 changes: 1 addition & 6 deletions lib/studies/rally/home.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -35,6 +35,7 @@ class _HomePageState extends State<HomePage>
@override
void restoreState(RestorationBucket oldBucket, bool initialRestore) {
registerForRestoration(tabIndex, 'tab_index');
_tabController.index = tabIndex.value;
}

@override
Expand All @@ -58,12 +59,6 @@ class _HomePageState extends State<HomePage>

@override
Widget build(BuildContext context) {
// Ensures that the tab controller's index is updated with the
// state restorable tab index value.
if (_tabController.index != tabIndex.value) {
_tabController.index = tabIndex.value;
}

final theme = Theme.of(context);
final isDesktop = isDisplayDesktop(context);
Widget tabBarView;
Expand Down
74 changes: 21 additions & 53 deletions lib/studies/shrine/app.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -29,53 +29,6 @@ class ShrineApp extends StatefulWidget {
_ShrineAppState createState() => _ShrineAppState();
}

class _RestorableAnimationValue extends RestorableDouble {
_RestorableAnimationValue(double defaultValue) : super(defaultValue);

AnimationController _animationController;
AnimationController get animationController => _animationController;

void _updateAnimationValue(AnimationStatus status) {
// Only modify the value after the property has been registered with a
// RestorationMixin.
if (isRegistered &&
(status == AnimationStatus.completed ||
status == AnimationStatus.dismissed)) {
value = _animationController.value;
}
}

/// Registers a status listener to the controller that sets
/// [RestorableDouble.value] if the animation completes or is dismissed.
void registerStatusListener(AnimationController controller) {
_animationController = controller;
// After setting the animation controller, add a listener that
// sets the animation controller value whenever an animation completes or
// is dismisses. This saves the latest animation state and serializes
// it on the device.
_animationController.addStatusListener(_updateAnimationValue);
}

@override
void dispose() {
_animationController.removeStatusListener(_updateAnimationValue);
_animationController = null;
super.dispose();
}

@override
double fromPrimitives(Object data) {
// When retrieving serialized data, set the animation controller value to
// the saved value.
final savedAnimationValue = data as double;
if (_animationController != null &&
_animationController.value != savedAnimationValue) {
_animationController.value = savedAnimationValue;
}
return super.fromPrimitives(data);
}
}

class _ShrineAppState extends State<ShrineApp>
with TickerProviderStateMixin, RestorationMixin {
// Controller to coordinate both the opening/closing of backdrop and sliding
Expand All @@ -86,9 +39,8 @@ class _ShrineAppState extends State<ShrineApp>
AnimationController _expandingController;

final _RestorableAppStateModel _model = _RestorableAppStateModel();
final _RestorableAnimationValue _expandingTabIndex =
_RestorableAnimationValue(0.0);
final _RestorableAnimationValue _tabIndex = _RestorableAnimationValue(1.0);
final RestorableDouble _expandingTabIndex = RestorableDouble(0);
final RestorableDouble _tabIndex = RestorableDouble(1);
final Map<String, List<List<int>>> _layouts = {};

@override
Expand All @@ -97,11 +49,13 @@ class _ShrineAppState extends State<ShrineApp>
@override
void restoreState(RestorationBucket oldBucket, bool initialRestore) {
registerForRestoration(_model, 'app_state_model');
registerForRestoration(_tabIndex, 'tab_index');
registerForRestoration(
_expandingTabIndex,
'expanding_tab_index',
);
registerForRestoration(_tabIndex, 'tab_index');
_controller.value = _tabIndex.value;
_expandingController.value = _expandingTabIndex.value;
}

@override
Expand All @@ -112,12 +66,26 @@ class _ShrineAppState extends State<ShrineApp>
duration: const Duration(milliseconds: 450),
value: 1,
);
_tabIndex.registerStatusListener(_controller);
// Save state restoration animation values only when the cart page
// fully opens or closes.
_controller.addStatusListener((status) {
if (status == AnimationStatus.completed ||
status == AnimationStatus.dismissed) {
_tabIndex.value = _controller.value;
}
});
_expandingController = AnimationController(
duration: const Duration(milliseconds: 500),
vsync: this,
);
_expandingTabIndex.registerStatusListener(_expandingController);
// Save state restoration animation values only when the menu page
// fully opens or closes.
_expandingController.addStatusListener((status) {
if (status == AnimationStatus.completed ||
status == AnimationStatus.dismissed) {
_expandingTabIndex.value = _expandingController.value;
}
});
}

@override
Expand Down