Flutter中如何在PageView中正确使用GoogleMap

Posted 2023-05-07

【中文标题】Flutter中如何在PageView中正确使用GoogleMap

【英文标题】：How to Properly use GoogleMap in PageView in Flutter

【发布时间】：2021-04-04 16:14:46

【问题描述】：

下面是我Google Mapflutter中的代码：

GoogleMap(
          gestureRecognizers: <Factory<OneSequenceGestureRecognizer>>[
            Factory<OneSequenceGestureRecognizer>(
              () => EagerGestureRecognizer(),
            ),
          ].toSet(),
          mapType: MapType.normal,
          zoomGesturesEnabled: true,
          myLocationButtonEnabled: true,
          myLocationEnabled: true,
          markers: _markers,
          initialCameraPosition: _kGooglePlex,
          onMapCreated: (GoogleMapController controller) 
            _controller = controller;
            isMapCreated = true;
            changeMapMode();
          ,
        );

此代码位于PageView 小部件之一中。所以问题是如果我保持低于代码gestureRecognizers，我无法滑动到其他页面。

gestureRecognizers: <Factory<OneSequenceGestureRecognizer>>[
            Factory<OneSequenceGestureRecognizer>(
              () => EagerGestureRecognizer(),
            ),
          ].toSet(),

如果我删除它，我可以在页面上滑动，但是我无法正确使用地图。做什么？如何解决这个问题？我知道EagerGestureRecognizer 是GestureDectors 中的佼佼者。请指导我解决这种情况。

【参考方案1】：

你不能在一个页面中同时使用这两种手势，它会发生冲突并且没有好的解决方案和用户体验。您可以只使用 PageController 进行页面浏览，以通过左右按钮控制页面滚动。

记得在页面视图中禁用物理滚动：NeverScrollableScrollPhysics()，

【参考方案2】：

您可能想要的是 PanGestureRecognizer，它允许在您的 PageView 屏幕之间来回滑动（即使您从地图小部件中滑动）。如果您在地图小部件上执行拖动，则地图小部件会滚动。不过，我仍然觉得它有点意外，要拖动地图，您必须向上/向下拖动一点，然后它才能识别左/右拖动（假设您的 PageView 方向是水平的）。

不过，它还是比 EagerGestureRecognizer IMO 好得多。

gestureRecognizers: 
  Factory<PanGestureRecognizer>(() => PanGestureRecognizer()),