在平时的需求开发中不可避免要弹出一些对话框提示用户，但默认的showDialog中的SimpleDialog和AlertDialog默认都是宽度全屏的，所以需要满足自定义大小的dialog非常有必要。这里记录下我的实现方式，当然有更好的方式也希望大家分享在评论里

```cpp
ex_dialog.dart

import 'package:flutter/material.dart';

/// 显示指定大小dialog onClickOutSide点击弹窗以外的透明区域 onClickContent点击child区域
Future<T> showCustomSizeDialog<T>(BuildContext context,
{Widget child, Function onClickOutSide, Function onClickContent}) {
return showDialog<T>(
context: context,
builder: (context) {
return Material(
type: MaterialType.transparency,
child: GestureDetector(
behavior: HitTestBehavior.opaque,
onTap: onClickOutSide,
child: GestureDetector(
child: Center(
child: child,
),
onTap: onClickContent ?? () {}, // 默认点击内容区域不透传事件
),
),
);
},
);
}

```

例子

```cpp
showCustomSizeDialog(
context,
child: Container(
width: 100,
height: 100,
color: Colors.white,
child: Text('test'),
),
onClickOutSide: () { // 点击蒙层区域
//Navigator.of(context).pop();
},
// onClickContent: () { // 点击内容区域 这里对应的child
// Navigator.of(context).pop();
// },
);

```

以上就是flutter dialog实现手机直播源码对话框支持自定义大小， 更多内容欢迎关注之后的文章