缩放更改了侦听器答案

【问题标题】：Zoom changed listener缩放更改了侦听器
【发布时间】：2021-06-14 09:53:22
【问题描述】：

我想知道，flutter_map 包中是否存在v. 0.13.1 一些缩放变化事件监听器？

我尝试根据缩放大小更改笔触宽度。我该如何处理？

【问题讨论】：

【解决方案1】：

您可以使用MapOptions 属性onPositionChanged 这是每次您在地图上移动时调用的回调，即使您只是在缩放。从这个回调中，你可以填充一个Stream，你可以收听它。

这是我的完整测试代码：

class HomePage extends StatefulWidget {
  @override
  State<StatefulWidget> createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  final _controller = MapController();

  // Create your stream
  final _streamController = StreamController<double>();
  Stream<double> get onZoomChanged => _streamController.stream;

  @override
  void initState() {
    super.initState();

    // Add your listener
    onZoomChanged.listen((event) {
      print('New zoom is $event');
    });
  }

  @override
  void dispose() {
    _streamController.close();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(),
      // Some basic zoom control buttons
      floatingActionButton: Column(
        mainAxisSize: MainAxisSize.min,
        children: [
          FloatingActionButton(
            onPressed: () =>
                _controller.move(_controller.center, _controller.zoom + 1),
            child: Icon(Icons.zoom_in),
          ),
          const SizedBox(height: 8),
          FloatingActionButton(
            onPressed: () =>
                _controller.move(_controller.center, _controller.zoom - 1),
            child: Icon(Icons.zoom_out),
          )
        ],
      ),
      body: FlutterMap(
        mapController: _controller,
        options: MapOptions(
          center: LatLng(51.5, -0.09),
          zoom: 13.0,
          onPositionChanged: (position, hasGesture) {
            // Fill your stream when your position changes
            final zoom = position.zoom;
            if (zoom != null) {
              _streamController.sink.add(zoom);
            }
          },
        ),
        layers: [
          TileLayerOptions(
              urlTemplate: "https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png",
              subdomains: ['a', 'b', 'c']),
          MarkerLayerOptions(
            markers: [
              Marker(
                width: 80.0,
                height: 80.0,
                point: LatLng(51.5, -0.09),
                builder: (ctx) => Container(
                  child: FlutterLogo(),
                ),
              ),
            ],
          ),
        ],
      ),
    );
  }
}

控制台输出：

PS D:\Documents\Projects\so_tests> flutter run -d chrome
Launching lib\main.dart on Chrome in debug mode...
Waiting for connection from debug service on Chrome...             13,4s
This app is linked to the debug service: ws://127.0.0.1:64606/bNK9z0-_2N8=/ws
Debug service listening on ws://127.0.0.1:64606/bNK9z0-_2N8=/ws

 Running with sound null safety 

  To hot restart changes while running, press "r" or "R".
For a more detailed help message, press "h". To quit, press "q".
New zoom is 13
New zoom is 12
New zoom is 11
New zoom is 10
New zoom is 11
New zoom is 12

【讨论】：

谢谢！这正是我想要的。