Page 1 sur 1

Sliding SideBar

Publié : ven. 10/févr./2017 10:53
par falsam
C'est un essai d'une barre latérale gauche coulissante confectionnée avec un conteneur canvas. Vous devez utiliser PureBasic 5.60 si vous souhaitez jouer avec ce code.

Image

Code : Tout sélectionner

;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
La procédure ForceGadgetZOrder() est inutile si vous utiliser Linux. j'aimerais un avis sous OSx. Merci.

Re: Sliding SideBar

Publié : ven. 10/févr./2017 11:59
par Torp
Merci pour cet exemple instructif.
Juste dommage qu'il faille passer par l'API pour conserver l'ordre des gadgets.

Re: Sliding SideBar

Publié : ven. 10/févr./2017 13:45
par Ar-S
Pour du sans API tu peux gruger en jouant avec le disablegadget.

Code : Tout sélectionner

;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")
    DisableGadget(#mfList,1)
  Else
    SetGadgetText(#mfMenu, Chr($1405)) ;ᐅ
    GadgetToolTip(#mfMenu, "Open Sidebar")
    DisableGadget(#mfList,0)
  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)
  DisableGadget(#mfList,0)
  AddGadgetItem(#mfList, -1, "Custumer " + n + Chr(10) + Str(411000 + n))
  DisableGadget(#mfList,1)
Resize()
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

Re: Sliding SideBar

Publié : ven. 10/févr./2017 19:01
par Kwai chang caine
Les deux codes marchent, mais j'ai un legé flickering le long de la bordure gauche de la fenêtre pour le code de FALSAM
Et une apparition des gadgets pendant le replis pour le code de ARS
Non non pas W95 :?

W10 X64 Pb5.60B3
8)

Ouaih m'sieu dame !!!!! tout au TOP !!! :mrgreen:
Compile X86 quand même, faut pas exagérer
Merci du partage 8)