Widget _menuBarShowcase(){
return Shortcuts(
shortcuts: const <ShortcutActivator, Intent>{
SingleActivator(LogicalKeyboardKey.keyT, control: true):
VoidCallbackIntent(debugDumpApp),
},
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisSize: MainAxisSize.max,
children: <Widget>[
Row(
children: <Widget>[
Expanded(
child: MenuBar(
children: <Widget>[
SubmenuButton(
menuChildren: <Widget>[
MenuItemButton(
onPressed: () {
showAboutDialog(
context: context,
useRootNavigator: false,
applicationName: 'MenuBar Demo',
applicationVersion: '1.0.0',
);
},
child: const MenuAcceleratorLabel('&About'),
),
SubmenuButton(
menuChildren: <Widget>[
MenuItemButton(
onPressed: () {
ScaffoldMessenger.of(context).showSnackBar(
const SnackBar(
content: Text('Saved!'),
),
);
},
child: const MenuAcceleratorLabel('&Save now'),
),
MenuItemButton(
onPressed: () {
ScaffoldMessenger.of(context).showSnackBar(
const SnackBar(
content: Text('Load!'),
),
);
},
child: const MenuAcceleratorLabel('&Load now'),
),
],
child: const Text('File'),
),
MenuItemButton(
onPressed: () {
ScaffoldMessenger.of(context).showSnackBar(
const SnackBar(
content: Text('Quit!'),
),
);
},
child: const MenuAcceleratorLabel('&Quit'),
),
],
child: const MenuAcceleratorLabel('&File'),
),
SubmenuButton(
menuChildren: <Widget>[
MenuItemButton(
onPressed: () {
ScaffoldMessenger.of(context).showSnackBar(
const SnackBar(
content: Text('Bold!'),
),
);
},
child: const MenuAcceleratorLabel('&Bold'),
),
MenuItemButton(
onPressed: () {
ScaffoldMessenger.of(context).showSnackBar(
const SnackBar(
content: Text('Italic!'),
),
);
},
child: const MenuAcceleratorLabel('&Italic'),
),
MenuItemButton(
onPressed: () {
ScaffoldMessenger.of(context).showSnackBar(
const SnackBar(
content: Text('Underline!'),
),
);
},
child: const MenuAcceleratorLabel('&Underline'),
),
],
child: const MenuAcceleratorLabel('&Style'),
),
SubmenuButton(
menuChildren: <Widget>[
const MenuItemButton(
onPressed: null,
child: MenuAcceleratorLabel('&Disabled item'),
),
MenuItemButton(
onPressed: () {
ScaffoldMessenger.of(context).showSnackBar(
const SnackBar(
content: Text('Minify!'),
),
);
},
child: const MenuAcceleratorLabel('Mi&nify'),
),
],
child: const MenuAcceleratorLabel('&View'),
),
],
),
),
],
),
],
),
);
}
MenuBarScreen.dart
class MenuBarScreen extends StatelessWidget {
const MenuBarScreen({super.key});
ThemeController themeController = Get.find();
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: Theme.of(context).colorScheme.background,
appBar: showAppBar
? AppBar(
title: const Text("MenuBar Theme"),
)
: null,
body: Center(
child: Container(
constraints: const BoxConstraints(
maxWidth: 1000,
),
alignment: Alignment.topCenter,
padding: const EdgeInsets.all(16),
child: SingleChildScrollView(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
_menuBarShowcase(),
const SizedBox(height: 20,),
Obx(
() => CustomContainer(
title: 'MenuBar Background color',
description: 'Background color',
child: ThemePopupMenu3(
schemeIndex: themeController.menusBackgroundColorIndex.value,
onChanged: themeController.setMenusBackgroundColorIndex),
),
),
const SizedBox(
height: 20,
),
Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Obx(
() => Flexible(
child: _buildCommonContainer(
child: SliderTheme(
data: SliderTheme.of(context).copyWith(
overlayShape: SliderComponentShape.noOverlay,
),
child: SizedBox(
width: 1000,
child: Slider(
value: themeController
.menuBarContainerRadius.value,
min: 0,
max: 30,
divisions: 16,
inactiveColor: Colors.transparent,
onChanged: (double value) {
themeController
.setMenuBarContainerRadius(value);
if (kDebugMode) {
print(value);
}
},
),
),
),
title: 'MenuBar Radius',
description:
'Adjust the menu bar container radius to your preference.',
),
),
),
Padding(
padding: const EdgeInsets.only(left: 10.0, top: 28),
child: Column(
mainAxisAlignment: MainAxisAlignment.start,
children: [
const Text('Radius'),
Obx(
() {
final borderRadius = themeController
.menuBarContainerRadius.value;
final integerPart =
double.parse(borderRadius.toStringAsFixed(0))
.toInt();
return SizedBox(
width: 55,
child: Text(
textAlign: TextAlign.center,
maxLines: 2,
softWrap: true,
themeController
.menuBarContainerRadius.value <=0? 'default Radius'
: integerPart.toString(),
style: TextStyles.titleSmall
.copyWith(fontSize: 12),
),
);
},
)
],
),
)
],
),
const SizedBox(
height: 10,
),
Obx(
()=> SwitchListTileReveal(
title: const Text('Remove elevation shadow',style: TextStyle(fontSize: 15),),
subtitleDense: true,
subtitle: const Text(
'The M3 guide depicts MenuBars with no shadow and optional '
'elevation with tint. Flutter defaults has shadow in M3. To be '
'able to use elevation with only elevation tint in M3, turn '
'this setting ON, to remove the shadow.\n',
),
value: themeController.menuBarShadowColor?.value != Colors.transparent,
onChanged: (bool removeShadow) {
if (removeShadow) {
themeController.setMenuBarShadowColor(Colors.black);
} else {
themeController.setMenuBarShadowColor(Colors.transparent);
}
}),
),
const SizedBox(
height: 10,
),
Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Obx(
() => Flexible(
child: _buildCommonContainer(
child: SliderTheme(
data: SliderTheme.of(context).copyWith(
overlayShape: SliderComponentShape.noOverlay,
),
child: SizedBox(
width: 1000,
child: Slider(
value: themeController
.menuBarContainerElevation.value,
min: 0,
max: 30,
divisions: 16,
inactiveColor: Colors.transparent,
onChanged: (double value) {
themeController
.setMenuBarContainerElevation(value);
if (kDebugMode) {
print(value);
}
},
),
),
),
title: 'Elevation of Container',
description:
'Adjust the elevation of container to your preference.',
),
),
),
Padding(
padding: const EdgeInsets.only(left: 10.0, top: 28),
child: Column(
mainAxisAlignment: MainAxisAlignment.start,
children: [
const Text('ELEV'),
Obx(
() {
final borderRadius = themeController
.menuBarContainerElevation.value;
final integerPart =
double.parse(borderRadius.toStringAsFixed(0))
.toInt();
return SizedBox(
width: 55,
child: Text(
textAlign: TextAlign.center,
maxLines: 2,
softWrap: true,
themeController
.menuBarContainerElevation.value <=0? 'default elev'
: integerPart.toString(),
style: TextStyles.titleSmall
.copyWith(fontSize: 12),
),
);
},
)
],
),
)
],
),
],
),
],
),
),
),
);
}
Widget _menuBarShowcase(){
return Shortcuts(
shortcuts: const <ShortcutActivator, Intent>{
SingleActivator(LogicalKeyboardKey.keyT, control: true):
VoidCallbackIntent(debugDumpApp),
},
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisSize: MainAxisSize.max,
children: <Widget>[
Row(
children: <Widget>[
Expanded(
child: MenuBar(
children: <Widget>[
SubmenuButton(
menuChildren: <Widget>[
MenuItemButton(
onPressed: () {
showAboutDialog(
context: context,
useRootNavigator: false,
applicationName: 'MenuBar Demo',
applicationVersion: '1.0.0',
);
},
child: const MenuAcceleratorLabel('&About'),
),
SubmenuButton(
menuChildren: <Widget>[
MenuItemButton(
onPressed: () {
ScaffoldMessenger.of(context).showSnackBar(
const SnackBar(
content: Text('Saved!'),
),
);
},
child: const MenuAcceleratorLabel('&Save now'),
),
MenuItemButton(
onPressed: () {
ScaffoldMessenger.of(context).showSnackBar(
const SnackBar(
content: Text('Load!'),
),
);
},
child: const MenuAcceleratorLabel('&Load now'),
),
],
child: const Text('File'),
),
MenuItemButton(
onPressed: () {
ScaffoldMessenger.of(context).showSnackBar(
const SnackBar(
content: Text('Quit!'),
),
);
},
child: const MenuAcceleratorLabel('&Quit'),
),
],
child: const MenuAcceleratorLabel('&File'),
),
SubmenuButton(
menuChildren: <Widget>[
MenuItemButton(
onPressed: () {
ScaffoldMessenger.of(context).showSnackBar(
const SnackBar(
content: Text('Bold!'),
),
);
},
child: const MenuAcceleratorLabel('&Bold'),
),
MenuItemButton(
onPressed: () {
ScaffoldMessenger.of(context).showSnackBar(
const SnackBar(
content: Text('Italic!'),
),
);
},
child: const MenuAcceleratorLabel('&Italic'),
),
MenuItemButton(
onPressed: () {
ScaffoldMessenger.of(context).showSnackBar(
const SnackBar(
content: Text('Underline!'),
),
);
},
child: const MenuAcceleratorLabel('&Underline'),
),
],
child: const MenuAcceleratorLabel('&Style'),
),
SubmenuButton(
menuChildren: <Widget>[
const MenuItemButton(
onPressed: null,
child: MenuAcceleratorLabel('&Disabled item'),
),
MenuItemButton(
onPressed: () {
ScaffoldMessenger.of(context).showSnackBar(
const SnackBar(
content: Text('Minify!'),
),
);
},
child: const MenuAcceleratorLabel('Mi&nify'),
),
],
child: const MenuAcceleratorLabel('&View'),
),
],
),
),
],
),
],
),
);
}
}
