Content overflow (visible / hidden) bug in 3.6.2

Hey guys,
I’m having real trouble with the latest Hype Pro update. It seems that group behaviours have either changed or something is different. Il describe the scenario…

I am currently illustrating some interactions for a developer, one of them is a circle that fills up on tap (i.e. user interaction, when the circle fills up the action plays)

To illustrate this I would usually have:

  • A circle layer on top with a stroke and NO fill
  • (Inside a group) a circle layer with a fill, and the group set to hidden

I would then animate the group top edge upwards to give the top the circle the appearance of being ‘filled’

In Hype 3.6.2 PRO animating the group frame now causes the FILL circle to move, which is not the behaviour I wanted. Am I doing something wrong???

Would You post a Hype project example of your situation… the best way to understand an issue.

I don’t think there are any 3.6.2 changes that would have caused this. I’m not completely able to follow the steps, so as @JimScott says, would you mind posting a zip of a .hype document that reproduces the issue? Thanks!

Hey @JimScott @jonathan
Thank you so much for your replies! Iv added an example document with the above issue. Iv also added some visual states (state 1-3) to show the expected behaviour I wanted. When setting up the document and using visible/hidden to hide a filled circle, it moves the group and the group contents.

Am i doing something wrong???

Loading_Circle.zip (14.9 KB)

hi,

if not masking from top/left you’ve got to animate the content of the masking group to the opposite …

-> moving the circle downwards while opening the mask

1 Like

Ok great @h_classen - so i need to animate the group and the circle

Touching on this, Animating the mask from Right to Left results in an image moving as oppose to just the mask? I know you mentioned why it does what it does but what must I do in this case?

mask from right to left without image moving.zip (187.6 KB)

this is how nikon has it now with the spiral they’re using a different tactic here looking at the source code theyre animating the SVG values.
https://www.nikonusa.com/en/nikon-products/mirrorless-cameras/overview.page?icid=img_en_us:hp:slot:1:ml:ml_cameras:082318:wwa_ml#z-series-rethink

Here’s more info on why this is a bit tricky: Masking Objects Left to Right

ok done opposite directions was the key :wink: Thanks Daniel, looking at Hans response it wasn’t as clear as Jonathan’s was.