Skip to content

PopupMenuItem with a ListTile doesn't use the correct text style. #133138

@TahaTesser

Description

@TahaTesser

Is there an existing issue for this?

This was pointed out by @rydmike in #131609 (comment)

Steps to reproduce

Use ListTile in PopupMenuItem for a eloborate popup menu item

https://api.flutter.dev/flutter/material/PopupMenuItem-class.html

Expected results

Text style for the PopupMenuItem with a Text widget child, CheckedPopupMenuItem (which uses the ListTile widget internally, and PopupMenuItem with a ListTile child should have consistent text style.

Screenshot 2023-08-23 at 14 08 32

Actual results

Text style for the PopupMenuItem with a Text widget child, CheckedPopupMenuItem (which uses the ListTile widget internally, and PopupMenuItem with a ListTile child does not have consistent text style.

Screenshot 2023-08-23 at 14 08 48

Code sample

Code sample
[Paste your code here]

Screenshots or Video

Screenshots / Video demonstration

[Upload media here]

Logs

Logs
import 'package:flutter/material.dart';

/// Flutter code sample for [PopupMenuButton].

// This is the type used by the popup menu below.
enum SampleItem { itemOne, itemTwo, itemThree }

void main() => runApp(const PopupMenuApp());

class PopupMenuApp extends StatelessWidget {
  const PopupMenuApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData(
        useMaterial3: true,
        textTheme: const TextTheme(
          labelLarge: TextStyle(
            fontStyle: FontStyle.italic,
            fontWeight: FontWeight.bold,
          ),
        ),
      ),
      home: const PopupMenuExample(),
    );
  }
}

class PopupMenuExample extends StatefulWidget {
  const PopupMenuExample({super.key});

  @override
  State<PopupMenuExample> createState() => _PopupMenuExampleState();
}

class _PopupMenuExampleState extends State<PopupMenuExample> {
  SampleItem? selectedMenu;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: SizedBox(
          width: 300,
          height: 130,
          child: Align(
            alignment: Alignment.topLeft,
            child: PopupMenuButton<SampleItem>(
              initialValue: selectedMenu,
              // Callback that sets the selected popup menu item.
              onSelected: (SampleItem item) {
                setState(() {
                  selectedMenu = item;
                });
              },
              itemBuilder: (BuildContext context) =>
                  <PopupMenuEntry<SampleItem>>[
                const PopupMenuItem<SampleItem>(
                  value: SampleItem.itemOne,
                  child: Text('PopupMenuItem'),
                ),
                const CheckedPopupMenuItem<SampleItem>(
                  checked: true,
                  value: SampleItem.itemTwo,
                  child: Text('CheckedPopupMenuItem'),
                ),
                const PopupMenuItem<SampleItem>(
                  value: SampleItem.itemOne,
                  child: ListTile(
                    leading: Icon(Icons.cloud),
                    title: Text('ListTile'),
                    contentPadding: EdgeInsets.zero,
                    trailing: Icon(Icons.arrow_right_rounded),
                  ),
                ),
              ],
            ),
          ),
        ),
      ),
    );
  }
}

Flutter Doctor output

Doctor output
[✓] Flutter (Channel master, 3.14.0-9.0.pre.52, on macOS 13.5 22G74
    darwin-arm64, locale en-EE)
    • Flutter version 3.14.0-9.0.pre.52 on channel master at
      /Users/tahatesser/Code/flutter
    • Upstream repository [email protected]:TahaTesser/flutter.git
    • FLUTTER_GIT_URL = [email protected]:TahaTesser/flutter.git
    • Framework revision 4bbcb780a6 (7 hours ago), 2023-08-23 00:53:44 -0400
    • Engine revision 7d56840865
    • Dart version 3.2.0 (build 3.2.0-97.0.dev)
    • DevTools version 2.26.2

[✓] Android toolchain - develop for Android devices (Android SDK version
    34.0.0)
    • Android SDK at /Users/tahatesser/Code/android-sdk
    • Platform android-34, build-tools 34.0.0
    • ANDROID_SDK_ROOT = /Users/tahatesser/Code/android-sdk
    • Java binary at: /Applications/Android
      Studio.app/Contents/jbr/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build
      17.0.6+0-17.0.6b829.9-10027231)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 14.3.1)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Build 14E300c
    • CocoaPods version 1.12.1

[✓] Chrome - develop for the web
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] Android Studio (version 2022.3)
    • Android Studio at /Applications/Android Studio.app/Contents
    • Flutter plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/6351-dart
    • Java version OpenJDK Runtime Environment (build
      17.0.6+0-17.0.6b829.9-10027231)

[✓] VS Code (version 1.81.1)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension version 3.70.0

[✓] Connected device (2 available)
    • macOS (desktop) • macos  • darwin-arm64   • macOS 13.5 22G74 darwin-arm64
    • Chrome (web)    • chrome • web-javascript • Google Chrome 116.0.5845.110

[✓] Network resources
    • All expected network resources are available.

• No issues found!

Metadata

Metadata

Assignees

Labels

f: material designflutter/packages/flutter/material repository.found in release: 3.13Found to occur in 3.13found in release: 3.14Found to occur in 3.14frameworkflutter/packages/flutter repository. See also f: labels.has reproducible stepsThe issue has been confirmed reproducible and is ready to work onr: fixedIssue is closed as already fixed in a newer versionteam-designOwned by Design Languages team

Type

No type

Projects

Status

Done (PR merged)

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions