TBGL_RenderMatrix2D, how to use it?

[Michael Hartlef]

Hi Petr,

is TBGL_RenderMatrix2D some kind of gluOrtho2D functionality?
How do I use it? I guess it could be handy for selfmade GUI's?

[kryton9]

I am sure Petr is working on the samples and documentation. There is so much power in there, just look at that animated head he did with your fine animated heads for the game.

Well glad to see read some posts today. Now back to studies.

[Petr Schreiber]

Hi Mike,

yes, it is almost the same.

It automatically sets 2D resolution when you resize window, future versions may allow to set fixed one using optional parameters.

Here is simple script:


'
' TBGL 2D Mode #1
'
Uses "TBGL"
Uses "UI"

Dim hWnd As Dword

hWnd = TBGL_CreateWindowEx("Render using 2D techniques - press ESC to quit", 640, 480, 32, 0)
TBGL_ShowWindow

DIM hFont AS DWORD = Font_Create("Courier New", 9)
TBGL_BuildFont hFont

TBGL_GetAsyncKeyState(-1) ' Resets status of all keys
tbgl_LineWidth 3

While TBGL_IsWindow(hWnd)

tbgl_ClearFrame

tbgl_RenderMatrix2D

tbgl_color 255,128,64
tbgl_PrintFont "+ 160,120", 160,120,0
tbgl_PrintFont "+ 500,400", 500,400,0

tbgl_BeginPoly %GL_LINE_Loop
tbgl_color 255,128,0
tbgl_Vertex 0, 0
tbgl_color 0,128,255
tbgl_Vertex 639, 0
tbgl_color 128,0,255
tbgl_Vertex 639, 479
tbgl_color 255,0,128
tbgl_Vertex 0, 479
tbgl_EndPoly

tbgl_color 255,255,255
tbgl_BeginPoly %GL_LINES
tbgl_Vertex 0, 0
tbgl_Vertex 639, 479
tbgl_Vertex 639, 0
tbgl_Vertex 0, 479
tbgl_EndPoly

tbgl_DrawFrame

If TBGL_GetWindowKeyState( hWnd, %VK_ESCAPE) Then Exit While

Wend

tbgl_KillFont
TBGL_DestroyWindow



Bye,
Petr

[Petr Schreiber]

Here is somehing more UI-like:


'
' TBGL 2D Mode #2
'
Uses "TBGL"
Uses "UI"

Dim hWnd As Dword

hWnd = TBGL_CreateWindowEx("Render using 2D techniques - press ESC to quit", 640, 480, 32, 0)
TBGL_ShowWindow

%MSG_MOUSE_OVER = 1
%MSG_MOUSE_CLICK = 2
DIM hFont AS DWORD = Font_Create("Courier New", 9)
TBGL_BuildFont hFont

TBGL_GetAsyncKeyState(-1) ' Resets status of all keys
tbgl_UseDepthMask 0
tbgl_LineWidth 3

dim WhatHappened as long
While TBGL_IsWindow(hWnd)

tbgl_ClearFrame

tbgl_RenderMatrix2D

WhatHappened = DrawButton("Move mouse", 270,320,100,30)

select case WhatHappened
case %MSG_MOUSE_OVER
DrawButton("Mouse", 270,220+sin(GetTickcount/100+1)*10,100,32)
DrawButton("is", 270,120+sin(GetTickcount/100+2)*10,100,32)
DrawButton("on button", 270,20+sin(GetTickcount/100+3)*10,100,32)

case %MSG_MOUSE_CLICK
DrawButton("Clicking...", 270+sin(GetTickcount/100+3)*10,220,100,32)

end select

DrawButton("Button 1", 170,320,100,30)
DrawButton("Button 2", 370,320,100,30)


tbgl_DrawFrame

If TBGL_GetWindowKeyState( hWnd, %VK_ESCAPE) Then Exit While

Wend

tbgl_KillFont
TBGL_DestroyWindow

function DrawButton( bText as string, x as long, y as long, length as long, height as long ) as long
function = 0
local mx as long = tbgl_MouseGetPosX
local cx, cy as long
tbgl_GetWindowClient hWnd, cx, cy
local my as long = cy-tbgl_MouseGetPosy

tbgl_BeginPoly %GL_QUADS
tbgl_color 128,128,128
tbgl_Vertex x+length, y+height
tbgl_Vertex x, y+height
if mx >< x, x+length and my >< y, y+height then
tbgl_color 255,0,0
if tbgl_MouseGetLbutton then
function = %MSG_MOUSE_CLICK
else
function = %MSG_MOUSE_OVER
end if
else
tbgl_color 64,64,64
end if

tbgl_Vertex x, y
tbgl_Vertex x+length, y

