Flutter 自定义loading及使用移动开发klousYG的博客-

1.首先写一个公共组件

new Material(       type: MaterialType.transparency,       child: new Center(         child: new SizedBox(           width: 120.0,           height: 120.0,           child: new Container(             decoration: ShapeDecoration(               color: Color(0xffffffff),               shape: RoundedRectangleBorder(                 borderRadius: BorderRadius.all(                   Radius.circular(8.0),                 ),               ),             ),             child: new Column(               mainAxisAlignment: MainAxisAlignment.center,               crossAxisAlignment: CrossAxisAlignment.center,               children: <Widget>[                 new CircularProgressIndicator(                     valueColor: new AlwaysStoppedAnimation(Color(0xffAA1F52))),                 new Padding(                   padding: const EdgeInsets.only(                     top: 20.0,                   ),                   child: new Text(widget.text),                 ),               ],             ),           ),         ),       ),     ); 

2.封装loading组建

void showLoading(BuildContext context,String text){   showDialog(     context: context,     barrierDismissible: false,     builder: (BuildContext context) {       return new Loading(         text,       );     }   ); } 

3.调用loading弹窗

 showLoading(context, "加载中"); 

效果如下：：：