Skip to content

DropdownButtonFormField does not scale correctly to fit its parent's height #162350

Closed
flutter/packages
#12606

Description

@MacFrikandel

Steps to reproduce

Stretch a DropdownButtonFormField to fill its parent widget's height

Expected results

The UI should scale according to the widget height. This works when using DropdownButton instead of DropdownButtonFormFeild as shown in the screenshot, where the bottom border is moved lower to fill the remaining height.

Actual results

The actual visible elements including the border are only rendered at the top of the field instead of expanded to the full height. The widget scales to full height and is clickable across the whole height, but the border and decoration doesn't scale accordingly.

Code sample

DropdownButton UI scales to fit its parents hide, wheares DropdownButtonFormField does not
import 'package:flutter/material.dart';

void main() {
  runApp(
    MaterialApp(
      home: const TestView(),
    )
  );
}

class TestView extends StatelessWidget {
  const TestView({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    List<DropdownMenuItem<int>> debugItems = [
      DropdownMenuItem(
        value: 1,
        child: Text("Option 1"),
      ),
      DropdownMenuItem(
        value: 2,
        child: Text("Option 2"),
      ),
    ];
    
    return Scaffold(
      body: SizedBox(
        height: 200,
        child: Row(
          crossAxisAlignment: CrossAxisAlignment.stretch,
          children: [
            Expanded(
              child: DropdownButton<int> ( // rendered correctly
                isExpanded: true,
                value: 1,
                items: debugItems,
                onChanged: (int? value) {},
              ),
            ),
            Expanded(
              child: DropdownButtonFormField<int>( // looks weird
                isExpanded: true,
                value: 1,
                items: debugItems,
                onChanged: (int? value) {},
              ),
            ),
          ],
        ),
      ),
    );
  }
}

Screenshots or Video

DropdownButton on the left, DropdownButtonFormField on the right

Image

Flutter Doctor output

Doctor output
[√] Flutter (Channel stable, 3.22.2, on Microsoft Windows [Version 10.0.19045.5247], locale de-DE)
    • Flutter version 3.22.2 on channel stable at D:\Workspace\flutter
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 761747bfc5 (8 months ago), 2024-06-05 22:15:13 +0200
    • Engine revision edd8546116
    • Dart version 3.4.3
    • DevTools version 2.34.3

[√] Windows Version (Installed version of Windows is version 10 or higher)

[√] Android toolchain - develop for Android devices (Android SDK version 34.0.0)
    • Android SDK at D:\Workspace\Android\Sdk
    • Platform android-34, build-tools 34.0.0
    • Java binary at: D:\Programme\Android\Android Studio\jbr\bin\java
    • Java version OpenJDK Runtime Environment (build 17.0.7+0-b2043.56-10550314)
    • All Android licenses accepted.

[√] Chrome - develop for the web
    • CHROME_EXECUTABLE = D:\Programme\Google\Chrome\Application\chrome.exe      

[√] Visual Studio - develop Windows apps (Visual Studio Community 2022 17.10.5)
    • Visual Studio at D:\Programme\Visual Studio\2022
    • Visual Studio Community 2022 version 17.10.35122.118
    • Windows 10 SDK version 10.0.22621.0

[√] Android Studio (version 2023.1)
    • Android Studio at D:\Programme\Android\Android Studio
    • 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.7+0-b2043.56-10550314)

[√] Connected device (3 available)
    • Windows (desktop) • windows • windows-x64    • Microsoft Windows [Version 10.0.19045.5247]
    • Chrome (web)      • chrome  • web-javascript • Google Chrome 132.0.6834.111
    • Edge (web)        • edge    • web-javascript • Microsoft Edge 131.0.2903.146

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

• No issues found!

Activity

  1. darshankawar commented on Jan 29, 2025

    @darshankawar
    Member

    Thanks for the report. Seeing the same behavior on latest sdk versions and on all platforms.

    stable : 3.27.3
    master : 3.29.0-1.0.pre.127
    
  2. added
    frameworkflutter/packages/flutter repository. See also f: labels.
    p: material_uimaterial_ui package in flutter/packages
    has reproducible stepsThe issue has been confirmed reproducible and is ready to work on
    team-designOwned by Design Languages team
    and removed
    in triagePresently being triaged by the triage team
    on Jan 29, 2025
  3. added
    P2Important issues not at the top of the work list
    triaged-designTriaged by Design Languages team
    on Jan 29, 2025
  4. added
    packageflutter/packages repository. See also p: labels.
    and removed
    frameworkflutter/packages/flutter repository. See also f: labels.
    on Aug 17, 2026
  5. added a commit that references this issue on Oct 2, 2026
    b0ae3b2
  6. github-actions commented on Oct 16, 2026

    @github-actions

    This thread has been automatically locked since there has not been any recent activity after it was closed. If you are still experiencing a similar issue, please open a new bug, including the output of flutter doctor -v and a minimal reproduction of the issue.

  7. locked as resolved and limited conversation to collaborators on Oct 16, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    P2Important issues not at the top of the work listfound in release: 3.27Found to occur in 3.27found in release: 3.29Found to occur in 3.29has reproducible stepsThe issue has been confirmed reproducible and is ready to work onp: material_uimaterial_ui package in flutter/packagespackageflutter/packages repository. See also p: labels.team-designOwned by Design Languages teamtriaged-designTriaged by Design Languages team

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions