1

我想知道,flutter_map 包中是否存在v. 0.13.1一些缩放更改事件侦听器?

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

4

1 回答 1

2

您可以使用该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
于 2021-06-14T21:29:06.313 回答