애니메이션 숨기기/표시

Question

단순한 gwt (additonnal librairies 제외)로 숨기기/표시 패널에서 애니메이션을 만들 수 있는지 알고 싶습니다.

모든 의견을 환영합니다.

감사합니다.

Answer 1

GWT의 레이아웃 클래스는 애니메이션을 지원합니다. Layout, DockLayout, 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.