opt: use NavigationRail on landscape page

This commit is contained in:
bggRGjQaUbCoE
2024-09-25 18:36:40 +08:00
parent e7af9b0ab3
commit 6138dfa51f

View File

@@ -111,7 +111,11 @@ class _MainAppState extends State<MainApp> with SingleTickerProviderStateMixin {
_homeController.flag = true;
}
},
child: Scaffold(
child: LayoutBuilder(
builder: (_, constriants) {
bool isPortait = constriants.maxHeight > constriants.maxWidth;
return Scaffold(
extendBody: true,
body: Row(
mainAxisAlignment: MainAxisAlignment.center,
@@ -156,13 +160,44 @@ class _MainAppState extends State<MainApp> with SingleTickerProviderStateMixin {
))
.toList(),
trailing: SizedBox(height: 0.1 * context.height),
)),
],
),
),
] else if (!isPortait)
NavigationRail(
onDestinationSelected: (value) => setIndex(value),
selectedIndex: _mainController.selectedIndex,
destinations: _mainController.navigationBars
.map(
(e) => NavigationRailDestination(
icon: Badge(
label: _mainController.dynamicBadgeType ==
DynamicBadgeMode.number
? Text(e['count'].toString())
: null,
padding: const EdgeInsets.fromLTRB(6, 0, 6, 0),
isLabelVisible:
_mainController.dynamicBadgeType !=
DynamicBadgeMode.hidden &&
e['count'] > 0,
child: e['icon'],
backgroundColor:
Theme.of(context).colorScheme.primary,
textColor: Theme.of(context)
.colorScheme
.onInverseSurface,
),
selectedIcon: e['selectIcon'],
label: Text(e['label']),
),
)
.toList(),
),
VerticalDivider(
width: 1,
indent: MediaQuery.of(context).padding.top,
endIndent: MediaQuery.of(context).padding.bottom,
color: Theme.of(context).colorScheme.outline.withOpacity(0.06),
color:
Theme.of(context).colorScheme.outline.withOpacity(0.06),
),
Expanded(
child: PageView(
@@ -178,7 +213,7 @@ class _MainAppState extends State<MainApp> with SingleTickerProviderStateMixin {
if (useSideBar) SizedBox(width: context.width * 0.004),
],
),
bottomNavigationBar: useSideBar
bottomNavigationBar: useSideBar || !isPortait
? null
: StreamBuilder(
stream: _mainController.hideTabBar
@@ -192,34 +227,37 @@ class _MainAppState extends State<MainApp> with SingleTickerProviderStateMixin {
offset: Offset(0, snapshot.data ? 0 : 1),
child: enableMYBar
? NavigationBar(
onDestinationSelected: (value) => setIndex(value),
onDestinationSelected: (value) =>
setIndex(value),
selectedIndex: _mainController.selectedIndex,
destinations: <Widget>[
..._mainController.navigationBars.map((e) {
return NavigationDestination(
destinations: _mainController.navigationBars
.map(
(e) => NavigationDestination(
icon: Badge(
label: _mainController.dynamicBadgeType ==
label: _mainController
.dynamicBadgeType ==
DynamicBadgeMode.number
? Text(e['count'].toString())
: null,
padding:
const EdgeInsets.fromLTRB(6, 0, 6, 0),
isLabelVisible:
_mainController.dynamicBadgeType !=
padding: const EdgeInsets.fromLTRB(
6, 0, 6, 0),
isLabelVisible: _mainController
.dynamicBadgeType !=
DynamicBadgeMode.hidden &&
e['count'] > 0,
child: e['icon'],
backgroundColor:
Theme.of(context).colorScheme.primary,
backgroundColor: Theme.of(context)
.colorScheme
.primary,
textColor: Theme.of(context)
.colorScheme
.onInverseSurface,
),
selectedIcon: e['selectIcon'],
label: e['label'],
);
}).toList(),
],
),
)
.toList(),
)
: BottomNavigationBar(
currentIndex: _mainController.selectedIndex,
@@ -232,36 +270,40 @@ class _MainAppState extends State<MainApp> with SingleTickerProviderStateMixin {
// Theme.of(context).colorScheme.primary, // 选中项的颜色
// unselectedItemColor:
// Theme.of(context).colorScheme.onSurface,
items: [
..._mainController.navigationBars.map((e) {
return BottomNavigationBarItem(
items: _mainController.navigationBars
.map(
(e) => BottomNavigationBarItem(
icon: Badge(
label: _mainController.dynamicBadgeType ==
label: _mainController
.dynamicBadgeType ==
DynamicBadgeMode.number
? Text(e['count'].toString())
: null,
padding:
const EdgeInsets.fromLTRB(6, 0, 6, 0),
isLabelVisible:
_mainController.dynamicBadgeType !=
padding: const EdgeInsets.fromLTRB(
6, 0, 6, 0),
isLabelVisible: _mainController
.dynamicBadgeType !=
DynamicBadgeMode.hidden &&
e['count'] > 0,
child: e['icon'],
backgroundColor:
Theme.of(context).colorScheme.primary,
backgroundColor: Theme.of(context)
.colorScheme
.primary,
textColor: Theme.of(context)
.colorScheme
.onInverseSurface,
),
activeIcon: e['selectIcon'],
label: e['label'],
);
}).toList(),
],
),
)
.toList(),
),
);
},
),
);
},
),
);
}