Timeline animation in JavaFX - animation

I've been trying to add an animation to my bubble chart in my UI but have ran into some issues. I'm trying to increase the size of the bubble at different stages to show a gradual change but its just drawing it at its full size instead of at every stage.
Here's the timeline code
tl.getKeyFrames().add(
new KeyFrame(Duration.seconds(30),
new EventHandler<ActionEvent>() {
#Override public void handle(ActionEvent actionEvent) {
//for (XYChart.Series<Number, Number> series : liveDemoBubbleChart.getData()) {
for(int i = 10; i>0; i--) {
series1.getData().add(new XYChart.Data(5,5, ProjectProperties.getInstance().getSportsTweetsCount()/i));
}
The sport tweet count is the final value for the bubble and I'm dividing it by different amounts to show the build up to the final value.
Does anyone have any ideas as to why this isn't working as I expect?

The KeyFrame taking a Duration and an EventHandler<ActionEvent> simply executes the EventHandler's handle(...) method after the time specified by the Duration. So your code causes the entire for loop to be executed after a pause of 30 seconds.
You probably want to supply a KeyValue instead, providing a property to be set and the target value after 30 seconds. The value will then be interpolated at times in between. Have a look at the tutorial to see if it helps.

Related

Text typing effect in C# based on current FPS and characters per second?

I am working on a typing effect for TextMeshPro texts in Unity that should take into account both the current FPS and the user input 'characters per second' (to determine the speed).
The implementation runs in an IEnumerator and displays one or more characters of a given text at a time. After displaying the char(s), there is a 'yield return new WaitForSeconds()' before the next round of revealing begins. (It should be possible to display more than one char at a time, because WaitForSeconds() takes too much time in some cases, even if I enter very small numbers. So rather than waiting after every single char, it should be waited after a precomputed number of chars to maintain the specified typing speed.)
I'm not sure if my approach works as intended in the different possible scenarios and additionally, I'm not happy with the computations within the IEnumerator because I think it could slow down the revealing process.
I tested the typing effect with different FPS in PlayMode (by setting the FPS with "Application.targetFrameRate" manually) and noticed that with FPS lower than 30 the text is revealed very haltingly and thus the viewer gets frustrated because it looks laggy. Maybe someone has experience with this and can suggest an easier way of implementation?
// Precompute the time for displaying a single character by a given number of characters per second:
public void GetTimePerChar() {
if (_charsPerSecond > 0) {
TimePerChar = 1f / _charsPerSecond;
} else {
TimePerChar = 0f;
}
// Coroutine that reveals characters of a given text over time:
private IEnumerator DisplayText() {
/* some other code */
while (TmpText.maxVisibleCharacters < TotalCharCount) { // Reveal characters until the the total amount of chars is reached
if (CharsPerSecond > 0) {
TimePerFrame = Time.deltaTime; // How much time does 1 frame take
if (TimePerChar > 0) {
CharsPerFrame = TimePerFrame / TimePerChar; // How many chars can be displayed within a single frame
} else {
CharsPerFrame = 0f;
}
CharsPerRound = (int)Math.Ceiling(CharsPerFrame); // Rounded up number of chars (as fractions doesn't make sense to display)
TimePerRound = TimePerChar * CharsPerRound; // The individual waiting time before the next char(s) get revealed
TmpText.maxVisibleCharacters += CharsPerRound; // Reveal one or more characters at a time
if (CharsPerRound - CharsPerFrame > 0) { // If the number of chars got rounded up wait afterwards as long as it shall take to display them
yield return new WaitForSeconds(TimePerRound);
}
} else {
TmpText.maxVisibleCharacters = TotalCharCount; // With zero CharsPerSecond, display the whole text at once
}
}
/* some other code */
}

Timer Efficiency

I'm working on an AS3 project and for one of the effects I use timers to switch the colors then stop. The function is below.
//global variable
private var valueAnimationTimer:Timer = new Timer(50);
//constructor
valueAnimationTimer.addEventListener(TimerEvent.TIMER, scrollUp );
//function
private function scrollUp(e:TimerEvent):void
{
var i:int = e.currentTarget.currentCount as int;
if (i < 10)
{
if (colored){
if (i % 2 == 0){
ChangeColor(ico, flickerColor);
}
else{
ico.transform.colorTransform = new ColorTransform();
}
}
tfValue.y -= 7.5;
}
else
{
RemoveFilters(ico);
tfValue.y = ico.height / 2;
e.currentTarget.reset();
RemoveSprite(tfValue);
colored = false;
}
}
Each character (object) has it's own version of this function and it happens at different times (like when it is injured or poisoned). The listener is added once in the constructor, it is only removed when the character dies and is removed from the stage. The issue here is after the timer is used on at least 3 characters, the frame rate begins to drop. Every time the function is called, the frame rate drops lower and lower.
What I don't understand is, if the timer is stopped, and the listeners are only added once so it doesn't overload the stack, then why does the frame rate begin to decline after the listener is actually used? It doesn't run forever only for a small amount of time, but it happens again and again. When the frame rate drops the entire program begins to lag badly and eventually freezes. I have no idea what is causing this
Also be aware that inside of the Timer function, the first number is your count in MILLISECONDS and the second is repeat count
var fl_TimerInstance:Timer = new Timer(240000, 1);
So this example above is a 4 minute timer that repeats 1 time
I bring this up because yours is set for 50 milliseconds which is very quick lol

XNA game : calculate time between two shoots

I'm trying to make a game with the XNA library. I want a sprite to throw a fireball to hit falling asteroids. But I have a problem with pressing the concrete key: I want to throw fireballs, for example, with one second between throws.
I want to measure the time difference between creating instances. How can I do that?
UYou can use the ElapsedGameTime property of the gameTime variable passed to the Update method like this:
const float shootTimer = 1.0f;
float elapsedTime = 0f;
protected override void Update(GameTime gameTime)
{
// Allows the game to exit
if (GamePad.GetState(PlayerIndex.One).Buttons.Back == ButtonState.Pressed)
this.Exit();
elapsedTime += gameTime.ElapsedGameTime.TotalSeconds;
if(elapsedTime >= shootTimer && /* Your logic to see if you should shoot a fireball */ )
{
// Shoot the fireball!
elapsedTime = 0f;
}
base.Update(gameTime);
}
Basically, what you are doing in the above code is setting a minimum value (seconds) that need to pass between each shot.
Then you create a variable that will store the amount of time that has passed between each shot.
In the Update method, you add the time between each Update call and then check if it is bigger than the timer, and if it is, then you shoot and reset the elapsed time.
Note: I wrote that piece of code out of the top of my mind so it may have some minor issue.
Each call to Update of your main Game class or any GameComponent receives an instance of GameTime as an argument. Its property ElapsedGameTime can be used to accumulate the passage of time.

StateTime in LibGDX Animation

How do I use implemented Animation in LibGDX? I know, that the documentation can be found here, but when I want to get a frame out of the Animation, I need to use stateTime, which isn't explained anywhere in the documentation. So the question is, what is stateTime in terms of LibGDX's Animation?
There is some more doc on the getKeyFrame method documentation:
Returns a TextureRegion based on the so called state time. This is the amount of seconds an object has spent in the state this Animation instance represents, e.g. running, jumping and so on.
(This documentation doesn't really make any sense to me either.)
But, the Animation.java source is readable. It looks like it boils down to
getKeyFrameIndex
which divides the stateTime by frameDuration (which is a parameter of the constructor -- how long each frame lasts) to compute an array index. getKeyFrameIndex does different things for looping or non-looping sequences, but basically it takes the array index to look up the right key frame in the sequence to display.
So the "stateTime" is the input to pick a key frame from your Animation. The documentation is assuming you have one Animation instance for "running" and another for "jumping" (these are the "states" its referring to). To find the right key frame within an Animation, you tell it how long you've been in this "state". So, if you've been in the "running" Animation instance for 1.2 seconds, it does some math to figure out which key frame to show (say you've initialized the instance with 30 frames that show for 0.0333 seconds and loop -- it picks the 6th frame).
The wiki https://github.com/libgdx/libgdx/wiki/2D-Animation has some more details and an example, but doesn't address this directly, either.
animationFrames = walkSheetArray[moveDirection];
animation = new Animation(1f / 5f, animationFrames);
myAnimatedActor = new AnimatedActor(animation);
stage.addActor(myAnimatedActor);
public class AnimatedActor extends Image {
private float stateTime = 0;
Animation animation;
public AnimatedActor(Animation animation) {
super(animation.getKeyFrame(0));
this.animation = animation;
}
#Override
public void act(float delta) {
((TextureRegionDrawable) getDrawable()).setRegion(animation.getKeyFrame(stateTime += delta, true));
super.act(delta);
}
}

JavaFX: pause transition, not equal times

I have written a small application that performs some long-running tasks. Instead of having the user to wait and seeing just a progress bar, I would like to display some (changing) information about the application.
For that purpose, I wrote the following code within the constructor of an extended Pane:
FadeTransition fadeOutTransition = new FadeTransition(Duration.millis(1000), this);
fadeOutTransition.setFromValue(0.8);
fadeOutTransition.setToValue(0.0);
Similarly the fadeInTransition. And further...
SequentialTransition seqTransition = new SequentialTransition (
new Transition() {
{ setInterpolator(Interpolator.DISCRETE);
setCycleDuration(Duration.seconds(1)); }
protected void interpolate(double frac) {
int nextElement = (int) ((explenations.size() - 1) * Math.random());
Explenation explenation = explenations.get(nextElement);
questionLabel.setText(explenation.getQuestion());
answerLabel.setText(explenation.getAnswer());
}
},
fadeInTransition,
new PauseTransition(Duration.seconds(15)),
fadeOutTransition
);
What I woud like is the text to fade in, stay there for ~15 seconds and then fade out again. Unfortunately, the animation flickers, moves faster and slower - and the PauseTransition never takes 15 seconds! What is wrong about the code? I'm using Java 7, and JavaFX 2.2 on Mac OS X.
The problem seems to be that I called the function
seqTransition.play();
multiple times. From there comes probably the flickering and the unequal waiting time.

Resources