feat: show menu as overlapping drawer on small screens (#1088)

* feat: show menu as overlapping drawer on small screens

* refactor: simplify home page left offset ternary expression
This commit is contained in:
Poly-Pixel 2022-09-21 08:06:48 -04:00 committed by GitHub
parent 811dc46bc6
commit 4e0b9c87e2
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 16 additions and 15 deletions

View File

@ -13,6 +13,7 @@ import 'home_sizes.dart';
class HomeLayout { class HomeLayout {
late double menuWidth; late double menuWidth;
late bool showMenu; late bool showMenu;
late bool menuIsDrawer;
late bool showEditPanel; late bool showEditPanel;
late double editPanelWidth; late double editPanelWidth;
late double homePageLOffset; late double homePageLOffset;
@ -36,10 +37,11 @@ class HomeLayout {
if (forceCollapse) { if (forceCollapse) {
showMenu = false; showMenu = false;
} else { } else {
showMenu = context.widthPx > PageBreaks.tabletPortrait; showMenu = true;
menuIsDrawer = context.widthPx <= PageBreaks.tabletPortrait;
} }
homePageLOffset = showMenu ? menuWidth : 0.0; homePageLOffset = (showMenu && !menuIsDrawer) ? menuWidth : 0.0;
menuSpacing = !showMenu && Platform.isMacOS ? 80.0 : 0.0; menuSpacing = !showMenu && Platform.isMacOS ? 80.0 : 0.0;
animDuration = .35.seconds; animDuration = .35.seconds;

View File

@ -148,7 +148,6 @@ class _HomeScreenState extends State<HomeScreen> {
return FocusTraversalGroup(child: RepaintBoundary(child: homeMenu)); return FocusTraversalGroup(child: RepaintBoundary(child: homeMenu));
} }
Widget _buildEditPanel( Widget _buildEditPanel(
{required HomeState homeState, {required HomeState homeState,
required BuildContext context, required BuildContext context,
@ -204,18 +203,6 @@ class _HomeScreenState extends State<HomeScreen> {
}) { }) {
return Stack( return Stack(
children: [ children: [
homeMenu
.animatedPanelX(
closeX: -layout.menuWidth,
isClosed: !layout.showMenu,
)
.positioned(
left: 0,
top: 0,
width: layout.menuWidth,
bottom: 0,
animate: true)
.animate(layout.animDuration, Curves.easeOut),
homeStack homeStack
.constrained(minWidth: 500) .constrained(minWidth: 500)
.positioned( .positioned(
@ -241,6 +228,18 @@ class _HomeScreenState extends State<HomeScreen> {
) )
.positioned( .positioned(
right: 0, top: 0, bottom: 0, width: layout.editPanelWidth), right: 0, top: 0, bottom: 0, width: layout.editPanelWidth),
homeMenu
.animatedPanelX(
closeX: -layout.menuWidth,
isClosed: !layout.showMenu,
)
.positioned(
left: 0,
top: 0,
width: layout.menuWidth,
bottom: 0,
animate: true)
.animate(layout.animDuration, Curves.easeOut),
], ],
); );
} }