Bouton avec du texte et une image de fond

Partagez votre expérience de PureBasic avec les autres utilisateurs.
Le Soldat Inconnu
Messages : 4312
Inscription : mer. 28/janv./2004 20:58
Localisation : Clermont ferrand OU Olsztyn
Contact :

Bouton avec du texte et une image de fond

Message par Le Soldat Inconnu »

Salut,

vous aimez faire de joli bouton ?

et bien j'ai codé un truc super cool avec le code de Freak que j'ai largement bidouillé à ma sauce :D donc c'est forcément génial, huhu :lol:

Donc voici ce que j'ai mis au point :
Un bouton avec avec du texte sans bord et une image de fond.
Vous choississez :
- Le texte à afficher et son alignement
- L'image de fond
- L'image de fond quand la souris est au dessus du bouton
- L'image de fond quand on clique sur le bouton
- Le curseur de la souris quand on est au dessus du bouton

alors, ça vous intéressent :?:
je pense que oui, mais je sais pas si vous méritez d'avoir ce code :mrgreen:

On va voir, je vais attendre un peu.

Le temps de comprendre comment marche ce fichu TailBite pour faire une lib (je ne l'ai toujours pas touché, ce truc, faut que je m'y mette)

donc A+ :D
Je ne suis pas à moitié Polonais mais ma moitié est polonaise ... Vous avez suivi ?

[Intel quad core Q9400 2.66mhz, ATI 4870, 4Go Ram, XP (x86) / 7 (x64)]
Le Soldat Inconnu
Messages : 4312
Inscription : mer. 28/janv./2004 20:58
Localisation : Clermont ferrand OU Olsztyn
Contact :

Message par Le Soldat Inconnu »

je suis vache (meuh), voici le code :

à enregistrer sous le nom de fichier "ButtonImageGadgetEx.pb"

Code : Tout sélectionner

#DST_COMPLEX = $0000
#DST_TEXT = $0001
#DST_PREFIXTEXT = $0002
#DST_ICON = $0003
#DST_BITMAP = $0004

#DSS_NORMAL = $0000
#DSS_UNION = $0010
#DSS_DISABLED = $0020
#DSS_MONO = $0080
#DSS_HIDEPREFIX = $0200
#DSS_PREFIXONLY = $0400
#DSS_RIGHT = $8000

#IDI_ASTERISK = 32516
#IDI_EXCLAMATION = 32515
#IDI_HAND = 32513
#IDI_ERROR = 32513
#IDI_INFORMATION = 32516
#IDI_QUESTION = 32514
#IDI_WARNING = 32515
#IDI_WINLOGO = 32517

Global hWndProc.l, ActiveButton.l, ButtonImageGadgetCursor.l, ButtonImageGadgetTextColor.l, ButtonImageGadgetTextSelectedColor.l

Structure ButtonImageWinCallBack
  hWnd.l
  Msg.l
  Func.l
EndStructure

NewList ButtonImageCallBacks.ButtonImageWinCallBack()

Procedure RegisterCallBack(hWnd.l, Msg.l, Func.l)
  AddElement(ButtonImageCallBacks())
  ButtonImageCallBacks()\hWnd = hWnd
  ButtonImageCallBacks()\msg = Msg
  ButtonImageCallBacks()\Func = Func
EndProcedure

Procedure ButtonImageGadgetExCallback(hWnd, uMsg, wParam, lParam)
  ReturnValue = #PB_ProcessPureBasicEvents
  ResetList(ButtonImageCallBacks())
  While NextElement(ButtonImageCallBacks())
    If ButtonImageCallBacks()\hWnd = hWnd And ButtonImageCallBacks()\Msg = uMsg
      CallWindowProc_(ButtonImageCallBacks()\Func, hWnd, uMsg, wParam, lParam)
    EndIf
  Wend
  ProcedureReturn ReturnValue
EndProcedure

