Java-Gaming.org    
Featured games (91)
games approved by the League of Dukes
Games in Showcase (578)
games submitted by our members
Games in WIP (498)
games currently in development
News: Read the Java Gaming Resources, or peek at the official Java tutorials
 
    Home     Help   Search   Login   Register   
Pages: [1]
  ignore  |  Print  
  how to draw Sprites that turned to the left.  (Read 1144 times)
0 Members and 1 Guest are viewing this topic.
Offline thanatos1

Senior Newbie





« Posted 2012-12-08 04:01:30 »

I know it sounds like a cryptic question but it's been bothering for a while now.

I'm making some game, and the player has different Images that i use to give the illusion of Animation (when he walks, I rotate between 3 images, etc).

let's say that now my player wants to attack to the right, attacking means extending the arm of the player to whatever desired location, (really its just using an image with the dude's arm extended), naturally, since he's extending his arm, i am now using a wider image.

(this is an example spritesheet so you can see what i'm talking about http://spritedatabase.net/files/nes/193/Sprite/TrevorC3.png)

if the dude's attacking to the right, the arm is extended to the right, but there's no problem, since i draw to the canvas from the top left coordinate of the Image (x coordinate).

however, if the dude's attacking to the left, the arm is extended to the left, but there's a problem, since i draw to the canvas from the top left coordinate of the Image (x coordinate), now the "body" of the dude is drawn a bunch of pixels to the right instead of staying where it was, it's as if i were to try to punch something in front of me, but as i extend my arm, i walk backwards...

I'm not sure if i explained the problem... but can i get some help on this? I can clarify further if need be.

I kind of "fixed" this issue, essentially what i did was i looked at which animation image was displaying for that particular tick, and if it was one that made it extend its arm to the left i drew the character a few x pixels to the left.. but it seems like a hack to me rather than a legit fix...


Thanks!
Offline Jimmt
« League of Dukes »

JGO Kernel


Medals: 114
Projects: 4
Exp: 3 years



« Reply #1 - Posted 2012-12-08 04:22:52 »

Try flipping the image instead of using different left/right images.
Offline Abuse

JGO Coder


Medals: 10


falling into the abyss of reality


« Reply #2 - Posted 2012-12-08 04:32:15 »

You should have additional data that goes alongside that sprite sheet, defining the bounds for each frame (and possibly separate collision bounds too).
For rotating or flipping you'll want each frame to have an anchor point defined too, around which the operations are performed.

How you store that additional data is up to you; artists tend to like using paint packages, so having the bounds & anchor points defined as additional layers in the same image file can be a neat solution. (though obviously needs a little pre-processing in your code to extract the numerical offsets of the various pixel flags)

Make Elite IV:Dangerous happen! Pledge your backing at KICKSTARTER here! https://dl.dropbox.com/u/54785909/EliteIVsmaller.png
Games published by our own members! Check 'em out!
Legends of Yore - The Casual Retro Roguelike
Offline thanatos1

Senior Newbie





« Reply #3 - Posted 2012-12-08 04:36:31 »

I'm not sure I understand.

do you mean that my spritesheet should have some sort of x and y offset that should be used whenever i draw?

for example, if i extend my arm to the left, the x offset would be at like -30 or something, which would draw the entire image to the left.

I'm pretty sure that wasn't what you were talking about at all, but that actually seems a lot better than the "fix" that i have now... cool!
Offline SkyAphid

Senior Member


Medals: 3
Projects: 1



« Reply #4 - Posted 2012-12-08 04:53:15 »

I'm not sure I understand.

do you mean that my spritesheet should have some sort of x and y offset that should be used whenever i draw?

for example, if i extend my arm to the left, the x offset would be at like -30 or something, which would draw the entire image to the left.

I'm pretty sure that wasn't what you were talking about at all, but that actually seems a lot better than the "fix" that i have now... cool!

Here's how I do it.

When making a sheet, make a set frame width/height before putting it together (make sure it can hold all of the animations) So, when you're working on the sheet, be sure to center the sprites in the frames. That way when it animates, they aren't jittery.

To solve your left and right problem, if the character is symmetrical you could always flip the image horizontally. If you animated it right, the center alignment won't be messed up.

If you need an example I can throw one together.

Good luck bud.

EDIT:
To reiterate, each frame would be equal in width and height. Every sprite would go in a frame of the same size. So, a sheet would have 3x3, 16x16 frames. The first set containing an idle animation, the second running, and the third attacking. They would all be centered, so making an individual offset would no longer be necessary. Just be sure the frames are large enough to fit ALL potential sprites later or you may run into trouble.

“Life is pretty simple: You do some stuff. Most fails. Some works. You do more of what works. If it works big, others quickly copy it. Then you do something else. The trick is the doing something else.” ~Leonardo da Vinci
Offline erana

Junior Member


Medals: 1
Projects: 3



« Reply #5 - Posted 2012-12-08 04:55:41 »

If you save/set a direction variable each time you move (e.g. with a key release/press left arrow key), your direction stays put when you stop. It still is set to the last direction you were moving in. Then check your direction variable when painting/drawing your char, if it is, say "left" (in Java: if (direction == "left") { drawleftplayer image(x-20,...) }, then you can draw -20 to the left for the right shooting/clubbing image. As simple as that  Smiley
Offline Jimmt
« League of Dukes »

JGO Kernel


Medals: 114
Projects: 4
Exp: 3 years



« Reply #6 - Posted 2012-12-08 04:56:38 »

ofc the easiest way is to just make all images the same width
Offline thanatos1

Senior Newbie





« Reply #7 - Posted 2012-12-08 05:08:13 »

I'm not sure I understand.

do you mean that my spritesheet should have some sort of x and y offset that should be used whenever i draw?

for example, if i extend my arm to the left, the x offset would be at like -30 or something, which would draw the entire image to the left.

I'm pretty sure that wasn't what you were talking about at all, but that actually seems a lot better than the "fix" that i have now... cool!

Here's how I do it.

When making a sheet, make a set frame width/height before putting it together (make sure it can hold all of the animations) So, when you're working on the sheet, be sure to center the sprites in the frames. That way when it animates, they aren't jittery.

To solve your left and right problem, if the character is symmetrical you could always flip the image horizontally. If you animated it right, the center alignment won't be messed up.

If you need an example I can throw one together.

Good luck bud.

EDIT:
To reiterate, each frame would be equal in width and height. Every sprite would go in a frame of the same size. So, a sheet would have 3x3, 16x16 frames. The first set containing an idle animation, the second running, and the third attacking. They would all be centered, so making an individual offset would no longer be necessary. Just be sure the frames are large enough to fit ALL potential sprites later or you may run into trouble.



ohhh... yeah yeah that's f**king brilliant.

My game was f**king up because i was using the dimensions of the actual Image as the collision hitbox, rather than having a separate invisible rectangle that represents the hitbox, so whenever the image changed dimensions it would f**k my game up (if i was beside a wall or something).

but yes, that seems like a really really good fix, (it seems so easy too, i'm stupid as f**k for never thinking of it).

Thanks a bunch!
Offline SkyAphid

Senior Member


Medals: 3
Projects: 1



« Reply #8 - Posted 2012-12-08 05:17:10 »

I'm not sure I understand.

do you mean that my spritesheet should have some sort of x and y offset that should be used whenever i draw?

for example, if i extend my arm to the left, the x offset would be at like -30 or something, which would draw the entire image to the left.

I'm pretty sure that wasn't what you were talking about at all, but that actually seems a lot better than the "fix" that i have now... cool!

Here's how I do it.

When making a sheet, make a set frame width/height before putting it together (make sure it can hold all of the animations) So, when you're working on the sheet, be sure to center the sprites in the frames. That way when it animates, they aren't jittery.

To solve your left and right problem, if the character is symmetrical you could always flip the image horizontally. If you animated it right, the center alignment won't be messed up.

If you need an example I can throw one together.

Good luck bud.

EDIT:
To reiterate, each frame would be equal in width and height. Every sprite would go in a frame of the same size. So, a sheet would have 3x3, 16x16 frames. The first set containing an idle animation, the second running, and the third attacking. They would all be centered, so making an individual offset would no longer be necessary. Just be sure the frames are large enough to fit ALL potential sprites later or you may run into trouble.



ohhh... yeah yeah that's f**king brilliant.

My game was f**king up because i was using the dimensions of the actual Image as the collision hitbox, rather than having a separate invisible rectangle that represents the hitbox, so whenever the image changed dimensions it would f**k my game up (if i was beside a wall or something).

but yes, that seems like a really really good fix, (it seems so easy too, i'm stupid as f**k for never thinking of it).

Thanks a bunch!

No problem man. I'm glad I could help you out with your problems.

“Life is pretty simple: You do some stuff. Most fails. Some works. You do more of what works. If it works big, others quickly copy it. Then you do something else. The trick is the doing something else.” ~Leonardo da Vinci
Pages: [1]
  ignore  |  Print  
 
 
You cannot reply to this message, because it is very, very old.

 

Add your game by posting it in the WIP section,
or publish it in Showcase.

The first screenshot will be displayed as a thumbnail.

xsi3rr4x (27 views)
2014-04-15 18:08:23

BurntPizza (22 views)
2014-04-15 03:46:01

UprightPath (38 views)
2014-04-14 17:39:50

UprightPath (20 views)
2014-04-14 17:35:47

Porlus (36 views)
2014-04-14 15:48:38

tom_mai78101 (61 views)
2014-04-10 04:04:31

BurntPizza (119 views)
2014-04-08 23:06:04

tom_mai78101 (219 views)
2014-04-05 13:34:39

trollwarrior1 (186 views)
2014-04-04 12:06:45

CJLetsGame (193 views)
2014-04-01 02:16:10
List of Learning Resources
by Longarmx
2014-04-08 03:14:44

Good Examples
by matheus23
2014-04-05 13:51:37

Good Examples
by Grunnt
2014-04-03 15:48:46

Good Examples
by Grunnt
2014-04-03 15:48:37

Good Examples
by matheus23
2014-04-01 18:40:51

Good Examples
by matheus23
2014-04-01 18:40:34

Anonymous/Local/Inner class gotchas
by Roquen
2014-03-11 15:22:30

Anonymous/Local/Inner class gotchas
by Roquen
2014-03-11 15:05:20
java-gaming.org is not responsible for the content posted by its members, including references to external websites, and other references that may or may not have a relation with our primarily gaming and game production oriented community. inquiries and complaints can be sent via email to the info‑account of the company managing the website of java‑gaming.org
Powered by MySQL Powered by PHP Powered by SMF 1.1.18 | SMF © 2013, Simple Machines | Managed by Enhanced Four Valid XHTML 1.0! Valid CSS!