在 GWT 中使用按钮刷新面板

Question

我有一个使用 GWT 的小型 Web 应用程序项目，其中一个按钮处理一个事件：使用小部件填充面板。目前，第二次单击该按钮将复制面板，我想要它以便清除面板，然后重新添加小部件。

到目前为止我有：

final Button b = new Button("get schools near me");
    final HorizontalPanel panel = new HorizontalPanel();
    panel.getElement().setId("distanceTable");
    RootPanel.get("core").add(b);
    RootPanel.get("core").add(panel);
    b.addClickHandler(new ClickHandler(){
        @Override
        public void onClick(ClickEvent event) {
            Timer t = new Timer(){
                @Override
                public void run() {
                    //how do you clear the panel here first? before you
                    // do a bunch of things along the lines of:
                    panel.add(widget);
                    panel.add(widget2);
                }
            };
            t.schedule(1400); // wait 1.4 seconds for callback
        }
    });

我知道你传递给运行函数的任何东西都必须作为最终声明，那么我该如何解决这个问题？

Answer 1

您可以使用clear方法：

panel.clear();

Answer 2

将 final HorizontalPanel panel = new HorizontalPanel(); 更改为 class 级别属性。然后它可以很容易地传递给内部匿名classes。您可以按照 @philfr49 的建议在 Timer 方法中使用 clear 方法例如

private HorizontalPanel panel = new HorizontalPanel();
.....
// Elsewhere
.....
final Button b = new Button("get schools near me");
panel.getElement().setId("distanceTable");
RootPanel.get("core").add(b);
RootPanel.get("core").add(panel);
b.addClickHandler(new ClickHandler(){
    @Override
    public void onClick(ClickEvent event) {
        Timer t = new Timer(){
            @Override
            public void run() {
                panel.clear();
                panel.add(widget);
                panel.add(widget2);
            }
        };
        t.schedule(1400); // wait 1.4 seconds for callback
    }
});

Answer 3

接问题的评论——不推荐使用计时器等待回调结果。

我假设您正在使用严格的模型-视图-控制器分离，并且您打印的代码是视图部分，回调发生在单独的控制器中 class。

现在，如果没有向面板添加很多东西，我会使用以下结构：

/*
 * contains all the display parts of the appliation
 */
class View{

  private HorizontalPanel panel = new HorizontalPanel(); // panel as a field

  /*
   * Getter for panel
   */
  public HorizontalPanel getPanel(){
    return this.panel;
  }

  /**
    * Method to create the display part for 'Schools Near Me'
    *
    * @param schoolsNearMeHandler Clickhandler that decides what happens
    *                             when the 'near me' button is clicked
    *                             Contains code to request from server
    *                             and display server result
    */
  public void createSchoolsNearMeSection(ClickHandler schoolsNearMeHandler){
    final Button b = new Button("get schools near me");
    panel.getElement().setId("distanceTable");
    RootPanel.get("core").add(b);
    RootPanel.get("core").add(panel);
    b.addClickHandler(schoolsNearMeHandler);
  }

}

/*
 * Creates and operates the View and makes sure the correct things get displayed
 */
class Controller{

  private View view;

  public Controller(){
     // since the Controller drives the Model-View-Controller part,
     // the view is being created here
     view = new View();

     // TODO more code to set up the view to perfection

     // Create the 'schools near me' section
     view.createSchoolsNearMeSection(new ClickHandler(){
      @Override
      public void onClick(ClickEvent event) {
          loadSchoolsNearMe(); // send request to server
      }
    }
  }

  /**
    * Loads schools near me from the server
    */
  private void loadSchoolsNearMe(){

    // generic callback -- use whatever callback interface is required for your way of requesting data from server
    Callback callback = new Callback(){

      public void onSuccess(ServerResult result){

         // retrieve the panel where you want to display your data
         HorizontalPanel panel = view.getPanel();
         panel.clear();

         // TODO execute whatever code necessary to create
         // widget and widget2 from the ServerResult

         // display the newly generated widgets
         panel.add(widget);
         panel.add(widget2);
      }

      public void onError(...){
         // handle errors
      }

    }

    // Create request
    Request request = new Request(...);

    // Execute request
    RequestBuilder.execute(request, callback);
  }


}

当然，如果服务器结果有很多复杂的代码和视图构建，你可以再次将显示部分放入View对象，将逻辑保留在Controller中，并且只需调用相应的 View 函数即可显示任何需要的内容。

在 GWT 中使用按钮刷新面板

Using a button to refresh a panel in GWT

java

gwt