tweening movement

Previous topic - Next topic

tatakamucher

Code (glbasic) Select
WHILE TRUE



IF t3 = 0
        t4 =  GETTIMERALL()
        t3 = 1

        ENDIF
        t2 = GETTIMERALL()- t4
        IF t2 > 999 THEN t3 = 0

IF t2 < 478


x% = -24.833333
y% = 81.923077
a% = 0
t% = 0
s% = 0

a2x% = -25.5
a2y% = 79.589744
a2a% =  0
a2t% = 477
a2s% = 0

ENDIF

IF t2 > 477
x% = -25.5
y% = 79.589744
a% =  0
t% = 477
s% = 0

a2x% = -24.833333
a2y% = 81.923077
a2a% = 0
a2t% = 999
a2s% = 0



ENDIF

a3x% = x%+((a2x% - (x%))*((t2-t%)/(a2t%-t%)))
a3y% = y%+((a2y% - (y%))*((t2-t%)/(a2t%-t%)))

DRAWRECT -a3x%,a3y%,50,50,RGB(244,0,0)

SHOWSCREEN
WEND





i try to implement a tweening movemtn to animate characters but when i try to drawsprite or drawrect the x and y values has only integer values


i need some help  =D

spicypixel

Change your variables from % to # for a start ;)
http://www.spicypixel.net | http://www.facebook.com/SpicyPixel.NET

Comps Owned - ZX.81, ZX.48K, ZX.128K+2, Vic20, C64, Atari-ST, A500.600.1200, PC, Apple Mini-Mac.

SnooPI

Quote from: spicypixel on 2013-Jul-29
Change your variables from % to # for a start ;)

I agree.

For a "clean code" just uses the INTEGER function when you draw :

DRAWRECT INTEGER(-a3x), INTEGER(a3y), 50, 50, RGB(244,0,0)

tatakamucher

my first code uses # and dont work, int neither, i think about the ocean solution u_u

mentalthink

Hi tatamuker I think  I put a lot of time a library or tutorials for make this... I rebenber another coleague comments this tutorials are amazing, because are very easy to port to GLbasic.... (I can't find it)

I'm not sure but Slydog made another great library, I read something about twenning, perhaps here you can find and use very easy...
http://www.glbasic.com/forum/index.php?topic=8242.0


SnooPI

#5
Quote from: tatakamucher on 2013-Jul-30
my first code uses # and dont work, int neither, i think about the ocean solution u_u

then this is not only a problem of data types (integer or float) but also a problem in your code.  ;)

Here a simple tweening movement  (for clarity, the code is not optimized )  :):
Code (glbasic) Select


GLOBAL npos = 4, n1 = 0, n2 = 0, dtime, x_rect, y_rect, speed_rect, dx_rect, dy_rect, speed, distx, disty, dist, pos[]

DIMDATA pos[],  10, 10,  200, 10,  250, 200,   10, 200   // X, Y Format

x_rect = pos[0]
y_rect = pos[1]
speed_rect = 2

WHILE TRUE
IF dist <= 0
n2 = n1 + 1
IF n2 >= npos THEN n2 = 0

distx = pos[n2 * 2 + 0] - pos[n1 * 2 + 0]      // X
disty = pos[n2 * 2 + 1] - pos[n1 * 2 + 1]      // Y
dist = SQR((distx * distx) +  (disty * disty)) // Distance
dx_rect = distx / dist
dy_rect = disty / dist

INC n1
IF n1 >= npos THEN n1 = 0
ELSE
DEC dist, speed_rect * speed
ENDIF

INC x_rect, dx_rect * speed_rect * speed
INC y_rect, dy_rect * speed_rect * speed

//DRAWRECT INTEGER(x_rect), INTEGER(y_rect), 50, 50, RGB(244,0,0)
DRAWRECT x_rect, y_rect, 50, 50, RGB(244,0,0)  // For a "clean code" use INTEGER function, but GLB also accepts floating value in 2D ;)

SHOWSCREEN

speed = 30.0 * GETTIMER() * 0.001
WEND

tatakamucher

Quote from: Snoopy on 2013-Jul-30
Quote from: tatakamucher on 2013-Jul-30
my first code uses # and dont work, int neither, i think about the ocean solution u_u

then this is not only a problem of data types (integer or float) but also a problem in your code.  ;)

Here a simple tweening movement  (for clarity, the code is not optimized )  :):
Code (glbasic) Select


