隐藏/显示动画

Question

我想知道是否可以使用简单的gwt（无需外部库）在hide/show面板上制作动画。

欢迎任何建议。

感谢

Answer 1

GWT的布局类支持动画。退房Layout，DockLayout en SplitLayout。此外，还有一个Animation类，它在几个面板中用于使用动画来显示/隐藏内容。只需使用Animation类检查这些类。

Answer 2

也许你会觉得这有用的代码从NotificationMole：

private class MoleAnimation extends Animation { 
    private int endSize; 
    private int startSize; 

    @Override 
    protected void onComplete() { 
     if (endSize == 0) { 
     borderElement.getStyle().setDisplay(Display.NONE); 
     return; 
     } 
     borderElement.getStyle().setHeight(endSize, Unit.PX); 
    } 

    @Override 
    protected void onUpdate(double progress) { 
     double delta = (endSize - startSize) * progress; 
     double newSize = startSize + delta; 
     borderElement.getStyle().setHeight(newSize, Unit.PX); 
    } 

    void animateMole(int startSize, int endSize, int duration) { 
     this.startSize = startSize; 
     this.endSize = endSize; 
     if (duration == 0) { 
     onComplete(); 
     return; 
     } 
     run(duration); 
    } 
    } 

用法：

• 隐藏面板：

  animation.animateMole（heightMeasure.getOffsetHeight（） 0， animationDuration）;

• 显示：

  borderElement.getStyle（）setDisplay（Display.BLOCK）;
  animation.animateMole（0，heightMeasure.getOffsetHeight（），animationDuration）;

凡borderElement - 容器的DivElement和heightMeasure - 内部的DivElement。