DropdownButton does not grows based on content when isDense is true.

[kf6gpe]

https://b.corp.google.com/issues/151121131.

[mehmetf]

The documentation in the code says:

  // When isDense is true, reduce the height of this button from _kMenuItemHeight to
  // _kDenseButtonHeight, but don't make it smaller than the text that it contains.
  // Similarly, we don't reduce the height of the button so much that its icon
  // would be clipped.

However, with the following snippet:

DropdownButtonFormField(
  items: [
    DropdownMenuItem(
      value: 'some value',
      child: Text(
        'some option',
        style: Theme.of(context).textTheme.headline1,
      ),
    ),
  ],
  value: _value,
  onChanged: (newValue) { _setValue(newValue); },
  isDense: true,
  hint: Text(
    'some hint',
    style: Theme.of(context).textTheme.headline1,
  ),
  decoration: InputDecoration(
    enabledBorder: OutlineInputBorder(),
  ),
),

Both 'some hint' and 'some option'(after being selected) will be cut.

[lanerichmond00]

DropdownButtonFormField(
  items: [
    DropdownMenuItem(
      value: 'some value',
      child: Text(
        'some option',
        style: Theme.of(context).textTheme.headline1,
      ),
    ),
  ],
  value: _value,
  onChanged: (newValue) { _setValue(newValue); },
  isDense: true,
  hint: Text(
    'some hint',
    style: Theme.of(context).textTheme.headline1,
  ),
  decoration: InputDecoration(
    enabledBorder: OutlineInputBorder(),
  ),
),

[pedromassangocode]

I was able to reproduce in 1.21.0-1.0.pre.

Complete example

``` import 'package:flutter/material.dart'; void main() { runApp(MyApp()); } class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return MaterialApp( title: 'Flutter Demo', theme: ThemeData( primarySwatch: Colors.blue, visualDensity: VisualDensity.adaptivePlatformDensity, ), home: MyHomePage(), ); } } class MyHomePage extends StatefulWidget { @override _MyHomePageState createState() => _MyHomePageState(); } class _MyHomePageState extends State { dynamic _value; @override Widget build(BuildContext context) { return Scaffold( body: Center( child: DropdownButtonFormField( items: [ DropdownMenuItem( value: 'some value', child: Text( 'some option', style: Theme.of(context).textTheme.headline1, ), ), ], value: _value, onChanged: (newValue) => setState(() => _value = newValue), isDense: true, hint: Text( 'some hint', style: Theme.of(context).textTheme.headline6, ), decoration: InputDecoration( enabledBorder: OutlineInputBorder(), ), ), ) ); } } ```

Logs

``` Performing hot reload... Syncing files to device iPhone SE (2nd generation)... ══╡ EXCEPTION CAUGHT BY RENDERING LIBRARY ╞═════════════════════════════════════════════════════════ The following assertion was thrown during layout: A RenderFlex overflowed by 309 pixels on the right. The relevant error-causing widget was: DropdownButtonFormField file:///Users/pedro/dev/projects/hello_flutter/lib/main.dart:34:18 The overflowing RenderFlex has an orientation of Axis.horizontal. The edge of the RenderFlex that is overflowing has been marked in the rendering with a yellow and black striped pattern. This is usually caused by the contents being too big for the RenderFlex. Consider applying a flex factor (e.g. using an Expanded widget) to force the children of the RenderFlex to fit within the available space instead of being sized to their natural size. This is considered an error condition because it indicates that there is content that cannot be seen. If the content is legitimately bigger than the available space, consider clipping it with a ClipRect widget before putting it in the flex, or using a scrollable container rather than a Flex, like a ListView. The specific RenderFlex in question is: RenderFlex#e8195 OVERFLOWING: creator: Row ← Padding ← ConstrainedBox ← Container ← DefaultTextStyle ← _PointerListener ← Listener ← _GestureSemantics ← RawGestureDetector ← GestureDetector ← Semantics ← _FocusMarker ← ⋯ parentData: offset=Offset(0.0, 0.0) (can use size) constraints: BoxConstraints(w=351.0, h=24.0) size: Size(351.0, 24.0) direction: horizontal mainAxisAlignment: spaceBetween mainAxisSize: min crossAxisAlignment: center textDirection: ltr verticalDirection: down ◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤ ════════════════════════════════════════════════════════════════════════════════════════════════════ Reloaded 1 of 521 libraries in 198ms. ════════ Exception caught by rendering library ═════════════════════════════════════════════════════ The following assertion was thrown during layout: A RenderFlex overflowed by 309 pixels on the right. The relevant error-causing widget was: DropdownButtonFormField file:///Users/pedro/dev/projects/hello_flutter/lib/main.dart:34:18 The overflowing RenderFlex has an orientation of Axis.horizontal. The edge of the RenderFlex that is overflowing has been marked in the rendering with a yellow and black striped pattern. This is usually caused by the contents being too big for the RenderFlex. Consider applying a flex factor (e.g. using an Expanded widget) to force the children of the RenderFlex to fit within the available space instead of being sized to their natural size. This is considered an error condition because it indicates that there is content that cannot be seen. If the content is legitimately bigger than the available space, consider clipping it with a ClipRect widget before putting it in the flex, or using a scrollable container rather than a Flex, like a ListView. The specific RenderFlex in question is: RenderFlex#e8195 OVERFLOWING ... parentData: offset=Offset(0.0, 0.0) (can use size) ... constraints: BoxConstraints(w=351.0, h=24.0) ... size: Size(351.0, 24.0) ... direction: horizontal ... mainAxisAlignment: spaceBetween ... mainAxisSize: min ... crossAxisAlignment: center ... textDirection: ltr ... verticalDirection: down ◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤ ════════════════════════════════════════════════════════════════════════════════════════════════════ ```

