I was trying to achieve an effect that you could see a lot in oldschool demos. Usually it looked like a waving
flag made up of many tiny squares(sprites?). Other times it could be a big text scroller made up of tiny sprites.
I saw a similar effect in the Ad Astra demo recently, but that code was way beyond me.
i'm still very much a beginner so i'm unsure of how to go about creating an effect like that.
If anyone could push me in the right direction i would be super grateful. Any help would be appreciated!
Something like this ?
For this one I've first constructed the flat flag.
Then i picked each pixel of this flag and put it in the bottom flag with a sinus function to make the wave.
The movement is due to a T variable which is incremented each frame.
Sorry for the late reply!
This is indeed exactly what i was going for, thank you very much!
I will be going through the code to get a grasp on the sine function as i'm not very experienced with applying sine formulas etc. to programming.
Also, would it be possible to use the same approach to get sprites (like bubbles etc.) to move together in the same way?
No problem
Here is an example where you could use sin function to make bubbles moving
In the init function I create an array which will contains all the bubbles.
Each bubble has a sprite ID, a X and Y coordinate and a SIN_Y value.
In the update function, the SIN_Y and X values are updated. X increases constantly to create a left to right translation of the bubble. It also depends of the sprite ID to make the bigger bubbles going faster. The "%", modulo function allow to make the bubble reappearing to the left once it reach the right of the screen.
The SIN_Y does a loop between 0 and 1 (a complete loop from 0 to 1 of this variable will result in a complete sinus wave of the sprite).
In the draw function, the sprite is drawn using each bubble sprite and coordinates.
It is here that the sinus function is used.
To have higher waves it is necessary to multiply the sinus function by something as the function only goes from -1 to 1, it would be very small waves without this.
To make the demo more clear, I've set constant values for the bubble characteristics (all the bubble behave the same, so it seems only one bubble is displayed on screen).
If you change the constants by the commented randomly generated values you will have something more "demoscene" like.
Really thankful for these explanations, they have helped me a ton.
For the longest time i felt i've plateaued because i simply could not wrap my head around these concepts. I'll be playing around with this until i get comfortable with these functions.
Again, thanks a lot!
I ran out of time to get the explanation made, and this animates an array of pixels, not sprites (but the same process can be applied). I will probably add more to this demo and write some real documentation if you are interested. Since Pico-8 gives us Lua to work with, there are several ways to do the sine wave thing, or any animation really, and i wanted to demonstrate some of those techniques here which i think might be helpful in understanding.
the main thing to know about sin and cos, is that they describe a circle if you increase the angle from 0 to 1 in the sin function. when you move the x coordinate left to right increasing by time (every frame update) and you move the y coordinate by the value returned from the sin function as the angle goes from 0-1 you get the characteristic sine wave pattern. try uncommenting the cls() call in the _draw() function and you'll see the shape
I've been tinkering with the code you provided above and with everything explained to me in this thread so far, i really feel that i'm finally beginning to grasp this concept, really happy about the progress so far.
If you ever feel like you have time to come up with any kind of documentation at all, know that i would be super grateful for the slightest bit of information!
Thanks a lot!
[Please log in to post a comment]
