Forum Discussion
How to make this image transition?
- 4 months ago
To recreate the use of buttons as seen in Nejc's video (This guy is really smart and nice), you need to create 4 triggers per button. So, 8 triggers for the 2 left/right buttons. But it is not complicated at all.
>>I'll start with the RIGHT button (to move the panel to the right)
You need 1 first trigger to start moving the "scrolling panel" when you click on the button. 1 other trigger to continue moving as long as the button is pressed. Ditto for the “image” in the panel, so 2 other triggers.
BUT FIRST, you need to ensure that the panel and image will move CONTINUOUSLY and REGULARLY as long as the button is pressed.
The Motion Path to the right of the “Panel” is 10px in 0.10s; no slow motion; relative starting point.
The Motion Path to the left of the “Image” in the panel is in the opposite direction, same setting.
OK, now:
- 1st trigger: Move "Panel" along its Motion Path (to the right) when “Right Button” status is “pressed”.
-1st trigger bis: Move “Image” along its Motion Path (to the left) when the “Right Button” status is “pressed”.
-2nd trigger: Move “Panel” along Motion Path (to the right) when the Motion Path ( to the right) of “Panel” ends IF Right Button status is pressed.
-2nd trigger bis: Move “Image” along Motion Path (to the left) when the Motion Path (to the left) of “Image” ends IF right button status is pressed.
(My apologies if the triggers are not perfectly translated, I have the French version).
This allows you to: trigger movement to the right if you click the RIGHT button, and continue the movement (10pix per 0.1s = very smooth and continuous, but you can change the speed) as long as the button remains pressed. It stops as soon as you stop clicking.
All that's left is to create the Motion Path (to the left) if you haven't already done so, and apply similar triggers to the LEFT button.
Have I made myself clear?
If you need the little .story file with which I tried and verified that this works, just let me know.
To recreate the use of buttons as seen in Nejc's video (This guy is really smart and nice), you need to create 4 triggers per button. So, 8 triggers for the 2 left/right buttons. But it is not complicated at all.
>>I'll start with the RIGHT button (to move the panel to the right)
You need 1 first trigger to start moving the "scrolling panel" when you click on the button. 1 other trigger to continue moving as long as the button is pressed. Ditto for the “image” in the panel, so 2 other triggers.
BUT FIRST, you need to ensure that the panel and image will move CONTINUOUSLY and REGULARLY as long as the button is pressed.
The Motion Path to the right of the “Panel” is 10px in 0.10s; no slow motion; relative starting point.
The Motion Path to the left of the “Image” in the panel is in the opposite direction, same setting.
OK, now:
- 1st trigger: Move "Panel" along its Motion Path (to the right) when “Right Button” status is “pressed”.
-1st trigger bis: Move “Image” along its Motion Path (to the left) when the “Right Button” status is “pressed”.
-2nd trigger: Move “Panel” along Motion Path (to the right) when the Motion Path ( to the right) of “Panel” ends IF Right Button status is pressed.
-2nd trigger bis: Move “Image” along Motion Path (to the left) when the Motion Path (to the left) of “Image” ends IF right button status is pressed.
(My apologies if the triggers are not perfectly translated, I have the French version).
This allows you to: trigger movement to the right if you click the RIGHT button, and continue the movement (10pix per 0.1s = very smooth and continuous, but you can change the speed) as long as the button remains pressed. It stops as soon as you stop clicking.
All that's left is to create the Motion Path (to the left) if you haven't already done so, and apply similar triggers to the LEFT button.
Have I made myself clear?
If you need the little .story file with which I tried and verified that this works, just let me know.
- DanielAlbarran3 months agoCommunity Member
Hi Emmanuel, I almost got the result, but I´d like to know how to set the speed of the motion, and please, share your story file.
- ThierryEMMANUEL3 months agoCommunity Member
I'm really sorry for this late reply, and probably unnecessary now, but I wasn't notified of your request (there's probably a @ThierryEMMANUEL missing from your message for this to be the case). I stumbled upon this thread quite by accident while doing some housework.
For speed, it's very simple: all you have to do is increase the movement distance during the 0.1s, which means modifying the length of your motion patch: from 10px to 20px for example = 2 times faster.
For the .story file: it must be somewhere on my PC, but where? and what's its name? I'm looking for it.Thierry
- DanielAlbarran3 months agoCommunity Member
Oh thanks ThierryEMMANUEL. I´ll try. If you find your file, it will be great.
Related Content
- 7 months ago
- 4 months ago
- 7 months ago