Page 1 of 1
How to combine multiple images (Question).
Posted: Thu Oct 03, 2013 8:33 am
by Roberth_12
Hi, Greetings to all.
I'm starting to work with PureBasic v5.11 and mesclar need multiple images in bmp with black color background, but I can not get over the image you are left with transparent background, and the text is cropped. This is the first result I want to get (I really want mesclar 5 or 6 images):
This is my code:
Code: Select all
base = CreateImage(#PB_Any, 210, 210)
layer1 = LoadImage(#PB_Any, "backgrd.bmp")
layer2 = LoadImage(#PB_Any, "xclock.bmp")
StartDrawing(ImageOutput(layer1)) ; Create a layer, add some text
DrawingMode(#PB_2DDrawing_Transparent)
DrawText(15,40, "Hello World! - Hello World!", RGB(255,255,255))
DrawText(37, 133, "2DDrawing_Transparent", RGB(0,255,0))
StopDrawing()
StartDrawing(ImageOutput(layer2))
DrawingMode(#PB_2DDrawing_Transparent) ; Another layer
StopDrawing()
StartDrawing(ImageOutput(base)) ; combine the layers (same as 'Merge Visible' in Photoshop)
DrawingMode(#PB_2DDrawing_AlphaBlend)
DrawImage(ImageID(layer1),5,5)
DrawImage(ImageID(layer2),48,130)
StopDrawing()
OpenWindow(0,0,0,220,220,"",#PB_Window_SystemMenu|#PB_Window_ScreenCentered)
ImageGadget(7, 5, 5, 200, 210,ImageID(base))
Repeat:Until WaitWindowEvent() = #PB_Event_CloseWindow
Here the two images used:
I hope you can help and thanks in advance for your answers.
PS: English is not my native language, sorry for grammar errors.
Re: How to combine multiple images (Question).
Posted: Thu Oct 03, 2013 1:30 pm
by Alex777
An ordinary *.bmp image has no alpha channel. Change the background and clock images to 32-bit *.png files with transparency through the alpha channel. Then, this code works:
Code: Select all
UsePNGImageDecoder()
base = CreateImage(#PB_Any, 210, 210, 32, #Black)
layer1 = LoadImage(#PB_Any, "backgrd.png")
layer2 = LoadImage(#PB_Any, "xclock.png")
StartDrawing(ImageOutput(base))
DrawingMode(#PB_2DDrawing_AlphaBlend)
DrawImage(ImageID(layer1), 5 ,5)
DrawImage(ImageID(layer2), 48, 130)
DrawingMode(#PB_2DDrawing_Transparent)
DrawText(15, 40, "Hello World! - Hello World!", RGB(255,255,255))
DrawText(37, 133, "2DDrawing_Transparent", RGB(0,255,0))
StopDrawing()
OpenWindow(0,0,0,220,220,"",#PB_Window_SystemMenu|#PB_Window_ScreenCentered)
ImageGadget(7, 5, 5, 200, 210,ImageID(base))
Repeat:Until WaitWindowEvent() = #PB_Event_CloseWindow
Re: How to combine multiple images (Question).
Posted: Thu Oct 03, 2013 5:53 pm
by Roberth_12
The code has been operated well with images *. Png, thanks. But at least one of the upper layers use an image *. Bmp and if the need for the black background of the image transparent.
Re: How to combine multiple images (Question).
Posted: Thu Oct 03, 2013 8:38 pm
by Roberth_12
I have this solution using a custom filter, so you can choose the color that will be transparent in the images *.bmp. What do you think?
Code: Select all
Global TranspFilter_Color.f
Procedure Transparent_Filter(x, y, SrcColor, TrgColor)
If SrcColor = TranspFilter_Color
ProcedureReturn TrgColor
EndIf
ProcedureReturn SrcColor
EndProcedure
base.f = CreateImage(#PB_Any, 200, 200)
layer1.f = LoadImage(#PB_Any, "backgrd.bmp")
layer2.f = LoadImage(#PB_Any, "xclock.bmp")
layer3.f = LoadImage(#PB_Any, "smile.bmp")
StartDrawing(ImageOutput(base))
DrawingMode(#PB_2DDrawing_CustomFilter) ;CustomFilter
TranspFilter_Color = RGBA($00, $00, $00, $FF) ;This color will not be drawn by the filter
CustomFilterCallback(@Transparent_Filter())
DrawImage(ImageID(layer1), 5, 5)
DrawImage(ImageID(layer2), 10, 10)
DrawImage(ImageID(layer3), 120, 30)
DrawingMode(#PB_2DDrawing_Transparent)
DrawText(25, 82, "Hello World!", RGB(0,255,0))
DrawText(45, 132, "Transparent Filter Color", RGB(255,255,255))
StopDrawing()
OpenWindow(0,0,0,220,220,"Transparent_Filter",#PB_Window_SystemMenu | #PB_Window_ScreenCentered)
ImageGadget(7, 5, 5, 200, 210,ImageID(base))
Repeat:Until WaitWindowEvent() = #PB_Event_CloseWindow
Re: How to combine multiple images (Question).
Posted: Sat Oct 05, 2013 1:17 am
by Alex777
Yah, that works, but colors should be defined as Longs and image identifiers should be Integers.
Re: How to combine multiple images (Question).
Posted: Sat Oct 05, 2013 1:33 am
by IdeasVacuum
....a lot of bitmaps will either fail or the edges will be a bit jaggy ('saw tooth'). Far better to stick with PNG images.
Re: How to combine multiple images (Question).
Posted: Sat Oct 05, 2013 3:04 am
by Roberth_12
True, but usually have a bmp image and we can use it without having to convert it to png and edit it to make a color transparent.
Re: How to combine multiple images (Question).
Posted: Sat Oct 05, 2013 6:18 am
by PB
Here's some old code I had lying around. It loads a BMP image
and then superimposes text over it. Maybe it can help you?
Code: Select all
; Palette index 0 must be the transparent colour of the bitmap!
If OpenWindow(0,200,200,200,150,"Test",#PB_Window_SystemMenu)
i=LoadImage_(0,"C:\Image.bmp",#IMAGE_BITMAP,0,0,#LR_LOADFROMFILE|#LR_LOADTRANSPARENT|#LR_LOADMAP3DCOLORS)
ImageGadget(0,50,20,0,0,i)
TextGadget(1,50,40,100,20,"TRANSPARENT")
InvalidateRect_(WindowID(0),0,1)
Repeat : Until WaitWindowEvent()=#PB_Event_CloseWindow
EndIf
Re: How to combine multiple images (Question).
Posted: Sat Oct 26, 2013 8:28 am
by netmaestro
If you're on Windows and you need transparent drawing at very fast speeds for images with no alpha layer, TransparentBlt should do the trick. Here's a simple example of how to implement it in your project, the parameters are pretty much self-documenting:
Code: Select all
Import "msimg32.lib"
TransparentBlt( hdcDest, nXOriginDest, nYOriginDest, nWidthDest, hHeightDest, hdcSrc, nXOriginSrc, nYOriginSrc, nWidthSrc, nHeightSrc, crTransparent )
EndImport
CreateImage(0, 256, 256, 24, RGB(0,0,80)) ; background
CreateImage(1, 128, 128, 24, #Black) ; image to be drawn transparent
StartDrawing(ImageOutput(1))
DrawingMode(#PB_2DDrawing_Outlined)
Circle(63,63,60,#White)
Circle(63,63,40,#Green)
Circle(63,63,20,#Red)
StopDrawing()
CreateImage(3, 256 , 256, 24) ; buffer image to be output to screen
hdcDest = StartDrawing(ImageOutput(3))
DrawImage(ImageID(0),0,0) ; draw the background to the buffer image
hdcSrc = CreateCompatibleDC_(0)
SelectObject_(hdcSrc, ImageID(1))
TransparentBlt(hdcDest,64,64,128,128,hdcSrc,0,0,128,128,#Black)
DeleteDC_(hdcSrc)
StopDrawing()
OpenWindow(0,0,0,320,320,"",#PB_Window_SystemMenu|#PB_Window_ScreenCentered)
ImageGadget(0, 32, 32, 0, 0, ImageID(3))
Repeat:Until WaitWindowEvent() = #PB_Event_CloseWindow