1

少し問題が発生しました。GWT で開発された Web アプリには、「タブ レイアウト パネル」機能を備えたレイアウトがあります。現在、水平スライド アニメーションは、Chrome (バージョン > 22) を除くすべてのブラウザーでうまく機能します。

ユーザーがスライド アニメーションをトリガーするタブの 1 つをクリックすると、GWT Chrome プラグインがクラッシュするまで停止することなく、ある種のループで左から右にスクロールし始めます (常に発生するとは限りません)。

複数のコンピューター、異なる OS、ブラウザー、およびプラットフォームで試してみましたが、結果は常に同じです。Chrome は、GWT タブ レイアウト パネルのアニメーションが気に入らないようです。

これは、この質問用に作成された Web アプリの例です。まだこの akward ループっぽい左右のスライドがあります。

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