PureBasic

Forums PureBasic - Français
http://forums.purebasic.com/french/

Création de gadgets avec CanvasGadget() + VectorDrawing

http://forums.purebasic.com/french/viewtopic.php?t=19475

Page 2 sur 2

Re: Création de gadgets avec CanvasGadget() + VectorDrawing

Publié : jeu. 15/janv./2026 17:05
par Jacobus
15/01/2026 à 17h00
J'ai pu explorer les possibilités de pliage et vous préparer un exemple d'utilisation multiple de la fonction GradientExpanderBar() et en bonus la création d'un bouton toggle. Je trouve que ça rend bien :D

Image

Image

Image

Le code complet modifié en conséquence :
(Vous pouvez parfaitement combiner les 2 codes pour en faire qu'un)

Code : Tout sélectionner

;==============================================================
; Library functions:      + LargeGradientButton()  = Créer de larges boutons avec images et textes aux couleurs en mode dégradées
;                         + ButtonMovementEffect() = Donne un effet de mouvement aux boutons lors du survol de la souris / Ajout de la gestion d'un effet ToggleButton
;                         + GradientTextArea()     = Création d'une Zone de texte + image, en couleurs dégradées
;                         + GradientHeaderBar()    = Créer une barre d'entête de fenêtre avec icone et textes de couleurs différentes
;                         + GradientExpanderBar()  = Créer une barre de simulation de pliage de zone
;                         + NormalGradientButton() = Créer des boutons standards avec texte, image et gradient color
;                         + ExpandAndCollapse()    = Mise en oeuvre de plusieurs GradientExpanderBar() 
;
; Version:.................1.1
; Author:..................Jacobus
; Date:....................15 janvier, 2026
; Target OS:...............Microsoft Windows 10 & 11 (All ??)
; Target Compiler:.........PureBasic 6.30
; License:.................Free, unrestricted, no warranty

;==============================================================

;-DPI (prise en compte nécessaire pour les grands écrans)
; CompilerIf #PB_Compiler_DPIAware = 1
  Global dpix.d = DesktopResolutionX()
  Global dpiy.d = DesktopResolutionY() 

;- CONSTANTES
Enumeration Fenetres
  #MAIN_WINDOW 
EndEnumeration

Enumeration Gadgets
  #CANVAS_HEADER
  
  #CANVAS_EXPAND_ONE
  #CONTAINER_EXPAND_ONE
  #EDITORNOTES
  
  #CANVAS_EXPAND_TWO
  #CONTAINER_EXPAND_TWO
  #TXT_EXPAND_TWO
  
  #CANVAS_EXPAND_THREE
  #CONTAINER_EXPAND_THREE
  #TXT_EXPAND_THREE
  
  #CANVAS_EXPAND_FOUR
  #CONTAINER_EXPAND_FOUR
  #TXT_EXPAND_FOUR
  
  #BTN_QUIT
  #BTN_ABOUT
  #BTN_HELP
  #BTN_OTHER 
  #BTN_TOGGLE
  
  #STATUS
EndEnumeration

;-FONTS
Global Font0 = LoadFont(0, "Bahnschrift Semibold Condensed", 11, #PB_Font_HighQuality)

;-VARIABLES
Global exp1, exp2, exp3, exp4
exp1 = 0 : exp2 = 0 : exp3 = 0 : exp4 = 0
Global ToggleState = 0

;-PROCEDURES
; Avec VectorDrawing, les couleurs sont de type RGBA (RGB + Canal Alpha) pour un meilleur rendu.
; ex: RGBA(125, 141, 172, 253) ou RGBA(213, 228, 223, 103)
Procedure GradientHeaderBar(canvasID, ColorZero, ColorOne, Title$, Text$, Enterprise$, ImageHeader, HV = 1)
  
  ; canvasID:...............N° ID du CanvasGadget() 
  ; ColorZero:..............Couleur du début du gradient, ex: RGBA(99, 184, 255, 255)
  ; ColorOne:...............Couleur de fin du gradient,   ex: RGBA(0, 0, 128, 255)
  ; Title$:.................Titre affiché en haut à gauche de la barre d'entête de fenêtre 
  ; Text$:..................Texte affiché en bas à gauche, sous le titre. 
  ; Enterprise$:............Texte ou nom qui sera affiché au milieu à droite de la barre d'entête de fenêtre  
  ; ImageHeader:............Image qui sera affichée à gauche de la barre d'entête de fenêtre
  ; HV:.....................Option: HV = 1 gradient vertical (par défaut) ou HV = 0 gradient horizontal
  
  Protected wc = GadgetWidth(canvasID)
  Protected hc = GadgetHeight(canvasID)
  Protected outputc = CanvasVectorOutput(canvasID, #PB_Unit_Pixel)
  
  If StartVectorDrawing(outputc)
;     Resultat = VectorUnit()
;     If Resultat = #PB_Unit_Pixel          : Debug "Les valeurs sont mesurées en pixels (ou Point (dots) pour les imprimantes)"
;     ElseIf Resultat = #PB_Unit_Point      : Debug "Les valeurs sont mesurées en points (1/72 pouce = 25.4/72 mm = 0,352 778 mm)"
;     ElseIf Resultat = #PB_Unit_Inch       : Debug "Les valeurs sont mesurées en pouces (25,4 millimètres)"
;     ElseIf Resultat = #PB_Unit_Millimeter : Debug "Les valeurs sont mesurées en millimètres (0,039 370 pouce)"
;     EndIf
    ; Choix de l'orientation du dégradé de couleur
    If HV = 0  ; Fond gradient Horizontal (par défaut)
      VectorSourceLinearGradient(0, 0, w*dpix, h*dpiy)
      VectorSourceGradientColor(ColorZero, 0.0)
      VectorSourceGradientColor(ColorOne, 1.0)
    ElseIf HV = 1 ; Fond gradient vertical
      VectorSourceLinearGradient(1, hc*dpiy, 1, 1 )
      VectorSourceGradientColor(ColorZero, 0.0)
      VectorSourceGradientColor(ColorOne, 1.0)
    EndIf  
    FillVectorOutput() ; remplissage
    
    If ImageHeader <> 0
      MovePathCursor(10, 4)
      DrawVectorImage(ImageHeader, 255) 
    EndIf 
    
    If Title$ <> ""
      VectorFont(Font0);, 10)
      VectorSourceColor(RGBA(231, 234, 238, 255)) ; gris clair 
      MovePathCursor(70, 5)   
      DrawVectorText(Title$)
    EndIf 
    
    If Text$ <> ""
      ;VectorFont(Font2)
      ;VectorSourceColor(RGBA(231, 234, 238, 255)) ; gris clair   
      MovePathCursor(70, 25)   
      DrawVectorText(Text$)
    EndIf 
    
    If Enterprise$ <> ""
      ; Modification de la couleur pour le texte Enterprise$
      VectorSourceColor(RGBA(145, 0, 0, 255)) ; rouge foncé
      MovePathCursor((wc*dpix)-(VectorTextWidth(Enterprise$)+30), 20)  ; positionnement à droite de la barre 
      DrawVectorText(Enterprise$)
    EndIf   
    
    StopVectorDrawing()
  EndIf   
EndProcedure

Procedure LargeGradientButton(canvasID, ColorZero, ColorOne, Title$, Text$, Image, PosImage = 0, HV = 1)
  
  ; canvasID:...............N° ID du CanvasGadget() 
  ; ColorZero:..............Couleur du début du gradient, ex: RGBA(105, 133, 187, 255)
  ; ColorOne:...............Couleur de fin du gradient,   ex: RGBA(213, 228, 223, 255)
  ; Title$:.................Titre affiché en haut à gauche du bouton et à droite de l'icône 
  ; Text$:..................Texte affiché en bas à gauche, sous le titre. 
  ; Image:..................Image qui sera affichée sur le bouton, à gauche du titre et du texte ou du côté droit du bouton
  ; PosImage:...............Option position de l'icône, 0 = à gauche, 1 = à droite
  ; HV:.....................Option: HV = 1 gradient horizontal (par défaut) ou HV = 0 gradient vertical
  
  Protected w = GadgetWidth(canvasID)
  Protected h = GadgetHeight(canvasID)
  Protected output = CanvasVectorOutput(canvasID, #PB_Unit_Pixel)
  
  If StartVectorDrawing(output) 
    
    ; Choix de l'orientation du dégradé de couleur
    If HV = 1  ; Fond gradient Horizontal (par défaut)
      VectorSourceLinearGradient(0, 0, w*dpix, h*dpiy)
      VectorSourceGradientColor(ColorZero, 0.0) ; 0,0 (le début du gradient)
      VectorSourceGradientColor(ColorOne, 1.0)  ; 1.0 (la fin du gradient). 
    ElseIf HV = 0 ; Fond gradient vertical
      VectorSourceLinearGradient(1, h*dpiy, 1, 1 )
      VectorSourceGradientColor(ColorOne, 1.0)
      VectorSourceGradientColor(ColorZero, 0.0)
    EndIf   
    FillVectorOutput()
    
    If PosImage = 0      ; l'image sera placée à gauche 
      MovePathCursor(10, 10)     
      DrawVectorImage(Image, 255) 
      
      VectorSourceColor(RGBA(0, 0, 0, 255)) ; noir   
      MovePathCursor(70, 25)   
      DrawVectorText(Text$)
      
      VectorFont(Font0)
      VectorSourceColor(RGBA(28, 113, 218, 255)) ; bleu  
      MovePathCursor(70, 5)   
      DrawVectorText(Title$)
  
    ElseIf PosImage = 1  ; positionnement à droite
      MovePathCursor((w*dpix)-(48+10), 10) 
      DrawVectorImage(Image, 255)
      
      VectorSourceColor(RGBA(0, 0, 0, 255)) ; noir   
      MovePathCursor(10, 25)   
      DrawVectorText(Text$)
      
      VectorFont(Font0)
      VectorSourceColor(RGBA(28, 113, 218, 255)) ; bleu  
      MovePathCursor(10, 5)   
      DrawVectorText(Title$)   
    EndIf 

    StopVectorDrawing()
  EndIf   
    
EndProcedure

Procedure NormalGradientButton(canvasID, ColorZero, ColorOne, Text$, ColorTxt, Image, OutlineColor, Outline = 0, PosImage = 0, HV = 1)
  
  ; canvasID:...............N° ID du CanvasGadget() 
  ; ColorZero:..............Couleur du début du gradient, ex: RGBA(105, 133, 187, 255)
  ; ColorOne:...............Couleur de fin du gradient,   ex: RGBA(213, 228, 223, 255)
  ; Text$:..................Texte affiché en bas à gauche, sous le titre.
  ; ColorTxt:...............Couleur du texte,   ex: RGBA(231, 234, 238, 255)
  ; Image:..................Image/icône 16x16 max (vous pouvez modifier cette limite) qui sera affichée sur le bouton, à gauche du titre et du texte ou du côté droit du bouton
  ; OutlineColor:...........Option choix de la couleur du contour
  ; Outline:................Option dessin d'un contour au bouton.
  ; PosImage:...............Option position de l'icône, 0 = à gauche, 1 = à droite
  ; HV:.....................Option: HV = 1 gradient horizontal (par défaut) ou HV = 0 gradient vertical
  
  Protected w = GadgetWidth(canvasID)
  Protected h = GadgetHeight(canvasID)
  Protected output = CanvasVectorOutput(canvasID, #PB_Unit_Pixel)

  If StartVectorDrawing(output)
    
    ; Choix de l'orientation du dégradé de couleur
    If HV = 1      ; Fond gradient Horizontal (par défaut)
      VectorSourceLinearGradient(0, 0, w*dpix, h*dpiy)
      VectorSourceGradientColor(ColorZero, 0.0) ; 0,0 (le début du gradient)
      VectorSourceGradientColor(ColorOne, 1.0)  ; 1.0 (la fin du gradient). 
    ElseIf HV = 0  ; Fond gradient vertical
      VectorSourceLinearGradient(1, h*dpiy, 1, 1 )
      VectorSourceGradientColor(ColorOne, 1.0)
      VectorSourceGradientColor(ColorZero, 0.0)
    EndIf   
    FillVectorOutput()
    
    ; image
    If Image <> 0
      If PosImage = 0      ; l'image sera placée à gauche 
        MovePathCursor(5, 5*dpiy)
        DrawVectorImage(Image, 255, 16*dpix, 16*dpiy)
      ElseIf PosImage = 1  ; positionnement à droite
        MovePathCursor((w*dpix)-(21*dpix), 5*dpiy)
        DrawVectorImage(Image, 255, 16*dpix, 16*dpiy)
      EndIf 
    EndIf 
    
    ; texte centré
    If Text$ <> ""
      Protected xt = (w*dpix/2)-(VectorTextWidth(Text$)/2)  ; pour centrer le texte horizontalement
      Protected yt = (h*dpiy/2)-(VectorTextHeight(Text$)/2) ; pour centrer le texte verticalement
      MovePathCursor(xt, yt) 
      VectorFont(Font0)
      VectorSourceColor(ColorTxt)
      DrawVectorText(Text$)
    EndIf 
    
    ; pour marquer un contour (à faire en dernier pour ne pas qu'il soit recouvert)
    If Outline = 1
      MovePathCursor(0, 0)     
      AddPathBox(0, 0, w*dpix, h*dpiy)
      VectorSourceColor(OutlineColor)     
      StrokePath(3)   ; 3 pixels d'épaisseur
    EndIf 
    
    StopVectorDrawing()
  EndIf
  
EndProcedure

Procedure GradientTextArea(canvasID, ColorZero, ColorOne, Title$, Text$, Image, ImgWidth, ImgHeight, HV = 1)
   
  ; canvasID:...............N° ID du CanvasGadget() 
  ; ColorZero:..............Couleur du début du gradient, ex: RGBA(105, 133, 187, 255)
  ; ColorOne:...............Couleur de fin du gradient,   ex: RGBA(213, 228, 223, 255)
  ; Title$:.................Titre affiché en haut à gauche du bouton et à droite de l'icône 
  ; Text$:..................Texte affiché en bas à gauche, sous le titre. 
  ; Image:..................Image qui sera affichée 
  ; ImgWidth:...............Largeur de l'image
  ; ImgHeight:..............Hauteur de l'image
  ; HV:.....................Option: HV = 1 gradient horizontal (par défaut) ou HV = 0 gradient vertical
  
  Protected w = GadgetWidth(canvasID)
  Protected h = GadgetHeight(canvasID)
  Protected output = CanvasVectorOutput(canvasID, #PB_Unit_Pixel)
  
  If StartVectorDrawing(output)
    ; Choix de l'orientation du dégradé de couleur
    If HV = 1  ; Fond gradient Horizontal (par défaut)
      VectorSourceLinearGradient(0, 0, w*dpix, h*dpiy)
      VectorSourceGradientColor(ColorZero, 0.0) ; 0,0 (le début du gradient)
      VectorSourceGradientColor(ColorOne, 1.0)  ; 1.0 (la fin du gradient). 
    ElseIf HV = 0                               ; Fond gradient vertical
      VectorSourceLinearGradient(1, h*dpiy, 1, 1 )
      VectorSourceGradientColor(ColorOne, 1.0)
      VectorSourceGradientColor(ColorZero, 0.0)
    EndIf   
    FillVectorOutput()
    
    If Image <> 0
      If ImgWidth < 24 Or ImgHeight < 24
        ImgWidth = 24 : ImgHeight = 24 ; On donne une taille minimale de 24x24 à l'image
;       ElseIf ImgWidth >= 24 And ImgHeight >= 24
;         ImgWidth = ImgWidth : ImgHeight = ImgHeight
      EndIf 
      MovePathCursor(10, 10)
      DrawVectorImage(Image, 255, ImgWidth*dpix, ImgHeight*dpiy) 
    EndIf 
        
    If Title$ <> ""
      VectorFont(Font0)
      VectorSourceColor(RGBA(255, 0, 0, 255)) ; rouge   
      MovePathCursor((ImgWidth*dpix)+30, 30)   
      DrawVectorText(Title$)
    EndIf  
    
    If Text$ <> ""
      VectorSourceColor(RGBA(0,0,0,255)) ; texte en noir    
      MovePathCursor(10, (ImgHeight*dpiy)+30)
      ; Le texte peut être long, il est placé dans un paragraphe avec retour à la ligne automatique
      DrawVectorParagraph(Text$, (w*dpix)-20, h*dpiy)
    EndIf 
    
    StopVectorDrawing()
  EndIf 
  
EndProcedure

Procedure GradientExpanderBar(canvasIDexp, ColorZero, ColorOne, Title$, ColorTitle, ImageExp, HV = 1)
  
  ; canvasID:...............N° ID du CanvasGadget() 
  ; ColorZero:..............Couleur du début du gradient, ex: RGBA(99, 184, 255, 255)
  ; ColorOne:...............Couleur de fin du gradient,   ex: RGBA(0, 0, 128, 255)
  ; Title$:.................Titre affiché à gauche 
  ; ColorTitle:.............Couleur du titre,   ex: RGBA(231, 234, 238, 255)
  ; Image:..................Image qui sera affichée du côté droit
  ; HV:.....................Option: HV = 1 gradient horizontal (par défaut) ou HV = 0 gradient vertical
  
  Protected wexp = GadgetWidth(canvasIDexp)
  Protected hexp = GadgetHeight(canvasIDexp)
  Protected outputexp = CanvasVectorOutput(canvasIDexp, #PB_Unit_Pixel)
  
  If StartVectorDrawing(outputexp)
    
    ; Choix de l'orientation du dégradé de couleur
    If HV = 1      ; Fond gradient Horizontal (par défaut)
      VectorSourceLinearGradient(0, 0, wexp*dpix, hexp*dpiy)
      VectorSourceGradientColor(ColorZero, 0.0) ; 0,0 (le début du gradient)
      VectorSourceGradientColor(ColorOne, 1.0)  ; 1.0 (la fin du gradient). 
    ElseIf HV = 0  ; Fond gradient vertical
      VectorSourceLinearGradient(1, hexp*dpiy, 1, 1 )
      VectorSourceGradientColor(ColorOne, 1.0)
      VectorSourceGradientColor(ColorZero, 0.0)
    EndIf   
    FillVectorOutput()
    
    VectorFont(Font0)
    VectorSourceColor(ColorTitle)  
    MovePathCursor(10, 5)   
    DrawVectorText(Title$)
    
    MovePathCursor((wexp-30)*dpix, 5)
    DrawVectorImage(ImageExp, 255, 24, 24) ; image redimensionnée en 24x24
    
    StopVectorDrawing()
  EndIf 

EndProcedure

Procedure ButtonMovementEffect(CanvasID, x1, y1, Move = 0)
  ; Lorsque la souris survole le bouton il est déplacé de x1 en x2 et de y1 en y2
  ; Lorsque la souris quitte le bouton il revient à sa place initiale
  ; donnant un effet de mouvement du gadget.
  
  ; canvasID:...............N° ID du CanvasGadget()
  ; x1:.....................Position initiale en x du gadget
  ; y1:.....................Position initiale en y du gadget
  ; Move:...................Sens du mouvement souhaité pour le bouton ou mode toggle si = 2 
  
  Protected wt = GadgetWidth(canvasID)
  Protected ht = GadgetHeight(canvasID)
  Protected x2, y2
  
  If Move = 0
    x2 = x1+2 ; mouvement vers la droite
    y2 = y1-2 ; mouvement vers le haut
    
  ElseIf Move = 1
    x2 = x1   ; ne change pas
    y2 = y1+1 ; mouvement vers le bas
    
  ElseIf Move = 2 ; toggle
    x2 = x1   ; ne change pas  
    y2 = y1+1 ; mouvement vers le bas

    If EventType() = #PB_EventType_LeftClick
      If ToggleState = 0 ; on change les couleurs (bleu vers orange)
        NormalGradientButton(#BTN_TOGGLE, RGBA(237, 146, 25, 255), RGBA(237, 236, 167, 255), "Toggle", RGBA(44, 65, 97, 255), ExtractIcon_(GetModuleHandle_(#Null), "Shell32.dll",150), RGBA(255, 0, 0, 255), 0, 0, 0) 
        ToggleState = 1
      ElseIf ToggleState = 1 ; on remet les couleurs initiales (orange vers bleu)
        NormalGradientButton(#BTN_TOGGLE, RGBA(92, 113, 206, 255), RGBA(213, 228, 223, 255), "Toggle", RGBA(44, 65, 97, 255), ExtractIcon_(GetModuleHandle_(#Null), "Shell32.dll",150), RGBA(255, 0, 0, 255), 0, 0, 0)
        ToggleState = 0
      EndIf 
    EndIf 
  EndIf 

  If EventType() = #PB_EventType_MouseEnter    
    ResizeGadget(CanvasID, x2, y2, #PB_Ignore, #PB_Ignore)    
  ElseIf EventType() = #PB_EventType_MouseLeave    
    ResizeGadget(CanvasID, x1, y1, #PB_Ignore, #PB_Ignore)   
  EndIf
            
EndProcedure

Procedure ExpandAndCollapse(CanvasID)
  
  Select CanvasID
      
    Case #CANVAS_EXPAND_ONE ;{
      If exp1 = 1
        GradientExpanderBar(#CANVAS_EXPAND_ONE, RGBA(92, 113, 206, 255), RGBA(213, 228, 223, 255), "Ouvrir l'accès aux autres fonctions", RGBA(231, 234, 238, 255), ExtractIcon_(GetModuleHandle_(#Null), "Shell32.dll",247),0)
        GadgetToolTip(#CANVAS_EXPAND_ONE,"Déplier la section d'édition")
        HideGadget(#CONTAINER_EXPAND_ONE, #True) ;caché           
        ResizeGadget(#CANVAS_EXPAND_ONE,   #PB_Ignore, 70, #PB_Ignore, #PB_Ignore)
        ResizeGadget(#CANVAS_EXPAND_TWO,   #PB_Ignore, 95, #PB_Ignore, #PB_Ignore)
        ResizeGadget(#CANVAS_EXPAND_THREE, #PB_Ignore, 120, #PB_Ignore, #PB_Ignore)
        ResizeGadget(#CANVAS_EXPAND_FOUR,  #PB_Ignore, 145, #PB_Ignore, #PB_Ignore)
        exp1 = 0
      ElseIf exp1 = 0
        GradientExpanderBar(#CANVAS_EXPAND_ONE, RGBA(92, 113, 206, 255), RGBA(213, 228, 223, 255), "Refermer l'accès aux autres fonctions", RGBA(231, 234, 238, 255), ExtractIcon_(GetModuleHandle_(#Null), "Shell32.dll",246),0)
        GadgetToolTip(#CANVAS_EXPAND_ONE,"Replier la section d'édition")      
        HideGadget(#CONTAINER_EXPAND_ONE, #False) ;affiché  
        ResizeGadget(#CANVAS_EXPAND_ONE,   #PB_Ignore, 70, #PB_Ignore, #PB_Ignore)  
        
        HideGadget(#CONTAINER_EXPAND_TWO, #True) 
        ResizeGadget(#CANVAS_EXPAND_TWO,  #PB_Ignore, 395, #PB_Ignore, #PB_Ignore)
        GradientExpanderBar(#CANVAS_EXPAND_TWO, RGBA(92, 113, 206, 255), RGBA(213, 228, 223, 255), "Ouvrir la section numéro 2", RGBA(231, 234, 238, 255), ExtractIcon_(GetModuleHandle_(#Null), "Shell32.dll",247),0)
        GadgetToolTip(#CANVAS_EXPAND_TWO,"Déplier la section numéro 2")
        
        HideGadget(#CONTAINER_EXPAND_THREE, #True) 
        ResizeGadget(#CANVAS_EXPAND_THREE,  #PB_Ignore, 420, #PB_Ignore, #PB_Ignore)
        GradientExpanderBar(#CANVAS_EXPAND_THREE, RGBA(213, 228, 223, 255), RGBA(105, 133, 187, 255), "Ouvrir la section numéro 3", RGBA(44, 65, 97, 255), ExtractIcon_(GetModuleHandle_(#Null), "Shell32.dll",247))
        GadgetToolTip(#CANVAS_EXPAND_THREE,"Déplier la section numéro 3")
        
        HideGadget(#CONTAINER_EXPAND_FOUR, #True) 
        ResizeGadget(#CANVAS_EXPAND_FOUR,  #PB_Ignore, 445, #PB_Ignore, #PB_Ignore)
        GradientExpanderBar(#CANVAS_EXPAND_FOUR, RGBA(213, 228, 223, 255), RGBA(105, 133, 187, 255), "Ouvrir la section numéro 4", RGBA(44, 65, 97, 255), ExtractIcon_(GetModuleHandle_(#Null), "Shell32.dll",247))
        GadgetToolTip(#CANVAS_EXPAND_FOUR,"Déplier la section numéro 4")
        exp1 = 1
      EndIf
      ;}
    Case #CANVAS_EXPAND_TWO ;{     
      If exp2 = 1
        GradientExpanderBar(#CANVAS_EXPAND_TWO, RGBA(92, 113, 206, 255), RGBA(213, 228, 223, 255), "Ouvrir la section numéro 2", RGBA(231, 234, 238, 255), ExtractIcon_(GetModuleHandle_(#Null), "Shell32.dll",247),0)
        GadgetToolTip(#CANVAS_EXPAND_TWO,"Déplier la section d'édition")
        HideGadget(#CONTAINER_EXPAND_TWO, #True) 
        ResizeGadget(#CANVAS_EXPAND_ONE,   #PB_Ignore, 70, #PB_Ignore, #PB_Ignore)
        ResizeGadget(#CANVAS_EXPAND_TWO,   #PB_Ignore, 95, #PB_Ignore, #PB_Ignore)
        ResizeGadget(#CANVAS_EXPAND_THREE, #PB_Ignore, 120, #PB_Ignore, #PB_Ignore)
        ResizeGadget(#CANVAS_EXPAND_FOUR,  #PB_Ignore, 145, #PB_Ignore, #PB_Ignore)
        
        exp2 = 0
      ElseIf exp2 = 0
        GradientExpanderBar(#CANVAS_EXPAND_TWO, RGBA(92, 113, 206, 255), RGBA(213, 228, 223, 255), "Refermer la section numéro 2", RGBA(231, 234, 238, 255), ExtractIcon_(GetModuleHandle_(#Null), "Shell32.dll",246),0)
        GadgetToolTip(#CANVAS_EXPAND_TWO,"Replier la section numéro 2")        
        
        HideGadget(#CONTAINER_EXPAND_ONE, #True)          
        ResizeGadget(#CANVAS_EXPAND_ONE,   #PB_Ignore, 70, #PB_Ignore, #PB_Ignore)
        GradientExpanderBar(#CANVAS_EXPAND_ONE, RGBA(92, 113, 206, 255), RGBA(213, 228, 223, 255), "Ouvrir l'accès aux autres fonctions", RGBA(231, 234, 238, 255), ExtractIcon_(GetModuleHandle_(#Null), "Shell32.dll",247),0)
        GadgetToolTip(#CANVAS_EXPAND_ONE,"Déplier la section d'édition")
        
        HideGadget(#CONTAINER_EXPAND_TWO, #False) 
        ResizeGadget(#CANVAS_EXPAND_TWO,  #PB_Ignore, 95, #PB_Ignore, #PB_Ignore)
        
        HideGadget(#CONTAINER_EXPAND_THREE, #True) 
        ResizeGadget(#CANVAS_EXPAND_THREE,  #PB_Ignore, 420, #PB_Ignore, #PB_Ignore)
        GradientExpanderBar(#CANVAS_EXPAND_THREE, RGBA(213, 228, 223, 255), RGBA(105, 133, 187, 255), "Ouvrir la section numéro 3", RGBA(44, 65, 97, 255), ExtractIcon_(GetModuleHandle_(#Null), "Shell32.dll",247))
        GadgetToolTip(#CANVAS_EXPAND_THREE,"Déplier la section numéro 3")
        
        HideGadget(#CONTAINER_EXPAND_FOUR, #True) 
        ResizeGadget(#CANVAS_EXPAND_FOUR,  #PB_Ignore, 445, #PB_Ignore, #PB_Ignore)
        GradientExpanderBar(#CANVAS_EXPAND_FOUR, RGBA(213, 228, 223, 255), RGBA(105, 133, 187, 255), "Ouvrir la section numéro 4", RGBA(44, 65, 97, 255), ExtractIcon_(GetModuleHandle_(#Null), "Shell32.dll",247))
        GadgetToolTip(#CANVAS_EXPAND_FOUR,"Déplier la section numéro 4")
        
        exp2 = 1
      EndIf 
      ;}
    Case #CANVAS_EXPAND_THREE ;{
      If exp3 = 1
        GradientExpanderBar(#CANVAS_EXPAND_THREE, RGBA(213, 228, 223, 255), RGBA(105, 133, 187, 255), "Ouvrir la section numéro 3", RGBA(44, 65, 97, 255), ExtractIcon_(GetModuleHandle_(#Null), "Shell32.dll",247))
        GadgetToolTip(#CANVAS_EXPAND_THREE,"Déplier la section numéro 3")
        HideGadget(#CONTAINER_EXPAND_THREE, #True) 
        ResizeGadget(#CANVAS_EXPAND_ONE,   #PB_Ignore, 70, #PB_Ignore, #PB_Ignore)
        ResizeGadget(#CANVAS_EXPAND_TWO,   #PB_Ignore, 95, #PB_Ignore, #PB_Ignore)
        ResizeGadget(#CANVAS_EXPAND_THREE, #PB_Ignore, 120, #PB_Ignore, #PB_Ignore)
        ResizeGadget(#CANVAS_EXPAND_FOUR,  #PB_Ignore, 145, #PB_Ignore, #PB_Ignore)
        exp3 = 0
      ElseIf exp3 = 0
        GradientExpanderBar(#CANVAS_EXPAND_THREE, RGBA(213, 228, 223, 255), RGBA(105, 133, 187, 255), "Refermer la section numéro 3", RGBA(44, 65, 97, 255), ExtractIcon_(GetModuleHandle_(#Null), "Shell32.dll",246))              
        GadgetToolTip(#CANVAS_EXPAND_THREE,"Replier la section numéro 3")
        
        HideGadget(#CONTAINER_EXPAND_ONE, #True)          
        ResizeGadget(#CANVAS_EXPAND_ONE,   #PB_Ignore, 70, #PB_Ignore, #PB_Ignore)
        GradientExpanderBar(#CANVAS_EXPAND_ONE, RGBA(92, 113, 206, 255), RGBA(213, 228, 223, 255), "Ouvrir l'accès aux autres fonctions", RGBA(231, 234, 238, 255), ExtractIcon_(GetModuleHandle_(#Null), "Shell32.dll",247),0)
        GadgetToolTip(#CANVAS_EXPAND_ONE,"Déplier la section d'édition")
        
        HideGadget(#CONTAINER_EXPAND_TWO, #True) 
        ResizeGadget(#CANVAS_EXPAND_TWO,  #PB_Ignore, 95, #PB_Ignore, #PB_Ignore)
        GradientExpanderBar(#CANVAS_EXPAND_TWO, RGBA(92, 113, 206, 255), RGBA(213, 228, 223, 255), "Ouvrir la section numéro 2", RGBA(231, 234, 238, 255), ExtractIcon_(GetModuleHandle_(#Null), "Shell32.dll",247),0)
        GadgetToolTip(#CANVAS_EXPAND_TWO,"Déplier la section numéro 2")
        
        HideGadget(#CONTAINER_EXPAND_THREE, #False) 
        ResizeGadget(#CANVAS_EXPAND_THREE,  #PB_Ignore, 120, #PB_Ignore, #PB_Ignore)
        
        HideGadget(#CONTAINER_EXPAND_FOUR, #True) 
        ResizeGadget(#CANVAS_EXPAND_FOUR,  #PB_Ignore, 445, #PB_Ignore, #PB_Ignore)
        GradientExpanderBar(#CANVAS_EXPAND_FOUR, RGBA(213, 228, 223, 255), RGBA(105, 133, 187, 255), "Ouvrir la section numéro 4", RGBA(44, 65, 97, 255), ExtractIcon_(GetModuleHandle_(#Null), "Shell32.dll",247))
        GadgetToolTip(#CANVAS_EXPAND_FOUR,"Déplier la section numéro 4")
        
        exp3 = 1
      EndIf
      ;}
    Case #CANVAS_EXPAND_FOUR ;{
      If exp4 = 1
        GradientExpanderBar(#CANVAS_EXPAND_FOUR, RGBA(213, 228, 223, 255), RGBA(105, 133, 187, 255), "Ouvrir la section numéro 4", RGBA(44, 65, 97, 255), ExtractIcon_(GetModuleHandle_(#Null), "Shell32.dll",247))
        GadgetToolTip(#CANVAS_EXPAND_FOUR,"Déplier la section la section numéro 4")
        HideGadget(#CONTAINER_EXPAND_FOUR, #True) 
        ResizeGadget(#CANVAS_EXPAND_ONE,   #PB_Ignore, 70, #PB_Ignore, #PB_Ignore)
        ResizeGadget(#CANVAS_EXPAND_TWO,   #PB_Ignore, 95, #PB_Ignore, #PB_Ignore)
        ResizeGadget(#CANVAS_EXPAND_THREE, #PB_Ignore, 120, #PB_Ignore, #PB_Ignore)
        ResizeGadget(#CANVAS_EXPAND_FOUR,  #PB_Ignore, 145, #PB_Ignore, #PB_Ignore)
        exp4 = 0
      ElseIf exp4 = 0
        GradientExpanderBar(#CANVAS_EXPAND_FOUR, RGBA(213, 228, 223, 255), RGBA(105, 133, 187, 255), "Refermer la section numéro 4", RGBA(44, 65, 97, 255), ExtractIcon_(GetModuleHandle_(#Null), "Shell32.dll",246))              
        GadgetToolTip(#CANVAS_EXPAND_FOUR,"Replier la section la section numéro 4")
   
        HideGadget(#CONTAINER_EXPAND_ONE, #True)          
        ResizeGadget(#CANVAS_EXPAND_ONE,   #PB_Ignore, 70, #PB_Ignore, #PB_Ignore)
        GradientExpanderBar(#CANVAS_EXPAND_ONE, RGBA(92, 113, 206, 255), RGBA(213, 228, 223, 255), "Ouvrir l'accès aux autres fonctions", RGBA(231, 234, 238, 255), ExtractIcon_(GetModuleHandle_(#Null), "Shell32.dll",247),0)
        GadgetToolTip(#CANVAS_EXPAND_ONE,"Déplier la section d'édition")
        
        HideGadget(#CONTAINER_EXPAND_TWO, #True) 
        ResizeGadget(#CANVAS_EXPAND_TWO,  #PB_Ignore, 95, #PB_Ignore, #PB_Ignore)
        GradientExpanderBar(#CANVAS_EXPAND_TWO, RGBA(92, 113, 206, 255), RGBA(213, 228, 223, 255), "Ouvrir la section numéro 2", RGBA(231, 234, 238, 255), ExtractIcon_(GetModuleHandle_(#Null), "Shell32.dll",247),0)
        GadgetToolTip(#CANVAS_EXPAND_TWO,"Déplier la section numéro 2")
        
        HideGadget(#CONTAINER_EXPAND_THREE, #True) 
        ResizeGadget(#CANVAS_EXPAND_THREE,  #PB_Ignore, 120, #PB_Ignore, #PB_Ignore)
        GradientExpanderBar(#CANVAS_EXPAND_THREE, RGBA(213, 228, 223, 255), RGBA(105, 133, 187, 255), "Ouvrir la section numéro 3", RGBA(44, 65, 97, 255), ExtractIcon_(GetModuleHandle_(#Null), "Shell32.dll",247))
        GadgetToolTip(#CANVAS_EXPAND_THREE,"Déplier la section numéro 3")
        
        HideGadget(#CONTAINER_EXPAND_FOUR, #False) 
        ResizeGadget(#CANVAS_EXPAND_FOUR,  #PB_Ignore, 145, #PB_Ignore, #PB_Ignore)
        
        exp4 = 1
      EndIf 
      ;}
      
  EndSelect

EndProcedure


;- Interface graphique
If OpenWindow(#MAIN_WINDOW, 0, 0, 500, 500, "Fenêtre principale", #PB_Window_SystemMenu | #PB_Window_ScreenCentered|#PB_Window_MaximizeGadget|#PB_Window_MinimizeGadget|#PB_Window_SizeGadget)
  WindowBounds(#MAIN_WINDOW, 500, 500, 500, 500)
  WidthWMain  = WindowWidth(#MAIN_WINDOW, #PB_Window_InnerCoordinate)
  HeightWMain = WindowHeight(#MAIN_WINDOW, #PB_Window_InnerCoordinate) 
  SetWindowColor(#MAIN_WINDOW, RGB(105, 133, 187))
  
  ;Entête
  CanvasGadget(#CANVAS_HEADER, 0, 0, WidthWMain, 40)
  GradientHeaderBar(#CANVAS_HEADER, RGBA(99, 184, 255, 255), RGBA(0, 0, 128, 255), "Fenêtre principale", "Création d'une colonne extensible, pliage et dépliage", "Jacobus Software", ExtractIcon_(GetModuleHandle_(#Null), "Shell32.dll",13))
  
  ;Boutons
  CanvasGadget(#BTN_QUIT, 0, 40, 100, 25)  : GadgetToolTip(#BTN_QUIT,"Fermer la fenêtre et quitter le programme")
  NormalGradientButton(#BTN_QUIT, RGBA(92, 113, 206, 255), RGBA(213, 228, 223, 255), "Quitter", RGBA(44, 65, 97, 255), ExtractIcon_(GetModuleHandle_(#Null), "Shell32.dll",27), RGBA(255, 0, 0, 255), 0, 0, 0)
  
  CanvasGadget(#BTN_ABOUT, 100, 40, 100, 25)  : GadgetToolTip(#BTN_ABOUT,"A propos de ces fonctions")
  NormalGradientButton(#BTN_ABOUT, RGBA(92, 113, 206, 255), RGBA(213, 228, 223, 255), "A propos", RGBA(44, 65, 97, 255), ExtractIcon_(GetModuleHandle_(#Null), "Shell32.dll",221), RGBA(255, 0, 0, 255), 0, 0, 0)
  
  CanvasGadget(#BTN_HELP, 200, 40, 100, 25)  : GadgetToolTip(#BTN_HELP,"Besoin d'aide ?")
  NormalGradientButton(#BTN_HELP, RGBA(92, 113, 206, 255), RGBA(213, 228, 223, 255), "Aide ?", RGBA(44, 65, 97, 255), ExtractIcon_(GetModuleHandle_(#Null), "Shell32.dll",23), RGBA(255, 0, 0, 255), 0, 0, 0)
  
  CanvasGadget(#BTN_OTHER, 300, 40, 100, 25)  : GadgetToolTip(#BTN_OTHER,"Autre chose ?")
  NormalGradientButton(#BTN_OTHER, RGBA(92, 113, 206, 255), RGBA(213, 228, 223, 255), "Autre ?", RGBA(44, 65, 97, 255), ExtractIcon_(GetModuleHandle_(#Null), "Shell32.dll",171), RGBA(255, 0, 0, 255), 0, 0, 0)
  
  CanvasGadget(#BTN_TOGGLE, 400, 40, 100, 25)  : GadgetToolTip(#BTN_TOGGLE,"Bouton Toggle")
  NormalGradientButton(#BTN_TOGGLE, RGBA(92, 113, 206, 255), RGBA(213, 228, 223, 255), "Toggle", RGBA(44, 65, 97, 255), ExtractIcon_(GetModuleHandle_(#Null), "Shell32.dll",150), RGBA(255, 0, 0, 255), 0, 0, 0)
  
  
  ;Barres de pliage
  CanvasGadget(#CANVAS_EXPAND_ONE, 0, 70, 500, 25, #PB_Canvas_Border)  : GadgetToolTip(#CANVAS_EXPAND_ONE,"Déplier la section d'édition")
  GradientExpanderBar(#CANVAS_EXPAND_ONE, RGBA(92, 113, 206, 255), RGBA(213, 228, 223, 255), "Ouvrir l'accès aux autres fonctions", RGBA(231, 234, 238, 255), ExtractIcon_(GetModuleHandle_(#Null), "Shell32.dll",247),0)
  ContainerGadget(#CONTAINER_EXPAND_ONE, 0, 95, 500, 300, #PB_Container_Flat) ;{
  EditorGadget(#EDITORNOTES, 0, 0, 500, 300, #PB_Editor_WordWrap)
  SetGadgetColor(#EDITORNOTES, #PB_Gadget_BackColor, RGB(255, 250, 205))
  SetGadgetColor(#EDITORNOTES, #PB_Gadget_FrontColor, RGB(40, 56, 86))
  ;}
  CloseGadgetList()
  HideGadget(#CONTAINER_EXPAND_ONE, #True)
  
  CanvasGadget(#CANVAS_EXPAND_TWO, 0, 95, 500, 25, #PB_Canvas_Border)  : GadgetToolTip(#CANVAS_EXPAND_TWO,"Déplier la section numéro 2")
  GradientExpanderBar(#CANVAS_EXPAND_TWO, RGBA(92, 113, 206, 255), RGBA(213, 228, 223, 255), "Ouvrir la section numéro 2", RGBA(231, 234, 238, 255), ExtractIcon_(GetModuleHandle_(#Null), "Shell32.dll",247),0)
  ContainerGadget(#CONTAINER_EXPAND_TWO, 0, 120, 500, 300, #PB_Container_Flat) ;{
  SetGadgetColor(#CONTAINER_EXPAND_TWO, #PB_Gadget_BackColor, RGB(189, 208, 220))
  
  TextGadget(#TXT_EXPAND_TWO, 20, 20, 200, 20, "GADGETS AU CHOIX")
  SetGadgetColor(#TXT_EXPAND_TWO, #PB_Gadget_BackColor, RGB(189, 208, 220))
    ; 
  ;}
  CloseGadgetList()
  HideGadget(#CONTAINER_EXPAND_TWO, #True)
  
  CanvasGadget(#CANVAS_EXPAND_THREE, 0, 120, 500, 25, #PB_Canvas_Border)  : GadgetToolTip(#CANVAS_EXPAND_THREE,"Déplier la section numéro 3")
  GradientExpanderBar(#CANVAS_EXPAND_THREE, RGBA(213, 228, 223, 255), RGBA(105, 133, 187, 255), "Ouvrir la section numéro 3", RGBA(44, 65, 97, 255), ExtractIcon_(GetModuleHandle_(#Null), "Shell32.dll",247))
  ContainerGadget(#CONTAINER_EXPAND_THREE, 0, 145, 500, 300, #PB_Container_Flat) ;{
  SetGadgetColor(#CONTAINER_EXPAND_THREE, #PB_Gadget_BackColor, RGB(92, 146, 123))
  
  TextGadget(#TXT_EXPAND_THREE, 20, 20, 200, 20, "GADGETS AU CHOIX")
  SetGadgetColor(#TXT_EXPAND_THREE, #PB_Gadget_BackColor, RGB(92, 146, 123))
    ;
  ;}
  CloseGadgetList()
  HideGadget(#CONTAINER_EXPAND_THREE, #True)
  
  CanvasGadget(#CANVAS_EXPAND_FOUR, 0, 145, 500, 25, #PB_Canvas_Border)  : GadgetToolTip(#CANVAS_EXPAND_FOUR,"Déplier la section numéro 4")
  GradientExpanderBar(#CANVAS_EXPAND_FOUR, RGBA(213, 228, 223, 255), RGBA(105, 133, 187, 255), "Ouvrir la section numéro 4", RGBA(44, 65, 97, 255), ExtractIcon_(GetModuleHandle_(#Null), "Shell32.dll",247))
  ContainerGadget(#CONTAINER_EXPAND_FOUR, 0, 170, 500, 300, #PB_Container_Flat) ;{
  SetGadgetColor(#CONTAINER_EXPAND_FOUR, #PB_Gadget_BackColor, RGB(199, 161, 54)) ;
  
  TextGadget(#TXT_EXPAND_FOUR, 20, 20, 200, 20, "GADGETS AU CHOIX")
  SetGadgetColor(#TXT_EXPAND_FOUR, #PB_Gadget_BackColor, RGB(199, 161, 54))
    ;
  ;}
  CloseGadgetList()
  HideGadget(#CONTAINER_EXPAND_FOUR, #True)
  
   ;-Statusbar
  If CreateStatusBar(#STATUS, WindowID(#MAIN_WINDOW)) ;{
    AddStatusBarField(150)
    AddStatusBarField(#PB_Ignore)
    StatusBarText(#STATUS, 0, "Fenêtre principale", #PB_StatusBar_Center|#PB_StatusBar_Raised)
    StatusBarText(#STATUS, 1, "Information", #PB_StatusBar_Raised)    
    SendMessage_(StatusBarID(#STATUS),#WM_SETFONT,FontID(0),0) ; modifie la police de caractère de la statusbar
    ;}
  EndIf
  

  ;- Boucle principale
  Repeat
    Select WaitWindowEvent()
      Case #PB_Event_Gadget
        Select EventGadget()
     ;-Extensions                 
          Case #CANVAS_EXPAND_ONE ;{
            If EventType() = #PB_EventType_MouseEnter
              SetGadgetAttribute(#CANVAS_EXPAND_ONE, #PB_Canvas_Cursor, #PB_Cursor_Hand)
              StatusBarText(#STATUS, 1, "Extension de la fenêtre et affichage d'autres fonctions disponibles", #PB_StatusBar_Raised)
            ElseIf EventType() = #PB_EventType_MouseLeave
              SetGadgetAttribute(#CANVAS_EXPAND_ONE, #PB_Canvas_Cursor, #PB_Cursor_Default)
              StatusBarText(#STATUS, 1, "Zone d'information", #PB_StatusBar_Raised)
            ElseIf EventType() = #PB_EventType_LeftClick
              ExpandAndCollapse(#CANVAS_EXPAND_ONE)
            EndIf        
            ;}  
            
          Case #CANVAS_EXPAND_TWO ;{
            If EventType() = #PB_EventType_MouseEnter
              SetGadgetAttribute(#CANVAS_EXPAND_TWO, #PB_Canvas_Cursor, #PB_Cursor_Hand)
              StatusBarText(#STATUS, 1, "Extension de la fenêtre et affichage d'autres fonctions disponibles", #PB_StatusBar_Raised)
            ElseIf EventType() = #PB_EventType_MouseLeave
              SetGadgetAttribute(#CANVAS_EXPAND_TWO, #PB_Canvas_Cursor, #PB_Cursor_Default)
              StatusBarText(#STATUS, 1, "Zone d'information", #PB_StatusBar_Raised)
            ElseIf EventType() = #PB_EventType_LeftClick
             ExpandAndCollapse(#CANVAS_EXPAND_TWO)
            EndIf        
            ;} 
            
          Case #CANVAS_EXPAND_THREE ;{
            If EventType() = #PB_EventType_MouseEnter
              SetGadgetAttribute(#CANVAS_EXPAND_THREE, #PB_Canvas_Cursor, #PB_Cursor_Hand)
              StatusBarText(#STATUS, 1, "Extension de la fenêtre et affichage d'autres fonctions disponibles", #PB_StatusBar_Raised)
            ElseIf EventType() = #PB_EventType_MouseLeave
              SetGadgetAttribute(#CANVAS_EXPAND_THREE, #PB_Canvas_Cursor, #PB_Cursor_Default)
              StatusBarText(#STATUS, 1, "Zone d'information", #PB_StatusBar_Raised)
            ElseIf EventType() = #PB_EventType_LeftClick
              ExpandAndCollapse(#CANVAS_EXPAND_THREE)
            EndIf        
            ;} 
            
          Case #CANVAS_EXPAND_FOUR ;{
            If EventType() = #PB_EventType_MouseEnter
              SetGadgetAttribute(#CANVAS_EXPAND_FOUR, #PB_Canvas_Cursor, #PB_Cursor_Hand)
              StatusBarText(#STATUS, 1, "Extension de la fenêtre et affichage d'autres fonctions disponibles", #PB_StatusBar_Raised)
            ElseIf EventType() = #PB_EventType_MouseLeave
              SetGadgetAttribute(#CANVAS_EXPAND_FOUR, #PB_Canvas_Cursor, #PB_Cursor_Default)
              StatusBarText(#STATUS, 1, "Zone d'information", #PB_StatusBar_Raised)
            ElseIf EventType() = #PB_EventType_LeftClick
              ExpandAndCollapse(#CANVAS_EXPAND_FOUR)
            EndIf        
            ;} 
            
     ;-Boutons       
          Case #BTN_QUIT ;{
            ButtonMovementEffect(#BTN_QUIT, 0, 40, 1)
            If EventType() = #PB_EventType_MouseEnter 
              SetGadgetAttribute(#BTN_QUIT, #PB_Canvas_Cursor, #PB_Cursor_Hand)
              StatusBarText(#STATUS, 1, "Quitter l'application maintenant", #PB_StatusBar_Raised)
            ElseIf EventType() = #PB_EventType_MouseLeave 
              SetGadgetAttribute(#BTN_QUIT, #PB_Canvas_Cursor, #PB_Cursor_Default)
              StatusBarText(#STATUS, 1, "Zone d'information", #PB_StatusBar_Raised)
            ElseIf EventType() = #PB_EventType_LeftClick
              Break
            EndIf
            ;}             
          Case #BTN_ABOUT ;{
            ButtonMovementEffect(#BTN_ABOUT, 100, 40, 1)
            If EventType() = #PB_EventType_MouseEnter 
              SetGadgetAttribute(#BTN_ABOUT, #PB_Canvas_Cursor, #PB_Cursor_Hand)
              StatusBarText(#STATUS, 1, "A propos de ces boutons", #PB_StatusBar_Raised)
            ElseIf EventType() = #PB_EventType_MouseLeave
              SetGadgetAttribute(#BTN_ABOUT, #PB_Canvas_Cursor, #PB_Cursor_Default)
              StatusBarText(#STATUS, 1, "Zone d'information", #PB_StatusBar_Raised)
            ElseIf EventType() = #PB_EventType_LeftClick
              MessageRequester("Message", "C'est Cool!", #PB_MessageRequester_Ok|#PB_MessageRequester_Info)
            EndIf
            ;}           
          Case #BTN_HELP ;{
            ButtonMovementEffect(#BTN_HELP, 200, 40, 1)
            If EventType() = #PB_EventType_MouseEnter 
              SetGadgetAttribute(#BTN_HELP, #PB_Canvas_Cursor, #PB_Cursor_Hand)
              StatusBarText(#STATUS, 1, "A propos de ???", #PB_StatusBar_Raised)
            ElseIf EventType() = #PB_EventType_MouseLeave 
              SetGadgetAttribute(#BTN_HELP, #PB_Canvas_Cursor, #PB_Cursor_Default)
              StatusBarText(#STATUS, 1, "Zone d'information", #PB_StatusBar_Raised)
            ElseIf EventType() = #PB_EventType_LeftClick
              MessageRequester("Message", "C'est Cool aussi non ?", #PB_MessageRequester_Ok|#PB_MessageRequester_Info)
            EndIf
            ;}          
          Case #BTN_OTHER ;{
            ButtonMovementEffect(#BTN_OTHER, 300, 40, 1)
            If EventType() = #PB_EventType_MouseEnter 
              SetGadgetAttribute(#BTN_OTHER, #PB_Canvas_Cursor, #PB_Cursor_Hand)
              StatusBarText(#STATUS, 1, "Autre chose ?", #PB_StatusBar_Raised)
            ElseIf EventType() = #PB_EventType_MouseLeave 
              SetGadgetAttribute(#BTN_OTHER, #PB_Canvas_Cursor, #PB_Cursor_Default)
              StatusBarText(#STATUS, 1, "Zone d'information", #PB_StatusBar_Raised)
            ElseIf EventType() = #PB_EventType_LeftClick
              MessageRequester("Message", "Autre chose ?", #PB_MessageRequester_Ok|#PB_MessageRequester_Info)
            EndIf
            ;}
          Case #BTN_TOGGLE ;{
            ButtonMovementEffect(#BTN_TOGGLE, 400, 40, 2) ; 2 = toggle
            If EventType() = #PB_EventType_MouseEnter 
              SetGadgetAttribute(#BTN_TOGGLE, #PB_Canvas_Cursor, #PB_Cursor_Hand)
              StatusBarText(#STATUS, 1, "Bouton Toggle", #PB_StatusBar_Raised)
            ElseIf EventType() = #PB_EventType_MouseLeave 
              SetGadgetAttribute(#BTN_TOGGLE, #PB_Canvas_Cursor, #PB_Cursor_Default)
              StatusBarText(#STATUS, 1, "Zone d'information", #PB_StatusBar_Raised)
            ElseIf EventType() = #PB_EventType_LeftClick              
              MessageRequester("Message", "Bouton Toggle", #PB_MessageRequester_Ok|#PB_MessageRequester_Info)
            EndIf
            ;}
            
        EndSelect        
        
      Case #PB_Event_CloseWindow
        Break
        
    EndSelect   
  ForEver 
EndIf

Re: Création de gadgets avec CanvasGadget() + VectorDrawing

Publié : jeu. 15/janv./2026 17:09
par SPH
Ca marche nickel :!: :arrow: :P

Re: Création de gadgets avec CanvasGadget() + VectorDrawing

Publié : jeu. 15/janv./2026 17:23
par Jacobus
SPH a écrit : jeu. 15/janv./2026 17:09 Ca marche nickel :!: :arrow: :P
Super! merci.
Je sais que ça fait un peu retour vers XP, mais j'aime bien ce style :)

Re: Création de gadgets avec CanvasGadget() + VectorDrawing

Publié : jeu. 15/janv./2026 18:38
par venom
Jacobus a écrit : jeu. 15/janv./2026 17:23 Super! merci.
Je sais que ça fait un peu retour vers XP, mais j'aime bien ce style :)
J'avoue que j'ai pensé direct a ça :lol:

Bravo en tout cas les screens sont sympa ça met de la couleurs aux gui 😎







@++

Re: Création de gadgets avec CanvasGadget() + VectorDrawing

Publié : jeu. 15/janv./2026 20:22
par Jacobus
venom a écrit : jeu. 15/janv./2026 18:38 J'avoue que j'ai pensé direct a ça :lol:
Bravo en tout cas les screens sont sympa ça met de la couleurs aux gui 😎
Salut venom, oui sans m'en rendre compte j'ai régressé vers xp. :lol:
Mais bon, on peut modifier les couleurs comme on veut. :)

Re: Création de gadgets avec CanvasGadget() + VectorDrawing

Publié : jeu. 15/janv./2026 21:29
par SPH
C'est dans tes cordes (/facile ?) de proposer d'autres skins ?

Egalement, sais tu comment incorporer des gifs animés ?

Re: Création de gadgets avec CanvasGadget() + VectorDrawing

Publié : ven. 16/janv./2026 7:56
par Jacobus
Tout dépend de ce que tu veux comme genre de skins. Il y a plusieurs méthodes pour créer des fenêtres qui sortent des standards et je pense qu'elles ont déjà toutes été abordées. Une recherche sur les forums PB donnera des codes pour faire ce que l'on veut. Je n'avais pas encore utilisé le CanvasGadget() pour autre chose qu'un tableau blanc. Mais j'avoue que ce gadget est vraiment très puissant et qu'il offre d'énormes possibilités, et je vais m'en servir souvent. :) Dans tous les cas cela prend toujours du temps car il faut chercher, tester, rectifier...

Perso, je plaçe les gif animés dans des WebGadget() et ça fonctionne très bien, du plus petit au plus grand, l'affichage est nickel. Mais comme tu le sais minimy a publié un code pour afficher les gif dans CanvasGadget(). https://www.purebasic.fr/english/viewtopic.php?t=88142 Ca fonctionne très bien, que veux-tu de différent ?

Si tu veux un code plus simple que celui de minimy, si je reprends l'exemple de la documentation et que je l'adapte pour le gif de minimy, cela donne ça :
Le gif ici : giphy.gif
Le code :

Code : Tout sélectionner

; Loading a GIF file
; https://media1.giphy.com/media/v1.Y2lkPTc5MGI3NjExMjhzanEyMnkwZWkyYnRreXc5dzVlNjZlZDF4ZW8yeWM0Zm5qcXNsYiZlcD12MV9pbnRlcm5hbF9naWZfYnlfaWQmY3Q9Zw/XUFPGrX5Zis6Y/giphy.gif
; Enable the GIF decoder
UseGIFImageDecoder()
Filename$ = Emplacement$+"\giphy.gif"
If LoadImage(0, Filename$)
  OpenWindow(0, 500, 300, DesktopUnscaledX(ImageWidth(0)), DesktopUnscaledY(ImageHeight(0)), "GIF viewer") 
  CanvasGadget(0, 0, 0, ImageWidth(0), ImageHeight(0))  
  ; On ajoute une minuterie pour animer le GIF 
  ; l’animation démarre immédiatement pour afficher la première image sans délai.
  AddWindowTimer(0, 0, 50) ; modifier le timeout pour voir la différence de vitesse (50, 100, 500) 
  Repeat
    Event = WaitWindowEvent()   
    If Event = #PB_Event_Timer
      SetImageFrame(0, Frame) ; index de l'image 
      If StartDrawing(CanvasOutput(0))
        DrawImage(ImageID(0), 0, 0)
        StopDrawing()
      EndIf      
      ; Go to next frame
      Frame+1
      If Frame >= ImageFrameCount(0) ; Revient à la première image pour lire en boucle.
        Frame = 0
      EndIf
    EndIf   
  Until Event = #PB_Event_CloseWindow
Else
  Debug "Impossible to load the file: " + Filename$
EndIf
Ou dans le WebGadget() ça donne :

Code : Tout sélectionner

UseGIFImageDecoder()
Enumeration
  #MAIN_WINDOW
  #GifThread
EndEnumeration

;Pour limiter l'usage du WebGadget() à l'affichage du gif
Procedure NavigationCallback(Gadget, Url$) 
  
  gif = FindString(Url$,"giphy.gif")
  If gif = 0  
    ProcedureReturn #False 
  Else
    ProcedureReturn #True
  EndIf 
  
EndProcedure

If OpenWindow(#MAIN_WINDOW, 0, 0, 500, 300, "Fenêtre principale", #PB_Window_SystemMenu | #PB_Window_ScreenCentered|#PB_Window_MaximizeGadget|#PB_Window_MinimizeGadget|#PB_Window_SizeGadget)
  
  WebGadget(#GifThread, 0, 0, 500, 281, "file://"+Path$+"\giphy.gif", #PB_Web_Edge) ; dimensions exactes du gif
  SetGadgetAttribute(#GifThread, #PB_Web_NavigationCallback, @NavigationCallback()) ; limite l'usage au gif (pas de connexion web)
  SetGadgetAttribute(#GifThread, #PB_Web_BlockPopups, 1)
  SetGadgetAttribute(#GifThread, #PB_Web_BlockPopupMenu, 1)
  
Repeat
  EventMain = WaitWindowEvent()
  Select EventMain 
     Case #PB_Event_CloseWindow : quit = #True
  EndSelect
;-END       
Until quit = #True
End 
EndIf
Fuseau horaire sur UTC+01:00
Page 2 sur 2

Développé par phpBB® Forum Software © phpBB Limited

Traduction française officielle © Qiaeru