[PB 5.60] Sliding Left Sidebar

Share your advanced PureBasic knowledge/code with the community.
User avatar
falsam
Enthusiast
Enthusiast
Posts: 632
Joined: Wed Sep 21, 2011 9:11 am
Location: France
Contact:

[PB 5.60] Sliding Left Sidebar

Post by falsam »

This is a test of a sliding left sidebar made with a canvas container. You must use PureBasic 5.60 if you want to play with this code.

Image

Code: Select all

;Sliding SideBar 1.00 - PureBasic 5.60 
;
;falsam (2017)

EnableExplicit

Enumeration Police
  #fontGlobal
  #fontMenuTitle
  #fontUnicode  
EndEnumeration

Enumeration Window
  #mf
EndEnumeration

Enumeration Timer
  #mfMenuTimer
EndEnumeration

Enumeration Gadget
  #mfSidebar
  #mfTitle
  #mfMenu
  #mfCustumerAdd
  #mfClose
  #mfList
EndEnumeration

;Flag SideBar 
;  1: Close
; -1: Open
Global MenuState.i = -1  
Global SideBarColor = RGB(188, 143, 143)

;Summary
Declare Start()
Declare LinkGadget(Gadget, x, y, Width, Height, Text.s, BackColor, FrontColor, HoverColor = $000000)
Declare MenuSelect()
Declare MenuOpenClose()
Declare CustumerAdd()
Declare Resize()
Declare ForceGadgetZOrder(gadget, zorder = 0)
Declare Exit()

Start()

