Difference between revisions of "Controlling Gifs and SPA's"
From PowerUI
Bablakeluke (talk | contribs) (→Events) |
Bablakeluke (talk | contribs) (→Getting hold of the SPA instance) |
||
| Line 3: | Line 3: | ||
== Getting hold of the SPA instance == | == Getting hold of the SPA instance == | ||
| − | + | If you're loading an SPA or GIF via src, keep in mind that they can be loaded over the internet so the best way to know when your animation is available is via the [[#Events|spritestart event]]. | |
| + | |||
| + | To get to the GIF or SPA from any given element, the instance itself is always held within the background image displayable property: | ||
| + | |||
| + | <syntaxhighlight lang="csharp"> | ||
| + | |||
| + | // Get the background data: | ||
| + | var backgroundData=anElement.RenderData.BGImage; | ||
| + | |||
| + | // The original image package: | ||
| + | var imagePackage=backgroundData.Image; | ||
| + | |||
| + | // The contents are a specific type of image (GifFormat, SpaFormat): | ||
| + | // GifFormat gifContents=imagePackage.Contents as GifFormat; | ||
| + | // SpaFormat spaContents=imagePackage.Contents as SpaFormat; | ||
| + | |||
| + | // Either of the above hold the SPAInstance as 'Animation', if it has started playing: | ||
| + | // gifContents.Animation | ||
| + | // spaContents.Animation | ||
| + | |||
| + | // Otherwise, gifContents.GifFile and spaContents.SpaFile are the originating Gif/Spa. | ||
| + | |||
| + | </syntaxhighlight> | ||
== Events == | == Events == | ||
Revision as of 18:23, 24 February 2017
When you display a GIF with PowerUI, it runs as a Sprite Animaton (SPA). So, both a GIF and an SPA can be controlled in the same way.
Getting hold of the SPA instance
If you're loading an SPA or GIF via src, keep in mind that they can be loaded over the internet so the best way to know when your animation is available is via the spritestart event.
To get to the GIF or SPA from any given element, the instance itself is always held within the background image displayable property:
// Get the background data:
var backgroundData=anElement.RenderData.BGImage;
// The original image package:
var imagePackage=backgroundData.Image;
// The contents are a specific type of image (GifFormat, SpaFormat):
// GifFormat gifContents=imagePackage.Contents as GifFormat;
// SpaFormat spaContents=imagePackage.Contents as SpaFormat;
// Either of the above hold the SPAInstance as 'Animation', if it has started playing:
// gifContents.Animation
// spaContents.Animation
// Otherwise, gifContents.GifFile and spaContents.SpaFile are the originating Gif/Spa.Events
| Name | Event object type | Purpose |
|---|---|---|
| spritestart | PowerUI.SpriteEvent | Occurs when an SPA or GIF goes on screen and has started playing. |
| spriteend | PowerUI.SpriteEvent | Occurs when an SPA or GIF goes off screen or when it is set to not loop and has finished. |
| spriteiteration | PowerUI.SpriteEvent | Occurs when an SPA or GIF loops. |
Here's an example:
// The element to add the event handlers to (typically an img, or whichever element has background-image on it):
var nyanCat=document.getElementById("nyan");
nyanCat.addEventListener("spritestart",delegate(SpriteEvent se){
Debug.Log("Sprite start!");
// Shortcut to stop it from looping (This will make it stop on the last frame, and spriteend is fired):
// se.loop=false;
});
nyanCat.addEventListener("spriteend",delegate(SpriteEvent se){
Debug.Log("Sprite end!");
});
nyanCat.addEventListener("spriteiteration",delegate(SpriteEvent se){
Debug.Log("Sprite looped!");
});