nmelone/flutter_thingsboard_app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Use animated icon to switch dashboard right layout

Browse Source
This commit is contained in:
Igor Kulikov
2021-06-04 20:17:59 +03:00
parent e0ad700188
commit a6d89f1d0c
1 changed files with 21 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
lib/modules/dashboard/main_dashboard_page.dart
View File

@@ -60,16 +60,25 @@ class MainDashboardPage extends TbContextWidget<MainDashboardPage, _MainDashboar
} }
class _MainDashboardPageState extends TbContextState<MainDashboardPage, _MainDashboardPageState> { class _MainDashboardPageState extends TbContextState<MainDashboardPage, _MainDashboardPageState> with TickerProviderStateMixin {
late ValueNotifier<String> dashboardTitleValue; late ValueNotifier<String> dashboardTitleValue;
final ValueNotifier<bool> hasRightLayout = ValueNotifier(false); final ValueNotifier<bool> hasRightLayout = ValueNotifier(false);
final ValueNotifier<bool> rightLayoutOpened = ValueNotifier(false);
DashboardController? _dashboardController; DashboardController? _dashboardController;
late final Animation<double> rightLayoutMenuAnimation;
late final AnimationController rightLayoutMenuController;
@override @override
void initState() { void initState() {
super.initState(); super.initState();
rightLayoutMenuController = AnimationController(
vsync: this,
duration: Duration(milliseconds: 200),
);
rightLayoutMenuAnimation = CurvedAnimation(
curve: Curves.linear,
parent: rightLayoutMenuController
);
if (widget._controller != null) { if (widget._controller != null) {
widget._controller!._setMainDashboardPageState(this); widget._controller!._setMainDashboardPageState(this);
} }
@@ -78,6 +87,7 @@ class _MainDashboardPageState extends TbContextState<MainDashboardPage, _MainDas
@override @override
void dispose() { void dispose() {
rightLayoutMenuController.dispose();
super.dispose(); super.dispose();
} }
@@ -105,7 +115,7 @@ class _MainDashboardPageState extends TbContextState<MainDashboardPage, _MainDas
fit: BoxFit.fitWidth, fit: BoxFit.fitWidth,
alignment: Alignment.centerLeft, alignment: Alignment.centerLeft,
child: Text(title) child: Text(title)
); );
}, },
), ),
actions: [ actions: [
@@ -115,11 +125,9 @@ class _MainDashboardPageState extends TbContextState<MainDashboardPage, _MainDas
if (_hasRightLayout) { if (_hasRightLayout) {
return IconButton( return IconButton(
onPressed: () => _dashboardController?.toggleRightLayout(), onPressed: () => _dashboardController?.toggleRightLayout(),
icon: ValueListenableBuilder<bool>( icon: AnimatedIcon(
valueListenable: rightLayoutOpened, progress: rightLayoutMenuAnimation,
builder: (context, _rightLayoutOpened, widget) { icon: AnimatedIcons.menu_close
return Icon(_rightLayoutOpened ? Icons.arrow_back : Icons.menu);
}
) )
); );
} else { } else {
@@ -143,7 +151,11 @@ class _MainDashboardPageState extends TbContextState<MainDashboardPage, _MainDas
hasRightLayout.value = controller.hasRightLayout.value; hasRightLayout.value = controller.hasRightLayout.value;
}); });
controller.rightLayoutOpened.addListener(() { controller.rightLayoutOpened.addListener(() {
rightLayoutOpened.value = controller.rightLayoutOpened.value; if(controller.rightLayoutOpened.value) {
rightLayoutMenuController.forward();
} else {
rightLayoutMenuController.reverse();
}
}); });
} }
} }