You can then edit the custom ease using the standard bezier editing controls found in other property graphs in the Motion Editor.
To apply the custom ease to a property, you select the custom ease’s name from the Ease menu in the property you want to apply it to. The property graph updates with a dashed curve that displays the actual tweened values after the ease is applied, as it does for the preset eases you can apply using this Ease section of the Motion Editor. Keep reading to learn how to create custom eases.
There is an additional, and very useful, feature unique to custom ease graphs, as shown in the following exercise. Using this technique helps you ease between keyframes, which will be covered in the next blog post.
- Open this sample file, called custom-ease.fla.
- Select the tween span in the Timeline and open the Motion Editor. A tween with a custom ease has been applied already.
- Scroll down to the Eases section and find the Custom ease. Click the ease to expand the row size.
- Move the playhead to frame 40, which is where the keyframe is located on the X and Y properties.
- Click the Add Keyframe button to add a keyframe at that location.
- Drag the keyframe up and down at that location to see how it snaps to a percentage on the graph. This is where the keyframe value of the ease matches the keyframe on the X and Y properties.
- Choose Custom from the menu in the Ease column for both X and Y properties. Notice how the ease hits the keyframe at both of the spatial properties.
- Drag the handles that extend from this keyframe ,or the first and last ones, to modify the ease curve. The ease still hits the keyframes in the X and Y graphs (see the following image – click for fullsize).
9. Return to the Custom ease graph in the Eases section. Drag the keyframe at frame 40 up or down, while watching what happens in the X and Y property graphs and on the Stage (see the following image – click for fullsize).
- Drag the keyframe until it snaps again. Now the animation hits the spatial properties again. Test the animation to see how it looks.
Using this feature helps you create a custom curve that you can use to ease between keyframes. For more information on easing between keyframes, read the next blog post.