Question

构建如下所示的“嵌套底页”的最佳方法是什么： https://dribbble.com/shots/14139422-Mobile-banking-app-interactions？

我是否必须使用NestedScrollView或CustomScrollView或完全不同的方法？

更新：

这是我使用SlidingUpPanel的结果，但是我仍然有两个问题：

向上滑动面板时，绿色和红色容器会留在面板后面，并且不会滚动到顶部。
在横向模式下，容器的高度高于设备的高度，因此此方法无效。我需要将面板附加到容器的底部，因此只有向下滚动时才可见。

代码：

SafeArea(
  child: Scaffold(
    body: SlidingUpPanel(
      minHeight: MediaQuery.of(context).size.height - 479,
      maxHeight: MediaQuery.of(context).size.height - 79,
      panel: SingleChildScrollView(
        child: Column(
          children: [Text('Sliding Panel')],
        ),
      ),
      body: SingleChildScrollView(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.start,
          children: [
            Container(
              height: 100,
              color: Colors.green,
            ),
            Container(
              height: 300,
              color: Colors.red,
            )
          ],
        ),
      ),
    ),
  ),
);

结果：

Answer 1

我相信您可以做的是一个窗口小部件，因为Flutter中有一个用于所有内容的窗口小部件。这是软件包的link

注意：：您还可以设置折叠时小部件的最小高度，以控制折叠时可以显示的小部件数量。

这是演示：

颤振嵌套底页或向上滑动面板

1 个答案: