19 Jul 2013 4:08 AM #1
I just downloaded the demo of Sencha Animator and tried to post to the forum but was unable to do so. I need to know if I can name a symbol so that the code it exports to html/css/js uses an id or class that makes sense rather than assigning a random number as the style name. That's really the only feature I cannot seem to find and do need. Thanks!
23 Jul 2013 5:17 AM #2
You can give a name to a symbol by double-clicking it's name in the Library->Symbols, however this will not let you access the symbol, but it's meant to help you keep your library organized.
To manipulate a symbol instance (or any other object), select a symbol (or object) that you placed on the canvas and give it an id under Properties->Base Object->Id. Using AN.Controller.getElementById you can access this instance and change its properties. (also see documentation on the API: http://docs.sencha.com/animator/1.5/.../AN.Controller)
However, to do things such as switch or restart the timeline inside the symbol, you need to access the symbol instance internally. To do this, you should use AN.Controller.getSymbolByInstanceId . When editing the code inside Architect, autocomplete within editor will list all symbol instances placed on your canvas so you can select the instance easily. Changing the internal symbol instance ids is not possible for consistency reasons, every id is uniquely generated, but you could create your own reference to the symbol you need to use to access it easier outside Animator. Something like this (it should be executed once the animation is initialized, e.g. Properties->Timeline->Actions->Start):
//ids will be listed with autocomplete var mySymbolInstance = controller.getSymbolByInstanceId('62KhW7cw');