tbgl_EndPoly


tbgl_Color 255,255,255
tbgl_PrintFont bText, x+length/2 - (len(bText)/2*7), y+height/2-4,0

end function



Bye,
Petr

[ErosOlmi]

:D what a nice example !

[Petr Schreiber]

Thanks Eros :),

here is more clean version:


'=============================================================================
'= Basic TBGL UI =
'= ( requires TBGL 0.2.0.0 ) =
'= =
'= Petr Schreiber, 2007 =
'=============================================================================

Uses "TBGL"
Uses "UI"

Dim hWnd As Dword

hWnd = TBGL_CreateWindowEx("Basic UI - press ESC to quit", 640, 480, 32, 0)
TBGL_ShowWindow

' Initializes UI internals
UI_Init()

' Dialog definition
%ID_SAYHELLO = 1
%ID_CHECKALL = 2
%ID_WANT1 = 5
%ID_WANT2 = 6
%ID_WANT3 = 7
%ID_BTN1 = 11
%ID_BTN2 = 12
%ID_BTN3 = 13

UI_AddControl( %UICTRL_BUTTON, %ID_SAYHELLO, "Say hello", 270, 110, 100, 30 )
UI_AddControl( %UICTRL_BUTTON, %ID_CHECKALL, "Check all", 270, 70, 100, 30 )
UI_AddControl( %UICTRL_CHECKBOX, %ID_WANT1, "I want button 01", 50, 200, 120, 30 )
UI_AddControl( %UICTRL_CHECKBOX, %ID_WANT2, "I want button 02", 50, 240, 120, 30 )
UI_AddControl( %UICTRL_CHECKBOX, %ID_WANT3, "I want button 03", 50, 280, 120, 30 )
UI_AddControl( %UICTRL_BUTTON, %ID_BTN1, "button 01", 270, 200, 100, 30 )
UI_AddControl( %UICTRL_BUTTON, %ID_BTN2, "button 02", 270, 240, 100, 30 )
UI_AddControl( %UICTRL_BUTTON, %ID_BTN3, "button 03", 270, 280, 100, 30 )

TBGL_GetAsyncKeyState(-1) ' Resets status of all keys


While TBGL_IsWindow(hWnd)

tbgl_ClearFrame

' Renders whole UI in one go

UI_Render


tbgl_DrawFrame

' Reactions on UI events
if ui_control(%ID_SAYHELLO).checked = 1 then msgbox hWnd, "Hello"

if ui_control(%ID_CHECKALL).checked = 1 then
ui_control(%ID_WANT1).checked = 1
ui_control(%ID_WANT2).checked = 1
ui_control(%ID_WANT3).checked = 1
end if

if ui_control(%ID_WANT1).checked = 1 then
ui_control(%ID_BTN1).render = 1
else
ui_control(%ID_BTN1).render = 0
end if

if ui_control(%ID_WANT2).checked = 1 then
ui_control(%ID_BTN2).render = 1
else
ui_control(%ID_BTN2).render = 0
end if

if ui_control(%ID_WANT3).checked = 1 then
ui_control(%ID_BTN3).render = 1
else
ui_control(%ID_BTN3).render = 0
end if
If TBGL_GetWindowKeyState( hWnd, %VK_ESCAPE) Then Exit While

Wend

UI_DeInit()

TBGL_DestroyWindow

' -----------------------------------------------------------------------------------------------------------------------------------

sub UI_DeInit()
tbgl_KillFont
end sub

sub UI_Init()

%UICTRL_BUTTON = 1
%UICTRL_CHECKBOX = 2

type uiControls
cType as byte
render as byte

cText as asciiz * 256
posX as long
posY as long
length as long
height as long

checked as byte
end type

global ui_control(64) as uiControls
global ui_NumControls as long = 64

DIM hFont AS DWORD = Font_Create("Courier New", 9)
TBGL_BuildFont hFont

global ui_WasMouseButtonDown as long

end sub

sub UI_AddControl( cType as byte, ID as long, bText as string, x as long, y as long, length as long, height as long )
if ID > ui_NumControls then
redim preserve ui_control(ID)
ui_NumControls = id
end if
ui_control(id).cType = cType
ui_control(id).render= 1
ui_control(id).cText = bText
ui_control(id).posx = x
ui_control(id).posy = y
ui_control(id).length= length
ui_control(id).height= height
ui_control(id).checked= 0

end sub

sub UI_Render()
tbgl_UseDepthMask 0
tbgl_RenderMatrix2D

local i as long
local mx as long = tbgl_MouseGetPosX
local cx, cy as long
tbgl_GetWindowClient hWnd, cx, cy
local my as long = tbgl_MouseGetPosy
local mb as long = tbgl_MouseGetLbutton
local highlight as byte


