[RESOLVED] Combine Images

[Paul M]

Yea i know already done a search

But this i guess is a little more complicated? I was wondering what would be the best way to load pictures into an array, then i need to store them side by side. I don't really want to use a picturebox but it seems that using .PaintPicture will be easiest so i am a little uncertain now as i wanted to try and keep away from pictureboxes

[LaVolpe]

There are seveal options. I guess a couple of questions first
1. How many are we talking about, memory can become an issue whether using arrays or combining to some offscreen bitmap.
2. Do all of them need to be loaded in advance or can they be loaded on demand?
3. Store them side by side? To be saved to file or just to be shown on screen?

[RobDog888]

Like in doing some kind of slide show?

[Paul M]

Nope storing images side by side, and then saving it as a temp file or what ever.

Edit:

Oh and there really isn't to many files, small handfuls at time and they can be loaded on demand.

[jmsrickland]

LaVolpe,

Why not the examples you helped me with. Wouldn't that solve his problems

[LaVolpe]

If saving it is the only goal, then you do have the choice of using APIs or a single PictureBox and a resuable temporary stdPicture object. Depending on how many and how big they are can cause memory errors & even vb errors. A picturebox does have limits when AutoRedraw=True. And if using APIs, there are limits to what the system can support in way of DIBs (device independent bmps) or DDBs (device dependent bmps).

Also note that storage of combined images of different sizes will be larger than storing each separately.

Another point... If any of these are transparent GIFs, WMFs, Icons, you will lose any transparency or be forced to convert every image to some common palette and then convert the entire combined image to a GIF format. There is one workaround and that is using 32bpp bitmaps that include alpha channels, but then the fun factor rises dramatically.

So, bottom line.... You gotta load these things anyway, so you can combine them. VB's LoadPicture is easy. The other question is combining them. Using a PictureBox is easier, using API bitmaps becomes more complicated because you must code all the resizing & painting yourself.

Just some options and some things to think about. I don't mind giving assistance, just need to know which way you want to go. Others, I'm sure can offer alternatives, but the details are pretty sketchy at this point.

Edited: Oh, will the individual images have to be extracted from this combined image? If so, and if not all images are the same size, you will need to have some kind of indexing system so you know where each starts and its size.

[Paul M]

No they will not have to be extracted, but yes they are not always going to be of the same size

[LaVolpe]

And transparency is not an issue?
The combined image will require larger disk space than the individual images, if stored separately.
You can play with this for starters, the non-api approach.
1. Add a picture box to your form
-- keep the form as the picture box's container/parent object. The picbox can even be invisible if desired
2. In a loop add 2 to 5 pictures to test it out

 ' the picbox name: picCombined
   Dim tmpPic As StdPicture
   Dim picNr As Long
   Dim sFileName As String
   Dim maxCx As Long, maxCy As Long
   Dim picWidth As Long, picHeight As Long
   
   picCombined.ScaleMode = vbPixels
   picCombined.AutoRedraw = True
   picCombined.BorderStyle = 0&

   ' should add error checking in case VB can't load picture
   ' also, don't know if doing this for an entire folder, but error can occur
   ' if resources run too low
   For picNr = 1 To 5
       ' add code needed to identify which file to upload
      sFileName = ?????
      Set tmpPic = LoadPicture(sFileName)
      picWidth = ScaleX(tmpPic.Width, vbHimetric, vbPixels)
      picHeight = ScaleY(tmpPic.Height, vbHimetric, vbPixels)
      maxCx = maxCx + picWidth
      If picHeight > maxCy Then maxCy = picHeight
      picCombined.Move picCombined.Left, picCombined.Top, _
             ScaleX(maxCx, vbPixels, Me.ScaleMode), _
             ScaleY(maxCy, vbPixels, Me.ScaleMode)
      picCombined.PaintPicture tmpPic, maxCx - picWidth, 0&, picWidth, picHeight
  Next
  SavePicture picCombined.Image, [FileName]
  ' good idea for releasing some resources to... 
        picCombined.AutoRedraw = False        
        picCombined.Cls

