[ALOY-494] ImageView doesn't support animated images

GitHub Issue	n/a
Type	Bug
Priority	High
Status	Closed
Resolution	Invalid
Resolution Date	2013-02-09T01:26:56.000+0000
Affected Version/s	n/a
Fix Version/s	2013 Sprint 03
Components	n/a
Labels	n/a
Reporter	Tim Poulsen
Assignee	Tony Lukasavage
Created	2013-01-30T17:22:27.000+0000
Updated	2014-06-22T13:21:06.000+0000

Description

The tag/style/controller doesn't support setting the images property of an imageview to an array of image files to create a flipbook animation. Adapting the example from the old kitchen sink: View (index.xml)

<Alloy>
	<Window class="container">
		<ImageView id='animImage'/>
	</Window>
</Alloy>

TSS

".container": {
	backgroundColor:"white"
},
"#animImage": {
	width: 300,
	height: 300,
}

Controller (index.js)

var imageArray = [];
for(var i=1; i<18; i++) {
	imageArray.push('campFire'+i+'.gif');
}
$.animImage.images = imageArray;
//$.animImage.image = 'campFire1.gif'; // uncomment & static image visible

$.index.open();

I grabbed the images from KitchenSink/Resources/images/campFire*.gif. I renamed all the 01, 02, etc. images to campFire1.gif, etc. so my loop could be simpler.

Comments

Bart Seaman 2013-02-08

The code provided is missing the function call to play the animation. Add the following line to the end of your controller: $.animImage.start()

JSON Source