Animation editor

We have pushed a new update to MightyEditor. Beside minor bugfixes the most important feature is keyframes based animation editor. From now on you can switch from spritesheet animations and create much more smoother tween animations. Reduce file size and add more skins to character. Add animated user interface.

There are 2 different timelines: one big – for project in general, second one seperate for objects. If you want to create the game – you won’t need main timeline as it meant more for a movie clip creation.

Check out a tutorial how this works: http://mightyfingers.com/tutorials/animation-editor/animation-basics/

character_body_parts_animation_editor

Adding movie through code editor:

var character = mt.create("character");
mt.createTweens(character);
character.mt.movies.run.start() // assuming you have animation named "run"

In this case movie.run is special TweenCollection instance – bascially array of tweens that starts playing at the same time
atm. TweenCollection has only start / stop / pause / resume methods.

Recently Phaser had update to 2.2 where tweens have been improved very much and has built-in support for timeline. We are going to have new version of phaser in next update. Currently editor uses 2.07 version and projects can use any 2.0 – 2.1 version – by default projects have same version as the editor.

Another changes:

  • All new projects will start with a demo state ( js/state/demo.js )
  • Added rotation and “move anchor” (actually it moves group while keeps children in a place) gizmos for a group object
  • Now it’s possible to add children to the sprites in the objects panel
  • Added grid opactiy option
  • Added keyboard shortcuts 1-5 for tools: 1 – select tool, 2 stamp tool.. etc
  • Added cmd + S – as “save file” in source editor for osX users

Changes in mt.helper API:
mt.create will now return phaser object – sprite / group / tilemap layer – depends what you have created in the map editor
now all mighty editor data will be assigned to the created sprite as mt property. e.g.

var character = mt.create("character");
character.mt // from now on all editor data will be here

mt object structure:
{
   self: // refernece to the Phaser object
   data: // data used to create the Phaser object
   children: // cildren objects tree
   movies: // movies created
}

mighty_game_editor_background

8 comments on “Animation editor

  1. hi,

    var character = mt.create(“character”);
    mt.createTweens(character); // this function will create all tweens assigned to the object
    character.mt.movies.run.start() // assuming you have animation named “run”

  2. ManuelaDuke35Several years ago I did not hear words such as seo submission! Guys ivenetnd not long time ago! But, such stuff became quite popular. I guess that can be worth to try submission issues.

  3. I haven't got to this one yet. Like you I'm bad about putting sequels off for some reason. I still haven't read this or Crossed and I bought them as soon as they came out. Anyway happy to hear you liked it! Maybe I'll get to it soon. :)

  4. 我想做一个类似网址的动画 如果做到一个动画停止到最后一帧,而不是动画播放完了后就回到第一帧了
    看了好多例子都是循环播放,我尝试了播放一次,但是播放完以后就回到初始位置了,如何解决这个问题

Leave a Reply

Your email address will not be published. Required fields are marked *