flutter透明模态进度框

用Dialog本身的backgroundColor: Colors.transparent，总是会有个半透明的黑底，十分难看+恶心，flutter的坑

比如：

AlertDialog dlg = AlertDialog(
  key: _keyProgress,
  backgroundColor: Colors.transparent,
  title: Text(title),
  content: ...

网上找了个，自己修改了下，原来不支持标题，加了可选标题，并且改成了圆形进度条

原帖地址：https://www.jianshu.com/p/421ce2746941

效果如图：标题是可选的，如果不写标题，则只显示圆形进度，你也可以改成自己钟意的样式

用法：

Loading.show(context, title: 'some title');
Loading.close(context);

代码：

import 'package:flutter/material.dart';

class DialogRouter extends PageRouteBuilder{

  final Widget page;

  DialogRouter(this.page) : super(
    opaque: false,
    barrierColor: Color(0x00000001),
    barrierDismissible: false,
    pageBuilder: (context, animation, secondaryAnimation) => page,
    transitionsBuilder: (context, animation, secondaryAnimation, child) => child,
  );
}

class Loading {
  static void show(BuildContext context, {String title, bool mateStyle}) {
    Navigator.of(context)
        .push(DialogRouter(LoadingDialog(title: title)));
  }

  static void close(BuildContext context) {
    Navigator.of(context).pop();
  }
}

class LoadingDialog extends Dialog {
  LoadingDialog({Key key, this.title}) : super(key: key);

  final String title;

  @override
  Widget build(BuildContext context) {
    return WillPopScope(
        child: Material(
          //创建透明层
          type: MaterialType.transparency, //透明类型
          child: Center(
            child: SizedBox(
              width: 100,
              height: 100,
              child:Column(
                children: <Widget>[
                  SizedBox(
                    height: 20,
                    child: Text((){
                      if (title != null)
                        return title;
                      else
                        return '';
                    }()),
                  ),
                  Padding(
                    padding: const EdgeInsets.only(top: 10.0),
                  ),
                  Row(
                    mainAxisAlignment: MainAxisAlignment.start,
                    children: <Widget>[
                      Spacer(),
                      SizedBox(
                          width: 40,
                          height: 40,
                          child: SizedBox(
                              child: CircularProgressIndicator(
                                //backgroundColor: Colors.transparent,
                                valueColor: AlwaysStoppedAnimation(Colors.blue),
                              )
                          )
                      ),
                      Spacer(),
                    ]
                  )
                  ],
              ),

            )
          ),
        ),
        onWillPop: () async {
          return Future.value(false);
        });
  }
}