diff --git a/Documentation/6. Working with Animations.md b/Documentation/6. Working with Animations.md index 7f9acc3cc..f6886c9c7 100644 --- a/Documentation/6. Working with Animations.md +++ b/Documentation/6. Working with Animations.md @@ -4,7 +4,7 @@ You can use CocosBuilder for creating character animations, animating complete s ## The Basics In the bottom of the main window you can find the timeline. You use the timeline to create your animations. -![image](6-1.png) +![image](6-1.png?raw=true) By default your ccb-file has a single timeline that is 10 seconds long. CocosBuilder edits animations at a frame rate of 30 frames per second, but when you play back the animation in your app it will use whatever you have set cocos2d to use (the default in cocos2d is 60 fps). The current time is displayed in the top right corner, and has the format minute:second:frame. The blue vertical line also shows the current time. Click the time display to change the duration of the current timeline. @@ -28,7 +28,7 @@ If you have an animation created by sprite frames it can be tedious to move each ### Applying Easing CocosBuilder offers a carefully selected subset of the easings provided by cocos2d. To apply an easing right click between two keyframes and select the type of easing that you want to apply. -![image](6-2.png) +![image](6-2.png?raw=true) Some of the easings have additional options, after the easing has been applied you can right click again and select *Easing Setting…* from the popup menu. @@ -37,18 +37,18 @@ A very powerful feature of CocosBuilder's animation editor is the ability to hav To select, add or edit your timelines use the timeline popup menu: -![image](6-3.png) +![image](6-3.png?raw=true) In the edit timelines dialog you can get an overview of your timelines, rename them, add new ones and (optionally) set one of the timelines to automatically start playback directly when the ccbi-file is loaded by your app. -![image](6-4.png) +![image](6-4.png?raw=true) Properties in timelines that do not have keyframes set share their values across timelines. E.g. if you move one node in one timeline it will be moved in all timelines as long as they do not have a keyframe set for the position property. I can sometimes be useful to add a single keyframe to a property just to override the shared value for a specific timeline. ### Chaining Timelines You can automatically play back a sequence of timelines by chaining them. You can also use this feature for automatically looping a timeline. -![image](6-5.png) +![image](6-5.png?raw=true) To have a timeline play in sequence, click the *No chained timeline* text and select the timeline you want to play right after the current one. @@ -66,4 +66,4 @@ Optionally, you can use a tween duration to smoothly transition to the new timel [animationManager runAnimationsForSequenceNamed:@"My Timeline" tweenDuration:0.5f]; -It is also possible to receive a callback whenever a timeline has finished playing. You will receive these callbacks even if another timeline is chained in sequence. Use the CCBAnimationManagerDelegate to receive the callbacks. \ No newline at end of file +It is also possible to receive a callback whenever a timeline has finished playing. You will receive these callbacks even if another timeline is chained in sequence. Use the CCBAnimationManagerDelegate to receive the callbacks.