跳到主要內容

對話框的預設邊框半徑

摘要

#

Dialog 的實例,以及 SimpleDialogAlertDialogshowTimePicker,現在都預設使用 RoundedRectangleBorder 的形狀,且 BorderRadius 為 4.0 像素。這與目前 Material Design 的規範一致。在此變更之前,Dialog.shapeBorderRadius 預設行為為 2.0 像素。

背景

#

Dialog 及其相關的子類別(SimpleDialogAlertDialogshowTimePicker)的外觀會有些微差異,因為邊框半徑較大。如果您有使用先前 2.0 像素邊框半徑的 Dialog 渲染的黃金檔案圖片,您的 Widget 測試將會失敗。這些黃金檔案圖片可以更新以反映新的渲染效果,或者您可以更新您的程式碼以維持原始行為。

showDatePicker 對話框已經符合此規範,因此不受此變更影響。

遷移指南

#

如果您偏好維持舊的形狀,可以使用您的 Dialog 的 shape 屬性來指定原始的 2 像素半徑。

將對話框的形狀設定為原始半徑

dart
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))),
              );
            },
          );
        }),
      ),
    );
  }
}

如果您偏好新的行為,且有黃金檔案測試失敗,您可以使用此命令更新您的黃金檔案

flutter test --update-goldens

時間軸

#

已於版本中推出:1.20.0-0.0.pre
於穩定版本推出:1.20

參考資料

#

API 文件

相關 PR