Hide/Show animation
I would like to know if it is possible to make an animation on hide/show panel with simple gwt (without addito开发者_StackOverflow中文版nnal librairies).
Any suggestions are welcome.
Thanks
GWT's Layout classes support animation. Check out Layout
, DockLayout
en SplitLayout
. Furthermore, there is an Animation
class, which is used in several panels for using animation to show/hide the content. Simply check the classes using the Animation class.
Maybe you will find this code useful from 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);
}
}
Usage:
to hide panel:
animation.animateMole(heightMeasure.getOffsetHeight(), 0, animationDuration);
to show:
borderElement.getStyle().setDisplay(Display.BLOCK);
animation.animateMole(0, heightMeasure.getOffsetHeight(), animationDuration);
Where borderElement
- container DivElement and heightMeasure
- inner DivElement.
精彩评论