在GWT中向CellTable添加分页动画

Question

我正试图在GWT中为CellTable上的页面更改设置动画，这与更改标签的方式相同（http://gwt.google.com/samples/Showcase/Showcase.html ＃！CwTabLayoutPanel）。换句话说，新的表格页面将从顶部（或底部）滑入。 CellTable使用SimplePager来启动页面更改。

谢谢，Matyas

Answer 1

没有办法以简单的方式做到这一点，因为要制作幻灯片动画，你必须至少有2个已经渲染的页面：第一个被移出，第二个被替换掉。在带有动画tabset的展示示例中，所有选项卡都被渲染并可以使用，但是带有SimplePager的CellTable没有渲染页面，只有可见的页面 - 新页面只是直接渲染到CellTable体中。

所以，如果你真的想用CellTable和Pager创建这样的效果，你必须实现你自己的一对CellTable和Pager，它们会做以下事情：

1. 保留2个带渲染行的容器：一个是可见的，第二个是隐藏的。
2. CellTable正文应该有视口（只是一个带有“overflow：hidden”CSS规则的＆lt; div＆gt;），里面有两个容器。
3. 当寻呼机更改页面时，您必须强制CellTable将新行呈现到隐藏容器中。
4. 当呈现新数据时，将隐藏的容器放置在适当的位置，以使其看起来继续可见，并使其可见;
5. 提供将两个容器移动到新位置的动画。我建议不要使用动画编码（例如Timer） - 使用CSS3转换规则会更好，更有效（参见“CSS3 transform Property”和/或“CSS3 transition Property”）。
6. 动画完成后，隐藏第一个容器并将指针切换到可见容器和隐藏容器 - 这样就可以返回初始状态。

希望这有帮助。