flutter doctor -v

``` [✓] Flutter (Channel dev, 1.21.0-1.0.pre, on Mac OS X 10.15.5 19F101, locale en-AO) • Flutter version 1.21.0-1.0.pre at /Users/pedro/dev/SDKs/flutter_dev • Framework revision f25bd9c55c (2 days ago), 2020-07-14 20:26:01 -0400 • Engine revision 99c2b3a245 • Dart version 2.9.0 (build 2.9.0-21.0.dev 20bf2fcf56) [✓] Android toolchain - develop for Android devices (Android SDK version 30.0.0) • Android SDK at /Users/pedro/Library/Android/sdk • Platform android-30, build-tools 30.0.0 • Java binary at: /Users/pedro/Library/Application Support/JetBrains/Toolbox/apps/AndroidStudio/ch-0/193.6514223/Android Studio.app/Contents/jre/jdk/Contents/Home/bin/java • Java version OpenJDK Runtime Environment (build 1.8.0_242-release-1644-b3-6222593) • All Android licenses accepted. [✓] Xcode - develop for iOS and macOS (Xcode 11.5) • Xcode at /Applications/Xcode.app/Contents/Developer • Xcode 11.5, Build version 11E608c • CocoaPods version 1.9.3 [✓] Chrome - develop for the web • CHROME_EXECUTABLE = /Applications/Google Chrome.app/Contents/MacOS/google-chrome-unsafe [✓] Android Studio (version 4.0) • Android Studio at /Applications/Android Studio.app/Contents • Flutter plugin version 47.1.2 • Dart plugin version 193.7361 • Java version OpenJDK Runtime Environment (build 1.8.0_242-release-1644-b3-6222593) [✓] Android Studio (version 4.0) • Android Studio at /Users/pedro/Library/Application Support/JetBrains/Toolbox/apps/AndroidStudio/ch-0/193.6514223/Android Studio.app/Contents • Flutter plugin version 47.1.2 • Dart plugin version 193.7361 • Java version OpenJDK Runtime Environment (build 1.8.0_242-release-1644-b3-6222593) [✓] VS Code (version 1.47.0) • VS Code at /Applications/Visual Studio Code.app/Contents • Flutter extension version 3.12.1 [✓] Connected device (4 available) • AOSP on IA Emulator (mobile) • emulator-5554 • android-x86 • Android 9 (API 28) (emulator) • macOS (desktop) • macos • darwin-x64 • Mac OS X 10.15.5 19F101 • Web Server (web) • web-server • web-javascript • Flutter Tools • Chrome (web) • chrome • web-javascript • Google Chrome 83.0.4103.116 • No issues found! Process finished with exit code 0 ```

[maheshj01]

Reproducible as of stable 3.0.1 and master 3.1.0, DropdownButton doesn't change its height based on the selected content.

code sample

```dart import 'package:flutter/material.dart'; void main() { runApp(MyApp()); } class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return MaterialApp( title: 'Flutter Demo', theme: ThemeData( primarySwatch: Colors.blue, visualDensity: VisualDensity.adaptivePlatformDensity, ), home: MyHomePage(), ); } } class MyHomePage extends StatefulWidget { @override _MyHomePageState createState() => _MyHomePageState(); } class _MyHomePageState extends State { dynamic _value; @override Widget build(BuildContext context) { return Scaffold( body: Center( child: DropdownButtonFormField( items: [ DropdownMenuItem( value: 'This is too big to fit', child: Text( 'This will not fit', style: Theme.of(context).textTheme.headline1, ), ), DropdownMenuItem( value: 'This will fit', child: Text( 'This will fit', style: Theme.of(context).textTheme.headline6, ), ), ], value: _value, onChanged: (newValue) => setState(() => _value = newValue), isDense: true, hint: Text( 'some hint', style: Theme.of(context).textTheme.headline6, ), decoration: const InputDecoration( enabledBorder: OutlineInputBorder(), ), ), )); } } ```

flutter doctor -v (mac)

