1. 18 Oct, 2023 1 commit
  2. 22 Aug, 2023 1 commit
    • Taha Tesser's avatar
      Update default menu text styles for Material 3 (#131930) · 1bc79169
      Taha Tesser authored
      Related https://github.com/flutter/flutter/issues/131676
      
      ## Description
      
      #### Fix default input text style for `DropdownMenu`
      
      ![dropdown_input](https://github.com/flutter/flutter/assets/48603081/301f8243-155a-4b8f-84a8-5e6b7bebb3bc)
      
      ### Fix default text style for  `MenuAnchor`'s menu items (which `DropdownMenu` uses for menu items)
      
      ![dropdown_item](https://github.com/flutter/flutter/assets/48603081/6b5be81a-72fc-4705-a577-074c7a4cad8f)
      
      ###  Default  `DropdownMenu` Input text style 
      
      ![Screenshot 2023-08-04 at 16 48 28](https://github.com/flutter/flutter/assets/48603081/bcd9da98-e74d-491e-ae64-6268ae0b3893)
      
      ### Default `DropdownMenu` menu item text style
      
      ![Screenshot 2023-08-04 at 16 50 19](https://github.com/flutter/flutter/assets/48603081/9592ca43-2854-45b5-8648-203ab65d9745)
      
      ### Default `MenuAnchor` menu item text style
      
      ![Screenshot 2023-08-04 at 14 34 28](https://github.com/flutter/flutter/assets/48603081/e87e1073-05f8-4dc7-a435-d864e9cce6ab)
      
      ### Code sample
      
      <details> 
      <summary>expand to view the code sample</summary> 
      
      ```dart
      import 'package:flutter/material.dart';
      
      /// Flutter code sample for [DropdownMenu]s. The first dropdown menu has an outlined border.
      
      void main() => runApp(const DropdownMenuExample());
      
      class DropdownMenuExample extends StatefulWidget {
        const DropdownMenuExample({super.key});
      
        @override
        State<DropdownMenuExample> createState() => _DropdownMenuExampleState();
      }
      
      class _DropdownMenuExampleState extends State<DropdownMenuExample> {
        final TextEditingController colorController = TextEditingController();
        final TextEditingController iconController = TextEditingController();
        ColorLabel? selectedColor;
        IconLabel? selectedIcon;
      
        @override
        Widget build(BuildContext context) {
          final List<DropdownMenuEntry<ColorLabel>> colorEntries =
              <DropdownMenuEntry<ColorLabel>>[];
          for (final ColorLabel color in ColorLabel.values) {
            colorEntries.add(
              DropdownMenuEntry<ColorLabel>(
                  value: color, label: color.label, enabled: color.label != 'Grey'),
            );
          }
      
          final List<DropdownMenuEntry<IconLabel>> iconEntries =
              <DropdownMenuEntry<IconLabel>>[];
          for (final IconLabel icon in IconLabel.values) {
            iconEntries
                .add(DropdownMenuEntry<IconLabel>(value: icon, label: icon.label));
          }
      
          return MaterialApp(
            theme: ThemeData(
              useMaterial3: true,
              colorSchemeSeed: Colors.green,
              // textTheme: const TextTheme(
              //   bodyLarge: TextStyle(
              //     fontWeight: FontWeight.bold,
              //     fontStyle: FontStyle.italic,
              //     decoration: TextDecoration.underline,
              //   ),
              // ),
            ),
            home: Scaffold(
              body: SafeArea(
                child: Column(
                  children: <Widget>[
                    const Text('DropdownMenus'),
                    Padding(
                      padding: const EdgeInsets.symmetric(vertical: 20),
                      child: Row(
                        mainAxisAlignment: MainAxisAlignment.center,
                        children: <Widget>[
                          DropdownMenu<ColorLabel>(
                            controller: colorController,
                            label: const Text('Color'),
                            dropdownMenuEntries: colorEntries,
                            onSelected: (ColorLabel? color) {
                              setState(() {
                                selectedColor = color;
                              });
                            },
                          ),
                          const SizedBox(width: 20),
                          DropdownMenu<IconLabel>(
                            controller: iconController,
                            enableFilter: true,
                            leadingIcon: const Icon(Icons.search),
                            label: const Text('Icon'),
                            dropdownMenuEntries: iconEntries,
                            inputDecorationTheme: const InputDecorationTheme(
                              filled: true,
                              contentPadding: EdgeInsets.symmetric(vertical: 5.0),
                            ),
                            onSelected: (IconLabel? icon) {
                              setState(() {
                                selectedIcon = icon;
                              });
                            },
                          ),
                        ],
                      ),
                    ),
                    const Text('Plain TextFields'),
                    Padding(
                      padding: const EdgeInsets.symmetric(vertical: 20),
                      child: Row(
                        mainAxisAlignment: MainAxisAlignment.center,
                        children: <Widget>[
                          SizedBox(
                            width: 150,
                            child: TextField(
                                controller: TextEditingController(text: 'Blue'),
                                decoration: const InputDecoration(
                                  suffixIcon: Icon(Icons.arrow_drop_down),
                                  labelText: 'Color',
                                  border: OutlineInputBorder(),
                                )),
                          ),
                          const SizedBox(width: 20),
                          SizedBox(
                            width: 150,
                            child: TextField(
                                controller: TextEditingController(text: 'Smile'),
                                decoration: const InputDecoration(
                                  prefixIcon: Icon(Icons.search),
                                  suffixIcon: Icon(Icons.arrow_drop_down),
                                  filled: true,
                                  labelText: 'Icon',
                                )),
                          ),
                        ],
                      ),
                    ),
                    if (selectedColor != null && selectedIcon != null)
                      Row(
                        mainAxisAlignment: MainAxisAlignment.center,
                        children: <Widget>[
                          Text(
                              'You selected a ${selectedColor?.label} ${selectedIcon?.label}'),
                          Padding(
                            padding: const EdgeInsets.symmetric(horizontal: 5),
                            child: Icon(
                              selectedIcon?.icon,
                              color: selectedColor?.color,
                            ),
                          )
                        ],
                      )
                    else
                      const Text('Please select a color and an icon.')
                  ],
                ),
              ),
            ),
          );
        }
      }
      
      enum ColorLabel {
        blue('Blue', Colors.blue),
        pink('Pink', Colors.pink),
        green('Green', Colors.green),
        yellow('Yellow', Colors.yellow),
        grey('Grey', Colors.grey);
      
        const ColorLabel(this.label, this.color);
        final String label;
        final Color color;
      }
      
      enum IconLabel {
        smile('Smile', Icons.sentiment_satisfied_outlined),
        cloud(
          'Cloud',
          Icons.cloud_outlined,
        ),
        brush('Brush', Icons.brush_outlined),
        heart('Heart', Icons.favorite);
      
        const IconLabel(this.label, this.icon);
        final String label;
        final IconData icon;
      }
      
      ``` 
      	
      </details>
      1bc79169
  3. 14 Aug, 2023 1 commit
  4. 10 Aug, 2023 1 commit
  5. 20 Jul, 2023 1 commit
  6. 07 Jun, 2023 1 commit
    • Greg Spencer's avatar
      Disable context menu (#128365) · 36f73cf6
      Greg Spencer authored
      ## Description
      
      Changes the context menu example for `MenuAnchor` so that it uses right-click, or (on macOS and iOS only) ctrl-left-click, for the context menu. Also disables the browser context menu on web platforms.
      
      ## Tests
       - Updated test to reflect new triggers.
      36f73cf6
  7. 01 Jun, 2023 1 commit
  8. 29 Nov, 2022 1 commit
    • Greg Spencer's avatar
      Menu bar accelerators (#114852) · 0cb9f704
      Greg Spencer authored
      * Add MenuMenuAcceleratorLabel to support accelerators.
      
      * Review Changes
      
      * Review Changed
      
      * Fix default label builder to use characters
      
      * Remove golden test that shouldn't have been there.
      0cb9f704
  9. 25 Oct, 2022 1 commit
  10. 07 Oct, 2022 1 commit
  11. 28 Sep, 2022 1 commit
    • Greg Spencer's avatar
      Implement Material MenuBar and MenuAnchor (#112239) · 8c271e5c
      Greg Spencer authored
      This implements a MenuBar widget that can render a Material menu bar, and a MenuAnchor widget used to create a cascading menu in a region. The menus are drawn in the overlay, while the menu bar itself is in the regular widget tree. Keyboard traversal works between the two.
      
      This implementation of the MenuBar uses MenuAnchor to create a cascading menu that contains widgets representing the menu items. These menu items can be any kind of widget, but are typically SubmenuButtons that host submenus, or MenuItemButtons that have shortcut hints (but don't actually activate the shortcuts) and don't host submenus.
      
      Cascading menus can be created outside of a MenuBar by using a MenuAnchor. They can be either given a specific location to appear (a coordinate), or they can be located by the MenuAnchor region that wraps the control that opens them.
      
      The developer may also create a MenuController to pass to the various menu primitives (MenuBar or MenuAnchor) to associate menus so that they can be traversed together and closed together. Creating a controller is not required.
      8c271e5c