Canvases - Elements - Hag GUI for Cobra
Canvases are basic GUI elements that you can draw to. In essence, an ordinary Cobra sprite that integrates well with other hag GUI elements.
By integrating in this way, you can show, hide, reposition, etc. a hag form and the canvas will be shown, hidden, repositioned, etc. in the same way.
Canvases also support tooltips.
Canvases export the following read or write variables:
canvas.e: Element - Canvas sprite to draw to.
Canvases export the following read-only variables:
canvas.x: Integer - Canvas x position
canvas.y: Integer - Canvas y position
canvas.w: Integer - Canvas width
canvas.h: Integer - Canvas height
canvas.enabled: Boolean - If canvas is enabled
canvas.visible: Boolean - If canvas is visible
For two ready-to-run examples, see Example_Canvas and Example_Scrollbar in the Examples download.
Example with sliders:
Uses
hagC2D,
cobra2D,
keyset
{
This example uses a canvas
Reasons for using a canvas over a normal image/sprite are:
Supports hag tooltips
Integrates well with hag's SpriteIndexing
Can be shown/hidden with a form like a normal hag element
Can be enabled/disabled with a form like a normal hag element
Can be freed with any form like a normal hag element
}
Var
frmMain: ^forms
btnClose: ^buttons
cvsExample: ^canvases
sliExample: Array[3] of ^sliders
txtExample: Array[3] of ^hTexts
background: Element
i: Integer
Procedure MyGui_UpdateCanvas()
Var
r, g, b: Real
str: String
Begin
r = (255.0 / 100.0) * ToReal(SliderGetPercent(sliExample[0]))
g = (255.0 / 100.0) * ToReal(SliderGetPercent(sliExample[1]))
b = (255.0 / 100.0) * ToReal(SliderGetPercent(sliExample[2]))
CLS(ToRGBA(r, g, b), cvsExample.e)
str = "Updated at "+millisecs
SetFont("arial", 16, 1, cvsExample.e)
PenColor(ToRGBA(0, 0, 0), cvsExample.e)
Text(21, 26, str, cvsExample.e)
PenColor(ToRGBA(255-r, 255-g, 255-b), cvsExample.e)
Text(20, 25, str, cvsExample.e)
End
Begin
SetAppName("Canvas + Sliders Example")
OpenScreen(320, 240, 32, FALSE, COB_SHOWBORDER+COB_SHOWCLOSE)
background = CreateSprite(320,240)
Cls(ToRGBA(235,233,237),background) ; Flip
// Init GUI
HagBaseDir("hag\")
HagInit(320, 240, 1) // Start at sprite index 1 because of the background sprite
HagLoadGuiTheme("xp")
// Set up GUI Elements
frmMain = CreateForm()
cvsExample = CreateCanvas(frmMain, 20, 20, 280, 80, "This is a Hag Canvas")
sliExample[0] = CreateSlider(frmMain, 20, 120, 220, 0, 0, "Adjust Red channel")
sliExample[1] = CreateSlider(frmMain, 20, 140, 220, 0, 0, "Adjust Green channel")
sliExample[2] = CreateSlider(frmMain, 20, 160, 220, 0, 0, "Adjust Blue channel")
txtExample[0] = CreateText(frmMain, 260, 120, "Red")
txtExample[1] = CreateText(frmMain, 260, 140, "Green")
txtExample[2] = CreateText(frmMain, 260, 160, "Blue")
SliderSetPercent(sliExample[0], 70)
SliderSetPercent(sliExample[1], 70)
SliderSetPercent(sliExample[2], 100)
btnClose = CreateButton(frmMain, 250, 200, 50, "Close", "Click to close this program")
FocusButton(btnClose)
MyGui_UpdateCanvas()
HagUpdateOnce()
While ExitRequested = FALSE
HagUpdateAll_AutoKeys()
If hag_tooltip <> "" then
SetAppName("Tooltip: "+hag_tooltip)
Else
SetAppName("Canvas + Sliders Example")
Endif
For i = 0 to 2
If SliderUpdated(sliExample[i]) then
MyGui_UpdateCanvas()
Endif
Next
If KeyHits(VK_H) > 0 then EnableForm(frmMain, FALSE, TRUE)
If KeyHits(VK_J) > 0 then EnableForm(frmMain, TRUE, TRUE)
If ButtonClicked(btnClose) then RequestExit
If KeyHits(VK_ESCAPE) > 0 then RequestExit
Flip
Pause(1)
Wend
HagFreeAll()
CloseScreen()
End
Example with scrollbar:
Uses
hagC2D,
cobra2D,
keyset
Const
IMG_HEIGHT = 1024
Var
frmMain: ^forms
btnClose: ^buttons
sbrMain: ^scrollBars
cvsMain: ^canvases
largeImage: Element
background: Element
x, y: Integer = 1
Begin
SetAppName("Scrollbar example")
OpenScreen(320, 240, 32, FALSE, COB_SHOWBORDER+COB_SHOWCLOSE)
background = CreateSprite(320,240)
Cls(ToRGBA(235,233,237),background) ; Flip
// Init GUI
HagBaseDir("hag\")
HagInit(320, 240, 1) // Start at sprite index because of the background sprite
HagLoadGuiTheme("xp")
// Create a really large image to draw to the canvas sprite
largeImage = CreateImage(270, IMG_HEIGHT)
CLS(ToRGBA(255,255,255), largeImage)
For x = -20 to 270 Step 20
For y = -20 to IMG_HEIGHT Step 20
Rect(x, y, Rand(1, 40), Rand(1, 40), ToRGBA(Rand(0,255),Rand(0,255),Rand(0,255),Rand(25,255)), TRUE, largeImage)
Next
Next
// Set up GUI Elements
frmMain = CreateForm()
cvsMain = CreateCanvas(frmMain,20,20,270,180)
sbrMain = CreateScrollBar(frmMain, 289, 21, 178)
ScrollBarSetLength(sbrMain, IMG_HEIGHT)
ScrollBarSetSpeed(sbrMain, 5)
SetScrollBarMouseWheelTargetElement(sbrMain, cvsMain.e)
btnClose = CreateButton(frmMain, 250, 207, 50, "Close")
FocusButton(btnClose)
HagUpdateOnce()
While ExitRequested = FALSE
HagUpdateAll_AutoKeys()
If ScrollBarUpdated(sbrMain) then
Rect(0, 0, 270, 180, ToRGBA(255,255,255), TRUE, cvsMain.e)
DrawImage(largeImage, 0, 0 - scrollBarOffset(sbrMain), cvsMain.e)
Rect(0, 0, 270, 180, ToRGBA(0,0,0), FALSE, cvsMain.e)
SetAppName("ScrollBar Percent: "+ToInt(ScrollBarPercent(sbrMain))+"%")
Endif
If ButtonClicked(btnClose) then RequestExit
If KeyHits(VK_ESCAPE) > 0 then RequestExit
Flip
Pause(1)
Wend
HagFreeAll()
CloseScreen()
End
Stay Subscribed
RSS feed or get updates by e-mail.
, subscribe to theYou can also contact me directly - I make an effort to reply to every e-mail.