Procedure HoverCallBack(hWnd, uMsg, wParam, lParam)
  Select uMsg
    Case #WM_LBUTTONUP
      ActiveButton = 0
      InvalidateRect_(hWnd, 0, #TRUE)
    Case #WM_MOUSEMOVE
      If GetCapture_() = hWnd And activebutton <> 0
        mx.l = lParam & $FFFF
        my.l = lParam >> 16
        GetWindowRect_(hWnd, @rc.RECT)
        gw = rc\right - rc\left
        gh = rc\bottom - rc\top
        If mx < 0 Or my < 0 Or mx > gw Or my > gh
          ActiveButton = 0
          InvalidateRect_(hWnd, 0, #TRUE)
          ReleaseCapture_()
        EndIf
      Else
        SetCapture_(hWnd)
        SetCursor_(ButtonImageGadgetCursor)
        ActiveButton = hWnd
        InvalidateRect_(hWnd, 0, #TRUE)
      EndIf
  EndSelect
  ProcedureReturn CallWindowProc_(hWndProc, hWnd, uMsg, wParam, lParam)
EndProcedure

Procedure OnDrawHoverButton(hWnd, uMsg, wParam, lParam)
  *dis.DRAWITEMSTRUCT = lParam
  If * dis\CtlType = #ODT_BUTTON
    
    bhWnd = *dis\hWndItem
    GetClientRect_(bhWnd, rc.RECT)
    hDC = GetDC_(bhWnd)
    
    ; Police d'écriture
    hFont = GetStockObject_(#DEFAULT_GUI_FONT)
    SelectObject_(hDC, hFont)
    
    ; On récupère le texte et le handle des images du bouton
    Texte.s = Space(255)
    SetBkMode_(hDC, #TRANSPARENT)
    GetWindowText_(bhWnd, Texte, 255)
    ImageNormal.l = Val(StringField(Texte, 2, "|"))
    ImageSurvol.l = Val(StringField(Texte, 3, "|"))
    ImageAppui.l = Val(StringField(Texte, 4, "|"))
    Alignement.l = Val(StringField(Texte, 5, "|"))
    Texte = StringField(Texte, 1, "|")
    
    If activebutton = bhWnd
      GetClientRect_(bhWnd, rc.RECT)
      ; Couleur du Texte
      SetTextColor_(hDC, ButtonImageGadgetTextSelectedColor)
      
      If * dis\itemState & #ODS_SELECTED ; Bouton appuyé
        If DrawState_(hDC, 0, 0, ImageAppui, 0, rc\left, rc\top, 0, 0, #DST_BITMAP | #DSS_NORMAL)
          DrawState_(hDC, 0, 0, ImageAppui, 0, rc\left, rc\top, 0, 0, #DST_ICON | #DSS_NORMAL)
        EndIf
        
      Else ; bouton avec survol
        If DrawState_(hDC, 0, 0, ImageSurvol, 0, rc\left, rc\top, 0, 0, #DST_BITMAP | #DSS_NORMAL)
          DrawState_(hDC, 0, 0, ImageSurvol, 0, rc\left, rc\top, 0, 0, #DST_ICON | #DSS_NORMAL)
        EndIf
      EndIf
      
    Else ; Bouton normal
      ; Couleur du Texte
      SetTextColor_(hDC, ButtonImageGadgetTextColor)
      
      If DrawState_(hDC, 0, 0, ImageNormal, 0, rc\left, rc\top, 0, 0, #DST_BITMAP | #DSS_NORMAL)
        DrawState_(hDC, 0, 0, ImageNormal, 0, rc\left, rc\top, 0, 0, #DST_ICON | #DSS_NORMAL)
      EndIf
      
    EndIf
    
    ; Texte
    rc\left + 2 ; pour ne pas mettre le texte contre le bord du bouton
    rc\right - 2
    DrawTextEx_(hDC, Texte, -1, @rc, #DT_EXPANDTABS | #DT_VCENTER | #DT_SINGLELINE | Alignement, 0)
    
  EndIf
  ReleaseDC_(bhWnd, hDC)
EndProcedure

Procedure UseButtonImageGadgetEx(WindowID)
  SetWindowCallback(@ButtonImageGadgetExCallback())
  RegisterCallBack(WindowID, #WM_DRAWITEM, @OnDrawHoverButton())
  ButtonImageGadgetCursor = LoadCursor_(0, #IDC_HAND)
  ButtonImageGadgetTextColor = 0
  ButtonImageGadgetTextSelectedColor = 0
EndProcedure

Procedure ButtonImageGadgetCursor(Curseur)
  ; Choisir le cuseur quand on est au dessus des boutons
  
  ; valeurs possibles pour le curseur :
  ; #IDC_ARROW = 32512 ; la flèche (le curseur normal)
  ; #IDC_IBEAM = 32513 ; curseur sélection de texte
  ; #IDC_UPARROW = 32516 ; flèche qui pointe vers le haut
  ; #IDC_APPSTARTING = 32650 ; curseur attente (flèche + sablier)
  ; #IDC_WAIT = 32514 ; curseur occupé (sablier)
  ; #IDC_CROSS = 32515 ; curseur précision de la sélection (croix)
  ; #IDC_SIZENWSE = 32642 ; curseur de dimensionnment, pointe le NordOuest et le SudEst
  ; #IDC_SIZENESW = 32643 ; curseur de dimensionnment, pointe le NE et le SO
  ; #IDC_SIZEWE = 32644 ; curseur de dimensionnment, pointe le E et le O
  ; #IDC_SIZENS = 32645 ; curseur de dimensionnment, pointe le N et le S
  ; #IDC_SIZEALL = 32646 ; curseur de déplacement, pointe le N, S, E et O
  ; #IDC_HELP = 32651 ; curseur aide
  ; #IDC_HAND = 32649 ; curseur main
  ; #IDC_NO = 32648 ; curseur "interdit" (panneau d'interdiction)
  
  ButtonImageGadgetCursor = LoadCursor_(0, Curseur)
EndProcedure

Procedure ButtonImageGadgetTextColor(Color1.l, Color2.l)
  ; Choisir la couleur du texte
  
  ; Color1 : Texte normal
  
  ; Color2 : Texte sélectionné
  
  ButtonImageGadgetTextColor = Color1
  ButtonImageGadgetTextSelectedColor = Color2
EndProcedure

Procedure ButtonImageGadgetEx(ID, x, y, Texte.s, ImageNormal.l, ImageSurvol.l, ImageAppui.l, Alignement.l)
  ; Pour créer un bouton avec une image de fond
  ; La taille du bouton s'adapte en fonction de la taille de l'image
  
  ; ID = numéro du gadget
  
  ; X, Y = Position du gadget
  
  ; Texte = texte du gadget (mettre "" si vous ne voulez pas de texte)
  
  ; ImageNormal = Image de fond du bouton
  
  ; ImageSurvol = Image de fond du bouton obtenue quand la souris est au dessus du bouton
  
  ; ImageAppui = Image de fond du bouton obtenue quand on clique sur le bouton
  
  ; ImageDesactivee = Image de fond du bouton quand celui-ci est désactivée, utilser la procedure CreateDisableImage() pour créer une image en noir et blanc.
  
  ; Alignement =
  ; #DT_LEFT : gauche ( =0 )
  ; #DT_CENTER : centre ( =1 )
  ; #DT_RIGHT : droite ( =2 )
  
  UseImage(ImageNormal)
  
  ButtonGadget(ID, x, y, ImageWidth(), ImageHeight(), Texte + "|" + Str(UseImage(ImageNormal)) + "|" + Str(UseImage(ImageSurvol)) + "|" + Str(UseImage(ImageAppui)) + "|" + Str(Alignement), #BS_OWNERDRAW | #BS_BITMAP)
  
  hWndProc = GetWindowLong_(GadgetID(ID),#GWL_WNDPROC)
  SetWindowLong_(GadgetID(ID), #GWL_WNDPROC, @HoverCallBack())
  
EndProcedure

et voici l'exemple qui utilise le bazar précédent en includefile :

Code : Tout sélectionner

IncludeFile "ButtonImageGadgetEx.pb"

Enumeration
  #Img1
  #Img2
  #Img3
  #Img4
  
  #Bouton1
  #Bouton2
  #Bouton3
  #Bouton4
  #Bouton5
  #Bouton6
  #Bouton7
EndEnumeration

If OpenWindow(0, 0, 0, 200, 200, #PB_Window_SystemMenu | #PB_Window_ScreenCentered, "ButtonImageGadgetEx") And CreateGadgetList(WindowID(0))
  
  ; Création d'images
  CreateImage(#Img1, 50, 50)
  StartDrawing(ImageOutput())
    Box(0, 0, 50, 50, RGB(255, 255, 220))
    DrawingMode(1)
    FrontColor(0, 0, 0)
    Locate(1, 1)
    DrawText("1")
  StopDrawing()
  
  CreateImage(#Img2, 50, 50)
  StartDrawing(ImageOutput())
    Box(0, 0, 50, 50, RGB(140, 160, 140))
    Box(2, 2, 46, 46, RGB(160, 180, 160))
    DrawingMode(1)
    FrontColor(0, 0, 0)
    Locate(1, 1)
    DrawText("2")
  StopDrawing()
  
  CreateImage(#Img3, 50, 50)
  StartDrawing(ImageOutput())
    Box(0, 0, 50, 50, RGB(0, 200, 0))
    Circle(24, 24, 25, RGB(0, 180, 0))
    DrawingMode(1)
    FrontColor(0, 0, 0)
    Locate(1, 1)
    DrawText("3")
  StopDrawing()
  
  
  
  UseButtonImageGadgetEx(WindowID())
  ; pour activer le support de ButtonImageGadgetEx
  
  
  ButtonImageGadgetTextColor(RGB(0, 0, 0), RGB(0, 0, 255))
  ; ButtonImageGadgetTextColor(Color1.l, Color2.l)
  ; Choisir la couleur du texte, par défaut noir
  
  ; Color1 : Texte normal
  
  ; Color2 : Texte sélectionné
  
  
  ButtonImageGadgetCursor(#IDC_CROSS)
  ; Choisir le cuseur quand on est au dessus des boutons, par défaut la main
  
  ; valeurs possibles pour le curseur :
  ; #IDC_ARROW = 32512 ; la flèche (le curseur normal)
  ; #IDC_IBEAM = 32513 ; curseur sélection de texte
  ; #IDC_UPARROW = 32516 ; flèche qui pointe vers le haut
  ; #IDC_APPSTARTING = 32650 ; curseur attente (flèche + sablier)
  ; #IDC_WAIT = 32514 ; curseur occupé (sablier)
  ; #IDC_CROSS = 32515 ; curseur précision de la sélection (croix)
  ; #IDC_SIZENWSE = 32642 ; curseur de dimensionnment, pointe le NordOuest et le SudEst
  ; #IDC_SIZENESW = 32643 ; curseur de dimensionnment, pointe le NE et le SO
  ; #IDC_SIZEWE = 32644 ; curseur de dimensionnment, pointe le E et le O
  ; #IDC_SIZENS = 32645 ; curseur de dimensionnment, pointe le N et le S
  ; #IDC_SIZEALL = 32646 ; curseur de déplacement, pointe le N, S, E et O
  ; #IDC_HELP = 32651 ; curseur aide
  ; #IDC_HAND = 32649 ; curseur main
  ; #IDC_NO = 32648 ; curseur "interdit" (panneau d'interdiction)
  
  
  ButtonImageGadgetEx(#Bouton1, 5, 5, "Texte 1", #Img1, #Img2, #Img3, 1)
  ButtonImageGadgetEx(#Bouton2, 60, 5, "", #Img1, #Img2, #Img3, 1)
  ButtonImageGadgetEx(#Bouton3, 5, 60, "Gauche", #Img1, #Img2, #Img3, 0)
  ButtonImageGadgetEx(#Bouton4, 60, 60, "Milieu", #Img1, #Img2, #Img3, 1)
  ButtonImageGadgetEx(#Bouton5, 115, 60, "Droite", #Img1, #Img2, #Img3, 2)
  ; ButtonImageGadgetEx(ID, x, y, Texte.s, ImageNormal.l, ImageSurvol.l, ImageAppui.l, Alignement.l)
  ; Pour créer un bouton avec une image de fond
  ; La taille du bouton s'adapte en fonction de la taille de l'image
  
  ; ID = numéro du gadget
  
  ; X, Y = Position du gadget
  
  ; Texte = texte du gadget (mettre "" si vous ne voulez pas de texte)
  
  ; ImageNormal = Image de fond du bouton
  
  ; ImageSurvol = Image de fond du bouton obtenue quand la souris est au dessus du bouton
  
  ; ImageAppui = Image de fond du bouton obtenue quand on clique sur le bouton
  
  ; Alignement = 
  ; #DT_LEFT : gauche ( =0 )
  ; #DT_CENTER : centre ( =1 )
  ; #DT_RIGHT : droite ( =2 )
  
  
  
  Repeat 
    Event = WaitWindowEvent()
    
    If Event = #PB_EventGadget
      Select EventGadgetID() ; boutons, zone de texte, ...
        Case #Bouton1
          MessageRequester("", "Bouton 1", 0)
        Case #Bouton2
          MessageRequester("", "Bouton 2", 0)
        Case #Bouton3
          MessageRequester("", "Bouton 3", 0)
        Case #Bouton4
          MessageRequester("", "Bouton 4", 0)
        Case #Bouton5
          MessageRequester("", "Bouton 5", 0)
      EndSelect
    EndIf
    
  Until Event = #PB_Event_CloseWindow
EndIf
Vous pouvez tester chez vous et me dire si il y a des bugs ,j'ai testé que sur win98 pour le moment. merci.
Je ne suis pas à moitié Polonais mais ma moitié est polonaise ... Vous avez suivi ?

[Intel quad core Q9400 2.66mhz, ATI 4870, 4Go Ram, XP (x86) / 7 (x64)]
Oliv
Messages : 2117
Inscription : mer. 21/janv./2004 18:39

Message par Oliv »

moé, pas mal sous win98se :(
Anonyme2
Messages : 3518
Inscription : jeu. 22/janv./2004 14:31
Localisation : Sourans

Message par Anonyme2 »

Ca marche bien sous Win98 mais lorsque l'on clique sur le bouton, la petite boite met un certain temps avant de s'afficher. Ca vient de la boite ou du code (j'ai pas regardé)
Le Soldat Inconnu
Messages : 4312
Inscription : mer. 28/janv./2004 20:58
Localisation : Clermont ferrand OU Olsztyn
Contact :

Message par Le Soldat Inconnu »

il faut lacher le bouton, Denis. tu as le doigt lourd :mrgreen:
en fait, ça marche sur la remonté du bouton et non l'appui du bouton de la souris.
si tu arrives à le modifier je suis preneur. :wink: j'ai pas encore trop cherché sur ce point
Je ne suis pas à moitié Polonais mais ma moitié est polonaise ... Vous avez suivi ?

[Intel quad core Q9400 2.66mhz, ATI 4870, 4Go Ram, XP (x86) / 7 (x64)]
Oliv
Messages : 2117
Inscription : mer. 21/janv./2004 18:39

Message par Oliv »

et quand on descend le bouton de la souris sur Bouton 1 par ex, et que l'on glisse vers bouton 2, puis enfin on relache la souris : il n'y a rien
Aranoth
Messages : 293
Inscription : sam. 24/janv./2004 12:00
Localisation : Toulouse (31)
Contact :

Message par Aranoth »

super ca me sera très utile pour mes fenetres personnalisées :D

EDIT: quand je click sa plante "Fermeture du programme" a cause de GDI.exe........ :?
Le Soldat Inconnu
Messages : 4312
Inscription : mer. 28/janv./2004 20:58
Localisation : Clermont ferrand OU Olsztyn
Contact :

Message par Le Soldat Inconnu »

Oliv, essai de faire ton truc sur la croix en haut d'une fenêtre et tu verras que ça fait pareil :wink:

sinon, avant de récupérer le code, je vous conseille de patienter le temps que j'ai bien finaliser le bazar.
j'ai rajouté plein de fonction comme changer le texte, les image, la police de caractère.
je vous fournirait le code une fois le bazar finis.

je vais également essayé de faire une lib avec tailbite (ça y est, je l'ai installé, il faut encore que je lise comment marche cette horreur et c'est bon).
Je ne suis pas à moitié Polonais mais ma moitié est polonaise ... Vous avez suivi ?

[Intel quad core Q9400 2.66mhz, ATI 4870, 4Go Ram, XP (x86) / 7 (x64)]
Le Soldat Inconnu
Messages : 4312
Inscription : mer. 28/janv./2004 20:58
Localisation : Clermont ferrand OU Olsztyn
Contact :

Message par Le Soldat Inconnu »

la version finale est sur mon site sous forme de librairie.

je vous laisse la découvrir, elle est livrer avec un exemple complet

un grand merci à El_Choni pour son aide :wink:
Je ne suis pas à moitié Polonais mais ma moitié est polonaise ... Vous avez suivi ?

[Intel quad core Q9400 2.66mhz, ATI 4870, 4Go Ram, XP (x86) / 7 (x64)]
Le Soldat Inconnu
Messages : 4312
Inscription : mer. 28/janv./2004 20:58
Localisation : Clermont ferrand OU Olsztyn
Contact :

Message par Le Soldat Inconnu »

nouvelle version : j'ai corrigé un problème avec les boutons placés dans des containergadget par exemple
Je ne suis pas à moitié Polonais mais ma moitié est polonaise ... Vous avez suivi ?

[Intel quad core Q9400 2.66mhz, ATI 4870, 4Go Ram, XP (x86) / 7 (x64)]
Répondre