0

In my current Axure prototype I have an element that is supposed to "slide in" from below the actual screen area. Of course this element should not be visible beforehand. Therein lies my problem, as it actually is visible.

Current outcome:

enter image description here

Desired outcome:

enter image description here

How do I mask it out? Is there even a function like masks in Axure? If not, what are other viable options to achieve the desired effect?

1

There are two possible approaches.

  1. Set it to hidden. When you wish to animate it out, set it to display, but set the animation to the appropriate direction. If you want it hidden behind something, then make sure it is below it in the ordering. However I'm not sure if this will help you with your problem.

  2. Use a dynamic panel. Dynamic panels will automatically clip their contents based on the size that you have set it to. Just be careful about the "set to content" option with the dynamic panel. It doesn't change the size at run-time, but it will in the editor.

Also be aware of animation issues if you wish to slide in from an edge of the screen when you will not be touching the edge of the screen when it is displayed. It will only animate from the dimensions of the dynamic panel, so you need to set it's size such that an edge is touching the screen edge that you wish to animate in from.

Generally, if I want to show a panel sliding out from somewhere, I am very careful with the layers (what it is under, what it is above). Then I set it to hidden and I just display it, with the appropriate directional animation (I also set swing, normally looks best).

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.