Web
Analytics
Log In  

13

Cart [#22757#] | Copy | Code | 2016-06-12 | Link
13

A howto about rotating a sprite around its center...
Use left and right arrows to spin the sprite.

P#22756 2016-06-12 10:25 ( Edited 2018-08-11 19:32)

::

Works great. Mind if I reuse it in my own project?

P#27503 2016-08-27 22:15

::

Very nicely done ! I'm starting to see that FIREFOX is really not a good browser to play these PICO programs. I have one tab open in GOOGLE CHROME just for PICO and it plays there beautifully.

Will have to see the source to this when I get PICO, should be 48-hours from now.

P#27504 2016-08-27 22:54

::

Nice work! One thing that was confusing me was that when calculating the reverse rotation for xx and yy, the direction of the angle wasn't reversed. The reason it works is because the input angle is specified in a clockwise direction (10 degrees turns the ship right) while increasing angle goes anticlockwise in PICO-8 (10 degrees turns the ship left).

P#41001 2017-05-26 15:19 ( Edited 2017-05-26 15:23)

::

>Works great. Mind if I reuse it in my own project?

should be ok, the cart has a cc license (see the CC icon)
https://en.wikipedia.org/wiki/Creative_Commons_license

> I'm starting to see that FIREFOX is really not a good browser

running fine here, and it's on on a 5 years old laptop.

P#41003 2017-05-26 15:59

::

Can it be abstracted as to rotate around arbitrary point? I'm thinking about a game like Asteroids, but where you also have to fight other ships (which would be capable of shooting asteroids as well) and rotating around an arbitrary point would be useful for AI (as I want to make them circle strafe around player from time to time).

P#41004 2017-05-26 16:08

::

Edit: see post below for the optimized and pixel-perfect version

P#45365 2017-10-20 16:51 ( Edited 2018-05-08 16:35)

::

Hey @freds72 - I grabbed your code for a project and it seems like it doesn't quite work. When I rotate my sprite 180 degrees the drawing point seems to shift up and right one pixel - so the sprite is moved one pixel to the right and one pixel downwards which cuts off the right most and bottom lines of the sprite. Is this a known issue?

P#51200 2018-04-02 13:21

::

Edit: See post further below to have the actual fix (and a complete demo as an added bonus!)

P#51831 2018-04-21 02:23 ( Edited 2018-05-08 16:21)

::

Hah, cool! I only just saw this reply. Thanks for putting in the work for this. I'd fudged it by just not having a left or top line for that sprite. Just plopped in those extra -0.5s and we good!
Thanks again!

P#52298 2018-05-02 16:26 ( Edited 2018-05-02 16:27)

::

Hello, does anyone mind explaining how this works? I'm adapting the first example @fred72 provided to a Gyruss clone that I'm working on (couldn't get the second to work) and I managed to get it to function semi-decently, but doing so required some pretty nasty hacking since I'm just not familiar enough with the math involved.

Edit: I got the last example working. However when I use this one rather than the previous, the sprites streak at the edges. Does anyone know how to fix this?

P#52520 2018-05-07 22:42 ( Edited 2018-05-08 01:58)

::

My initial sample code misses a 0.5 offset.
Edit: fixed the fix!
Change:

ca*=w
sa*=w

to:

ca*=w-0.5
sa*=w-0.5

(e.g. I needed to adjust the square center with a half pixel)
The sprite can now use the full 8x8 or 16x16 extent!!

The "streaks" you have seens are "normals", sprite "effective image" must fit within a circle (e.g. pixels outside sprite radius will get trimmed).
I also added a clear color (unfortunately needed for pixel outside of the 'safe' zone).
Set the rspr_clear_col to specify a color that matches your sprite palette.

As for the math behind, it comes from:
Fast Bitmap Rotation and Scaling
In short, the code draws the image line by line and calculate the line (in sprite space) that needs to be copied.

The band trick (to stay within sprite boundaries) is from:
https://github.com/morgan3d/misc/tree/master/p8particle

Gyruss is a pseudo-3d game, suggest to use the rspr version I posted (e.g. drawing into spritesheet).
That will give you sspr for free and will allow you to scale sprites based on their distance (actually 1/z).

To get you started :)

Cart [#52541#] | Copy | Code | 2018-05-08 | Link
1

P#52525 2018-05-08 02:57 ( Edited 2018-05-08 16:36)

::

Thank you so much for that link; that's exactly what I was hoping for :D

I did get the second example working after analyzing it for a little while; I was (somehow) under the impression that it required the players actual x and y coordinates to function (it was really late xD). As for the distortion I mentioned: I resolved that by trimming the sprite down a pixel, so the image is now effectively 14x14 rather than 16x16. That's fine, but I liked the original graphic I created more xD

As for the nasty hacks I mentioned, I removed those after I realized that I was calculating the players rotation using a method that didn't work with your function. I can't seem to find a link to where I got the method I was using, but essentially the only real difference between what I was using before, and what I'm using now is that it had me dividing the players angle by pi, which was causing the player object to veer off the origin I wanted it to orbit. After tweaking my function, I managed to get it working properly :D

Distorted Sprite
Editor View

Fixed Sprite
Editor View

Note: I noticed your edit while I was writing this, thanks for the help! As for the code, I'll definitely take a look, since it does a lot more already than what I managed to get working :)

P#52539 2018-05-08 15:28 ( Edited 2018-05-08 15:30)

::

Bumping up the thread for @Arcturus615 & @Davbo: offset bug is truly fixed (no more pixel shifts or sprite cropping!)

P#52551 2018-05-09 03:11

::

Hey freds, thanks! When I added the 0.5s last time it appeared to work but then using a sprite which was a circle, so 3 pixels in each corner were transparent, seemed to have an issue where the bottom right corner was the same colour as the rest of the sprite instead of transparent.
I'm going to be working on the game tonight (UK time) so will try again with your latest version since I was still using the non sprite sheet version and let you know how I get on :D

P#52553 2018-05-09 05:06

::

Awesome, thanks freds! After studying your code, I've pretty much recreated it in a effort to figure it all out in my brain. The Gyruss part, that is. I'm not touching that sprite rotation function for a little bit xD

Have to say, working with your function is extremely easy now that I've worked out roughly how it works.

P#52559 2018-05-09 12:31

::

tried out the fix and working perfectly for me now - thanks a bunch!

P#52609 2018-05-11 08:12

::

the first one seems to be broken it doesn't draw the sprite correctly.
it seems to offset the pixels incorrectly

P#54952 2018-08-11 12:09 ( Edited 2018-08-11 12:10)

::

Is there sprite rotation code that does not use sin() or cos() ?

P#54956 2018-08-11 13:03

::

@dw817 what do you have against sin/cos?
That’s the usual way to convert an angle to x/y coordinates!

That said, given pico resolution, using a pre-defined cos/sin table by 1/64 increment is usually enough.

P#54962 2018-08-11 14:24

::

If you take a close look at SIN() and COS() for circles, they are really ragged compared to using a simple substitute like balancing comparisons thus:

-- note! requires floating
-- point numbers, messy
function uglycircle(x,y,r)
local i
x=x+r/1.05
for i=1,385 do
  pset(x,y)
  x+=sin(i/(r*6.1))
  y+=cos(i/(r*6.1))
end
end

cls()
for i=7,64,8 do
  uglycircle(64,64,i)
end
-- lovely circle from dots for pico using balancers
-- note! no floating point numbers are needed!
function circle(x,y,r,c)
local xo,yo,ba=0,r,3-2*r
repeat
  pset(x-xo,y-yo)pset(x-xo,y+yo)
  pset(x+xo,y-yo)pset(x+xo,y+yo)
  pset(x-yo,y-xo)pset(x-yo,y+xo)
  pset(x+yo,y-xo)pset(x+yo,y+xo)
  if (ba<0) ba+=6+4*xo else ba+=10+4*(xo-yo) yo-=1
  xo+=1
until xo>yo
end

cls()
for i=7,64,8 do
  circle(64,64,i)
end
P#54963 2018-08-11 15:37 ( Edited 2018-08-11 16:24)

::

@freds72 your second post says..
Change:

ca*=w
sa*=w

to:

ca*=w-0.5
sa*=w-0.5

but your first code does not have..

ca*=w
sa*=w

in it but instead has..

 sa=sin(a)
 ca=cos(a)

can u explain?
right now it uses like a 7x7 tile space or something because the higher sprite index I use the worse it looks coming to a point where its not even drawing the correct sprite.

P#54965 2018-08-11 15:54 ( Edited 2018-08-11 16:02)

::

@dw817 hu.. not sure what to do with that. Sprite rotation needs a vector from an angle.

@Shadowblit16 look 2 lines below, I am reusing variables.
Also note that the code assumes the rotated sprite fits within a circle.
(eg if you want a bigger sprite, you need to ‘waste’ space - see the Gyrus example for some sprite examples)
Here is a simpler version that writes to screen:

function rspr(sx,sy,x,y,a,w)
    local ca,sa=cos(a),sin(a)
    local srcx,srcy
    local ddx0,ddy0=ca,sa
    local mask=shl(0xfff8,(w-1))
    w*=4
    ca*=w-0.5
    sa*=w-0.5
    local dx0,dy0=sa-ca+w,-ca-sa+w
    w=2*w-1
    for ix=0,w do
        srcx,srcy=dx0,dy0
        for iy=0,w do
            if band(bor(srcx,srcy),mask)==0 then
                local c=sget(sx+srcx,sy+srcy)
                pset(x+ix,y+iy,c)
            end
            srcx-=ddy0
            srcy+=ddx0
        end
        dx0+=ddx0
        dy0+=ddy0
    end
end
P#54967 2018-08-11 16:37 ( Edited 2018-08-11 16:46)

::

@freds72 so wait why do u allow a width to be passed but not a height?

is w not have to do with tilesize?

P#54969 2018-08-11 16:50

::

Hi Fred:

It should be possible to derive rotating coordinates from the circle by marking the pixels into a table. For instance, to stuff the values into an array and make a game like Gyruss.

https://youtu.be/haehLgNNB4c?t=24

P#54972 2018-08-11 17:07

::

@dw817 the circle thing doesn’t really work as you’ll have hole between circle if increasing radius (in pixel unit) - if I understand what you are proposing...

Note: I already did a Gyruss prototype, see above demo cart ;)

P#54976 2018-08-11 17:55

::

You could always 1/2 the steps of the plotter. I think my idea would work.

I'm working on a data compressor right now, a powerful one that functions a little like a computer chess player in that it looks ahead for its moves.

I should be able to post it today. Then I'll see if it's possible to make a very smooth rotation engine using the balancers above.

Of course if ZEP would just add rotation plotting to P8, which is standard in most video game programming languages, we wouldn't be here. :)

GrabImage img_stripe,0,0
Repeat
  SetAlpha .008
  Cls
  For i=-256 To 1024+256 Step 2
    SetRotation bgswirl*.0005
    DrawImage img_stripe,i,Sin(bgswirl/2000.0+(i/8.0))*200.0+350.0
    If i Mod 4=0
      bgswirl:+1
    EndIf
  Next
  Flip -1
Until KeyDown(27)
P#54979 2018-08-11 19:32

Log in to post a comment

user:
password:

New User | Account Help
:: New User
X
About | Contact | Updates | Terms of Use
Follow Lexaloffle:        
Generated 2018-08-14 14:00 | 0.173s | 1835k | Q:51