search

flutter / flutter

Flutter makes it easy and fast to build beautiful apps for mobile and beyond
https://flutter.dev
BSD 3-Clause "New" or "Revised" License
165.02k stars 27.19k forks source link

BUG: Elevated / Text / Outline Buttons - minimumSize not respected properly when visual density is not standard #123528

Open AlexDochioiu opened 1 year ago

AlexDochioiu commented 1 year ago

Steps to Reproduce

  1. Execute flutter run on the code sample

Expected results: All buttons and red container should have same height

Actual results: Buttons with VisualDensity compact and comfortable have a smaller height compared to the explicitly specified minimum height.

Code sample ```dart 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', theme: ThemeData(primarySwatch: Colors.blue), home: const StlessHomePage(), ); } } class StlessHomePage extends StatelessWidget { const StlessHomePage({Key? key}) : super(key: key); @override Widget build(BuildContext context) { const minHeight = 80.0; final buttonStyle = ElevatedButton.styleFrom( minimumSize: const Size(100, minHeight), ); final standardButtonStyle = buttonStyle.copyWith(visualDensity: VisualDensity.standard); final comfortableButtonStyle = buttonStyle.copyWith(visualDensity: VisualDensity.comfortable); final compactButtonStyle = buttonStyle.copyWith(visualDensity: VisualDensity.compact); return Scaffold( appBar: AppBar(title: const Text('HomePage')), body: Center( child: Row( children: [ const Spacer(), Container(width: 20, height: minHeight, color: Colors.red), ElevatedButton(style: standardButtonStyle, onPressed: () {}, child: const Text("Standard")), ElevatedButton(style: comfortableButtonStyle, onPressed: () {}, child: const Text("Comfortable")), ElevatedButton(style: compactButtonStyle, onPressed: () {}, child: const Text("Compact")), const Spacer(), ], ), ), ); } } ```
Logs ``` ➜ bug_reporting_project flutter doctor -v [✓] Flutter (Channel stable, 3.7.8, on macOS 13.2.1 22D68 darwin-arm64, locale en-GB) • Flutter version 3.7.8 on channel stable at /Users/alexandrudochioiu/.asdf/installs/flutter/3.7.8-stable • Upstream repository https://github.com/flutter/flutter.git • Framework revision 90c64ed42b (6 days ago), 2023-03-21 11:27:08 -0500 • Engine revision 9aa7816315 • Dart version 2.19.5 • DevTools version 2.20.1 [✓] Android toolchain - develop for Android devices (Android SDK version 33.0.1) • Android SDK at /Users/alexandrudochioiu/Library/Android/sdk • Platform android-33, build-tools 33.0.1 • ANDROID_HOME = /Users/alexandrudochioiu/Library/Android/sdk • Java binary at: /Applications/Android Studio.app/Contents/jbr/Contents/Home/bin/java • Java version OpenJDK Runtime Environment (build 11.0.15+0-b2043.56-8887301) • All Android licenses accepted. [✓] Xcode - develop for iOS and macOS (Xcode 14.2) • Xcode at /Applications/Xcode.app/Contents/Developer • Build 14C18 • CocoaPods version 1.12.0 [✓] Chrome - develop for the web • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome [✓] Android Studio (version 2022.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.15+0-b2043.56-8887301) [✓] IntelliJ IDEA Community Edition (version 2022.3.2) • IntelliJ at /Applications/IntelliJ IDEA CE.app • 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 [✓] VS Code (version 1.76.2) • VS Code at /Applications/Visual Studio Code.app/Contents • Flutter extension version 3.60.0 [✓] Connected device (3 available) • 2201116TG (mobile) • LN7DPFJ7MNZXPFFA • android-arm64 • Android 12 (API 31) • macOS (desktop) • macos • darwin-arm64 • macOS 13.2.1 22D68 darwin-arm64 • Chrome (web) • chrome • web-javascript • Google Chrome 111.0.5563.110 [✓] HTTP Host Availability • All required HTTP hosts are available • No issues found! ```
exaby73 commented 1 year ago

Triage report

I can reproduce this issue on Master (3.9.0-17.0.pre.27).

Height wise: standard looks right, while comfortable and compact are less than the minimumSize.height.

Width wise: standard and comfortable looks right while compact is less than the minimumSize.width.

Code Sample ```dart 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', theme: ThemeData(primarySwatch: Colors.blue), home: const StlessHomePage(), ); } } class StlessHomePage extends StatelessWidget { const StlessHomePage({Key? key}) : super(key: key); @override Widget build(BuildContext context) { const minHeight = 80.0; const minWidth = 100.0; final buttonStyle = ElevatedButton.styleFrom( minimumSize: const Size(minWidth, minHeight), ); final standardButtonStyle = buttonStyle.copyWith(visualDensity: VisualDensity.standard); final comfortableButtonStyle = buttonStyle.copyWith(visualDensity: VisualDensity.comfortable); final compactButtonStyle = buttonStyle.copyWith(visualDensity: VisualDensity.compact); return Scaffold( appBar: AppBar(title: const Text('HomePage')), body: Center( child: Row( mainAxisAlignment: MainAxisAlignment.spaceAround, children: [ Column( mainAxisAlignment: MainAxisAlignment.center, children: [ Container(width: minWidth, height: 20, color: Colors.red), ElevatedButton( style: standardButtonStyle, onPressed: () {}, child: const Text("Standard"), ), ElevatedButton( style: compactButtonStyle, onPressed: () {}, child: const Text("Compact"), ), ElevatedButton( style: comfortableButtonStyle, onPressed: () {}, child: const Text("Comfortable"), ), ], ), Row( mainAxisAlignment: MainAxisAlignment.center, children: [ Container(width: 20, height: minHeight, color: Colors.red), ElevatedButton( style: standardButtonStyle, onPressed: () {}, child: const Text("Standard"), ), ElevatedButton( style: comfortableButtonStyle, onPressed: () {}, child: const Text("Comfortable"), ), ElevatedButton( style: compactButtonStyle, onPressed: () {}, child: const Text("Compact"), ), ], ), ], ), ), ); } } ```
HansMuller commented 1 year ago

The fact that minimumSize doesn’t trump the size computed by visualDensity does sound like a bug. Will investigate fixing this one

flutter-triage-bot[bot] commented 1 year ago

This issue is assigned to @HansMuller but has had no recent status updates. Please consider unassigning this issue if it is not going to be addressed in the near future. This allows people to have a clearer picture of what work is actually planned. Thanks!

flutter-triage-bot[bot] commented 1 year ago

This issue is assigned to @HansMuller but has had no recent status updates. Please consider unassigning this issue if it is not going to be addressed in the near future. This allows people to have a clearer picture of what work is actually planned. Thanks!

flutter-triage-bot[bot] commented 1 year ago

This issue is assigned to @HansMuller but has had no recent status updates. Please consider unassigning this issue if it is not going to be addressed in the near future. This allows people to have a clearer picture of what work is actually planned. Thanks!

flutter-triage-bot[bot] commented 2 months ago

This issue is assigned to @HansMuller but has had no recent status updates. Please consider unassigning this issue if it is not going to be addressed in the near future. This allows people to have a clearer picture of what work is actually planned. Thanks!