The above loads, resizes, draws. There are optimizations that can be done, but would require double loads: Load all images, calculate max size needed, try reszing picCombined & test for errors. Then if no errors, load & draw. That approach will allow errors to be caught before one gets started.

Edited: If wanting to center vertically all images, then premeasuring would be necessary. The above code assumes image will be combined side by side.

Edited Again. Since some images may not be as tall as others, you will have a border at the bottom of shorter images (or top & bottom if eventually centered vertically). Simply change the picbox's backcolor to whatever color you choose. This requires a bit more work if you wish to go the API-way.

[Milk]

Paul, can you expand a little on exactly what your after. I see Lavolpe has given a good generic solution but there might be other solutions more tailored to needs if you could be more specific.

You have several images of different sizes which you want to combine into one image / array which is then saved as a temp file (or whatever). Once combined you don't need to extract the smaller images from the larger image / array.

Whats the intended use of this larger image?

[Paul M]

This is what i have so far, i select images of all formats (nothing exclusive like .dds or something) and the paths are entered into a list view. What i am doing is storing all the paths in an array and then from there it begins. Depending on the option selected i will be saving it vertically or side-by-side.

So say i have image1, image2, and image3.

If i select side-by-side it will have image1, then to its right image2 and then beside that image3. Like wise for the vertical option. No resizing of the images what so ever is required. Then all i have to do is save it.

At the moment in my test application i am just using a invisible picturebox which will most likely be what is used in the real application unless it can be done another way.

Sorry for the rather vague descriptions earlier on i have been quite busy.

[Paul M]

Oh no, problem. How do i make it save just the necessary stuff. It is saving all the empty/unused space of the picturebox as well

So say image 1 is 50x50 and image 2 is 30x25 the saved image should be...

80 in width and 75 in height. Yes there is going to be a little bit of space saved but thats alright, if that can also not be saved it would be great

Any ideas?

[Milk]

If your saving as one image, your stuck with a rectangle. You can make parts of this image transparent but that will cost more memory rather than less. I'm a little slow at times and I'm still unsure of how you intend to use this final image. Whether its acting as an image resource or it's intended to be rendered whole. I'm also not sure what the best format would be but a 24bpp Bitmap is probably the easiest.

Using your example, if image 1 is 50x50 and image 2 is 30x25 the optimum combined image would be stacking them vertically as a 50x75 image, 500 pixels would be wasted. If it was also 24bpp that would be 1500 bytes wasted which is enough for 27 Bitmap headers.

[Paul M]

I think i am going to use BitBlt to save only the specific sections

[Paul M]

http://pastebin.com/f420cbf32

Thats what i have so far...

The BitBlt doesn't seem to work though it saves a grey color instead (backcolor of the picturebox) and i am using to more variables storeWidth and sotreHeight so if there is a 80px and a 50px image. The height of the saved image is going to be 80px instead of 130px. Any ideas or suggestions?

Also i receive a Subscript out of range error in the first loop

Its because i haven't defined how many elements there are though, and i am not sure if i can fix it

[LaVolpe]

A few things

1. I dont' see where you are sizing the strFiles() array: try
ReDim strFiles(1 To listview1.ListCount)

2. You are keeping the largest image width & largest image height in the storeWidth & storeHeight variables. You are not keeping the the total height or total width, which is what I suspect you want to do.

3. Regarding the gray color, have you simply tried to change the picturebox' background color?

[Paul M]

http://pastebin.com/f3f6c0a12

Thats what i have so far i realized i don't actually need to use BitBlt. But that is still saving the parts of the box i don't want i tried adding the following code just before i save the picture but it doesn't scale properly it turns out like 24x5 or something i thing i need to scale it?

    If bVertical = False Then
        pictCanvas.Width = maxCx
        pictCanvas.Height = storeHeight
    Else
        pictCanvas.Width = storeWidth
        pictCanvas.Height = maxCy
    End If

[LaVolpe]

