Displaying transparent images

[RobertoBozzolo]

Hi all.

I want to display an image with transparent background on a panel. Since the picture control accepts only file formats that do not support transparent color, how can I do this task?

Thank for your help
Roberto

[Alex D]

Roberto:

What version of CVI are you using? In CVI 7.1, you can place any user bitmap in a picture control; if you want it to act like a transparent background for the panel, you can paint the control transparent in the UI editor. (You could accomplish this with a canvas as well but it would be more difficult.)

Let me know more exactly what you're trying to do and I'll attempt a more detailed answer.

Regards,

-alex

[RobertoBozzolo]

I am using cvi 6.0.

The problem is even if I paint the picture control in transparent, when the bitmap is loaded its background (i.e. the part of the rectangular area of the bitmap which is not an interesting part of the image I am displaying) remains painted in some colour. That behaviour is due to the fact that bitmap images does not permit you to use the "transparent" colour.

Let me make an example. Imagine my picture contains a yellow solid circle, which is the interesting part. The bitmap is a square area which contains this circle. Let suppose this area is painted in white. When I load the image in the picture control, in my panel appears a white square with a yellow solid circle in it. I would like to "mask" the white area and leave only
the yellow circle.

Unfortunately I cannot draw the picture contents (the yellow circle) in a canvas since these images come from my customer. He can supply me JPGs with transparent background, but when I change them to bitmap transparency is lost.

[Alex D]

I think the only image format that CVI supports which can contain transparency is .ico. (I don't think .jpg files can have transparency). However, you can add a transparency mask to an image after the fact (if, for example, you know that all "transparent" pixels will be the same color and know what that color is). If you do that, you can use the resulting bitmap in a transparent picture control to get the effect you want. You will have to process the image after loading it, though.

I don't know if this is feasable for you or not but it's the only option that I can think of.

Best of luck,

-alex

[DavidLee]

Hi Roberto,

Have you solved this problem? I have the same trouble , hope can get an advise. Thanks.


David

[Alex D]

I threw together a small example of what this would look like. Using the following code, you can just call

MakeColorTransparent(bitmap, VAL_WHITE);

for example, to make all white pixels in the bitmap transparent. You can use MakeColor() to use a color of your choice.

You can then place it in a picture control for which you have set ATTR_PICT_BGCOLOR to VAL_TRANSPARENT and place it wherever you want, with whatever fit mode is appropriate.

Hope this helps,

-alex

void MaskBitsOfColor (unsigned char *bits, int rowBytes, int color, int width, int height, unsigned char *mask)
{
 int i, j, maskRowSize = ((width + 15) / 16 * 2);

 for (i = 0; i < height; ++i)
  for (j = 0; j < width; ++j)
  {
   if (*(int *)(bits + i * rowBytes + 4 * j) == color)
    mask[maskRowSize * i + j / 8] &= ~(1 << (7 - (j & 0x7)));
  }
}

void MakeColorTransparent(int bitmap, int color)
{
 unsigned char *bits = NULL, *mask = NULL;
 int width, height, rowBytes, pixelDepth = 32;
 int maskSize, maskRowSize, hasMask;
 
 GetBitmapInfo(bitmap, NULL, NULL, &maskSize);
 GetBitmapData(bitmap, NULL, NULL, &width, &height, NULL, NULL, NULL);
 
 rowBytes = 4 * width;
 maskRowSize = ((width + 15) / 16 * 2);

 hasMask = maskSize > 0;
 maskSize = maskRowSize * height;
 mask = malloc(maskRowSize * height);
 
 bits = malloc(rowBytes * height);
 
 if (hasMask)
  GetBitmapData(bitmap, NULL, NULL, NULL, NULL, NULL, bits, mask);
 else
 {
  memset(mask, 0xff, maskSize);
  GetBitmapData(bitmap, NULL, NULL, NULL, NULL, NULL, bits, NULL);
 }
 
 MaskBitsOfColor (bits, rowBytes, color, width, height, mask);
 
 SetBitmapData (bitmap, rowBytes, pixelDepth, NULL, NULL, mask);

 free(mask);
 free(bits);

}

[RobertoBozzolo]

I'll try your example, alex!

In my original application I ended up using a white background since the images needed to be printed too.

[RobertoBozzolo]

As promised, I have tried Alex's code and found it simple and powerful. Thank you for your help 

[sunnywu]

Hi, all

I've tried Alex D's code, it works well in my own computer, but when i tried it on the system which use NI PXI 8176(P3) ,it didn't work, does it have something about  the hardware? such as  vedio card?
 

thanks for your help!

[Alex D]

I looked briefly at what I did, and I did make one assumption: that you are running at 32-bit color depth. If you have a machine running at 256 colors or 16-bit color depth (for example), the code will not work.

If you need this code to work on any color depth system, I can give you an idea of what changes would be needed.

Regards,

-alex