Developers Manual > Cocos Studio > Animation Editor > Animation Editor Workspace > Animation Editor KeyFrame

Animation Editor KeyFrame

Overview

The animation frame area displays information about all of the frames’ current animation.

Function

Frame Operation

Add Frame

  1. As shown in the right part of the picture above: right-click the mouse and hold down the button to add a keyframe, then a gray oval appears in the mouse’s position as a mark of the keyframe.
  2. You may also wish to add a keyframe by selecting the keyframe button on the left top part of the Animation Editor.

Delete Frame

As shown in the right part of the picture above: right-click the mouse and select the Delete Frame option to delete the keyframe currently selected.

Move Frame

To move the frame, left-click the mouse and select the keyframe’s gray oval mark. Use the mouse to reposition the frame to wherever you want.

Play Animation

  1. Play Animation: Left-click the mouse to play the selected animation.
  2. Stop Animation: Stops the animation.
  3. To add a keyframe: Select the position by left-clicking the mouse where you want to add a keyframe, then click it to add a keyframe.
  4. Looping Animation: Select the option to loop the playing animation.
  5. Frame playing interval: Sets the interval time, which controls the speed of the animation.
  6. Mouse’s position: Displays the mouse’s position to help the user accurately add a keyframe.

Play Animation

  1. Image Reference : The switch of image reference. Checked is on.
  2. Font frame : Setting the count of mirror image before selected frame. The colour of mirror image is red.
  3. back frame: Setting the count of mirror image after selected frame.The colour of mirror image is blue.
  4. Add Current Frame :Add the mirror image of current frame to the render panel . The colour of mirror image is green.

Content Menu

Option > *Description*
Add Frame> Adds a frame at the current position for all the selected layers..
Delete Frame=> Deletes all selected keyframes.
Hide Frame=> Hides all selected keyframes.
Display Frame> Displays all selected and hidden keyframes.
Hide tween Frame=> Hide the current frame interval between frames.
Display tween Frame> Displays the current frame interval between frames.
Copy Frame=> Copies all selected keyframes.
Paste Frame> Pastes all copied frames.
Select Frame=> Selects currently selected keyframe.
Cancel Selected> Cancels the keyframe currently selected.
Ease Setting===> Setting ease type of the current frame area .

4-2-8-img-01.png (32.9 kB) hanrea@qq.com, 2013-12-03 10:31

4-2-8-img-02.png (31.6 kB) hanrea@qq.com, 2013-12-03 10:31

4-2-8-img-03.png (69.4 kB) hanrea@qq.com, 2013-12-03 10:31

4-2-8-img-04.png (152.8 kB) hanrea@qq.com, 2013-12-03 10:31

Sign up for our newsletter to keep up with the latest developments, releases and updates for Cocos2d-x.