Skip to content

DropdownMenu does not correctly handle incoming maxWidth and minHeight constraints #147076

@Hixie

Description

@Hixie

Consider the following demo:

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(
      title: 'Flutter Demo',
      home: Container(
        alignment: Alignment.center,
        color: Colors.amber,
        child: SizedBox(
          height: 100.0,
          width: 100.0,
          child: Card(
            child: DropdownMenu(
              dropdownMenuEntries: [
                DropdownMenuEntry(
                  value: '',
                  label: 'This is a very long label',
                ),
              ],
            ),
          ),
        ),
      ),
    );
  }
}

It should display a 100x100 widget, or at least a widget not wider than 100 pixels, whose menu appears below it.

Instead it displays a widget that is wider than the maxWidth (painting outside of its allowed bounds), and the menu renders below the minHeight, not under the actual widget:

The width aspect of this in particular is quite serious as it makes it impossible to use this widget with user-controlled text without risking overflow. You can't even set a labelWidget that makes the text wrap or truncate, because the labels don't receive the constraints.

Metadata

Metadata

Assignees

Labels

P2Important issues not at the top of the work listf: material designflutter/packages/flutter/material repository.found in release: 3.19Found to occur in 3.19found in release: 3.22Found to occur in 3.22frameworkflutter/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 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