2

使用 Google Web Toolkit（使用 Google Maps Extension）我遇到了一个小问题：

我想将 Google 地图插入 TabLayoutPanel。没有那个 TabLayoutPanel 一切正常。但是，一旦地图位于选项卡内，它的行为就会非常奇怪（它没有居中，并且在您尝试滚动时会“跳跃”。）。

同样的问题是使用 TabPanel 而不是 TabLayoutPanel 时。

从我的代码中提取：

在我的 EntryPoint 类的 onModuleLoad 方法中：

    DockLayoutPanel mainPanel;
    MainUITabs tabWidget = new MainUITabs();
    mainPanel.add(tabWidget);
    RootLayoutPanel.get().add(mainPanel);

MainUITabsWiget 看起来像这样：

public class MainUITabs extends Composite {

public MainUITabs(){
    TabLayoutPanel tabPanel = new TabLayoutPanel(10, Unit.PCT);

    MapWidget googleMapsTab = buildMapWidget();

    tabPanel.add(googleMapsTab, "Google Maps");

    initWidget(tabPanel);
}

private MapWidget buildMapWidget() {

    LatLng coord = LatLng.newInstance(51.509, 11.434);
    final MapWidget map = new MapWidget(coord, 2);
    map.setSize("600px", "300px");
    map.setCenter(coord);

    map.addControl(new LargeMapControl());  

    map.addOverlay(new Marker(coord));

    return map;
}

}

似乎地图不喜欢在选项卡内..有人知道问题出在哪里吗？

谢谢。

安迪

4

2 回答 2

0

TabPanel 文档说“这个小部件只能在怪癖模式下工作。如果您的应用程序处于标准模式，请改用 TabLayoutPanel。”

因此，如果您的页面具有 DOCTYPE 并因此处于标准模式，则表明您将遇到问题。

我发现在标准模式下使用 TabPanel 时，第一个选项卡上的小部件（一开始不可见）并不总是正确呈现。一种解决方法是在显示选项卡时使用 SelectionHandler.onSelection 呈现这些元素，如弃用方法的文档中所述TabPanel#onTabSelected。但是阅读我上面引用的内容，这可能是自找麻烦，在标准模式下，您应该改用 TabLayoutPanel。

于 2010-06-09T18:02:03.857 回答
0

乍一看，这似乎是我在将 TinyMCE（所见即所得编辑器）与 GWT 集成时遇到的问题——通常，像这样的组件不喜欢 DOM 更改时——在这种情况下，它发生在您切换选项卡时（在我的情况下是是拖放）。
IIRC，解决方案是在 TinyMCE 小部件未显示在屏幕上时，从它环绕的文本字段中删除它。在您的情况下，您希望从 tabPanel 中删除 MapWidget，而它未显示。我对 Google Maps API 不够熟悉，不知道是否有指定的方法可以做到这一点，但您可以尝试一个简单的tabPanel.remove(googleMapsTab);.

于 2010-06-09T17:31:41.333 回答