Skip to main content

Reverse animation

6 replies [Last post]
hrgdavor
Offline
Joined: 2004-08-02
Points: 0

I've seen support for reversing animation
http://blogs.sun.com/chrisoliver/entry/key_frame_animation
Motomaxxve

I'm using javafx preview SDK, but can not use method: reverseNow

is the blog example ahead of current script syntax, or was the reverseNow method
removed ?

any how, I can not get an animation to reverse direction on demand.

Ma main reason was to make button animation smooth:
for example a alpha 05. button on mouse over to get to alpha 1.0
- mouseover start animation
- mouseout play animation backward
- if mouseout happens in the middle of the mouse over animation (alpha 0.75)
I don't want the animation jump to aplha 1.0 and then play back to 0.5

any hints on this ?

Reply viewing options

Select your preferred way to display the comments and click "Save settings" to activate your changes.
michael_heinrichs
Offline
Joined: 2007-11-15
Points: 0

The blog post is pretty old and refers to an old implementation of the animation framework.

I haven't tried it myself, but maybe setting Timeline.toggle to true and calling start() again does what you want?

hrgdavor
Offline
Joined: 2004-08-02
Points: 0

I've tried few options but none work,
this seems like a basic feature for and it worked before...

I've tried
calling start()

or
calling stop() and then start();

or
calling stop(), set toggle=true, and then start();

none of it works :(

michael_heinrichs
Offline
Joined: 2007-11-15
Points: 0

Can you please provide the code, that is causing the problem?

hrgdavor
Offline
Joined: 2004-08-02
Points: 0

The code is just a sth I played with after pasting the example from javafx blog

[code]
package javafxapp1;

import javafx.scene.*;
import javafx.scene.paint.*;
import javafx.scene.geometry.*;
import javafx.application.*;
import javafx.scene.transform.*;
import javafx.input.*;
import javafx.animation.*;
import java.lang.System;

var angleStart = -360;
var angle = angleStart;
var count = 0;

Frame {
windowStyle: WindowStyle.TRANSPARENT visible: true
width: 500 height: 500
stage: Stage {
fill: null
content: [
Group {
translateX: 100 translateY: 100
content: for(i in [0..10]) {
// here is the magic with binding
Rectangle {
fill: Color.rgb(25*i,0,0, i/10.0)
width: 100 height: 100 arcHeight: 10 arcWidth: 10
stroke: Color.BLACK strokeWidth: 5
transform: bind [
Transform.rotate(-i*36+angle/2,50,50),
Transform.translate(angle/4,0),
]
}
}
onMouseClicked: function(e:MouseEvent):Void{
System.exit(1);
}
},
Group{
translateX: 400
content: [
Circle{
fill: Color.rgb(30,30,255, 0.5)
radius: 10
translateX: 10 translateY:10
},
Rectangle {
fill: Color.rgb(30,30,255, 0.5)
width: 4 height:10
x:5 y:5
},
Rectangle {
fill: Color.rgb(30,30,255, 0.5)
width: 4 height:10
x:11 y:5
}
]
transform: Rotate{angle: bind angle*-1 x:10 y:10}
onMouseClicked: function(e:MouseEvent):Void{
anim.toggle = true;
anim.start();
}

}
]
}
}

var anim = Timeline { keyFrames: [
KeyFrame { time: 0s values: angle => angleStart tween Interpolator.EASEBOTH },
KeyFrame { time: 4s values: angle => 360 tween Interpolator.EASEBOTH },
]
repeatCount: Timeline.INDEFINITE
};

anim.start();
[/code]

michael_heinrichs
Offline
Joined: 2007-11-15
Points: 0

Looks like you run in one of the open issues with Timeline: http://openjfx.java.sun.com/jira/browse/JFXC-1387

If you set repeatCount to something else than INDEFINITE, the demo works.

hrgdavor
Offline
Joined: 2004-08-02
Points: 0

ok,
thank you, it works now,

I was actually looking to make an animated button,
where repeatCount would most likely be sth other than
indefinite ...

anyhow, thank you for the link to the JIRA for the project,
I was having trouble finding it... there is another problem
I need to see if it is already reported...