Flutter GridView 图像放大缩小答案

【问题标题】：Flutter GridView images zoom in zoom outFlutter GridView 图像放大缩小
【发布时间】：2021-10-13 10:02:33
【问题描述】：

我是 Flutter 的新手，我想尝试制作一个响应式网格视图来显示图像。

例如：

这是初始状态：

更改栏后，我想让屏幕看起来像这样：

我的主要问题是我不知道如何实现这个放大缩小栏：

【问题讨论】：

标签： flutter flutter-layout flutter-widget

【解决方案1】：

要制作可滚动的网格，您应该使用GridView。

GridView 需要一个委托来告诉它如何布局其子级。在这种情况下，您可能想要使用SliverGridDelegateWithFixedCrossAxisCount。请注意，它有一个crossAxisCount，表示一行中的项目数。

GridView(
      gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
        crossAxisCount: 4, // <<<< Here
        childAspectRatio: 0.5,
      ),
      children: List<Widget>.generate(20, (int i) {
        return Builder(builder: (BuildContext context) {
          return Text('$i');
        });
      }),
    );

然后您可以在滑块更改时更新crossAxisCount，您的GridView 将更新。

【讨论】：

您好，感谢您的回复。如果我问的问题难以理解，我很抱歉。我的主要问题是我不知道如何实现滑块。
您可以使用Slider class。您可以更改min、max 和divisions 的值来限制用户可以使用的缩放。