Implementing an Animation like DiceAnimation to playback png sequence in non randomized frame order

[LeonardSander]

I used DiceView/DiceAnimation to show a png sequence in gui. Everything works, but the displaying order of the frames is randomized. In Hindsight this might have been obvious for a dice animation, but this seems to be the easiest way to implement video without having to work with bare javaFX.

Please provide something like SequenceView/SequenceAnimation just like its Dice Counterpart, but with frames displayed in their correct order of the provided List to DiceView.

sequence with some code.zip I have included the bigger part of the sequence and the BGWBoardGameScene i was working on for reference. Nevermind the inefficient code.

[FantaMagier]

+1

[dominikmaeckel]

SequentialAnimation might be helpful to display frames sequentially. You may use several DelayAnimations with delay 1/25s for 25FPS sequentially. Bare in mind that this is very inefficient to display video and may cause freezes on lower-end hardware.

[LeonardSander]

Yes this option does work, although it creates a huge repetitive block of DelayAnimations in the SequentialAnimation, since i don't know how to properly loop this in the apply block. Also the Animation runs pretty laggy with only 15 fps configured (67 msec duration per DelayAnimation). While also being pretty inefficient, my implementation with the DiceAnimation runs much faster. it seems like fullspeed at 60 fps.

[dominikmaeckel]

As you can see in https://github.com/tudo-aqua/bgw/blob/main/bgw-gui/src/main/kotlin/tools/aqua/bgw/builder/AnimationBuilder.kt DiceAnimation and SequentialTransition both map to a JavaFX SequentialTransition and get built in the same way. What causes the laggy behaviour may either be large image files and/or loading many of them as you use one image only for one frame.

As I said, Animations are not designed to display video at all.

[LeonardSander]

it runs so slow because in the DelayAnimations that i use right now it removes the current TokenView, sets it to the next Image and adds the component again. I don't know how to implement it in a better way. The DiceAnimation runs fluently, because it loads the images at once first before displaying. Please add a copy of DiceView/DiceAnimation without the toSide parameter, that displays the images in sequence.

[dominikmaeckel]

Changing the visual is sufficient to update the image - the component does not have to be removed and re-added.

Using single images to implement video in a gif-style manor will not be natively supported by BGW. Therefore another animation for this purpose will not be added. Video may also be achieved by using css if this is an option.

[LeonardSander]

yeah thanks that was the hint i was missing to get the delayAnimation Method to run at full speed. but it would be better if the duration parameter passed to the Animation() class was Double instead of Int for accurate frametimes.