Question

我是 Flutter 的新手，我想知道如何在我的项目中实现这种设计。

如何变换/平移我的背景，使其在视图中上下移动？
如何在几毫秒后在我的背景顶部添加另一个容器（位于屏幕底部）？

gif demonstrating the design I'd like to achieve

Answer 1

使用showModalBottomSheet。举个例子

 onPressed: () {
              showModalBottomSheet(
                  context: context,
                  builder: (BuildContext ctx) {
                    return Container(
                      padding: EdgeInsets.only(top: 20),
                      child: Container() //add any widget here
                    );
              
                  });
            }

对于第一个问题，将您的图像放在 AnimatedAlign 小部件中

Answer 2

你可以使用这个，sliding_up_panel 有视差效果：

@override
Widget build(BuildContext context) {
  return Scaffold(
    appBar: AppBar(
      title: Text("SlidingUpPanelExample"),
    ),
    body: SlidingUpPanel(
      parallaxEnabled: true,
      panel: Center(
        child: Text("This is the sliding Widget"),
      ),
      body: Center(
        child: Text("This is the Widget behind the sliding panel"),
      ),
    ),
  );
}

如何在颤振中将图像从视图中推出？

2 个答案: