I'm struggling a little here with trying to simulate an EaseOutBack animation in PowerApps.
The code is supposed to simulate an EaseOutBack motion in moving the box onto the screen when flyOut equates to false. So it comes out, overshoots it's final position, then settles. The final position should be 10 pixels from the screen's right edge. Going back in isn't a problem, and works beautifully (hence not including the code here).
In order to make an EaseOutBack equation, I created a custom function with a single paramter, called "Duration". This is what the custom function looks like:
EaseOutBackFunction_1.EaseOutBack = 1.2 * ((Duration - 1)^2 + 1.2 * (Duration - 1) * Cos(Duration * (Pi()/2)))
Now the problem: I get the simulation I need, to a degree. As you can see in the gif below, the box settles 10 pixels from the edge, but seems to appear out of nowhere, rather than sliding onto the screen.
That's this code:
!flyOut,
//Off-screen to on-screen
//Starting position off-screen
//Adding here seems to start it off screen, but it ends up the same amount onscreen (10 in this case)
(Parent.Width - 20) -
//Gradually add the width of the rectangle
//Minus (10 in this case) at beginning seems to affect how far it bounces
((-Self.Width + 10) * EaseOutBackFunction_1.EaseOutBack(MenuTimer.Value/MenuTimer.Duration)) +
//Move by this much
(-Self.Width + 10)
)
So, I make it's starting position equal to screen width plus 10 instead, so that it appears to slide in properly, But that ends up putting its final position as 10 closer to the edge (right up against it). My code seem to cancel itself out.
!flyOut,
//Off-screen to on-screen
//Starting position off-screen
//Adding here seems to start it off screen, but it ends up the same amount onscreen (10 in this case)
(Parent.Width + 10) -
//Gradually add the width of the rectangle
//Minus (10 in this case) at beginning seems to affect how far it bounces
((-Self.Width + 10) * EaseOutBackFunction_1.EaseOutBack(MenuTimer.Value/MenuTimer.Duration)) +
//Move by this much
(-Self.Width + 10)
)
If i change either the first bit or the last bit, they seem to oppose each other. And I've tried so much trial and error that my brain is shutting down. I feel like the answer is that I need to start the box off-screen, but make it travel further to end in the right place.
Maybe I've done it all wrong, but I have literally made this all up on the fly as I can't seem to find any information on EaseOutBack in PowerApps.
Any help would be so greatly appreciated.
