当列表视图在flutter中用交互式查看器小部件包装时，垂直方向缩放不起作用

Question

要求：需要在所有方向上捏缩放/平移并支持快速滚动

面临的问题：为了实现这种情况，尝试用interactiveviewer包装listview.builder，但在这种情况下，只有x轴（即水平缩放）单独起作用，无法在y方向缩放。我怀疑在垂直缩放时，列表视图小部件的手势获胜。使用 listView 的原因是有 n 个小部件/子部件。那么有什么解决方法可以实现我的要求，请协助我，提前致谢。我已在下面附上我尝试过的代码。

还请告诉我 Flutter 中是否还有其他小部件来实现我的功能。

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {

  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Container(
        color: Colors.red,
        child: InteractiveViewer(
          child: ListView.builder(
            itemCount: 30,
            itemBuilder: (context, index) {
              return Image.network(
                'https://images.pexels.com/photos/213780/pexels-photo-213780.jpeg?auto=compress&cs=tinysrgb&dpr=1&w=500',
              );
            },
          ),
        ),
      ),
    );
  }
}

Answer 1

将约束属性值设置为 false

InteractiveViewer(
  constrained: false,
...

Answer 2

我不确定这是否是您的确切问题，但我在让 ListView 进行捏缩放时遇到问题。我转而使用包裹在“InteractiveViewer”内的“Column”，并将 InteractiveViewer 的“boundaryMargin”属性设置为“EdgeInsets.all(double.infinity)”。这使用户可以看到该列中的所有内容。它还允许它们向任何方向无限滚动，这可能会出现问题。我认为这可以通过更仔细地调整 borderMargin 属性来解决。

来源： https://api.flutter.dev/flutter/widgets/InteractiveViewer-class.html

https://api.flutter.dev/flutter/widgets/InteractiveViewer/boundaryMargin.html