Ordering 2D-Drawing - curious...

[ReneMiner]

OK, to make it quick:
I used an empty TBGL-Skeleton-Script and built that stuff in that I'm curious about.

First it's the Font-behaviour, I setup a small and a large font,
TBGL_GetFontTextSize gives always back the width of the large one.

Second is the order of drawing. I added a sub that just draws 3 TBGL_RECTs
the first should be brighter and offset 2 points left up of the main-Rect, so there'a a highlighted upper left border
the second sould be darker and 2 points right down and be a shade on the lower-right border.
the third shall be the main rectangle, drawn over the others. But if I do it that way, the last one gets drawn first.

I found out that I have to draw the on-top visible rect as first, why and how is that?


See for yourself, try to uncomment the commented last lines and comment the first rect out.





'
' The 2D primitive skeleton for TBGL
' , started on 11-02-2012
'

Uses "TBGL"

%SmallFont = 1 'these are my two fonts
%LargeFont = 2

Function TBMain()
Local hWnd As DWord
Local FrameRate As Double
Local width, height As Long
Local i,lW,lH As Long

' -- Create and show window
hWnd = TBGL_CreateWindowEx("TBGL script - press ESC to quit", 640, 480, 32, %TBGL_WS_WINDOWED Or %TBGL_WS_CLOSEBOX)
TBGL_ShowWindow

TBGL_GetWindowClient( hWnd, width, height )

' create fonts...
TBGL_BuildFont TBGL_FontHandle("Lucida Console", 14), %SmallFont
TBGL_BuildFont TBGL_FontHandle("Lucida Console", 20), %LargeFont


' -- Resets status of all keys
TBGL_ResetKeyState()

' -- Main loop
While TBGL_IsWindow(hWnd)
' -- Read the current frame rate.
FrameRate = TBGL_GetFrameRate

' -- As we don't draw a full background, we need to clear the framebuffer
TBGL_ClearFrame
' -- Set the resolution and the coordinate system
TBGL_RenderMatrix2D (0,height,width,0)

' now draw the small font aligned on the right:
TBGL_Color 0, 255, 128
TBGL_SetActiveFont %SmallFont
TBGL_GetFontTextSize( "TESTSTRING", lW, lH )
TBGL_PrintFont "TESTSTRING", width - lW, 24

' and the large font, also aligned on the right:

TBGL_Color 0, 128, 255
TBGL_SetActiveFont %LargeFont
TBGL_GetFontTextSize( "TESTSTRING", lW, lH )
TBGL_PrintFont "TESTSTRING", width - lW, 72

' -- now draw a framed rectangle
' left, top width height Red Green Blue
drawFramedRect2D( 100, 100, 100, 100, 123, 123 , 60)

'Show the rendered stuff
TBGL_DrawFrame

' -- ESCAPE key to exit application
If TBGL_GetWindowKeyState(hWnd, %VK_ESCAPE) Then Exit While

Wend

TBGL_DestroyWindow
End Function
' ------------------------------------------------------------------------------------
Sub DrawFramedRect2D(ByVal X As Long, ByVal Y As Long, ByVal W As Long, ByVal H As Long, _
ByVal R As Byte, ByVal G As Byte, ByVal B As Byte)

Local lR,lG,lB As Long

TBGL_Color R,G,B ' the given color
TBGL_Rect( X, Y, X + W , Y + H )

' now lighten the color
lR = R + 32 : If lR > 255 Then lR = 255
lG = G + 32 : If lG > 255 Then lG = 255
lB = B + 32 : If lB > 255 Then lB = 255

TBGL_Color lR, LG, lB
TBGL_Rect( X - 2, Y - 2, X + W - 2, Y + H - 2 )

' darken the color
lR = R - 32 : If lR < 0 Then lR = 0
lG = G - 32 : If lG < 0 Then lG = 0
lB = B - 32 : If lB < 0 Then lB = 0

TBGL_Color lR, lG, lB
TBGL_Rect( X + 2, Y + 2, X + W + 2 , Y + H + 2 )

' usually the last drawn stuff has to be on top of all that
' has been drawn before, but try to comment the first TBGL_Rect out
' and enable the following

'TBGL_Color 255,0,0 ' bright red just to see...
'TBGL_Rect( X, Y, X + W , Y + H )

End Sub

EDIT:

If I draw a Rect to display text inside, I have to draw the text first, then the rect, else the text is hidden behind the rect.

Intentionally I used TBGL_Line to draw highlight and shade. If I do that I have to draw (in this order)

1. shade (2 lines)
2. rect
3. highlight (2 lines)

so the in front laying rect has to be drawn inbetween. That makes me wonder. Are there special rules that I've overseen?
Do I have to order by color or by size or day of week?

[peter]

Do I have to order by color or by size or day of week?

LOL

[Petr Schreiber]

Hi Rene,

this is a feature of GPU accelerated graphics with z-buffer in general (when using default fastest "less" testing mode) and it is related to way depth testing of fragments is performed.
When you need order dependent 2D graphics you want to disable depth testing before you draw anything:


tbgl_UseDepth false


With latest TBGL, I would suggest this more systematic approach (which OpenGL doesn't have):


TBGL_PushStateProtect %TBGL_DEPTH
... render here ...
TBGL_PopStateProtect


Alternatively, you could use this too:


tbgl_DepthFunc %TBGL_LEQUAL

... but as you do pure 2D, using Z-buffer seems very redundant to me.

Petr

P.S. Regarding TBGL_GetFontTextSize - I am examining the issue

[ReneMiner]

no I'm not dealing with pure 2D. I want to create some buttons in front of my 3d-drawing-screen. First I render 3d, then I draw text and buttons. Making good progresses in my little 3d-poly-draw and I'll try depth-switch now :)

btw. Push + Pop are my favourites, I've got to sing you some praises for building them in.

[ReneMiner]

I append this here, (similar type of question)

Can I draw Text behind a 3d-Viewport?

As follows, (I drew a small picture to get it clear)

I want to use the sides of TBGL_Window like some lists and draw/print text there (black on yellow in picture) so it gets covered by the 3d-Viewport (blue & orange sphere) if it's a longer string. Currently (pink) it looks like this, the text covers the 3d-view, but I want it to disappear behind, so longer Strings get covered ( like the black "some text" ).

And, can I set different backcolor to different viewports somehow or can I just draw two yellow boxes and display just text to the right side of the 3d-Viewport for now?

[Petr Schreiber]

Hi Rene,

it is all about order of operation and/or depth.
If you want your text to behave like the black one (hide behind already painted stuff), you need to paint something the text could hide behind.

Back color is applied only after TBGL_ClearFrame call, using squares instead could be more simple solution.


Petr