draw transparent text on a transparent background problem ?

[marc_256]

Hello,

After a lot of time of testing, I still have this transparent text problem ...
see viewtopic.php?f=13&t=76081

When I draw transparent text on a transparent background, the text quality is very, very bad ?
Is this a bug or is this normal ?



Tested with WIN10 - x64 - PB5.72 x64 and PB5.72 x86 - (PB5.73 x64)

marc

[STARGÅTE]

On this example code, I can not see any differents:

Code: Select all

Enumeration
	#Window
	#Gadget
	#Image
	#Font
EndEnumeration

Procedure CustomBackground(X, Y, Front, Back)
	If X % 40 < 20 XOr Y % 40 < 20
		ProcedureReturn $FF0000C0
	Else
		ProcedureReturn $FF0000FF
	EndIf
EndProcedure

OpenWindow(#Window, 0, 0, 800, 450, "Vector Canvas Gadget", #PB_Window_MaximizeGadget|#PB_Window_MaximizeGadget|#PB_Window_SizeGadget|#PB_Window_ScreenCentered)
CanvasGadget(#Gadget, 0, 0, WindowWidth(#Window), WindowHeight(#Window), #PB_Canvas_Keyboard)

LoadFont(#Font, "Calibri", 48)

CreateImage(#Image, 800, 450, 32)
If StartDrawing(ImageOutput(#Image))
	DrawingMode(#PB_2DDrawing_Gradient|#PB_2DDrawing_AllChannels)
	LinearGradient(0, 0, 0, 450)
	GradientColor(0.0, $FFFF0000)
	GradientColor(1.0, $00FF0000)
	Box(0, 0, 400, 450)
	DrawingMode(#PB_2DDrawing_AllChannels)
	Box(400, 0, 400, 450, $00000000)
	Line(400, 0, 1, 450, $FF000000)
	DrawingMode(#PB_2DDrawing_AlphaBlend|#PB_2DDrawing_Transparent)
	DrawText(20, 20, "Text on semi-transparent image", $FFFFFFFF)
	DrawText(420, 20, "Text on transparent image", $FFFFFFFF)
	DrawingFont(FontID(#Font))
	For I = 50 To 350 Step 50
		DrawText(25, I, "Hello World!", $FFFFFFFF)
		DrawText(425, I, "Hello World!", $FFFFFFFF)
	Next
	StopDrawing()
EndIf

If StartDrawing(CanvasOutput(#Gadget))
	DrawingMode(#PB_2DDrawing_CustomFilter)
	CustomFilterCallback(@CustomBackground())
	Box(0, 0, 800, 450)
	DrawingMode(#PB_2DDrawing_AlphaBlend)
	DrawAlphaImage(ImageID(#Image), 0, 0)
	StopDrawing()
EndIf

Repeat
Until WaitWindowEvent() = #PB_Event_CloseWindow

End

[Demivec]

@marc_256: See my solution code in the thread you linked to. It draws the text consistently over both backgrounds.

[marc_256]

Hallo STARGÅTE,

I use Windowed ScreenOutput ...

@Demivec,

I tested it and is not working for my application,
so I use a workaround now ... but I loos some speed now.
And speed is all I need in my CAD/CAM/CNC program.


thanks,
marco

[STARGÅTE]

Hallo STARGÅTE,

I use Windowed ScreenOutput ...

For ScreenOutput() the flag #PB_2DDrawing_AlphaBlend is not supported by DrawingMode()!
That meens you can not draw a text with semi-transparent anti-aliased border!
The text is just drawed with "clear type" mode, if this is activated in windows.
Here an image for comparison:

___



However, you can draw the text on an semi-transparent image, and draw this image with DrawAlphaImage, which supported this alpha channel. (as you can see in code below).

Code: Select all

Enumeration
	#Window
	#Image
	#Font
EndEnumeration

InitSprite()

OpenWindow(#Window, 0, 0, 1200, 450, "Vector Canvas Gadget", #PB_Window_MaximizeGadget|#PB_Window_MaximizeGadget|#PB_Window_SizeGadget|#PB_Window_ScreenCentered)
OpenWindowedScreen(WindowID(#Window), 0, 0, 1200, 450)

LoadFont(#Font, "Calibri", 48)

CreateImage(#Image, 800, 450, 32)
If StartDrawing(ImageOutput(#Image))
	DrawingMode(#PB_2DDrawing_Gradient|#PB_2DDrawing_AllChannels)
	LinearGradient(0, 0, 0, 450)
	GradientColor(0.0, $FFFF0000)
	GradientColor(1.0, $00FF0000)
	Box(0, 0, 400, 450)
	DrawingMode(#PB_2DDrawing_AllChannels)
	Box(400, 0, 400, 450, $00000000)
	Line(400, 0, 1, 450, $FF000000)
	DrawingMode(#PB_2DDrawing_AlphaBlend|#PB_2DDrawing_Transparent)
	DrawText(20, 20, "Text on semi-transparent image", $FFFFFFFF)
	DrawText(420, 20, "Text on transparent image", $FFFFFFFF)
	DrawingFont(FontID(#Font))
	For I = 50 To 350 Step 50
		DrawText(25, I, "Hello World!", $FFFFFFFF)
		DrawText(425, I, "Hello World!", $FFFFFFFF)
	Next
	StopDrawing()
EndIf

If StartDrawing(ScreenOutput())
	Box(0, 0, 1200, 450, $000000)
	DrawAlphaImage(ImageID(#Image), 0, 0)
	DrawingMode(#PB_2DDrawing_Transparent)
	DrawText(820, 20, "Text on screen do not support alpha blending!", $FFFFFF)
	DrawingFont(FontID(#Font))
	For I = 50 To 350 Step 50
		DrawText(825, I, "Hello World!", $FFFFFF)
	Next
	StopDrawing()
EndIf

Repeat
	FlipBuffers()
Until WaitWindowEvent() = #PB_Event_CloseWindow

End

[marc_256]

Hi STARGÅTE,

OK, now I understand why it don't work in Windowed Screen mode ...

thanks for clearing this up,
marco

[infratec]

You can use a CanvasGadget which fills the whole 'screen' and draw everything on this gadget.

[oreopa]

Just an aside, I really like the UI of your CAD/CAM program - especially in other screenshots Elegant and simple. Congrats for that...

[marc_256]

@ infratec,
Can I use images and sprites on canvas gadget ?
First at all I lover PB, I have an love/hate relationship with PB.
In the last 10 years I use PB, I never could finish one huge program with PB.
There was always a bug or a malfunction in PB to finish my work.
So, now I will never use one PB gadget anymore in my programs ...
and create them myself inside the screen mode.

@oreopa
Thanks for your support ...
my latest CNC part is the best GUI I ever created,
will show it in other forum selection soon ...

thanks,
marco

[infratec]

You can use images, since a canvas can be a container.

As I know you can not place gadgets on a screen, only inside a window.
So if you now use a screen for sprites, how can you place gedgets on it?
And if ou use a window 'beside' you can place a canvas over the whole window to draw on it.

If you want to use something like gadgets on a screen you have to do this by yourself.
This is the case since I use PB.

[Saki]

On canvas everything is actually much easier.
Sprites can also be output on canvas, you just have to clip the mask away.
Images and text can be output directly to canvas.
The chunk of your program are the many graphic outputs.
The output on canvas or image is very fast.
The time needed to code all this is in my opinion much less and more simple than if you do it all on screen.
Speed is often just a matter of precise consideration.

The more you deal with all these things the better you can do it.
Actually you are constantly learning.
When you are finished with a big project, you often realize that you could have done a lot better with new insights.
That is just so, annoying, but with more learning hardly to avoid.

Best Regards Saki

[Shardik]

As I know you can not place gadgets on a screen, only inside a window.

If you want to use something like gadgets on a screen you have to do this by yourself.
This is the case since I use PB.

You may try PureBasic's library Gadget3D instead of Gadget (just try PureBasic's example Gadget3d.pb - it's even cross-platform!):

The Gadget3D library allows to create complex Graphical User Interface (GUI) directly over the screen area, using the 3D engine. This is mainly intended for game or application which needs user inputs while running in fullscreen mode.