GLOBAL npos = 4, n1 = 0, n2 = 0, dtime, x_rect, y_rect, speed_rect, dx_rect, dy_rect, speed, distx, disty, dist, pos[]

DIMDATA pos[],  10, 10,  200, 10,  250, 200,   10, 200   // X, Y Format

x_rect = pos[0]
y_rect = pos[1]
speed_rect = 2

WHILE TRUE
IF dist <= 0
n2 = n1 + 1
IF n2 >= npos THEN n2 = 0

distx = pos[n2 * 2 + 0] - pos[n1 * 2 + 0]      // X
disty = pos[n2 * 2 + 1] - pos[n1 * 2 + 1]      // Y
dist = SQR((distx * distx) +  (disty * disty)) // Distance
dx_rect = distx / dist
dy_rect = disty / dist

INC n1
IF n1 >= npos THEN n1 = 0
ELSE
DEC dist, speed_rect * speed
ENDIF

INC x_rect, dx_rect * speed_rect * speed
INC y_rect, dy_rect * speed_rect * speed

//DRAWRECT INTEGER(x_rect), INTEGER(y_rect), 50, 50, RGB(244,0,0)
DRAWRECT x_rect, y_rect, 50, 50, RGB(244,0,0)  // For a "clean code" use INTEGER function, but GLB also accepts floating value in 2D ;)

SHOWSCREEN

speed = 30.0 * GETTIMER() * 0.001
WEND



hi, your code its ok for movement  :)

bur the challenge here is for a tweening animation, like a bone animation in flash.


for example i need to draw a sprite for x = 10 to x = 11 in a interval of 1000 millisecs (like x = 10.1, x = 10.2, x = 10.3... x = 11)

erico

Are you looking for sub-pixel movement then? I wonder, but not that I have a solution for it :doubt:

spicypixel

The pixel is either at 10 or its at 11, it can never be at 10.1, 10.2, etc.... using # will mean its at 10 longer before it's at 11, this is the best you can get. Like I say the pixel will only ever be at 10 or 11  :giveup:
http://www.spicypixel.net | http://www.facebook.com/SpicyPixel.NET

Comps Owned - ZX.81, ZX.48K, ZX.128K+2, Vic20, C64, Atari-ST, A500.600.1200, PC, Apple Mini-Mac.

SnooPI

Quote from: tatakamucher on 2013-Jul-31
hi, your code its ok for movement  :)

bur the challenge here is for a tweening animation, like a bone animation in flash.


for example i need to draw a sprite for x = 10 to x = 11 in a interval of 1000 millisecs (like x = 10.1, x = 10.2, x = 10.3... x = 11)

The system of my code is not only for the movement.  O_O
It is the same system that is used in quake1(mdl) and quake2(md2) to animate 3d models (keyframes animation with vertex morphing)

Quote from: spicypixel on 2013-Jul-31
The pixel is either at 10 or its at 11, it can never be at 10.1, 10.2, etc.... using # will mean its at 10 longer before it's at 11, this is the best you can get. Like I say the pixel will only ever be at 10 or 11  :giveup:

I confirm that spicypixel said.

Moreover, anti-aliasing is just a graphic effect.  :giveup:

SnooPI

I do not reject this technique, I'm just saying it's not the same thing.  :whistle:

spicypixel

Quote from: Snoopy on 2013-Jul-31
I do not reject this technique, I'm just saying it's not the same thing.  :whistle:

I agree, as a graphic artist I anti-alias by hand and can mimic sub-pixel movement but it still doesn't mean the pixel is at 10.5 it just means a pixel is at 10 and 11 with shading :D
http://www.spicypixel.net | http://www.facebook.com/SpicyPixel.NET

Comps Owned - ZX.81, ZX.48K, ZX.128K+2, Vic20, C64, Atari-ST, A500.600.1200, PC, Apple Mini-Mac.

erico

If antialiase is not heavy and dosen´t show when things are still but only on movement, you can sure increase visual movement quality this way.
For my stuff (move more then 1 pixel at many times), it is a bit overkill, but none the less really beautiful.

Somehow, I see some similarities with amiga´s hardware sprites moving about with fields.
It sure gave a great impression on tv or monitors capable of displaying such.
We may remember Doom didn´t quite move so smooth back then and fields could be seen as somehow an antialiase on horizontal movements.