• Taha Tesser's avatar
    Add `CheckedPopupMenuItem‎.labelTextStyle` and update default text style for Material 3 (#131060) · 038ec62b
    Taha Tesser authored
    fixes [Update `CheckedPopupMenuItem‎` for Material 3](https://github.com/flutter/flutter/issues/128576)
    
    ### Description
    
    - This adds the missing ``CheckedPopupMenuItem‎.labelTextStyle` parameter
    - Fixes default text style for `CheckedPopupMenuItem‎`. 
    It used `ListTile`'s  `bodyLarge` instead of `LabelLarge` similar to `PopupMenuItem`.
    
    ### Code sample
    
    <details> 
    <summary>expand to view the code sample</summary> 
    
    ```dart
    import 'package:flutter/material.dart';
    
    void main() => runApp(const MyApp());
    
    class MyApp extends StatelessWidget {
      const MyApp({super.key});
    
      @override
      Widget build(BuildContext context) {
        return MaterialApp(
          debugShowCheckedModeBanner: false,
          theme: ThemeData(
            useMaterial3: true,
            textTheme: const TextTheme(
              labelLarge: TextStyle(
                fontWeight: FontWeight.bold,
                fontStyle: FontStyle.italic,
                letterSpacing: 5.0,
              ),
            ),
          ),
          home: const Example(),
        );
      }
    }
    
    class Example extends StatelessWidget {
      const Example({super.key});
    
      @override
      Widget build(BuildContext context) {
        return Scaffold(
          appBar: AppBar(
            title: const Text('Sample'),
            actions: <Widget>[
              PopupMenuButton<String>(
                icon: const Icon(Icons.more_vert),
                itemBuilder: (BuildContext context) => <PopupMenuEntry<String>>[
                  const CheckedPopupMenuItem<String>(
                    // labelTextStyle: MaterialStateProperty.resolveWith(
                    //     (Set<MaterialState> states) {
                    //   if (states.contains(MaterialState.selected)) {
                    //     return const TextStyle(
                    //       color: Colors.red,
                    //       fontStyle: FontStyle.italic,
                    //       fontWeight: FontWeight.bold,
                    //     );
                    //   }
    
                    //   return const TextStyle(
                    //     color: Colors.amber,
                    //     fontStyle: FontStyle.italic,
                    //     fontWeight: FontWeight.bold,
                    //   );
                    // }),
                    child: Text('Mild'),
                  ),
                  const CheckedPopupMenuItem<String>(
                    checked: true,
                    // labelTextStyle: MaterialStateProperty.resolveWith(
                    //     (Set<MaterialState> states) {
                    //   if (states.contains(MaterialState.selected)) {
                    //     return const TextStyle(
                    //       color: Colors.red,
                    //       fontStyle: FontStyle.italic,
                    //       fontWeight: FontWeight.bold,
                    //     );
                    //   }
    
                    //   return const TextStyle(
                    //     color: Colors.amber,
                    //     fontStyle: FontStyle.italic,
                    //     fontWeight: FontWeight.bold,
                    //   );
                    // }),
                    child: Text('Spicy'),
                  ),
                  const PopupMenuDivider(),
                  const PopupMenuItem<String>(
                    value: 'Close',
                    child: Text('Close'),
                  ),
                ],
              )
            ],
          ),
        );
      }
    }
    
    ``` 
    	
    </details>
    
    ### Customized `textTheme.labelLarge` text theme.
    | Before | After |
    | --------------- | --------------- |
    | <img src="https://github.com/flutter/flutter/assets/48603081/2672438d-b2da-479b-a5d3-d239ef646365" /> | <img src="https://github.com/flutter/flutter/assets/48603081/b9f83719-dede-4c2f-8247-18f74e63eb29"  /> |
    
    ### New `CheckedPopupMenuItem‎.labelTextStyle` parameter with material states support
    <img src="https://github.com/flutter/flutter/assets/48603081/ef0a88aa-9811-42b1-a3aa-53b90c8d43fb" height="450" />
    038ec62b
popup_menu_test.dart 120 KB