欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

Flutter 底部滑出实现 showBottomSheet (七)

程序员文章站 2022-07-13 23:26:06
...
class _DetailScaffoldViewState extends State<ProductInfoShareScaffold> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: PreferredSize(
        preferredSize: Size.fromHeight(ScreenUtil().setHeight(40.0)),
        child: AppBar(
          actions: <Widget>[
            //要使用builder  不然Scaffold 取不到
            new Builder(builder: (BuildContext context) {
              return Container(
                child: IconButton(
                  onPressed: () {
                    Scaffold.of(context)
                        .showBottomSheet<Null>((BuildContext context) {
                      return Container(
                        height: ScreenUtil().setHeight(250),
                        child: Container(
                          child: Column(
                            children: <Widget>[
                              Container(
                                padding:EdgeInsets.all(9),
                                child: Text("分享到"),
                              ),
                              Container(
                                margin: EdgeInsets.only(top: ScreenUtil().setHeight(14)),
                                child: Row(
                                  children: <Widget>[
                                    Expanded(
                                      child: Container(
                                        child: Container(
                                          child: Image.asset("images/xinlang.png"),
                                          margin: EdgeInsets.all(14),
                                        ),
                                        color: Colors.white,
                                        margin: EdgeInsets.all(
                                            ScreenUtil().setWidth(11)),
                                      ),
                                    ),
                                    Expanded(
                                      child: Container(
                                        child: Container(
                                          child: Image.asset("images/weixin.png"),
                                          margin: EdgeInsets.all(14),
                                        ),
                                        color: Colors.white,
                                        margin: EdgeInsets.all(
                                            ScreenUtil().setWidth(11)),
                                      ),
                                    ),
                                    Expanded(
                                      child: Container(
                                        child: Container(
                                          child: Image.asset("images/pengyou.png"),
                                          margin: EdgeInsets.all(14),
                                        ),
                                        color: Colors.white,
                                        margin: EdgeInsets.all(
                                            ScreenUtil().setWidth(11)),
                                      ),
                                    ),
                                    Expanded(
                                      child: Container(
                                        child: Container(
                                          child: Image.asset("images/qq.png"),
                                          margin: EdgeInsets.all(14),
                                        ),
                                        color: Colors.white,
                                        margin: EdgeInsets.all(
                                            ScreenUtil().setWidth(11)),
                                      ),
                                    )
                                  ],
                                ),
                              ),
                              Container(
                                child: Row(
                                  children: <Widget>[
                                    Expanded(
                                      child: Center(
                                        child: Text("新浪微博"),
                                      ),
                                    ),
                                    Expanded(
                                      child: Center(child: Text("微信好友"),),
                                    ),
                                    Expanded(
                                      child: Center(child: Text("微信朋友圈"),),
                                    ),
                                    Expanded(
                                      child: Center(child: Text("QQ"),),
                                    )
                                  ],
                                ),
                              ),
                              Container(
                                width: ScreenUtil.screenWidth,
                                height: ScreenUtil().setHeight(50),
                                margin: EdgeInsets.only(left: 10,right: 10,bottom: 0,top:ScreenUtil().setHeight(25) ),
                                child: RaisedButton(
                                    color: Colors.white,
                                    child: Text("取消"),
                                    onPressed: () {
                                      Navigator.of(context).pop();
                                    }),
                              ),
                            ],
                          ),
                        ),
                      );
                    });
                  },
                  icon: Icon(Icons.share),
                ),
              );
            })
          ],
          title: Text(widget.title),
          leading: InkWell(
            child: Icon(Icons.chevron_left),
            onTap: () {
              Navigator.of(context).pop();
            },
          ),
        ),
      ),
      body: widget.child,
      backgroundColor: Color(0xFFF1F1F1),
      bottomNavigationBar: widget.bottomBtn,
    );
  }
}

效果:Flutter 底部滑出实现 showBottomSheet (七)

相关标签: Flutter