如何在颤动的屏幕顶部中心显示自定义对话框？

Question

我将在屏幕顶部中央显示一个自定义对话框。

我附上了一个 screenshot 。

我怎样才能做到这一点？ Dialog 的默认位置是屏幕中央。

showDialog(
    context: context,
    builder: (BuildContext context) {
      return alert;
    },
);

Answer 1

您可以使用对齐和材质小部件。 (Alignment.topCenter) 即

void showCustomDialog(BuildContext context, String message) {
    showDialog(
      barrierDismissible: false,
      context: context,
      builder: (BuildContext cxt) {
        return Align(
          alignment: Alignment.topCenter,
          child: Padding(
            padding: EdgeInsets.all(16),
            child: Material(
              color: Colors.green,
              shape: RoundedRectangleBorder(
                  borderRadius: BorderRadius.circular(15)),
              child: Padding(
                padding: EdgeInsets.all(16),
                child: Column(
                  mainAxisSize: MainAxisSize.min,
                  children: [
                    Row(
                      children: [
                        InkWell(
                            onTap: () {
                              Navigator.of(context).pop();
                            },
                            child: Image.asset("assets/close.png")),
                        SizedBox(width: 16),
                        Expanded(
                          child: Text(
                            message,
                            style: TextStyle(
                              color: Colors.white,
                            ),
                          ),
                        ),
                      ],
                    ),
                  ],
                ),
              ),
            ),
          ),
        );
      },
    );
  }