Open JHubi1 opened 1 month ago
As I can see, showDialog
uses FadeTransition
to open a DialogRoute currently:
There is also a proposal for using Fade transition on Dialogs at https://github.com/flutter/flutter/issues/68360, which seems outdated.
Reproduced this on Flutter 3.24.3
and 3.26.0-1.0.pre.263
.
Steps to reproduce
Expected results
The Material Design Specification states, "android components expand and collapse along the x or y axis as they enter and exit". The dialog widget should expand from the top to the bottom and collapse from the bottom to the top. I attached an example in the screenshot section.
https://m3.material.io/styles/motion/transitions/transition-patterns#a8acc8d4-8de2-4602-a9a3-945d44d08bad
Actual results
The dialog fades into the view. This does not meet the requirements given by the specification, and more looks like a relict from MD2.
Code sample
Code sample
```dart import 'package:flutter/material.dart'; void main() { runApp(const MainApp()); } class MainApp extends StatelessWidget { const MainApp({super.key}); @override Widget build(BuildContext context) { return const MaterialApp( home: MainScaffold(), ); } } class MainScaffold extends StatelessWidget { const MainScaffold({ super.key, }); @override Widget build(BuildContext context) { return Scaffold( body: Center( child: TextButton( onPressed: () { showDialog( context: context, builder: (context) { return AlertDialog( icon: const Icon(Icons.delete), title: const Text("Permanently delete?"), content: const Text( "Deleting the selected messages will also remove them from synced devices."), actions: [ TextButton( onPressed: () => Navigator.pop(context), child: const Text("Cancel")), FilledButton.tonal( onPressed: () => Navigator.pop(context), child: const Text("Delete")), ]); }); }, child: const Text("Open Dialog")), ), ); } } ```Screenshots or Video
Screenshots / Video demonstration
| Flutter behavior | Material specification (1 is android) | |-|-| | ![](https://github.com/user-attachments/assets/59474d57-3a12-4e2d-aa34-9867e05b441c) | ![dialogMaterial-ezgif com-resize](https://github.com/user-attachments/assets/bac3b1ee-cad6-4783-840d-041673302339) |Logs
Logs
> Not requiredFlutter Doctor output
Doctor output
```console [√] Flutter (Channel stable, 3.22.2, on Microsoft Windows [Version 10.0.22631.4169], locale de-DE) • Flutter version 3.22.2 on channel stable at E:\dev\flutter • Upstream repository https://github.com/flutter/flutter.git • Framework revision 761747bfc5 (4 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 C:\Users\jakob\AppData\Local\Android\sdk • Platform android-34, build-tools 34.0.0 • Java binary at: C:\Program Files\Android\Android Studio\jbr\bin\java • Java version OpenJDK Runtime Environment (build 17.0.9+0--11185874) • All Android licenses accepted. [√] Android Studio (version 2023.2) • Android Studio at C:\Program Files\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.9+0--11185874) [√] VS Code (version 1.93.1) • VS Code at C:\Users\jakob\AppData\Local\Programs\Microsoft VS Code • Flutter extension version 3.86.0 [√] Connected device (1 available) • sdk gphone64 x86 64 (mobile) • emulator-5554 • android-x64 • Android 14 (API 34) (emulator) [√] Network resources • All expected network resources are available. • No issues found! ```