可拖动的可拖曳容器

Question

我是新手，我正在寻找一种实现简单功能的方法。可拖动的容器。

我在Container小部件中包装了两组UI元素。我希望能够通过在不同方向上拖动或滑动而从一个组转到另一个组。

我将如何去做？

以下是我的UI设计的示例图像，可帮助您了解我想要实现的目标：

图片＃1

图片＃2

如您所见，图像＃1和图像＃2仅在设计的底部有所不同。我已经创建了所有必需的UI元素，并将它们包装在Container小部件中。现在，我唯一需要的就是能够从一个小组转到另一个小组。如果有一个回调方法可以在从一组切换到另一组时更新上面的按钮，那也很好。

谢谢！

Answer 1

实现此目标的可能性很多，具体取决于您的意愿，以下是3个想法：

1. 使用TabBarView滑动整个屏幕，Tab1将是显示的第一个屏幕，Tab2将是第二个屏幕-仅显示内容。 （您可能不希望那样做，而只是将其放在那里）。

2. 将容器垂直分成两部分，并将TabBarView放在底部，具有2个标签：1个标签为“今日”部分，一个标签为“每周”部分。 （那里有一些示例，例如：divide screen into two equal parts in flutter）。

您还可以自定义构建方法，以根据当前标签页索引（如此处要求和回答的问题，How to get current tab index in Flutter）来更改任何内容（例如顶部指示器）

有关更自定义的解决方案，您可以使用：

1. GestureDetector包裹在您的容器中，并处理OnHorizo​​ntalDragX（其中X是Start，End等）以执行任何自定义操作-可能更改状态并触发使用新图像的重建