Question

我认为我的体系结构有缺陷，但是我正在努力寻找方法/原因。我是个新手，所以请多多包涵。

我有一张地图和一个抽屉。我正在抽屉中加载坐标列表，一旦按下其中一个坐标，我想在地图上做一些事情。

所以我的问题是，我不知道该怎么称呼干净的代码并开始工作。当然，我可以将所有内容公开给所有人，但不能解决主要问题：我的理解

我的地图绘制在与抽屉相同的位置，所以我已经觉得自己在作弊，但是我认为没关系。老实说，我什至不确定那部分是否正确。

绘制地图：

class _MyHomePageState extends State<MyHomePage> {
  int _counter = 0;
  var _map = MapView();
  var _stationService = StationService();

  ....

@override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: DefaultTabController(
        length: 4,
        child: Scaffold(
          appBar: AppBar(
            bottom: TabBar(
              tabs: [
                Tab(icon: Icon(Icons.directions_car)),
                Tab(icon: Icon(Icons.map)),
                Tab(icon: Icon(Icons.directions_transit)),
                Tab(icon: Icon(Icons.directions_bike))
              ],
            ),
            title: Text('Floctta Plus'),
          ),
          drawer: _drawer(),
          body: TabBarView(
            physics: NeverScrollableScrollPhysics(),
            children: [
              IncrementView(),
              _map,
              Icon(Icons.directions_transit),
              Icon(Icons.directions_bike)
            ],
          ),
        ),
      ),
    );
  }

在我的抽屉代码中：

ListView.builder(
  itemCount: snapshot.data.length,
  itemBuilder: (context, position) {
    return ListTile(
       title: new Text(snapshot.data[position].titleFR),
       leading: new Icon(Icons.pin_drop),
       onTap: () {
         _map.GoToStation();     <<= Here, calling the MapView class
       },
    );
  },
),

所有MapView.dart代码

class MapView extends StatefulWidget {
  MapView({Key key}) : super(key: key);


  void GoToStation() {
    print("I'm reaching this point with success!");
  }

  @override
  _MapViewState createState() => _MapViewState();
}

class _MapViewState extends State<MapView> {
  CameraPosition _initialPosition =
      CameraPosition(target: LatLng(50.8267018, 4.3532732), zoom: 10.0);
  Completer<GoogleMapController> _controller = Completer();

  var _markers;

  void AddMarkers(List<Station> stations) {
    setState(() {
      _markers = new List.generate(
          stations.length,
              (index) => Marker(
            markerId: MarkerId(index.toString()),
            position: new LatLng(double.parse(stations[index].latitude),
                double.parse(stations[index].longitude)),
            infoWindow: InfoWindow(
              title: stations[index].titleFR,
              snippet: stations[index].city,
            ),
            icon: BitmapDescriptor.defaultMarker,
          ));
    });
  }

  void _onMapCreated(GoogleMapController controller) {
    _controller.complete(controller);
  }

  @override
  Widget build(BuildContext context) {
    return Stack(
      children: <Widget>[
        GoogleMap(
          onMapCreated: _onMapCreated,
          initialCameraPosition: _initialPosition,
          markers: _markers,
          myLocationEnabled: true,
        ),
      ],
    );
    // );
  }
}

我认为有足够的代码。

我的问题是：

我现在在我的Mapview类中，我想调用State类中的AddMarkers。但是我不能。我不确定我应该如何进行。

我应该直接从抽屉中调用状态类吗？如果是这样，怎么办？我应该从视图类中调用状态吗？如果是这样，怎么办？我应该完全做其他事情吗？如果是这样，那是什么？

Answer 1

对！

我将假设MapView和Drawer在Scaffold下的不同小部件子树中。一个是drawer，另一个出现在body下的某个地方。

我的理解是，当有人单击抽屉中的ListTile时，MapView应该更新。

通常，在这种情况下，您要采用的原理是引入第三方对象来在两个组件之间进行中介。

AWidget <--> SState <--> MapView

最不明智的方法是引入全局变量（请永远不要这样做，只是提及它，这样您才能理解）。因此，ListTiles和您的MapView之间的聊天应该通过此中介器对象进行。

我们将此对象称为SState。（双SS的目的是与Flutter的State类区分开）。该SState将负责跟踪地图建筑物的参数。（我实际上并不熟悉您的应用程序的见解，因此完全可以理解了）

因此，这种动作处理的间接含义是：

tap on ListTile in drawer -> update SState object -> let Flutter know stuff happened and should update those widgets that are sensitive to that change (MapView)

更新SState对象很容易，它只是对它的函数调用/ setter调用。但是，如何让Flutter知道它应该更新MapView？并且应该将SState对象实例放置在哪里，以便两个实例都可以在没有全局变量的情况下到达它？

要回答这个问题，有许多解决方案：scoped_model，InheritedWidget，Provider，BLoC pattern。所有这些的共同之处在于它们采用了称为lifting state up的原理。基本上是说，应该在两个对象上方的树中创建 SState对象。

提供者示例：

class SState with ChangeNotifier {

  String _someMapParam;
  String get someMapParam => _someMapParam;
  set someMapParam(String val) {
    _someMapParam = val;
    if(hasListeners) notifyListeners();
  }
}

// [...] somewhere in your app

Widget build(BuildContext context) {
  return ChangeNotifierProvider<SState>(
    builder: (ctx) => new SState(),
    child: Scaffold(
      drawer: _drawer(),
      body: Consumer<SState>(
        builder: (_, sStateInstance, __) => Text(sStateInstance.someMapParam),
      ),
    ),
  );
}

有关提供商的更多详细信息：https://pub.dev/packages/provider

颤抖中的小部件调用状态类

1 个答案: