Animation -problems

Ask the community
,
1

Always when i am working with animations, i get some problems.
Animations are not consistent and sometimes broke or get weird

Example:

In this video you can see the behaviour of showing and expanding several strips and hiding and collapsing again.

Elements right from the top:

  1. strip0
  2. strip3
  3. strip6
  4. strip4

Working code:

let animOptions = {"duration":200, "delay":100, "direction":"top"}

export async function BTNsettings_click(event) {
    $w('#MSTB1').changeState("Settings")
     if($w('#strip1').hidden){       
         await $w('#strip3, #strip4, #strip6').hide('float', animOptions)
         await $w('#strip3, #strip4, #strip6').collapse().then(()=>{
            $w('#strip1').expand(), $w('#strip1').show('float', animOptions)
        }) 
    }
     else {
         await $w('#strip1').hide('float', animOptions).then(()=>{$w('#strip1').collapse()}); 
         $w('#strip3, #strip4, #strip6').expand(), $w('#strip3, #strip4, #strip6').show('float', animOptions)
    }
}

Also tried other variations, but all without succes to get a proper animation.

The red marked part is the problematic one, which causes little inconsistant animations.
You can see for a split second, some elements poping up again, when hiding and collapsing elements.

Not sure if this is now an Velo-issue or Wix-issue (or even my own :laughing:).

2

Problem solved by recoding.
But it is still an animation-problem (on my opinion).
There are unpleasant side effects with animation (should be fixed).