Procedure Start()
  Protected n
  
  LoadFont(#FontGlobal, "Arial", 10)
  LoadFont(#fontMenuTitle, "Arial", 13)
  LoadFont(#fontUnicode, "Arial", 22)
  SetGadgetFont(#PB_Default, FontID(#FontGlobal))
  
  OpenWindow(#mf, 0, 0, 800, 600, "Sliding Sidebar", #PB_Window_SystemMenu|#PB_Window_MinimizeGadget|#PB_Window_MaximizeGadget|#PB_Window_SizeGadget|#PB_Window_ScreenCentered)
  
  ;Content
  ListIconGadget(#mfList, 25, 0, 775, 600, "Customers", 200, #PB_ListIcon_FullRowSelect|#PB_ListIcon_AlwaysShowSelection)
  AddGadgetColumn(#mfList, 1, "Account", 300)
  
  ;Add items test
  For n = 0 To 10
    AddGadgetItem(#mfList, -1, "Custumer " + n + Chr(10) + Str(411000 + n))
  Next
  SetGadgetState(#mfList, 0)
    
  ;SideBar
  CanvasGadget(#mfSidebar, 0, 0, 200, 600, #PB_Canvas_Container) 
  SetGadgetColor(#mfSidebar, #PB_Gadget_BackColor, SideBarColor) 
    ;Menu
    LinkGadget(#mfMenu, 177, 10, 21, 26, Chr($140A), SideBarColor, RGB(255, 255, 255))
    SetGadgetFont(#mfMenu, FontID(#fontUnicode))
    
    ;Add custumer
    LinkGadget(#mfCustumerAdd, 10, 100, 160, 22, "Add Custumer", SideBarColor, RGB(255, 255, 255)) 
    
    ;Close 
    LinkGadget(#mfClose, 10, 550, 50, 22, "Close", SideBarColor, RGB(255, 255, 255))  
  CloseGadgetList()
  
  ;Stacking gadgets 
  ForceGadgetZOrder(#mfSidebar, 0)
  ForceGadgetZOrder(#mfList, 1)
  
  ;Timer
  AddWindowTimer(#mf, #mfMenuTimer, 2)
  
  ;SideBar close and resize
  MenuSelect()
  Resize()
  
  ;Triggers
  BindEvent(#PB_Event_CloseWindow, @Exit())
  BindEvent(#PB_Event_SizeWindow, @Resize())  
  BindEvent(#PB_Event_Timer, @MenuOpenClose())
  
  BindGadgetEvent(#mfMenu, @MenuSelect())
  BindGadgetEvent(#mfclose, @Exit()) 
  BindGadgetEvent(#mfCustumerAdd, @CustumerAdd())
  
  Repeat : WaitWindowEvent() : ForEver
EndProcedure

Procedure LinkGadget(Gadget, x, y, Width, Height, Text.s, BackColor, FrontColor, HoverColor = $000000)
  HyperLinkGadget(Gadget, x, y, Width, Height, Text, HoverColor)
  SetGadgetColor(Gadget, #PB_Gadget_FrontColor, FrontColor)  
  SetGadgetColor(Gadget, #PB_Gadget_BackColor, BackColor)  
EndProcedure  

Procedure MenuSelect()
  MenuState * -1 
  If MenuState = -1
    SetGadgetText(#mfMenu, Chr($140A)) ;ᐊ
    GadgetToolTip(#mfMenu, "Close Sidebar")
  Else
    SetGadgetText(#mfMenu, Chr($1405)) ;ᐅ
    GadgetToolTip(#mfMenu, "Open Sidebar")
  EndIf
  SetActiveGadget(#mfMenu)
EndProcedure

Procedure MenuOpenClose()
  Static Left.i 
  
  If Left > -175 And MenuState = 1
    Left - 5
    ResizeGadget(#mfSidebar, left, #PB_Ignore, #PB_Ignore, #PB_Ignore)  
  EndIf
  
  If Left <> 0 And MenuState = -1
    Left + 5
    ResizeGadget(#mfSidebar, left, #PB_Ignore, #PB_Ignore, #PB_Ignore)  
  EndIf   
EndProcedure

Procedure CustumerAdd()
  Protected n = CountGadgetItems(#mfList)
  AddGadgetItem(#mfList, -1, "Custumer " + n + Chr(10) + Str(411000 + n)) 
EndProcedure

Procedure Resize()
  Protected WindowHeight = WindowHeight(#mf)
  Protected WindowWidth  = WindowWidth(#mf)
  
  ResizeGadget(#mfList, #PB_Ignore, #PB_Ignore, WindowWidth - 25, WindowHeight) 
  ResizeGadget(#mfSidebar, #PB_Ignore, #PB_Ignore, #PB_Ignore, WindowHeight)  
  ResizeGadget(#mfClose, #PB_Ignore, WindowHeight - 40, #PB_Ignore, #PB_Ignore) 
  
  ;Sidebar background
  StartDrawing(CanvasOutput(#mfSidebar))
  Box(0, 0, 200, WindowHeight, SideBarColor)
  LineXY(199, 0, 199, WindowHeight, RGB(0, 0, 0))
  
  DrawRotatedText(195, 50, "Sliding SideBar 1.00 - PureBasic 5.60", -90)
  
  StopDrawing()
EndProcedure

Procedure ForceGadgetZOrder(gadget, zorder = 0)
  If IsGadget(gadget)
    SetWindowLong_(GadgetID(gadget), #GWL_STYLE, GetWindowLong_(GadgetID(gadget), #GWL_STYLE) | #WS_CLIPSIBLINGS)
    If zorder = 1
      SetWindowPos_ (GadgetID (gadget), #HWND_BOTTOM, 0,0,0,0, #SWP_NOSIZE | #SWP_NOMOVE)
    Else
      SetWindowPos_ (GadgetID(gadget), #HWND_TOP, 0, 0, 0, 0, #SWP_NOSIZE | #SWP_NOMOVE)
    EndIf
  EndIf
EndProcedure

Procedure Exit()  
  End
EndProcedure
The ForceGadgetZOrder() procedure is useless if you use Linux. I would like a feedback if you execute this code behind OSx. Thank you.

➽ Windows 11 64-bit - PB 6.21 x64 - AMD Ryzen 7 - NVIDIA GeForce GTX 1650 Ti

Sorry for my bad english and the Dunning–Kruger effect 🤪
HanPBF
Enthusiast
Enthusiast
Posts: 570
Joined: Fri Feb 19, 2010 3:42 am

Re: [PB 5.60] Sliding Left Sidebar

Post by HanPBF »

Hello!

Thanks for this great example!

Tested with PB5.60b1 (x86) Win 7

Runs seamless.
User avatar
Demivec
Addict
Addict
Posts: 4270
Joined: Mon Jul 25, 2005 3:51 pm
Location: Utah, USA

Re: [PB 5.60] Sliding Left Sidebar

Post by Demivec »

Thanks for the awesome example. :)
Post Reply