``` [✓] Flutter (Channel stable, 3.0.1, on macOS 12.3 21E230 darwin-arm, locale en-IN) • Flutter version 3.0.1 at /Users/mahesh/Documents/flutter • Upstream repository https://github.com/flutter/flutter.git • Framework revision fb57da5f94 (3 days ago), 2022-05-19 15:50:29 -0700 • Engine revision caaafc5604 • Dart version 2.17.1 • DevTools version 2.12.2 [✓] Android toolchain - develop for Android devices (Android SDK version 31.0.0) • Android SDK at /Users/mahesh/Library/Android/sdk • Platform android-32, build-tools 31.0.0 • ANDROID_HOME = /Users/mahesh/Library/Android/sdk • Java binary at: /Applications/Android Studio.app/Contents/jre/Contents/Home/bin/java • Java version OpenJDK Runtime Environment (build 11.0.11+0-b60-7772763) • All Android licenses accepted. [!] Xcode - develop for iOS and macOS (Xcode 13.2.1) • Xcode at /Applications/Xcode.app/Contents/Developer ! CocoaPods 1.10.2 out of date (1.11.0 is recommended). CocoaPods is used to retrieve the iOS and macOS platform side's plugin code that responds to your plugin usage on the Dart side. Without CocoaPods, plugins will not work on iOS or macOS. For more info, see https://flutter.dev/platform-plugins To upgrade see https://guides.cocoapods.org/using/getting-started.html#installation for instructions. [✓] Chrome - develop for the web • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome [✓] Android Studio (version 2021.1) • 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 11.0.11+0-b60-7772763) [✓] IntelliJ IDEA Community Edition (version 2021.2.1) • IntelliJ at /Applications/IntelliJ IDEA CE.app • Flutter plugin version 61.2.4 • Dart plugin version 212.5080.8 [✓] VS Code (version 1.66.2) • VS Code at /Applications/Visual Studio Code.app/Contents • Flutter extension version 3.40.0 [✓] Connected device (4 available) • Redmi K20 Pro (mobile) • 192.168.1.2:5555 • android-arm64 • Android 11 (API 30) • iPhone 12 Pro (mobile) • 19FD0231-BFF0-441D-B584-AD94C4084525 • ios • com.apple.CoreSimulator.SimRuntime.iOS-15-2 (simulator) • macOS (desktop) • macos • darwin-arm64 • macOS 12.3 21E230 darwin-arm • Chrome (web) • chrome • web-javascript • Google Chrome 101.0.4951.64 [✓] HTTP Host Availability • All required HTTP hosts are available ! Doctor found issues in 1 category. ``` ``` [✓] Flutter (Channel master, 3.1.0-0.0.pre.1008, on macOS 12.3 21E230 darwin-arm, locale en-IN) • Flutter version 3.1.0-0.0.pre.1008 at /Users/mahesh/Documents/flutter_master • Upstream repository https://github.com/flutter/flutter.git • Framework revision c2cc31b198 (26 hours ago), 2022-05-30 05:23:08 -0400 • Engine revision 05efd25f05 • Dart version 2.18.0 (build 2.18.0-151.0.dev) • DevTools version 2.13.1 [✓] Android toolchain - develop for Android devices (Android SDK version 33.0.0-rc4) • Android SDK at /Users/mahesh/Library/Android/sdk • Platform android-32, build-tools 33.0.0-rc4 • ANDROID_HOME = /Users/mahesh/Library/Android/sdk • Java binary at: /Applications/Android Studio.app/Contents/jre/Contents/Home/bin/java • Java version OpenJDK Runtime Environment (build 11.0.11+0-b60-7772763) • All Android licenses accepted. [!] Xcode - develop for iOS and macOS (Xcode 13.2.1) • Xcode at /Applications/Xcode.app/Contents/Developer ! CocoaPods 1.10.2 out of date (1.11.0 is recommended). CocoaPods is used to retrieve the iOS and macOS platform side's plugin code that responds to your plugin usage on the Dart side. Without CocoaPods, plugins will not work on iOS or macOS. For more info, see https://flutter.dev/platform-plugins To upgrade see https://guides.cocoapods.org/using/getting-started.html#installation for instructions. [✓] Chrome - develop for the web • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome [✓] Android Studio (version 2021.1) • 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 11.0.11+0-b60-7772763) [✓] IntelliJ IDEA Community Edition (version 2021.2.1) • IntelliJ at /Applications/IntelliJ IDEA CE.app • Flutter plugin version 61.2.4 • Dart plugin version 212.5080.8 [✓] VS Code (version 1.66.2) • VS Code at /Applications/Visual Studio Code.app/Contents • Flutter extension version 3.40.0 [✓] Connected device (4 available) • sdk gphone arm64 (mobile) • emulator-5554 • android-arm64 • Android 11 (API 30) (emulator) • iPhone 12 Pro (mobile) • 6AE1D692-DB57-4C3E-ADCA-66842182426B • ios • com.apple.CoreSimulator.SimRuntime.iOS-14-5 (simulator) • macOS (desktop) • macos • darwin-arm64 • macOS 12.3 21E230 darwin-arm • Chrome (web) • chrome • web-javascript • Google Chrome 102.0.5005.61 [✓] HTTP Host Availability • All required HTTP hosts are available ! Doctor found issues in 1 category. ```

[a1573595]

Same issue