Is there anyway to have a element swipe over another image? For example on smart phones when you swipe for the top down or swipe from the bottom up, the control panel will go over top of the home screen.
I have a project that the client wants to have elements in an asset grid to swipe from left and right, but if you want more detail on the product you are on to swipe from the bottom up to see more detail on it. I have put 2 asset grids together one that is horizontal and inside it another asset grid that is vertical. But I was hopping to come up with something slicker then that.
You might consider having only 1 asset grid, each element being a Group with 2 images inside. When you tap / swipe the image at the top, you use the move to action to put it above the image below. Using a transparent toggle button can make things easier to handle the “move top image above below image” and “move the top image away” behaviors.
Don’t hesitate to add 1 or 2 images to explain your need if you want additional info.
@brett.halsey
Hey Brett, another thing you could do to make the swipe-able menu is place your content in a group…off-screen except for just a small portion that the user can “Grab” when they swipe. Be sure to set the swiping to only move vertically, so you don’t have a free-flying group when they move it.
Bind the Y position of the group to a counter. If you want to mimic the Android phone control panel movement, you’ll notice that the control panel only comes down after it is pulled past a certain point.
Set a trigger on your counter that when the value is Greater than or Equal to “XXX”, it will move the whole content group into proper x,y position. “XXX” is the value you are comfortable with for how far they should swipe before the action is triggered.
Of course to be on top, set your content to be at the top-most layer so it appears over the product info.
As a bonus, use parallax movements or other animation triggers to happen either when the swiping occurs, or when the content group is triggered to move into place.
Hey @brett.halsey,
I had some time this weekend and was playing around with something to mimic the settings swipe panel of an android.
The positioning works, but the problem is that it will interrupt you in the middle of the swipe. So I think that using the Drag and Drop triggers would be a more fitting solution.
As soon as your settings group is dropped over a transparent rectangle “drop-zone” it will finish moving the settings group to it’s proper position. Then the same when it is swiped back up, there is another drop zone for the upward movement. I haven’t finished testing this, but I think you may either need to hide/show down swipe drop-zones, or simply move them out of the way so they don’t try to override each other.