The 24x5 part is probably the size of the picturebox, correct?
When AutoRedraw=True, if you don't resize the picturebox, then all you get is what you can see. In the code I posted at #8 above, please note that I was sizing the picturebox, via the .Move event, as the loop progressed. And I agree, the BitBlt is not necessary. How now?

[Paul M]

No the picturebox size is like 400x 250 or something around that. But with the code if statement i posted it saves it at 24x5.

Ill try using .move now though.

[Paul M]

http://pastebin.com/f58dc1c26

Doesn't seem to be working

[Paul M]

Never mind it seems to be working alright actually

[LaVolpe]

Paul, I downloaded your code & found a couple things that I think will give you exactly what you are asking for.

1. Ensure you call pictCanvas.Cls when you enter the routine
2. The main problem? Add: pictCanvas.BorderStyle = 0

Oh & a typo. The 2nd parameter in the .Move call shouldnt' be pictCanvas.Width, it should have been pictCanvas.Top. Could potentially generate an error if the width is absolutely huge.

That's all.

[LaVolpe]

Just FYI. If storeWidth & storeHeight will remain module-level, you should ensure they are reset to zero when the routine is entered. Just noticed that.

[Paul M]

Ah yes almost forgot that, never noticed because i always ran it once

[xpertino]

Hi All,
Dear LaVolpe,

Thanks a lot about the code below

1- I needed only to save the combined images in vertical way and not to show In The Form.

2- I need to be able to have unlimited Images Combined or (128000 pixels maximum). However, the combined image is limited to 16383 pixels wide, Whats a good practical way to be able to save 128000 pixels maximum?

Kind Regards,

' the picbox name: picCombined
   Dim tmpPic As StdPicture
   Dim picNr As Long
   Dim sFileName As String
   Dim maxCx As Long, maxCy As Long
   Dim picWidth As Long, picHeight As Long
   
   picCombined.ScaleMode = vbPixels
   picCombined.AutoRedraw = True
   picCombined.BorderStyle = 0&

   ' should add error checking in case VB can't load picture
   ' also, don't know if doing this for an entire folder, but error can occur
   ' if resources run too low
   For picNr = 1 To 5
       ' add code needed to identify which file to upload
      sFileName = ?????
      Set tmpPic = LoadPicture(sFileName)
      picWidth = ScaleX(tmpPic.Width, vbHimetric, vbPixels)
      picHeight = ScaleY(tmpPic.Height, vbHimetric, vbPixels)
      maxCx = maxCx + picWidth
      If picHeight > maxCy Then maxCy = picHeight
      picCombined.Move picCombined.Left, picCombined.Top, _
             ScaleX(maxCx, vbPixels, Me.ScaleMode), _
             ScaleY(maxCy, vbPixels, Me.ScaleMode)
      picCombined.PaintPicture tmpPic, maxCx - picWidth, 0&, picWidth, picHeight
  Next
  SavePicture picCombined.Image, [FileName]
  ' good idea for releasing some resources to... 
        picCombined.AutoRedraw = False        
        picCombined.Cls

[LaVolpe]

xpertino, welcome to the forums

In the future, you should not start your own posting on someone else's posting. Rather, start your own post and you can reference another posting if you need to. If any moderators disagree with that statement, I'm sure they will let both of us know.

Your answers:

1. You will need to modify the code to shift stuff vertically vs horizontally. It is just that simple.

2. The sizes are limited. VB limits picturebox size and the size of the .Image and/or .Picture property can cause errors if it is too large and AutoRedraw is True, the error is generally something like "Can't create Active-X object". Even if one were to go with a complete API approach, the memory bitmap may be too large also. See post #6 above.

A possible solution may be to use more than one picturebox, where images 1-xx are in one box and images xx-last are in another box?

[xpertino]

Dear LaVolpe
Thanks Too Much For Your Support

Please, Can You Send An Example To Understanding How Combining Too Much Images The Combined Images Have Height More Or equal Than 128,000 Pixels.

And I Have Too Much Memory No Problem

Best Regards,