for i = 1 to ui_NumControls
if ui_control(i).render = 0 then iterate for
highlight = 0
if ui_control(i).cType <> %UICTRL_CHECKBOX then ui_control(i).checked = 0
if mx >< ui_control(i).posx, ui_control(i).posx+ui_control(i).length and my >< ui_control(i).posy, ui_control(i).posy+ui_control(i).height then
highlight = 1
if mb and ui_WasMouseButtonDown = 0 then ui_control(i).checked = ui_control(i).checked xor 1

end if

select case ui_control(i).cType
case %UICTRL_BUTTON

tbgl_BeginPoly %GL_QUADS
if highlight then
tbgl_color 255,0,0
else
tbgl_color 64,64,64
end if
tbgl_Vertex ui_control(i).posx+ui_control(i).length, cy-ui_control(i).posy-ui_control(i).height
tbgl_Vertex ui_control(i).posx, cy-ui_control(i).posy-ui_control(i).height

tbgl_color 128,128,128

tbgl_Vertex ui_control(i).posx, cy-ui_control(i).posy
tbgl_Vertex ui_control(i).posx+ui_control(i).length, cy-ui_control(i).posy

tbgl_EndPoly

tbgl_Color 255,255,255
tbgl_PrintFont ui_control(i).cText, ui_control(i).posx+ui_control(i).length/2 - (len(ui_control(i).cText)/2*7), cy-ui_control(i).posy-ui_control(i).height/2-4,0


case %UICTRL_CHECKBOX
if highlight = 1 then
tbgl_color 255,0,0
else
if ui_control(i).checked = 1 then
tbgl_color 0,128,0
else
tbgl_color 64,64,64
end if

end if
tbgl_BeginPoly %GL_QUADS
tbgl_Vertex ui_control(i).posx+15, cy-ui_control(i).posy-15
tbgl_Vertex ui_control(i).posx, cy-ui_control(i).posy-15

if ui_control(i).checked = 1 then
tbgl_color 0,255,0
else
tbgl_color 128,128,128
end if

tbgl_Vertex ui_control(i).posx, cy-ui_control(i).posy
tbgl_Vertex ui_control(i).posx+15, cy-ui_control(i).posy

tbgl_EndPoly

tbgl_Color 255,255,255
tbgl_PrintFont ui_control(i).cText, ui_control(i).posx+20, cy-ui_control(i).posy-10,0

end select
next

ui_WasMouseButtonDown = mb

tbgl_UseDepthMask 1
end sub


Bye,
Petr

[Michael Hartlef]

Thanks Petr,

i'll check the sources tonight.

Michael

[ErosOlmi]

This last example seems having problems redimensioning TBGL window.
Sometimes all disappear or in other cases objects are drawn interleaved with black lines.

Eros

[kryton9]

Petr, those are amazing examples. So this means we can use the buildfont and position it easily now on the screen where we want, woohoo.

Also those controls were so nice looking. I can see some incredible UI's coming with those for sure. THanks for those really nice examples and code!!

[Petr Schreiber]

Hi kryton,

thanks for positive reaction :)
I must study problem Eros has with resizing, it does not appear on my PC so it will be harder to solve.


Bye,
Petr

EDIT: Eros, problem fixed I think, try again the last sample ( I updated it ). Sorry for troubles.

[ErosOlmi]

Solved. Thanks

[Michael Hartlef]

I german I would say GEIL ;D This is a great addition. I was playing with GluOrtho2D before, but this makes everything so much easier. Thank you so much Petr. :)

[Petr Schreiber]

Thanks Mike :)

Bye,
Petr

[Michael Hartlef]

Here is an early screenshot of a project that will use TBGL_RENDERMATRIX2D ;)

I think I mentioned it before. Thanks Petr for the UI example and also the BOXMASTER example. They were a good start for my needs. First thing I customized was a way to handle a menu easily. Even with functioncalls added to the menu items.

Cheers
Michael

[Petr Schreiber]

Mike,

this looks -again- very profesional!
If you need any explanation on bones from my side or new functionality just tell me!

The screen really made me happy!


Bye,
Petr

[Michael Hartlef]

I'm glad it did.

Here is a quick about screen for thinPOSE.

[Petr Schreiber]

Looks good,

I can't wait to try it ;)
I totally forgot you are working on it, so I was planning to do the poser myself.
But as I see your screens... this will rock, I know it!


Thanks,
Petr

[kryton9]

Mike, wow the preview screen shots look incredible. Very professional looking for sure.
I didn't know you were that far a long on it. Thanks for the preview shots, it looks very exciting!!