Adobe® Flex® 4 Language Reference
Hide Packages and Classes List |  Packages  |  Classes  |  Index  |  Appendixes
spark.effects.easing 
Sine 
Packagespark.effects.easing
Classpublic class Sine
InheritanceSine Inheritance EaseInOutBase Inheritance Object

Language Version: ActionScript 3.0
Product Version: Flex 4
Runtime Versions: Flash Player 10, AIR 1.5

The Sine class defines easing functionality using a Sine function. Easing consists of two phases: the acceleration, or ease in phase, followed by the deceleration, or ease out phase. Use the easeInFraction property to specify the percentage of an animation accelerating.

MXML SyntaxexpandedHide MXML Syntax

The <s:Sine> tag inherits all of the tag attributes of its of its superclass, and adds the following tag attributes:

  <s:Sine
    id="ID"
   />
  

View the examples



Public Properties
 PropertyDefined By
 Inheritedconstructor : Object
A reference to the class object or constructor function for a given object instance.
Object
 InheritedeaseInFraction : Number
The percentage of an animation that should be spent accelerating.
EaseInOutBase
 Inheritedprototype : Object
[static] A reference to the prototype object of a class or function object.
Object
Public Methods
 MethodDefined By
  
Sine(easeInFraction:Number = 0.5)
Constructor.
Sine
 Inherited
ease(fraction:Number):Number
Takes the fraction representing the elapsed duration of an animation (a value between 0.0 to 1.0) and returns a new elapsed value.
EaseInOutBase
 Inherited
Indicates whether an object has a specified property defined.
Object
 Inherited
Indicates whether an instance of the Object class is in the prototype chain of the object specified as the parameter.
Object
 Inherited
Indicates whether the specified property exists and is enumerable.
Object
 Inherited
Sets the availability of a dynamic property for loop operations.
Object
 Inherited
Returns the string representation of this object, formatted according to locale-specific conventions.
Object
 Inherited
Returns the string representation of the specified object.
Object
 Inherited
Returns the primitive value of the specified object.
Object
Protected Methods
 MethodDefined By
 Inherited
easeIn(fraction:Number):Number
Returns a value that represents the eased fraction during the ease in phase of the animation.
EaseInOutBase
 Inherited
Returns a value that represents the eased fraction during the ease out phase of the animation.
EaseInOutBase
Constructor Detail

Sine

()Constructor
public function Sine(easeInFraction:Number = 0.5)

Language Version: ActionScript 3.0
Product Version: Flex 4
Runtime Versions: Flash Player 10, AIR 1.5

Constructor.

Parameters
easeInFraction:Number (default = 0.5) — Sets the value of the easeInFraction property. The default value is EasingFraction.IN_OUT, which eases in for the first half of the time and eases out for the remainder.
SinePowerEffectExample.mxml
<?xml version="1.0"?>
<!-- Simple example to demonstrate the s:Sine and s:Power classes. -->
<s:Application
    xmlns:fx="http://ns.adobe.com/mxml/2009"
    xmlns:mx="library://ns.adobe.com/flex/mx"
    xmlns:s="library://ns.adobe.com/flex/spark">

    <fx:Declarations>
        <s:Sine id="sineEasing"
            easeInFraction="0.3"/>
        <s:Power id="powerEasing"
            exponent="4"/>
        <s:Move id="moveRight" 
            target="{myImage}"
            xBy="500"
            duration="2000"
            easer="{powerEasing}"/>
        <s:Move id="moveLeft" 
            target="{myImage}"
            xBy="-500"
            duration="2000"
            easer="{sineEasing}"/>
    </fx:Declarations>


    <s:Panel id="examplePanel"
        title="Sine and Power Effect Example"
        width="75%" height="75%">

        <!-- Directions -->
        <s:VGroup id="detailsBox" width="50%" top="5" left="5">
            <s:Label width="99%" color="blue"
                text="Click the buttons to watch the effect."/>
        </s:VGroup>

        <mx:Image id="myImage" top="20"
            source="@Embed(source='assets/logo.jpg')"/>
            
        <s:Button label="Move Right"
             bottom="10" left="5" 
            click="moveRight.end();moveRight.play();"/>
            
        <s:Button label="Move Left" 
            bottom="10" left="100" 
            click="moveLeft.end();moveLeft.play();"/>
    </s:Panel>
</s:Application>