Combining multiple images into a single image

[azdesign 0]

Simple example, A tree consisted of 4 different parts. The root, trunk, branches, and leaves.

 

@root = Sprite.new
@root.bitmap = RPG::Cache.picture('root.png')
.
.

@leaves = Sprite.new
@leaves.bitmap = RPG::Cache.picture('leaves.png')

 

 

Just consider that I have set their coordinates to form a tree at the middle of the screen.

Now, when I want to move that tree, its means that I have to move each parts of it.

In the actual code, I have around 15 parts (body, hand, hair, brow, eye, nose, mouth, top, pants, shoes, etc) to be individually moved just to perform a single moving animation. That is for a single character. What if I have 3-4 character appeared simultaneously on the screen ? I have to move around 60 objects per frame.

 

The question is, is there is a way to create a single image object made from different parts of images ? Not a mere container, because if I were to move the container, the container will need to move each parts of its contents, which result just the same cpu usage

 

For those who wondering why would I separate different parts of the images : I want character pose to appear on the screen based on what he/she is currently equipping, expression, arm pose, hair color, etc. So I don't have to make different single images like 'char_a_frown_hands_up_red_boots_armor_glove_greatsword.png' along with its hundreds of variation

 

Thanks in advance :D

[ForeverZer0 44]

You can do this all with one Sprite and its bitmap. Instead of creating new sprites, just perform blits onto its bitmap.

Take a look in the help manual under Bitmap at the #blt method.

[azdesign 0]

Perfect, now I don't have to write

 

@image.each { |key,val| val.x += 1 }

instead :

@image.x += 1

 

Before I read your reply, I got something from google called RMagick, a gem that provide additional image manipulation functionality, which, one of its method is to produce a single image from combination of different image. But it seem that using .blt is way easier. Nice! another one step to complete my poser script

 

I have not tested the performance difference yet, I'll let you know if I found it later. Thanks you very much

Edited June 27, 2012 by azdesign

[azdesign 0]

Okay, tested, it is proven to have less CPU usage (noticeable differences) 20-25 vs 31-40.

 

BUT new problem appear, the Z index. image layers became messed up. How can I specify the z-index manually for every image components I'm combining ? I don't see z attributes in Bitmap while its only available for Sprite

 

Edit : Nevermind, I made some kind of "queuing" algorithm, to force .blt call specific image part in order. This way it works.

Edited June 27, 2012 by azdesign

[ForeverZer0 44]

Yeah, z-index does not apply to bitmaps, and never does in programming. All bitmaps displayed on the screen are via a graphics context, in which case RGSS uses the "Sprite" class as a wrapper. As you said, the drawing order is how you can have bitmaps "overlap" each other, although what is actually happening is it is overwriting/combining with the pixels beneath it. It achieves the same effect, though. If the Z values are going to be constantly changing, it might be wiser to use multiple sprites instead, since this will limit the number of draws needed, but for many cases what you have is more than sufficient.