【问题标题】:How to show marker with text in map in codenameone如何在代号中的地图中显示带有文本的标记
【发布时间】:2018-06-04 19:04:39
【问题描述】:

我正在 Map 上做一个示例,在此我想显示标记和文本。

因为我使用了下面的代码。

MapContainer mapContainer = new MapContainer("xxxxxxxxxxxxxxxxxxxxxx");
Coord coord = new Coord(latitude,longitude);
mapContainer.setCameraPosition(coord);
mapContainer.addMarker(EncodedImage.createFromImage(image,false), mapContainer.getCameraPosition(), "Text", "Text", null);

但是这段代码可以帮助我显示标记,但不能与文本一起显示。所以如果有人想用文字显示标记,请建议/帮助我实现这一点。

提前致谢。

这里是使用 MapContainer 和 MapLayout 的代码(下面的答案)..

if(BrowserComponent.isNativeBrowserSupported()) {
        MapContainer mc = new MapContainer("AIzaSyDLIu4RfdXVQPvRqOYLP6N8ocCQpPNqtIk");
        mapDemo.add(mc);
        Container markers = new Container();
        markers.setLayout(new MapLayout(mc, markers));
        mapDemo.add(markers);

        Coord moscone = new Coord(37.7831, -122.401558);
        Button mosconeButton = new Button("");
        FontImage.setMaterialIcon(mosconeButton, FontImage.MATERIAL_PLACE);
        markers.add(moscone, mosconeButton);

        Coord moscone1 = new Coord(36.6139, -120.2090);
        Button mosconeButton1 = new Button("");
        FontImage.setMaterialIcon(mosconeButton1, FontImage.MATERIAL_PLACE);
        markers.add(moscone1, mosconeButton1);

        mc.zoom(moscone1, 5);
    } else {
        // iOS Screenshot process...
        mapDemo.add(new Label("Loading, please wait...."));
    }

【问题讨论】:

标签: google-maps codenameone


【解决方案1】:

这是修改后的答案,请参阅下面的原始答案以供参考:

有了新的更新,这应该会更好,如果您有旧版本,您也需要更新谷歌地图的 cn1lib。我们还再次修改了MapLayout 类,并添加了对齐等一些功能:

public class MapLayout extends Layout implements MapListener {
        private static final String COORD_KEY = "$coord";
        private static final String POINT_KEY = "$point";
        private static final String HORIZONTAL_ALIGNMENT = "$align";
        private static final String VERTICAL_ALIGNMENT = "$valign";
        private final MapContainer map;
        private final Container actual;
        private boolean inUpdate;
        private Runnable nextUpdate;        
        private int updateCounter;

        public static enum HALIGN {
            LEFT {
                @Override
                int convert(int x, int width) {
                    return x;
                }
            },
            CENTER {
                @Override
                int convert(int x, int width) {
                    return x - width / 2;
                }
            }, 
            RIGHT {
                @Override
                int convert(int x, int width) {
                    return x - width;
                }
            };

            abstract int convert(int x, int width);
        }

        public static enum VALIGN {
            TOP {
                @Override
                int convert(int y, int height) {
                    return y;
                }
            }, 
            MIDDLE {
                @Override
                int convert(int y, int height) {
                    return y + height / 2;
                }
            }, 
            BOTTOM {
                @Override
                int convert(int y, int height) {
                    return y + height;
                }
            };

            abstract int convert(int y, int height);
        }

        public MapLayout(MapContainer map, Container actual) {
            this.map = map;
            this.actual = actual;
            map.addMapListener(this);
        }

        @Override
        public void addLayoutComponent(Object value, Component comp, Container c) {
            comp.putClientProperty(COORD_KEY, (Coord) value);
        }

        @Override
        public boolean isConstraintTracking() {
            return true;
        }

        @Override
        public Object getComponentConstraint(Component comp) {
            return comp.getClientProperty(COORD_KEY);
        }

        @Override
        public boolean isOverlapSupported() {
            return true;
        }

        public static void setHorizontalAlignment(Component cmp, HALIGN a) {
            cmp.putClientProperty(HORIZONTAL_ALIGNMENT, a);
        }

