Development/Tutorials/Plasma4/JavaScript/API-Animations: Difference between revisions
(Created page with '== Animations == = Creating Animation Objects = An Animation object can be retrieved by calling the ''Animation'' '''animation(string type)''' function. The ''string'' correspon...') |
m (D ed moved page Development/Tutorials/Plasma/JavaScript/API-Animations to Development/Tutorials/Plasma4/JavaScript/API-Animations) |
(No difference)
|
Latest revision as of 23:27, 11 September 2014
Animations
Creating Animation Objects
An Animation object can be retrieved by calling the Animation animation(string type) function. The string corresponds to the type of animation, which are listed below.
New Animation objects are associated with (and therefore will animate) the Plasmoid by default. By setting the widgetToAnimate property, however, it can be assigned to animate any QGraphicsWidget desired (e.g. Plasma widgets such as push buttons, sliders, etc) .
Enumerations
All Animation objects have the following enumerations:
MovementDirection
- MoveUp
- MoveUpRight
- MoveRight
- MoveDownRight
- MoveDown
- MoveDownLeft
- MoveLeft
- MoveUpLeft
Reference
The reference point, relative to the target widget, for the animation.
- Center
- Up
- Down
- Left
- Right
State
- Paused
- Running
- Stopped
Common API
With the exception of Pause and Property animations, all animations support the following read/write properties:
- AnimationDirection direction: the direction the animation should play: AnimationForward or AnimationBackward
- int duration: length of the animation in ms.
- EasingCurveType easingCurveType: The easing curve to use in the animation
- QGraphicsWidget targetWidget: the QGraphicsWidget (e.g. a Plasma::Widget) that this animation should operate on
Animation Groups
Animations may be put into groups for convenient sequential or parallel running. Sequential groups, where the animations run one after the other, are handled by the AnimationGroup class. Parallel aniations, where the animations run simultaneously, are handled the ParallelAnimationGroup class.
Animations are added to a group by calling add(Animation) on the group object. Groups may also be added to other groups.
Custom Animations
Custom animation types can be defined using Javascript files that are included as part of the Plasmoid's package in the contents/animations/ directory. To learn how to create such animations and access them from your Plasmoid, visit the Javascript Animations tutorial.
Standard Animation Types
Below is a list of all current standard animation types and their particular read/write properties:
Fade
- number startOpacity: the opacity, between 0 and 1, that the target widget starts at when the animation begins
- number targetOpacity: the opacity, between 0 and 1, that the target widget will be at the end of the animation
Geometry
- QRectF startGeometry: the geometry that the target widget should start with
- QRectF targetGeometry: the geometry the target widget will have at the end of the animation
Grow
- number factor: the factor by which the target widget will grow to by the end of the animation
Pause
- number duration: the number of milliseconds to pause for
Property
Animates an object (must be a QObject internally, which includes all Plasma Widgets) by manipulating one of its properties. Property animations have the following read/write properties:
- any startValue
- any endValue
- ByteArray propertyName
- QObject targetObject
- number duration
- EasingCurve easingCurve
Pulser
- number targetScale: the maximum scale of the pulse-shadow item, relative to the target widget
Rotate
- QtAxis axis: the axis along which to rotate the item
- Reference reference: the reference point around which to rotate the target widget
- number angle: the number of degrees to rotate the item
RotateStacked
- MovementDirection movementDirection: the direction to rotate the widgets in the stack around
- QGraphicsLayoutItem layout
- Reference reference: the reference point around which to rotate the target widget
- QGraphicsWidget backingWidget: the widget in the "back" to rotate to the front of the target widget
Slide
- MovementDirection movementDirection: the direction to slide the widget
- number distance: the distance to slide the widget
Zoom
- number zoom: the factor by which to zoom the target widget
QEasingCurve
Used to set the progress shape of Animation objects, this class has the following read-only properties:
- string toString
- number valueForProgress(number progress): returns effective progress for the easing curve at progress. While progress must be between 0 and 1, the returned effective progress can be outside those bounds.
as well as the following read/write property:
- EasingCurveType type: the shape of this easing curve
and the following enumeration:
- EasingCurveType
- Linear
- InQuad
- OutQuad
- InOutQuad
- OutInQuad
- InCubic
- OutCubic
- InOutCubic
- OutInCubic
- InQuart
- OutQuart
- InOutQuart
- OutInQuart
- InQuint
- OutQuint
- InOutQuint
- OutInQuint
- InSize
- OutSine
- InOutSine
- OutInSine
- InExpo
- OutExpo
- InOutExpo
- OutInExpo
- InCirc
- OutCirc
- InOutCirc
- InOutCirc
- OutInCirc
- InElastic
- OutElastic
- InOutElastic
- OutInElastic
- InBack
- OutBack
- InOutBack
- OutInBack
- InBounc
- OutBounce
- InOutBounce
- OutInBounce
- InCurve
- OutCurve
- SineCurve
- CosineCurve