How to animate sprite in script

I need to change sprite frames of an image in javascript function. Sprites are animated by changing background image position, which is simple, effective and elegant solution. But how to do it in javascript?

Reading some support questions I found the solution should be using setProperty() method, like this:

doc.getElement('image1').setProperty('backgroundPositionX', 150);

However in Saola Animate 3 it just doesn’t work.

I found a file “Extended Saola Animate APIs.txt” which covers undocumented API. But there is no such property as “backgroundPositionX” in this file. So does “backgroundPositionX” exist? Is there any other way to change background image position in script?

Hi Martin,

doc.getElement('image1').setProperty('backgroundPositionX', 150) should work.
You can also set multiple properties at once, e.g.:

element.setProperty({
  backgroundPositionX: 10,
  backgroundPositionY: 20
})

Please see this sample:
sprite scripting.saolapack (52.8 KB)

Regards

Ah, you’re right, it works now.
The problem was I typed “BackgroundPositionX” instead of “backgroundPositionX”.

Also, I found a really ugly hack, which works also:

doc.getElement('image1').dom.firstChild.style.backgroundPosition = "-50px 0px";

Could you please include “backgroundPositionX” and “backgroundPositionY” in the file “Extended Saola Animate APIs.txt”? It would be really useful to have a complete list of properties. Right now it is not in the list nor in the API and the only way to learn how to animate sprites through script is to search the forum.

The most important thing is that it works and it is a powerful feature indeed!

1 Like