添加一个小部件到地图打破GWT中的其他小部件

Question

我基本上有两对小部件，一个有两个日期选择器和一个提交按钮，将日期提交给服务器上的RPC，另一个是一个地图，那些日期。每个人都单独工作，但是当地图显示时，我无法对日期选择器或提交按钮执行任何操作。

这里是一个重要的

public void onModuleLoad() { 
    final DockLayoutPanel dock = new DockLayoutPanel(Unit.PCT); 
    /* 
    * Asynchronously loads the Maps API. 
    * 
    * The first parameter should be a valid Maps API Key to deploy this 
    * application on a public server, but a blank key will work for an 
    * application served from localhost. 
    */ 
    Maps.loadMapsApi("", "2", false, new Runnable() { 
     public void run() { 

      final FormPanel form = new FormPanel(); 
      form.setMethod(form.METHOD_POST); 


      DatePicker datePicker = new DatePicker(); 
      final Label text = new Label(); 
      text.setText("Start Date"); 

      // Set the value in the text box when the user selects a date 
      datePicker.addValueChangeHandler(new ValueChangeHandler<Date>() { 
       public void onValueChange(ValueChangeEvent<Date> event) { 
        Date date = event.getValue(); 
        String dateString = DateTimeFormat.getMediumDateFormat().format(date); 
        text.setText("Start Date - " + dateString); 
       } 
      }); 

      // Set the default value 
      datePicker.setValue(new Date(), true); 

      // Add the widgets to the page 
      RootPanel.get().add(text); 
      RootPanel.get().add(datePicker); 

      DatePicker datePicker2 = new DatePicker(); 
      final Label text2 = new Label(); 
      text2.setText("End Date"); 

      // Set the value in the text box when the user selects a date 
      datePicker2.addValueChangeHandler(new ValueChangeHandler<Date>() { 
       public void onValueChange(ValueChangeEvent<Date> event) { 
        Date date = event.getValue(); 
        String dateString = DateTimeFormat.getMediumDateFormat().format(date); 
        text2.setText("End Date - " + dateString); 
       } 
      }); 

      // Set the default value 
      datePicker2.setValue(new Date(), true); 

      // Add the widgets to the page 

      RootPanel.get().add(text2); 
      RootPanel.get().add(datePicker2); 
      RootPanel.get().add(new Button("Submit", new ClickListener() 
      { 
       public void onClick(Widget sender) 
       { 
        form.submit(); 
       } 
      })); 

      form.addSubmitHandler(new SubmitHandler() { 
       @Override 
       public void onSubmit(SubmitEvent event) { 
        getAwards(text.getText(),text2.getText()); 
       } 
      }); 

     } 
    }); 
} 

这是创建datepickers代码的代码。

下面是显示地图的代码。

private void buildUi() { 
    ArrayList<Icon> icons = createIconList(); 
    content = new ArrayList<String>(); 
    LatLng sanDiego = LatLng.newInstance(32.83049, -117.122717); 
    final MapWidget map = new MapWidget(sanDiego, 9); 
    map.clearOverlays(); 
    map.setSize("100%", "100%"); 
    // Add some controls for the zoom level 
    map.addControl(new LargeMapControl()); 

    java.util.Random rand = new java.util.Random(); 
    for(ContractAward ca : sanDiegoAwards) 
    { 
     double off1 = (rand.nextDouble()-.5)/100; 
     double off2 = (rand.nextDouble()-.5)/100; 
     index++; 
     // Open a map centered on San Diego 
     LatLng contract = LatLng.newInstance(ca.getLat() + off1,ca.getLon()+off2); 

     MarkerOptions mo = MarkerOptions.newInstance();   
     mo.setTitle(""+index); 
     mo.setIcon(icons.get(whichIcon(ca.getAmount()))); 
     final Marker mark = new Marker(contract,mo);  
     map.addOverlay(mark); 

     String caContent = "<P>Company: " + ca.getCompany() + "<br>"; 
     caContent+= "Date: " + ca.getDate().toGMTString() + "<br>"; 
     caContent+= "Amount: " + ca.getAmount() + "<br>"; 
     caContent+= "ContractID: " + ca.getContractID() + "</P>"; 

     content.add(caContent); 
     mark.addMarkerClickHandler(new MarkerClickHandler() { 
      public void onClick(MarkerClickEvent event) { 

       InfoWindow info = map.getInfoWindow(); 
       info.open(mark, new InfoWindowContent(content.get(Integer.parseInt(mark.getTitle())-1))); 
      } 
     }); 

    } 
    final DockLayoutPanel dock = new DockLayoutPanel(Unit.PCT); 
    dock.addEast(map, 80); 


    // Add the map to the HTML host page 
    RootLayoutPanel.get().add(dock); 
} 

我试图改变RootLayoutPanel.get（）。添加（码头）至RootPanel.get（）。添加（码头），但是在地图本身不显示。我也尝试通过rootlayoutpanel更改所有要插接的顶部部件，但是同样的问题出现在目前的问题中。

Answer 1

解决方案最终将使用RootLayoutPanel并将占据屏幕的东部和西部部分的两个码头合并为一个占据整个屏幕的码头。有两个码头导致只有最近添加的码头处于活动状态，但将两个码头放入1码可以让它们都起作用。

Answer 2

我第一眼看到的几种可能性。

1）您正在添加日期选择器的东西到RootPanel，但地图的东西到RootLayoutPanel。我建议坚持使用RootLayoutPanel，如果它起作用，标准模式通常在GWT中具有更多有用的最新内容。

2）为什么你要在Runnable的第一位代码中完成整个事情？是不是只有onModuleLoad？