Hi there,
I try to fade in a user popup. I have added the animation control and defined the fade in on the appear event. It works but it first shows the popup, then immediately hides it and fades it in. How can I prevent it from first showing?
Regards Rudy
It happens because the styles are not applied immediately, they are cached and the flushed all at once. I changed the event handler like this:
private void upMainMenu_VisibleChanged(object sender, EventArgs e)
{
upMainMenu.Eval(“this.getContentElement().setStyles({ \”box-shadow\”: \”6px 6px 3px #C0C0C0\”, \”opacity\”: 0}, true)”);
}
This way it’s only 1 call. The last parameter “true” is the direct argument which makes the library apply the styles immediately.
I also added .Visible = false in designer.cs and commented out upMainMenu.Hide() and the otehr eval. You need only 1 in VisibleChanged.
In any case, the next update will recognize “appear” animations and automatically apply the first animation frame right away so this is not necessary anymore. We also added a dozen or so new animations.
Hi Rudy,
enhancement WJ-8958 is now included in the latest Wisej dev build (1.4.99).
Best regards
Frank
Hi Luca,
thanks for your help. I managed to get it working the first time the popup is displayed. However, if I re-open it via the desktop menu button it shows the wrong behavior. I have attached a sample project.
Best Regards
Rudy
Yep. The problem is that the appear event it fired after the html elements have been created in the browser. To have the fadein work properly, the popup should be created with opacity 0. There are several solutions:
protected override void OnVisibleChanged(EventArgs e)
{
if (this.Visible)
this.Eval(“this.getContentElement().setStyle(‘opacity’, 0)”);
base.OnVisibleChanged(e);
}
HTH
Please login first to submit.