SadiQ and Hectate proudly present
Totally Awesome Transitions For Cool Developers Like You!
Update 4/11/20: Due to a change in the tween engine for Stencyl, version 2.0 has been released for current versions of Stencyl (4.0+). Only the "Threshold" transition remains as a result, although the code for the others are still there in case someone is interested in updating them. Cheers!
End update 4/11/20Greetings fellow Stencyler and Cool Developer! I'm sure that you have thought to yourself "Golly, if only I could have some totally awesome transitions to make this scene switching more interesting. If only someone could release an extension that solved this problem for me!". Well fear no more, because SadiQ and Hectate have come to your rescue. We are pleased to announce the release of our fine extension that resolves this handily.
You may find yourself wondering just exactly how awesome these transitions are. Do not fret yourself over such trivial matters; we shall prove it to you! Examine below, how
incredible and
smooth the exciting transformation between scenes is made by the addition of these
Totally Awesome Transitions For Cool Developers Like You!
Fancy images to come in the near futureVideo on Stencyl's Facebook"But Hectate," you say, "how much are these incredible feats of coding prowess that I find myself uncontrollably compelled to obtain going to cost me so that I might use them in my projects and try to fill the void in my soul left because I will never be as incredibly talented as you two fine coders?" Why
nothing of course! They're absolutely and entirely free for each and every person! Yes, even
you! SadiQ and I would not turn down a free beer, if we were to meet you in a pub someday - but it is not required (perhaps, we might buy
you one). In the meanwhile, enjoy!
Of course, this post would not be complete without some instructional documentation for the hapless users we are unleashing this on! Read on below, fellow developer, and be educated thoroughly concerning all matters involving
Totally Awesome Transitions For Cool Developers Like You!
Where it works: Flash is confirmed. All other platforms are untested at this date, and use-at-your-own-risk (sorry, they should be fine though, mostly?). Please let us know if you have any success/failure on other platforms so we can share the joy or sadness, or perhaps release new versions with greater compatibility in the future.
Questions not covered above or below: Please join us on the
Stencyl Discord server if you want to ask questions, troubleshoot issues, or proclaim how magnanimous we are for releasing this to the public. You could also post in this thread, if that's more your flavor.
Blocks
DetailsChange to [Scene] using [Transition]This is the block that you use to actual trigger a scene change. Select a scene, or a Scene attribute block, as the scene you will change to. The blank space is meant to hold any of the blue Transition blocks as the transition for this scene change.
Make [Number] [Horizontal/Vertical] blinds over [Number] secondsThis transition divides the screen into horizontal or vertical strips, similar to window blinds. Results are strange with few blinds (e.g. less than 5 or so), and an even number is recommended - and in particular one that divides evenly into the screen resolution. The total duration of the transition is related to the number of seconds given, but the transition will actually take longer as you add more blinds. Because we are not currently altering this code, please assume this is a feature and not a bug, and experiment and tweak the value to arrive at the desired effect.
Slide [Old Scene Out/New Scene In] moving [Up/Down/Left/Right] over [Number] secondsThe new/old scene will slide in/out of the scene, thereby concealing or revealing the other. Nothing particularly special or fancy, and in fact Stencyl already has this I believe. Consider this more of a convenience. We had hoped to introduce alternate tweens (bounces, etc) at some point, but at this time it is strictly linear. We could, if there is interest, revisit this in a future release should one occur.
Push [Up/Down/Left/Right] over [Number] seconds
The new scene will push the old one out of the way (both will move) in the desired direction. Again, this has greater possibilities in the future. Lies, they're all lies.
Crossfade in-out over [Number] secondsThis is the exact same code used in the Stencyl crossfade (because I took it from there to learn how the transitions work), so nothing special here either yet. Sorry, your transitions are in another castle/these are not the transitions you are looking for; move along.
Threshold masking using [Image] [Dark-to-light/Light-to-dark] over [Number] seconds : blur [Number] quality [Number]This is an exciting, exceptionally-customizable transition that uses any arbitrary image to progressively mask out portions of the old scene and reveal the new scene underneath. Anyone familiar with RPGMaker transitions should be familiar with these. A number of images are available (see the Installation Notes), or you can create your own or generate one from an
Image attribute in Stencyl! The Dark/Light dropdown allows you to reverse the "direction" of the threshold (inverting the image, essentially). The Blur and Quality numbers allow you to smooth the edge of the threshold, but with a performance penalty as numbers increase. Setting either to zero will disable the smoothing.
Note that images are automatically re-scaled when the transition begins so they fit the screen size fully. Thus you could use smaller images for your transitions to reduce the space requirements. Images larger than the screen would be pointless.
Use [Number] rows/columns, shrunk to [Number] and then [Flip/Shrink] over [Number] seconds, with [Color] backgroundThis cuts the old scene into equally-sized "cards", based on the number used for the rows/columns. These are intended to shrink a bit (so you can see the gaps), which is equal to the second number shown. This number should be a float between 0 and 1, with a value around .8-.9 recommended as a starting point. These cards will then either Flip over to reveal the new scene or Shrink to nothing with new cards appearing using the new scene's image instead.
Threshold using Perlin noise at scale [Number] over [Number] secondsThis does the same thing as the Threshold using an image, except it handily produces Perlin noise (random blobs with smooth gradient between them) image for the transition. The scale should be a multiple of 2 and the higher it is the larger the "blobs" of noise. There is a small amount of blending hardcoded into this already.
Installation Notes*
Version 1.0 original release (Google Drive link)*
Version 2.0 for Stencyl 4.0+ (Google Drive link)Please download the extension file
transitions.zip. The zip file can be installed
in the usual fashion (or by
alternate method). The code contained in this extension is being released under
CC BY 4.0 which pretty much means you can do whatever you want with it, almost. If you have questions or concerns about this, please PM me.
Also available is
extras.zip containing some images for the Threshold transition. I made all of them myself and they are released into the public domain, or the best legal equivalent for the laws in your country. Please feel free to learn from them, modify them, or include them in your projects as you see fit. To use them (or any that you create yourself), simply include the image in your /extras folder for the game and then reference them with the "image from file" block. Most are 640x480 (as that is the default resolution for Stencyl projects). Notably, the simple wipes are single-pixel wide/tall and you will see that the re-scaling done at run-time permits them to cover the entire screen easily!
