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

Commit

Permalink
Restorable Material Code Samples - Part 3/? (#382)
Browse files Browse the repository at this point in the history 
* State restorable navigation rail

* State restorable selection controls demo

* State restorable sliders

* State restorable tabs

* TextFormField TODO

* RestorableBoonN TODO
  • Loading branch information
Shi-Hao Hong authored Dec 6, 2020
1 parent ab517fc commit 86b2ac2
Show file tree
Hide file tree
Showing 7 changed files with 1,303 additions and 200 deletions.
1,170 changes: 1,049 additions & 121 deletions lib/codeviewer/code_segments.dart
View file

Large diffs are not rendered by default.

4 changes: 2 additions & 2 deletions lib/demos/material/navigation_drawer.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,8 +8,8 @@ import 'package:flutter/cupertino.dart';

// BEGIN navDrawerDemo

// Pressing the Navigation Drawer button the left of Appbar to show
// a simple Drawer with Two items.
// Press the Navigation Drawer button to the left of AppBar to show
// a simple Drawer with two items.
class NavDrawerDemo extends StatelessWidget {
const NavDrawerDemo({Key key}) : super(key: key);

Expand Down
18 changes: 13 additions & 5 deletions lib/demos/material/navigation_rail_demo.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,8 +14,16 @@ class NavRailDemo extends StatefulWidget {
_NavRailDemoState createState() => _NavRailDemoState();
}

class _NavRailDemoState extends State<NavRailDemo> {
int _selectedIndex = 0;
class _NavRailDemoState extends State<NavRailDemo> with RestorationMixin {
final RestorableInt _selectedIndex = RestorableInt(0);

@override
String get restorationId => 'nav_rail_demo';

@override
void restoreState(RestorationBucket oldBucket, bool initialRestore) {
registerForRestoration(_selectedIndex, 'selected_index');
}

@override
Widget build(BuildContext context) {
Expand All @@ -41,10 +49,10 @@ class _NavRailDemoState extends State<NavRailDemo> {
child: const Icon(Icons.add),
onPressed: () {},
),
selectedIndex: _selectedIndex,
selectedIndex: _selectedIndex.value,
onDestinationSelected: (index) {
setState(() {
_selectedIndex = index;
_selectedIndex.value = index;
});
},
labelType: NavigationRailLabelType.selected,
Expand Down Expand Up @@ -88,7 +96,7 @@ class _NavRailDemoState extends State<NavRailDemo> {
Expanded(
child: Center(
child: Text(
selectedItem[_selectedIndex],
selectedItem[_selectedIndex.value],
),
),
),
Expand Down
35 changes: 27 additions & 8 deletions lib/demos/material/selection_controls_demo.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -64,6 +64,9 @@ class _CheckboxDemo extends StatefulWidget {
}

class _CheckboxDemoState extends State<_CheckboxDemo> {
// TODO(shihaohong): Introduce RestorableBoolN into the framework
// to allow checkboxes to be properly state restorable (null value has
// meaning in checkboxes).
bool checkboxValueA = true;
bool checkboxValueB = false;
bool checkboxValueC;
Expand Down Expand Up @@ -114,12 +117,20 @@ class _RadioDemo extends StatefulWidget {
_RadioDemoState createState() => _RadioDemoState();
}

class _RadioDemoState extends State<_RadioDemo> {
int radioValue = 0;
class _RadioDemoState extends State<_RadioDemo> with RestorationMixin {
final RestorableInt radioValue = RestorableInt(0);

@override
String get restorationId => 'radio_demo';

@override
void restoreState(RestorationBucket oldBucket, bool initialRestore) {
registerForRestoration(radioValue, 'radio_value');
}

void handleRadioValueChanged(int value) {
setState(() {
radioValue = value;
radioValue.value = value;
});
}

Expand All @@ -132,7 +143,7 @@ class _RadioDemoState extends State<_RadioDemo> {
for (int index = 0; index < 3; ++index)
Radio<int>(
value: index,
groupValue: radioValue,
groupValue: radioValue.value,
onChanged: handleRadioValueChanged,
),
],
Expand All @@ -150,8 +161,16 @@ class _SwitchDemo extends StatefulWidget {
_SwitchDemoState createState() => _SwitchDemoState();
}

class _SwitchDemoState extends State<_SwitchDemo> {
bool switchValue = false;
class _SwitchDemoState extends State<_SwitchDemo> with RestorationMixin {
RestorableBool switchValue = RestorableBool(false);

@override
String get restorationId => 'switch_demo';

@override
void restoreState(RestorationBucket oldBucket, bool initialRestore) {
registerForRestoration(switchValue, 'switch_value');
}

@override
Widget build(BuildContext context) {
Expand All @@ -161,10 +180,10 @@ class _SwitchDemoState extends State<_SwitchDemo> {
label:
GalleryLocalizations.of(context).demoSelectionControlsSwitchTitle,
child: Switch(
value: switchValue,
value: switchValue.value,
onChanged: (value) {
setState(() {
switchValue = value;
switchValue.value = value;
});
},
),
Expand Down
101 changes: 77 additions & 24 deletions lib/demos/material/sliders_demo.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -59,9 +59,18 @@ class _Sliders extends StatefulWidget {
_SlidersState createState() => _SlidersState();
}

class _SlidersState extends State<_Sliders> {
double _continuousValue = 25;
double _discreteValue = 20;
class _SlidersState extends State<_Sliders> with RestorationMixin {
final RestorableDouble _continuousValue = RestorableDouble(25);
final RestorableDouble _discreteValue = RestorableDouble(20);

@override
String get restorationId => 'slider_demo';

@override
void restoreState(RestorationBucket oldBucket, bool initialRestore) {
registerForRestoration(_continuousValue, 'continuous_value');
registerForRestoration(_discreteValue, 'discrete_value');
}

@override
Widget build(BuildContext context) {
Expand All @@ -83,26 +92,28 @@ class _SlidersState extends State<_Sliders> {
textAlign: TextAlign.center,
onSubmitted: (value) {
final newValue = double.tryParse(value);
if (newValue != null && newValue != _continuousValue) {
if (newValue != null &&
newValue != _continuousValue.value) {
setState(() {
_continuousValue = newValue.clamp(0, 100) as double;
_continuousValue.value =
newValue.clamp(0, 100) as double;
});
}
},
keyboardType: TextInputType.number,
controller: TextEditingController(
text: _continuousValue.toStringAsFixed(0),
text: _continuousValue.value.toStringAsFixed(0),
),
),
),
),
Slider(
value: _continuousValue,
value: _continuousValue.value,
min: 0,
max: 100,
onChanged: (value) {
setState(() {
_continuousValue = value;
_continuousValue.value = value;
});
},
),
Expand All @@ -115,14 +126,14 @@ class _SlidersState extends State<_Sliders> {
mainAxisSize: MainAxisSize.min,
children: [
Slider(
value: _discreteValue,
value: _discreteValue.value,
min: 0,
max: 200,
divisions: 5,
label: _discreteValue.round().toString(),
label: _discreteValue.value.round().toString(),
onChanged: (value) {
setState(() {
_discreteValue = value;
_discreteValue.value = value;
});
},
),
Expand All @@ -144,12 +155,34 @@ class _RangeSliders extends StatefulWidget {
_RangeSlidersState createState() => _RangeSlidersState();
}

class _RangeSlidersState extends State<_RangeSliders> {
RangeValues _continuousValues = const RangeValues(25, 75);
RangeValues _discreteValues = const RangeValues(40, 120);
class _RangeSlidersState extends State<_RangeSliders> with RestorationMixin {
final RestorableDouble _continuousStartValue = RestorableDouble(25);
final RestorableDouble _continuousEndValue = RestorableDouble(75);
final RestorableDouble _discreteStartValue = RestorableDouble(40);
final RestorableDouble _discreteEndValue = RestorableDouble(120);

@override
String get restorationId => 'range_sliders_demo';

@override
void restoreState(RestorationBucket oldBucket, bool initialRestore) {
registerForRestoration(_continuousStartValue, 'continuous_start_value');
registerForRestoration(_continuousEndValue, 'continuous_end_value');
registerForRestoration(_discreteStartValue, 'discrete_start_value');
registerForRestoration(_discreteEndValue, 'discrete_end_value');
}

@override
Widget build(BuildContext context) {
final _continuousValues = RangeValues(
_continuousStartValue.value,
_continuousEndValue.value,
);
final _discreteValues = RangeValues(
_discreteStartValue.value,
_discreteEndValue.value,
);

return Padding(
padding: const EdgeInsets.symmetric(horizontal: 40),
child: Column(
Expand All @@ -164,7 +197,8 @@ class _RangeSlidersState extends State<_RangeSliders> {
max: 100,
onChanged: (values) {
setState(() {
_continuousValues = values;
_continuousStartValue.value = values.start;
_continuousEndValue.value = values.end;
});
},
),
Expand All @@ -186,7 +220,8 @@ class _RangeSlidersState extends State<_RangeSliders> {
),
onChanged: (values) {
setState(() {
_discreteValues = values;
_discreteStartValue.value = values.start;
_discreteEndValue.value = values.end;
});
},
),
Expand Down Expand Up @@ -423,12 +458,29 @@ class _CustomSliders extends StatefulWidget {
_CustomSlidersState createState() => _CustomSlidersState();
}

class _CustomSlidersState extends State<_CustomSliders> {
double _discreteCustomValue = 25;
RangeValues _continuousCustomValues = const RangeValues(40, 160);
class _CustomSlidersState extends State<_CustomSliders> with RestorationMixin {
final RestorableDouble _continuousStartCustomValue = RestorableDouble(40);
final RestorableDouble _continuousEndCustomValue = RestorableDouble(160);
final RestorableDouble _discreteCustomValue = RestorableDouble(25);

@override
String get restorationId => 'custom_sliders_demo';

@override
void restoreState(RestorationBucket oldBucket, bool initialRestore) {
registerForRestoration(
_continuousStartCustomValue, 'continuous_start_custom_value');
registerForRestoration(
_continuousEndCustomValue, 'continuous_end_custom_value');
registerForRestoration(_discreteCustomValue, 'discrete_custom_value');
}

@override
Widget build(BuildContext context) {
final customRangeValue = RangeValues(
_continuousStartCustomValue.value,
_continuousEndCustomValue.value,
);
final theme = Theme.of(context);
return Padding(
padding: const EdgeInsets.symmetric(horizontal: 40),
Expand Down Expand Up @@ -457,16 +509,16 @@ class _CustomSlidersState extends State<_CustomSliders> {
.copyWith(color: theme.colorScheme.onSurface),
),
child: Slider(
value: _discreteCustomValue,
value: _discreteCustomValue.value,
min: 0,
max: 200,
divisions: 5,
semanticFormatterCallback: (value) =>
value.round().toString(),
label: '${_discreteCustomValue.round()}',
label: '${_discreteCustomValue.value.round()}',
onChanged: (value) {
setState(() {
_discreteCustomValue = value;
_discreteCustomValue.value = value;
});
},
),
Expand All @@ -492,12 +544,13 @@ class _CustomSlidersState extends State<_CustomSliders> {
showValueIndicator: ShowValueIndicator.never,
),
child: RangeSlider(
values: _continuousCustomValues,
values: customRangeValue,
min: 0,
max: 200,
onChanged: (values) {
setState(() {
_continuousCustomValues = values;
_continuousStartCustomValue.value = values.start;
_continuousEndCustomValue.value = values.end;
});
},
),
Expand Down
Loading

0 comments on commit 86b2ac2

Please sign in to comment.