如何制作排序下拉窗口?

时间:2019-10-10 11:40:10

标签: flutter

我尝试制作类似thisthis

我使用

IconButton(
      onPressed: () {
        Navigator.push(
            context,
            PageRouteBuilder(
                opaque: false,
                pageBuilder: (BuildContext context, _, __) => MyPopup()));
      },

需要它,但是在弹出窗口中,应该返回哪种小部件以及如何通过从底部推动并向下滑动将其关闭来使其外观具有动画效果?

1 个答案:

答案 0 :(得分:0)

您可以使用与此相同的“材料”设计组件中的底部工作表,

Guidline or example from Material Design site
Also class from official flutter doc.

示例:

void _showBottomSheet(){
    showModalBottomSheet(
        context: context,
        builder: (builder){
          return new Container(
            height: 350.0,
            color: Colors.transparent, //could change this to Color(0xFF737373),
            child: new Container(
                decoration: new BoxDecoration(
                    color: Colors.white,
                    borderRadius: new BorderRadius.only(
                        topLeft: const Radius.circular(15.0),
                        topRight: const Radius.circular(15.0))),
                child: new Center(
                  child: new Text("Model Sheet Example Demo"),
                )),
          );
        }
    );
  }