Flutter 像谷歌日历一样摇动底页

我如何创建像谷歌日历一样的底部工作表？（下图）， 我很难制作像照片中那样的个人资料照片。 有人能帮我吗， 谢谢

---

这可以通过使用堆栈小部件来实现

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);
  final String title;

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: RaisedButton(
          onPressed: () {
            _settingModalBottomSheet();
          },
          child: Text('Show Bottom Sheet'),
        ),
      ),
    );
  }

  void _settingModalBottomSheet() {
    final double imageRadius = 50;
    showModalBottomSheet(
      context: context,
      backgroundColor: Colors.transparent,
      builder: (BuildContext bc) {
        return Column(
          mainAxisSize: MainAxisSize.min,
          children: [
            Stack(
              children: [
                Container(
                  margin: EdgeInsets.only(top: imageRadius),
                  padding: EdgeInsets.only(top: imageRadius),
                  decoration: BoxDecoration(
                    borderRadius: BorderRadius.only(
                      topLeft: Radius.circular(16),
                      topRight: Radius.circular(16),
                    ),
                    color: Colors.white,
                  ),
                  child: Column(
                    children: [
                      Text('asdfsdf asdfasdf'),
                      Row(
                        mainAxisAlignment: MainAxisAlignment.center,
                        children: [
                          IconButton(
                            icon: Icon(Icons.message),
                            onPressed: () {},
                          ),
                          SizedBox(
                            width: 16,
                          ),
                          IconButton(
                            icon: Icon(Icons.message),
                            onPressed: () {},
                          ),
                          SizedBox(
                            width: 16,
                          ),
                          IconButton(
                            icon: Icon(Icons.message),
                            onPressed: () {},
                          )
                        ],
                      ),
                    ],
                  ),
                ),
                Align(
                  alignment: Alignment.topCenter,
                  child: CircleAvatar(
                    radius: imageRadius,
                  ),
                ),
              ],
            )
          ],
        );
      },
    );
  }
}

类MyHomePage扩展StatefulWidget{
MyHomePage（{Key，this.title}）：超级（Key:Key）；
最后的字符串标题；
@凌驾
_MyHomePageState createState（）=>\u MyHomePageState（）；
}
类_MyHomePageState扩展状态{
@凌驾
小部件构建（构建上下文）{
返回脚手架(
正文：中(
孩子：升起按钮(
已按下：（）{
_设置ModalBottomSheet（）；
},
子项：文本（“显示底页”），
),
),
);
}
void _settingModalBottomSheet（）{
最终双成像半径=50；
showModalBottomSheet(
上下文：上下文，
背景颜色：颜色。透明，
生成器：（BuildContext bc）{
返回列(
mainAxisSize:mainAxisSize.min，
儿童：[
堆叠(
儿童：[
容器(
边距：仅限边集（顶部：图像半径），
填充：仅限边设置（顶部：imageRadius），
装饰：盒子装饰(
borderRadius：仅限borderRadius(
左上：半径。圆形（16），
右上角：半径。圆形（16），
),
颜色：颜色，白色，
),
子：列(
儿童：[
文本（'asdfsdf asdfasdf'），
划船(
mainAxisAlignment:mainAxisAlignment.center，
儿童：[
图标按钮(
图标：图标（Icons.message），
按下：（）{}，
),
大小盒子(
宽度：16，
),
图标按钮(
图标：图标（Icons.message），
按下：（）{}，
),
大小盒子(
宽度：16，
),
图标按钮(
图标：图标（Icons.message），
按下：（）{}，
)
],
),
],
),
),
对齐(
对齐：alignment.topCenter，
孩子：圆环星(
半径：imageRadius，
),
),
],
)
],
);
},
);
}
}