Page 1 of 1

Canvas Gadget - How is this code?

Posted: Wed Jan 04, 2012 1:58 am
by Caffeine
Hi all,

Just wondering if you could let me know if this code looks ok as a basic start? It's been a while since I used PB so I've very rusty.

Basically this code will be the basis for a simple program launcher, i.e It'll read a directory and populate the window with buttons. This code is just a test of that functionality on a very basic level. It should highlight the dummy button when the mouse is over it etc.

I just wanted to check the code looked ok to the professionals on here....

Code: Select all

#Window = 0

Global myGadgetHeight = 50, myGadgetWidth = 100

If OpenWindow(#Window, 0, 0, 100, 300, "Test")
  
  ; Create some canvas areas to draw our custom buttons on
  For buttonContainer = 1 To 5
    CanvasGadget(buttonContainer, 0, ypos, 100, 50)
    ypos = ypos + 51
  Next
  
  ; Draw our custom buttons
  For buttonBox = 1 To 5
    StartDrawing(CanvasOutput(buttonBox))
    Box(0, 0, myGadgetWidth, myGadgetHeight, RGB($44, $00, $00))
    StopDrawing()
  Next
  
EndIf

Procedure mouseEntered (thisGadget)
  
        StartDrawing(CanvasOutput(thisGadget))
          Box(0,0,myGadgetWidth,myGadgetHeight,RGB($00, $44, $00))
        StopDrawing()
  
EndProcedure
  
Procedure mouseLeft (thisGadget)
  
        StartDrawing(CanvasOutput(thisGadget))
          Box(0,0,myGadgetWidth,myGadgetHeight,RGB($44, $00, $00))
        StopDrawing()
  
EndProcedure

Repeat
  Event = WaitWindowEvent()
  
  Select Event
      
    Case #PB_Event_Gadget
      
      thisGadget = EventGadget()
      
           If EventType() = #PB_EventType_MouseEnter
             mouseEntered(thisGadget)
           ElseIf EventType() = #PB_EventType_MouseLeave  
             mouseLeft(thisGadget)
           EndIf    
      
  EndSelect    

Until Event = #PB_Event_CloseWindow

Re: Canvas Gadget - How is this code?

Posted: Wed Jan 04, 2012 6:15 am
by BasicallyPure
Hi,
Your code looks fine as it is.

Here is a modification to your code that I came up with that uses only one procedure.

Code: Select all

#Window = 0

Global myGadgetHeight = 50, myGadgetWidth = 100

If OpenWindow(#Window, 0, 0, 100, 300, "Test")
   
   ; Create some canvas areas to draw our custom buttons on
   For buttonContainer = 1 To 5
      CanvasGadget(buttonContainer, 0, ypos, 100, 50)
      ypos = ypos + 51
   Next
   
   ; Draw our custom buttons
   For buttonBox = 1 To 5
      StartDrawing(CanvasOutput(buttonBox))
         Box(0, 0, myGadgetWidth, myGadgetHeight, RGB($44, $00, $00))
      StopDrawing()
   Next
   
EndIf

Procedure mouseInOut (thisGadget)
   Static buttonColor = $4400
   
   StartDrawing(CanvasOutput(thisGadget))
      Box(0,0,myGadgetWidth,myGadgetHeight,buttonColor)
   StopDrawing()
   
   buttonColor = $4444 - buttonColor
EndProcedure


Repeat
   Event = WaitWindowEvent()
   
   Select Event
         
      Case #PB_Event_Gadget
         
         If EventType() = #PB_EventType_MouseEnter Or EventType() = #PB_EventType_MouseLeave
            mouseInOut(EventGadget())
         EndIf   
         
   EndSelect   
   
Until Event = #PB_Event_CloseWindow
I have just started using the canvas gadget myself so this was a good exercise for me.

B.P.

PS; I am not a professional. :)

Re: Canvas Gadget - How is this code?

Posted: Wed Jan 04, 2012 9:28 am
by Demivec
@Caffeine: Your code looks fine for the moment. The event loop could be a little more complete.

I couldn't detect a difference in the two colors that you chose for the buttons. If the colors are changed it becomes evident that the effect you wanted is achieved.

You will also want to click events for the buttons as well.

BasicallyPure wrote:Here is a modification to your code that I came up with that uses only one procedure.
@BasicallyPure: your code may not toggle the colors properly if an extra event of either type is triggered.

Re: Canvas Gadget - How is this code?

Posted: Thu Jan 05, 2012 9:12 pm
by BasicallyPure
You are right Demivec, my code had some problems.
here is another try.

Code: Select all

EnableExplicit

#Window = 0
Define myGadgetHeight = 30, myGadgetWidth = 100
Define fontHeight = 16 ;this is just a guess, it should be calculated somehow
Define colorNormal = RGB($60, $40, $40) ; normal button color
Define colorHighlight = RGB($80, $B0, $40) ; highlighted button color
Define xorColorToggle = colorNormal ! colorHighlight ;used to toggle between the two colors
Define Event, text$, buttonBox, buttonContainer, ypos = 5, boxRadius = myGadgetHeight / 2

Procedure ToggleButtonHighlight()
   Shared xorColorToggle, boxRadius, myGadgetHeight, myGadgetWidth
   If StartDrawing(CanvasOutput(EventGadget()))
      DrawingMode(#PB_2DDrawing_XOr)
      RoundBox(0, 0, myGadgetWidth, myGadgetHeight, boxRadius, boxRadius, xorColorToggle)
      DrawingMode(#PB_2DDrawing_Default)
      StopDrawing()
   EndIf
EndProcedure

If OpenWindow(#Window, 0, 0, 400, 300, "Canvas Buttons",#PB_Window_ScreenCentered | #PB_Window_SystemMenu)
   
   ; Create some canvas areas to draw our custom buttons on
   For buttonContainer = 1 To 5
      CanvasGadget(buttonContainer, 5, ypos, myGadgetWidth, myGadgetHeight)
      ypos = ypos + myGadgetHeight + 10
   Next
   
   ; grab the window background color
   If StartDrawing(WindowOutput(#Window))
      Define winColor = Point(0,0)
      StopDrawing()
   EndIf
   
   Define colorOutline = winColor ! $FFFFFF ; button outline color
   
   ; Draw our custom buttons with captions
   Define offset = myGadgetHeight/2 - fontHeight/2
   For buttonBox = 1 To 5
      If StartDrawing(CanvasOutput(buttonBox))
         Box(0, 0, myGadgetWidth, myGadgetHeight, winColor)
         RoundBox(0, 0, myGadgetWidth, myGadgetHeight, boxRadius, boxRadius, colorOutline)
         RoundBox(2, 2, myGadgetWidth-4, myGadgetHeight-4, boxRadius-2, boxRadius-2, colorNormal)
         text$ = " Button " + Str(buttonBox)
         DrawText(5, offset, text$ , colorHighlight, colorNormal )
         StopDrawing()
      EndIf
   Next
   
   Repeat
      Event = WaitWindowEvent()
      
      Select Event
            
         Case #PB_Event_Gadget
            
            Select EventType()
               Case #PB_EventType_MouseEnter, #PB_EventType_MouseLeave
                  If EventGadget() > 0 Or EventGadget() < 6
                     ToggleButtonHighlight()
                  EndIf
               Case #PB_EventType_LeftButtonDown
                  Select EventGadget()
                     Case 1 ;capture button 1 event
                        Debug "button 1 was clicked."
                     Case 2 ;capture button 2 event
                        Debug "button 2 was clicked."
                     Case 3 ; capture button 3 event
                        Debug "button 3 was clicked."
                     Case 4 ; capture button 4 event
                        Debug "button 4 was clicked."
                     Case 5 ; capture button 5 event
                        Debug "button 5 was clicked."
                  EndSelect
            EndSelect
            
      EndSelect   
      
   Until Event = #PB_Event_CloseWindow
   
EndIf