        public static void setVerticalAlignment(Component cmp, VALIGN a) {
            cmp.putClientProperty(VERTICAL_ALIGNMENT, a);
        }

        @Override
        public void layoutContainer(Container parent) {
            int parentX = 0;
            int parentY = 0;
            for (Component current : parent) {
                Coord crd = (Coord) current.getClientProperty(COORD_KEY);
                Point p = (Point) current.getClientProperty(POINT_KEY);
                if (p == null) {
                    p = map.getScreenCoordinate(crd);
                    current.putClientProperty(POINT_KEY, p);
                }
                HALIGN h = (HALIGN)current.getClientProperty(HORIZONTAL_ALIGNMENT);
                if(h == null) {
                    h = HALIGN.LEFT;
                }
                VALIGN v = (VALIGN)current.getClientProperty(VERTICAL_ALIGNMENT);
                if(v == null) {
                    v = VALIGN.TOP;
                }
                current.setSize(current.getPreferredSize());
                current.setX(h.convert(p.getX() - parentX, current.getWidth()));
                current.setY(v.convert(p.getY() - parentY, current.getHeight()));
            }
        }

        @Override
        public Dimension getPreferredSize(Container parent) {
            return new Dimension(100, 100);
        }

        @Override
        public void mapPositionUpdated(Component source, int zoom, Coord center) {
            Runnable r = new Runnable() {
                public void run() {
                    inUpdate = true;
                    try {
                        List<Coord> coords = new ArrayList<>();
                        List<Component> cmps = new ArrayList<>();
                        int len = actual.getComponentCount();
                        for (Component current : actual) {
                            Coord crd = (Coord) current.getClientProperty(COORD_KEY);
                            coords.add(crd);
                            cmps.add(current);
                        }
                        int startingUpdateCounter = ++updateCounter;
                        List<Point> points = map.getScreenCoordinates(coords);
                        if (startingUpdateCounter != updateCounter || len != points.size()) {
                            // Another update must have run while we were waiting for the bounding box.
                            // in which case, that update would be more recent than this one.
                            return;
                        }
                        for (int i=0; i<len; i++) {
                            Component current = cmps.get(i);
                            Point p = points.get(i);
                            current.putClientProperty(POINT_KEY, p);
                        }
                        actual.setShouldCalcPreferredSize(true);
                        actual.revalidate();
                        if (nextUpdate != null) {
                            Runnable nex = nextUpdate;
                            nextUpdate = null;
                            callSerially(nex);
                        }
                    } finally {
                        inUpdate = false;
                    }

                }

            };
            if (inUpdate) {
                nextUpdate = r;
            } else {
                nextUpdate = null;
                callSerially(r);
            }           
        }
}

原答案:

当您点击它时,标记将显示文本。如果您希望事物以不同的方式出现,您可以使用任何组件并将其放在地图顶部。即将发布的Uber tutorial 将对此进行深入介绍,但我在这篇博文中解释了基本系统:https://www.codenameone.com/blog/tip-map-layout-manager.html

【讨论】:

  • 它可以工作,但是如果我在缩放(放大/缩小)时添加多个标记,有时标记会相互重叠并且也会出现 stackoverflow 错误.. 并且 lts 仅在模拟器中的设备中发生,它工作正常..
  • 如果有很多标记,它们会重叠。您可以使用地图侦听器添加/删除标记并创建统一标记的效果。我们可能希望创建一个更标准化的布局 API 来处理所有这些问题。如果您看到异常,请尝试使用 USB 电缆检查设备打印输出并查看堆栈溢出的根。
  • 如果在地图上添加了多个标记,当地图移动/缩放标记不稳定并且标记显示在同一位置并且一直闪烁。
  • 在哪个设备/操作系统版本上。您确定原生地图处于活动状态而不是 JavaScript 后备?
  • 我不确定它是否是原生的,但它在 android 的所有版本中都发生(在 3 个版本中测试,如 4.4、5.0 和 7.0)..
猜你喜欢
  • 1970-01-01
  • 2021-12-03
  • 1970-01-01
  • 2019-08-13
  • 1970-01-01
  • 2023-02-11
  • 2019-11-08
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多