Envision, Create, Share

Welcome to HBGames, a leading amateur game development forum and Discord server. All are welcome, and amongst our ranks you will find experts in their field from all aspects of video game design and development.

Center picture on screen based on picture's size? [RESOLVED]

What's the best method for getting an image of a non-standard size displayed on screen like so:

@sprite1 = Sprite.new
@sprite1.bitmap = RPG::Cache.title(001-Title01)

If this image were less than 640 X 480, how can I get it to display on the center of the screen, based on it's size (which will vary from time to time.)?

This sounds like it would have been answered before, but I can't find it anywhere.
 

Jason

Awesome Bro

Hmm, just a random guess here, probably already tried...

@sprite1.x = [Value]
@sprite1.y = [Value]

I'd guess 320 and 240, however, I'm assuming it uses the topleft corner of the image and not the center...
 
Yes I did try that Jbrist, and you're exactly right, it centers the image based on the top left corner. Perhaps there is a way to change the point relative to which the picture will be shown?
 

Jason

Awesome Bro

Hmm, I'm not so good with the syntax and stuff, so I'll try and explain it in english, see if you can translate it, lol...

x = (screen width - picture width) / 2

y = (screen height - picture height) / 2

So if the screen is 640x480

Say, the picture is 600x400

It'd set it at 40, 80 (In terms of x, y), which means it'd be pressed towards one of the corners, so if you half it, it should center both of these...

Not sure if I've explained that as well as I could, but I think I'm onto something, if only I actually knew how to do that with RGSS, lol...
 
XeroVolume":1qfp0eyb said:
Yes I did try that Jbrist, and you're exactly right, it centers the image based on the top left corner. Perhaps there is a way to change the point relative to which the picture will be shown?

You can set the sprite's ox & oy properties


@sprite1 = Sprite.new
@sprite1.bitmap = RPG::Cache.title(001-Title01)

@sprite1.ox = @sprite1.bitmap.width / 2
@sprite1.oy = @sprite1.bitmap.height / 2
@sprite1.x = 320
@sprite1.y = 240

Programatically, not much different than Jbrist's example

@sprite1.x = (640 - @sprite1.bitmap.width) / 2
@sprite1.y = (480 - @sprite1.bitmap.height) / 2

Where the ox & oy come in handy is if you are moving a sprite relative to a non 0,0 point on the sprite.
In this case you're not moving the sprite around, so it's a wash
 

Jason

Awesome Bro

Whey I was pretty close, well, my english was correct, but like I said, I'm not the greatest with syntax, but damn!

And also, I didn't know you could set the ox and oy... although I guess it would've been fairly obvious o.O
 
Jbriste":1kdgqv8s said:
Hmm, I'm not so good with the syntax and stuff, so I'll try and explain it in english, see if you can translate it, lol...

x = (screen width - picture width) / 2

y = (screen height - picture height) / 2

That's exactly what I was thinking! (Great minds think alike :haha: ) I tried something like that (dividing by 2) but I have the same problem at the moment! I'm still learning the syntax!

Brewmeister":1kdgqv8s said:
@sprite1 = Sprite.new
@sprite1.bitmap = RPG::Cache.title(001-Title01)

@sprite1.ox = @sprite1.bitmap.width / 2
@sprite1.oy = @sprite1.bitmap.height / 2
@sprite1.x = 320
@sprite1.y = 240

Like before: So simple, yet so AWESOME! Isn't it great when things just "work"!? I am really digging this whole "programming" thing! :thumb: HAHA

Later guys and thanks for the help!!! This topic is RESOLVED!
 

Thank you for viewing

HBGames is a leading amateur video game development forum and Discord server open to all ability levels. Feel free to have a nosey around!

Discord

Join our growing and active Discord server to discuss all aspects of game making in a relaxed environment. Join Us

Content

  • Our Games
  • Games in Development
  • Emoji by Twemoji.
    Top