Skip to content

Update CheckedPopupMenuItem‎ for Material 3 #128576

@Curstantine

Description

@Curstantine

Is there an existing issue for this?

Steps to reproduce

  1. Use a ListTile inside PopupMenuItem as suggested in the comments to include a leading icon.
  2. TextTheme.bodyLarge is used on the title instead of the TextTheme.labelLarge as mentioned in the M3 spec.

Expected results

ListTile with a title style of TextTheme.labelLarge.

Actual results

ListTile with a title style of TextTheme.bodyLarge. The defaults of the ListTile is not being overriden by the PopupMenuItem when used with it.

  1. Menu:
    image

  2. ListTile:
    image

Code sample

Code sample
import 'package:flutter/material.dart';

void main() {
	runApp(const App());
}

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

	@override
	Widget build(context) {
		return MaterialApp(
			theme: ThemeData.dark(useMaterial3: true),
			home: Scaffold(body: Center(child: PopupMenuButton(
				offset: const Offset(0, 56),
				itemBuilder: (context, ) {
					final theme = Theme.of(context);
					final text = theme.textTheme;
					final colors = theme.colorScheme;

					return [
						const CheckedPopupMenuItem(
							checked: true,
							child: Text("Checked"),
						),
						const PopupMenuItem(
							child: ListTile(
								leading: Icon(Icons.check_rounded),
								title: Text("Checked"),
							),
						),
						PopupMenuItem(
							child: ListTile(
								leading: const Icon(Icons.check_rounded),
								title: Text("Checked", style: text.labelLarge?.copyWith(color: colors.onSurface)),
							),
						)
					];
				}
			)))
		);
	}
}

Screenshots or Video

No response

Logs

No response

Flutter Doctor output

Doctor output
[✓] Flutter (Channel stable, 3.10.2, on Arch Linux 6.3.5-arch1-1, locale en_US.UTF-8)
    • Flutter version 3.10.2 on channel stable at /home/<REDACTED>/Sdks/flutter
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 9cd3d0d9ff (2 weeks ago), 2023-05-23 20:57:28 -0700
    • Engine revision 90fa3ae28f
    • Dart version 3.0.2
    • DevTools version 2.23.1

[✓] Android toolchain - develop for Android devices (Android SDK version 34.0.0-rc2)
    • Android SDK at /opt/android-sdk
    • Platform android-33, build-tools 34.0.0-rc2
    • Java binary at: /usr/bin/java
    • Java version OpenJDK Runtime Environment (build 17.0.7+7)
    • All Android licenses accepted.

[✗] Chrome - develop for the web (Cannot find Chrome executable at google-chrome)
    ! Cannot find Chrome. Try setting CHROME_EXECUTABLE to a Chrome executable.

[✓] Linux toolchain - develop for Linux desktop
    • clang version 15.0.7
    • cmake version 3.26.4
    • ninja version 1.11.1
    • pkg-config version 1.8.1

[!] Android Studio (not installed)
    • Android Studio not found; download from https://developer.android.com/studio/index.html
      (or visit https://flutter.dev/docs/get-started/install/linux#android-setup for detailed instructions).

[✓] Connected device (2 available)
    • <REDACTED> (mobile) • <REDACTED> • android-arm64 • Android 12 (API 31)
    • Linux (desktop)     • linux      • linux-x64     • Arch Linux 6.3.5-arch1-1

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

Metadata

Metadata

Assignees

Labels

a: qualityA truly polished experiencec: proposalA detailed proposal for a change to Flutterf: material designflutter/packages/flutter/material repository.frameworkflutter/packages/flutter repository. See also f: labels.team-designOwned by Design Languages teamtriaged-designTriaged 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