Storyboard Transition Easing Options

Solar2D Composer
#1

I’m considering transitioning my app from using Director Class to Storyboard, however, there is one thing that is bothering me.  Director Class uses “transition.to” for its scene movement, which allows me to use built-in easing options or even custom easing options (I’m currently using the “EasingX” module).  Storyboard has a lot of transition types available, which is nice, but I haven’t found a way to control easing.  I’ve looked through the forums and haven’t found much regarding this.

Corona crew: Are there plans to add an “easing” parameter for Storyboard that works the same way easing does for transition.to?  In my opinion, this would be a really great addition to Storyboard.  Thanks for your help.

#2

I would suggest that you enter a feature request for this at:  http://feedback.coronalabs.com

Rob

#3

Good idea.  Alright everyone, time to vote it up!

http://feedback.coronalabs.com/forums/188732-corona-sdk-feature-requests-feedback/suggestions/5301082-add-easing-option-for-storyboard-transitions

#4

After some more digging, I wanted to share what I’d found. In this thread, BigDan256 shows how to read Storyboard’s parameters so that you can create your own custom effects:

http://forums.coronalabs.com/topic/23576-custom-storyboard-effect/?hl=%2Bstoryboard+%2Bcustom+%2Btransitions

His var_dump code is fantastic, and when run against the Storyboard module returns a partial list of Storyboard’s effect (from which the others are also derived, I believe). With this info, and BigDan256’s instructions, I created custom slideRight and slideLeft effects for Storyboard. My goal was to be able to use any of the easing options from the easing library (easing.outCubic in my case, which I think looks better than the default easing.outSine that the native ‘slideRight’ and ‘slideLeft’ effects use by default). Here they are:

[lua]storyboard.effectList.slideRightCubic = { sceneAbove = true, concurrent = true, to = { yStart = 0, xStart = -320, xEnd = 0, transition = easing.outCubic, yEnd = 0 }, from = { yStart = 0, xStart = 0, xEnd = 320, transition = easing.outCubic, yEnd = 0 } }
storyboard.effectList.slideLeftCubic = { sceneAbove = true, concurrent = true, to = { yStart = 0, xStart = 320, xEnd = 0, transition = easing.outCubic, yEnd = 0 }, from = { yStart = 0, xStart = 0, xEnd = -320, transition = easing.outCubic, yEnd = 0 } }[/lua]

Be sure to change the transition effect in both the ‘to’ and ‘from’ table so that they match up.  While it would still be easier if Corona Labs would just expose the ‘transition’ parameter in Storyboard’s options list by default, this is at least a way that properly allows custom transition effects in Storyboard.

#5

I would suggest that you enter a feature request for this at:  http://feedback.coronalabs.com

Rob

#6

Good idea.  Alright everyone, time to vote it up!

http://feedback.coronalabs.com/forums/188732-corona-sdk-feature-requests-feedback/suggestions/5301082-add-easing-option-for-storyboard-transitions

#7

After some more digging, I wanted to share what I’d found. In this thread, BigDan256 shows how to read Storyboard’s parameters so that you can create your own custom effects:

http://forums.coronalabs.com/topic/23576-custom-storyboard-effect/?hl=%2Bstoryboard+%2Bcustom+%2Btransitions

His var_dump code is fantastic, and when run against the Storyboard module returns a partial list of Storyboard’s effect (from which the others are also derived, I believe). With this info, and BigDan256’s instructions, I created custom slideRight and slideLeft effects for Storyboard. My goal was to be able to use any of the easing options from the easing library (easing.outCubic in my case, which I think looks better than the default easing.outSine that the native ‘slideRight’ and ‘slideLeft’ effects use by default). Here they are:

[lua]storyboard.effectList.slideRightCubic = { sceneAbove = true, concurrent = true, to = { yStart = 0, xStart = -320, xEnd = 0, transition = easing.outCubic, yEnd = 0 }, from = { yStart = 0, xStart = 0, xEnd = 320, transition = easing.outCubic, yEnd = 0 } }
storyboard.effectList.slideLeftCubic = { sceneAbove = true, concurrent = true, to = { yStart = 0, xStart = 320, xEnd = 0, transition = easing.outCubic, yEnd = 0 }, from = { yStart = 0, xStart = 0, xEnd = -320, transition = easing.outCubic, yEnd = 0 } }[/lua]

Be sure to change the transition effect in both the ‘to’ and ‘from’ table so that they match up.  While it would still be easier if Corona Labs would just expose the ‘transition’ parameter in Storyboard’s options list by default, this is at least a way that properly allows custom transition effects in Storyboard.