标记以错误的数字显示

Question

在我的应用程序中，我使用的是 flutter_bloc 和 flutter_map 包。当我跟踪路线时，我想显示跟踪点的顺序，因此当我收到跟踪路线的状态时，我使用为路线中的每个点添加一个标记一个（forEach 或 normal）循环，它有一个图标和一个数字，所以我可以看到标记顺序。问题是，虽然标记在地图上正确放置并且图标显示正确，但显示的数字是错误的。如果我打印包含要在循环中显示的值的变量，它会正确打印，例如。 1 到 7，但是当分配给标记时，它会得到错误的值 8。 我不知道那个 8 是从哪里来的..

你能看出我做错了什么吗？

这是接收状态的代码：

if (state is TrackedRoute) {
            route.clear();
            trackedPoints.clear();
            int num = 1;
            setState(() {
              route = state.trackedRoute;
            });
//              route.forEach((element) {
            for (int i = 0; i < route.length; i++) {
              LatLng element = route[i];
              print('@@@@@  num is $num'); // TODO printed number is correct
              LatLng point = LatLng(element.latitude, element.longitude);
              Marker trackedPoint = Marker(
                point: point,
                height: 30,
                width: 30,
                builder: (context) => Stack(
                  alignment: Alignment.topCenter,
                  children: [
                    // TODO Prints all 8s ???!!!

                    IconButton(
                      icon: Icon(Icons.add_location),
                      color: Colors.greenAccent,
                      iconSize: 30,
                      onPressed: () {},
                    ),
                    Text(
                      num.toString(),
                      style: TextStyle(color: Colors.red, fontSize: 25),
                    ), // TODO :  Displayed number is wrong
                  ],
                ),
              );
              trackedPoints.add(trackedPoint);
              num++;
            }

//              });

          }

这是控制台打印：

I/flutter (24597): @@@@@  num is 2
I/flutter (24597): @@@@@  num is 3
I/flutter (24597): @@@@@  num is 4
I/flutter (24597): @@@@@  num is 5
I/flutter (24597): @@@@@  num is 6
I/flutter (24597): @@@@@  num is 7

这是结果显示的溃败，标记显示数字 8：

Answer 1

这是因为Marker 的builder 方法仅在MarkerLayer 绘制在屏幕上时才被调用。因此，您的 num 变量将在调用 builder 方法之前达到其最大值，因此所有标记都将获得相同的 num。

我认为当前的flutter_map 软件包没有什么好方法可以实现您想要的。 MarkerLayer 仅使用上下文调用构建器，因此您需要一些其他方法来实现这一点。问题是标记生成器无法访问关联的标记数据。

也许是the solution is in this Github issue comment。但是，此解决方案会在标记更改时重建完整的地图。否则最好自己在flutter_map Github 存储库上打开一个问题。