Dialogs' Default BorderRadius
Summary
#Instances of Dialog
, as well as
SimpleDialog
, AlertDialog
, and showTimePicker
,
now have a default shape of a RoundedRectangleBorder
with a BorderRadius
of 4.0 pixels.
This matches the current specifications of Material Design.
Prior to this change, the default behavior for
Dialog.shape
's BorderRadius
was 2.0 pixels.
Context
#Dialog
s and their associated subclasses
(SimpleDialog
, AlertDialog
, and showTimePicker
), appears
slightly different as the border radius is larger.
If you have master golden file images that have the
prior rendering of the Dialog
with a 2.0 pixel border radius,
your widget tests will fail.
These golden file images can be updated to reflect the new rendering,
or you can update your code to maintain the original behavior.
The showDatePicker
dialog already matched
this specification and is unaffected by this change.
Migration guide
#If you prefer to maintain the old shape, you can use
the shape property of your Dialog
to specify the original 2 pixel radius.
Setting the Dialog shape to the original radius:
import 'package:flutter/material.dart';
void main() => runApp(Foo());
class Foo extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
floatingActionButton: FloatingActionButton(onPressed: () {
showDialog(
context: context,
builder: (BuildContext context) {
return AlertDialog(
content: Text('Alert!'),
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.all(Radius.circular(2))),
);
},
);
}),
),
);
}
}
If you prefer the new behavior and have failing golden file tests, you can update your master golden files using this command:
flutter test --update-goldens
Timeline
#Landed in version: 1.20.0-0.0.pre
In stable release: 1.20
References
#API documentation:
Relevant PR:
除非另有说明,本文档之所提及适用于 Flutter 的最新稳定版本,本页面最后更新时间: 2024-04-04。 查看文档源码 或者 为本页面内容提出建议。