Flutter-仿ios底部彈出框

小筆記～模仿得有點醜的ios底部彈出框

showModalBottomSheet(
            backgroundColor: Colors.transparent,
            context: context,
            builder: (BuildContext context) {
              return Container(
                padding: EdgeInsets.all(10),
                height: 200,
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.center,
                  children: <Widget>[
                    Container(
                        width: width-20,
                        height: 50,
                        decoration: BoxDecoration(
                          color: Color(0Xffececec),
                          borderRadius:BorderRadius.circular(15.0),//邊框
                        ),
                        child: Center(
                          child: Text(
                            '是否要訂閱《${servicePrice.title}》?',
                            overflow: TextOverflow.ellipsis,
                            style: TextStyle(
                              color: Colors.black,
                              fontWeight: FontWeight.bold,
                              fontSize: 20,
                            ),
                          ),
                        )
                    ),
                    GestureDetector(
                      onTap: (){
                        setState(() {
                         
                        });
                      },
                      child: Container(
                          margin: EdgeInsets.only(top:10),
                          width: width-20,
                          height: 50,
                          decoration: BoxDecoration(
                            color: Color(0Xffececec),
                            borderRadius:BorderRadius.circular(15.0),//邊框
                          ),
                          child: Center(
                            child: Text(
                              '確 認',
                              style: TextStyle(
                                color: Color(0Xff4d80c5),
                                fontWeight: FontWeight.bold,
                                fontSize: 20,
                              ),
                            ),
                          )
                      ),
                    ),
                    GestureDetector(
                      onTap: ()=>Navigator.of(context).pop(),
                      child: Container(
                          margin: EdgeInsets.only(top:10),
                          width: width-20,
                          height: 50,
                          decoration: BoxDecoration(
                            color: Color(0Xffececec),
                            borderRadius:BorderRadius.circular(15.0),//邊框
                          ),
                          child: Center(
                            child: Text(
                              '取 消',
                              style: TextStyle(
                                color: Colors.red,
                                fontWeight: FontWeight.bold,
                                fontSize: 20,
                              ),
                            ),
                          )
                      ),
                    )
                  ],
                ),
              );
            });