Morning everyone,
How are we all doing? It has been quite a long time since I have used AppGameKit, or even posted in these forums, so excuse the brain for being a little fuzzy.
I am in the process of creating a star rating system (if someone has already accomplished this, please share, I would love to see it), ultimately it will be displayed at the end of a level and the star rating will be awarded based on either the number of points obtained or the number of items that have been collected throughout the level, (I haven't decided yet). Here is a brief overview of how this system will work in terms of animation.
1. A score will be updated on the screen UI, (currently this UI does not exist, so we can ignore this for now).
2. As the score is increased, at certain values, a star will be awarded up to a maximum of 3 stars - (e.g to keep it simple - 100 = 1 star, 200 = 2 star, 300 = 3 star). Again, this does not exist yet, so we can ignore this.
3. Each star will animate as it is being displayed. - This is what we have currently, I will explain the issue in further detail below:
Okay, so now we know what I want to do, here is what I have so far, bearing in mind that this is bare-bones code, literally, the only thing that exists in the program at this point, the logic for the score/points/etc.. will be added at a later time, for now, functionality is key. It may not be the most efficient way of achieving this, it may have other bugs that I haven't come across yet, if so, I am open to optimisations and constructive criticism, so feel free to rip it apart if that is the case.
So, firstly I create an array to store the star objects and then we load the relevant images, create the sprites, set their on-screen position, etc, etc. Next, we create and set up the tweening animations. This all seems to work fine as you can see in the below screenshot:
Problem:
The problem is, I want the tween animation to happen on each star as it is displayed, and not on them all, as a whole, at the end. I had thought about just creating a 1-star object, and putting inside of a function that will first render it and then call the tween animation, and have it take a position argument so that I could call it multiple times and get the desired effect, I am not sure if this would be the most efficient solution though?
I think the problem I am facing is mainly because we don't call
UpdateAllTweens() until the main program loop and so the animation will never run until the function exits. I am aware of this so you can ignore that code being in the wrong place, I had to move it for taking the animated gif screenshot, so you guys could see it in action.
I had moved
UpdateAllTweens() and put it inside the
AwardStars() function. Firstly, it didn't have any effect and the animation didn't work at all. Then I had the sudden realisation, it needs
Sync()! So, I added a
Sync() call as well, but this also had no effect whatsoever, so I thought, hmmm I wonder if it needs a
while loop or a
repeat until, the
repeat until kinda worked, but made the program very stuttery and buggy, the positions were all off, and well, it was just a hot mess! Admittedly, I haven't tried the while loop, so perhaps I should!
Solution:
For a solution, apart from the above-tried things, I don't currently have one, that is where all you lovely people come into it. Please see the code below of what exists so far.
NOTES: As mentioned above, the code is hacky and could contain other bugs, the
UpdateAllTweens() is currently in the wrong place in the code.
Code so far:
// Project:
// Created:
// show all errors
SetErrorMode(2)
// set window properties
SetWindowTitle( "Some Catchy Title Here" )
SetWindowSize( 1024, 768, 0 )
SetWindowAllowResize( 1 ) // allow the user to resize the window
// set display properties
SetVirtualResolution( 1024, 768 ) // doesn't have to match the window
SetOrientationAllowed( 1, 1, 1, 1 ) // allow both portrait and landscape on mobile devices
SetSyncRate( 30, 0 ) // 30fps instead of 60 to save battery
SetScissor( 0,0,0,0 ) // use the maximum available screen space, no black borders
UseNewDefaultFonts( 1 )
AwardStars() // <-- Due to sprite creation this cannot go inside the loop, perhaps I will need to create a separate function to create the sprites and load the images then just handle the rendering here?
do
Print( ScreenFPS() )
// Update tweens
UpdateAllTweens( GetFrameTime() ) // <-- This is in the wrong place, where does it go?
Sync()
loop
// Creates a delay
function Delay(seconds as float)
ResetTimer()
repeat
Sync()
until Timer() >= seconds
endfunction
// Award the star rating (in progress)
function AwardStars()
// create an array of star sprites
star_image as integer
stars as integer[ 3 ]
star_image = LoadImage( "objects/star.png" )
xPos = 450
yPos = 100
// Create a simple y translation tween with bounce easing over 2 seconds. Time includes easing!
tweenstar = CreateTweenSprite( 2 )
SetTweenSpriteY( tweenstar, 100, 150, TweenBounce())
for i = 1 to 3
stars [ i ] = CreateSprite ( star_image )
SetSpriteSize( stars [ i ], -1, 32 )
SetSpritePosition ( stars [ i ], xPos, yPos )
// Set the tween to start playing on the sprite Delay the start by half a second
PlayTweenSprite( tweenstar, stars [ i ], 0.5 )
Delay(0.6)
xPos = xPos + 64
next i
endfunction
Thanks in advance
GunnerJnr