1

我们遇到了一些问题。我们在 GWT 中开发的 Web 应用程序的布局具有“选项卡布局面板”功能。现在，水平幻灯片动画在除 Chrome（版本 > 22）之外的所有浏览器中都非常有效。

当用户单击应该触发幻灯片动画的选项卡之一时，它只是开始以某种循环从左到右滚动，而不会自行停止，直到 GWT Chrome 插件崩溃（这并不总是发生）。

我们在多台计算机、不同的操作系统、浏览器和平台上进行了尝试，但结果始终相同。Chrome 似乎不喜欢 GWT 选项卡布局面板动画。

这是为这个问题创建的示例网络应用程序。它仍然有这个 akward loop-ish 左右幻灯片。

public class MyWebApp implements EntryPoint {
  // A simple data type that represents a contact.
  private static class Contact {
    private final String address;
    private final String name;

    public Contact(String name, String address) {
      this.name = name;
      this.address = address;
    }
  }

  // The list of data to display.
  private static List<Contact> CONTACTS = Arrays.asList(new Contact("John",
      "123 Fourth Road"), new Contact("Mary", "222 Lancer Lane"), new Contact(
      "Zander", "94 Road Street"));

  public void onModuleLoad() {

    // Create a CellTable.
    CellTable<Contact> table = new CellTable<Contact>();

    // Create name column.
    TextColumn<Contact> nameColumn = new TextColumn<Contact>() {
      @Override
      public String getValue(Contact contact) {
        return contact.name;
      }
    };

    // Make the name column sortable.
    nameColumn.setSortable(true);

    // Create address column.
    TextColumn<Contact> addressColumn = new TextColumn<Contact>() {
      @Override
      public String getValue(Contact contact) {
        return contact.address;
      }
    };

    // Add the columns.
    table.addColumn(nameColumn, "Name");
    table.addColumn(addressColumn, "Address");

    // Create a data provider.
    ListDataProvider<Contact> dataProvider = new ListDataProvider<Contact>();

    // Connect the table to the data provider.
    dataProvider.addDataDisplay(table);

    // Add the data to the data provider, which automatically pushes it to the
    // widget.
    List<Contact> list = dataProvider.getList();
    for (Contact contact : CONTACTS) {
      list.add(contact);
    }

    // Add a ColumnSortEvent.ListHandler to connect sorting to the
    // java.util.List.
    ListHandler<Contact> columnSortHandler = new ListHandler<Contact>(list);
    columnSortHandler.setComparator(nameColumn, new Comparator<Contact>() {
          public int compare(Contact o1, Contact o2) {
            if (o1 == o2) {
              return 0;
            }

            // Compare the name columns.
            if (o1 != null) {
              return (o2 != null) ? o1.name.compareTo(o2.name) : 1;
            }
            return -1;
          }
        });
    table.addColumnSortHandler(columnSortHandler);

    // We know that the data is sorted alphabetically by default.
    table.getColumnSortList().push(nameColumn);

    // Create a tab panel
    TabLayoutPanel tabPanel = new TabLayoutPanel(2.5, Unit.EM);
    tabPanel.setAnimationDuration(1000);
    tabPanel.getElement().getStyle().setMarginBottom(10.0, Unit.PX);
    tabPanel.getElement().getStyle().setHeight(1000, Unit.PX);
    tabPanel.getElement().getStyle().setWidth(720, Unit.PX);
    tabPanel.getElement().getStyle().setLeft(14, Unit.PX);

    // Add a home tab
    String[] tabTitles = {"Prova1", "Prova2", "Prova3"};
    HTML homeText = new HTML("<h1>Prova1</h1>");
    tabPanel.add(homeText, tabTitles[0]);
    FlexTable ft = new FlexTable();
    ft.setText(0, 0, "upper-left corner");
    ft.setText(2, 2, "bottom-right corner");
    VerticalPanel p = new VerticalPanel();
    p.add(ft);
    // Add a tab
    HTML moreInfo = new HTML("<h1>Prova2</h1>");
    tabPanel.add(p, tabTitles[2]);   

    // Add it to the root panel.
    RootPanel.get().add(table);
    RootPanel.get().add(tabPanel);
  }

}

4

0 回答 0