ImgButtonEx - Crossplattform

ts-soft · Beitrag von **ts-soft** » 21.02.2013 12:38

ImgButtonEx ist ein Flatbutton mit Imagesupport.

Funktionen:
ImgButtonEx() ; erstellt den Button, für optionale Parameter ist -1 zu übergeben
FreeImgButtonEx() ; gibt den Button wieder frei
DisableImgButtonEx() ; disabled oder enabled den Button
ResizeImgButtonEx()
SetFontImgButtonEx()
SetTextImgButtonEx
SetImageImgButtonEx()
SetColorImgButtonEx() ; mit folgenden Typen:

Code: Alles auswählen

  #ImgButton_Color_TextColor
  #ImgButton_Color_HotColor
  #ImgButton_Color_BackColor

ImgButtonExDraw() ; muß im Eventloop bei allen, ausser Clickereignissen aufgerufen werden

Bilder sollten einen Alphakanal haben, sonst sieht es evtl. komisch aus

Icons werden nicht unterstützt.
Der Buttontext sieht leider gemalt nicht immer so gut aus

Code: Alles auswählen

; ImgButtonEx
; Autor: Thomas <ts-soft> Schulz
; PB 5.10
; Crossplattform
; Version 1.5

Structure ImgButtonEx
  ID.i
  x.i
  y.i
  w.i
  h.i
  inactive.i
  text.s
  textcolor.i
  hotcolor.i
  backcolor.i
  Image.i
  sizedImage.i
  hFont.i
EndStructure

Enumeration ;colortype
  #ImgButton_Color_TextColor
  #ImgButton_Color_HotColor
  #ImgButton_Color_BackColor
EndEnumeration

Global NewMap _ImgButtonEx_.ImgButtonEx()

Macro _ImgButtonExDraw_
  If \hFont = -1
    DrawingFont(#PB_Default)
  Else
    DrawingFont(\hFont)
  EndIf
  If \sizedImage And IsImage(\sizedImage) : FreeImage(\sizedImage) : EndIf
  If \Image <> -1 And IsImage(\Image)
    img = CopyImage(\Image, #PB_Any)
    ResizeImage(img, GadgetHeight(\ID) - 10, GadgetHeight(\ID) - 10)
    DrawAlphaImage(ImageID(img), 5, GadgetHeight(\ID) - ImageHeight(img) - 5)
    DrawText(ImageWidth(img) + 10, (GadgetHeight(\ID) - TextHeight(\text)) / 2, \text, \textcolor)
    \sizedImage = img
  Else
    DrawText((GadgetWidth(\ID) - TextWidth(\text)) / 2, (GadgetHeight(\ID) - TextHeight(\text)) / 2, \text, \textcolor)
  EndIf
EndMacro

Procedure ImgButtonExDraw(ID, EvType = #PB_EventType_MouseLeave)
  Protected img
  With _ImgButtonEx_(Str(ID))
    StartDrawing(CanvasOutput(\ID))
    DrawingMode(#PB_2DDrawing_Transparent)
    If \inactive
      Box(0, 0, \w - 1, \h -1, \backcolor)
      Line(0, 0, \w -1, 1, RGB(128, 128, 128))
      Line(0, \h- 1, \w -1, 1, RGB(128, 128, 128))
      Line(0, 0, 1, \h - 1, RGB(128, 128, 128))
      Line(\w -1, 0, 1, \h - 1, RGB(128, 128, 128))
      _ImgButtonExDraw_
    Else
      Select EvType
        Case #PB_EventType_MouseEnter, #PB_EventType_LeftButtonUp
          Box(0, 0, \w - 1, \h -1, \backcolor)
          Line(0, 0, \w -1, 1, RGB(128, 128, 128))
          Line(0, \h- 1, \w -1, 1, RGB(128, 128, 128))
          Line(0, 0, 1, \h - 1, RGB(128, 128, 128))
          Line(\w -1, 0, 1, \h - 1, RGB(128, 128, 128))
          Box(2, 2, \w -3, \h -3, \hotcolor)
          _ImgButtonExDraw_
        Case #PB_EventType_MouseLeave
          Box(0, 0, \w - 1, \h -1, \backcolor)
          Line(0, 0, \w -1, 1, RGB(128, 128, 128))
          Line(0, \h- 1, \w -1, 1, RGB(128, 128, 128))
          Line(0, 0, 1, \h - 1, RGB(128, 128, 128))
          Line(\w -1, 0, 1, \h - 1, RGB(128, 128, 128))
          _ImgButtonExDraw_
        Case #PB_EventType_LeftButtonDown
          Box(0, 0, \w - 1, \h -1, \backcolor)
          Line(0, 0, \w -1, 1, RGB(128, 128, 128))
          Line(0, \h- 1, \w -1, 1, RGB(255, 255, 255))
          Line(0, 0, 1, \h - 1, RGB(128, 128, 128))
          Line(\w -1, 0, 1, \h - 1, RGB(255, 255, 255))
          If \hFont = -1
            DrawingFont(#PB_Default)
          Else
            DrawingFont(\hFont)
          EndIf
          If \sizedImage And IsImage(\sizedImage) : FreeImage(\sizedImage) : EndIf
          If \Image <> -1 And IsImage(\Image)
            img = CopyImage(\Image, #PB_Any)
            ResizeImage(img, GadgetHeight(\ID) - 10, GadgetHeight(\ID) - 10)
            DrawAlphaImage(ImageID(img), 6, GadgetHeight(\ID) - ImageHeight(img) - 4)
            DrawText(ImageWidth(img) + 11, (GadgetHeight(\ID) - TextHeight(\text)) / 2 + 1, \text, \textcolor)
            \sizedImage = img
          Else
            DrawText((GadgetWidth(\ID) - TextWidth(\text)) / 2 + 1, (GadgetHeight(\ID) - TextHeight(\text)) / 2 + 1, \text, \textcolor)
          EndIf
      EndSelect
    EndIf
    StopDrawing()
  EndWith
EndProcedure

Procedure DisableImgButtonEx(ID, state = #True)
  _ImgButtonEx_()\inactive = state
  ImgButtonExDraw(ID, #PB_EventType_MouseLeave)
  DisableGadget(ID, state)
EndProcedure

Procedure ResizeImgButtonEx(ID, x, y, w, h)
  If IsGadget(ID)
    With _ImgButtonEx_(Str(ID))
      If x <> #PB_Ignore : \x = x : EndIf
      If y <> #PB_Ignore : \y = y : EndIf
      If w <> #PB_Ignore : \w = w : EndIf
      If h <> #PB_Ignore : \h = h : EndIf
      ResizeGadget(ID, x, y, w, h)
      ImgButtonExDraw(\ID, #PB_EventType_MouseLeave)
    EndWith
  EndIf
EndProcedure

Procedure SetColorImgButtonEx(ID, Type, Color)
  If IsGadget(ID)
    With _ImgButtonEx_(Str(ID))
      Select Type
        Case #ImgButton_Color_TextColor
          \textcolor = Color
        Case #ImgButton_Color_HotColor
          \hotcolor = Color
        Case #ImgButton_Color_BackColor
          \backcolor = Color
      EndSelect
      ImgButtonExDraw(\ID, #PB_EventType_MouseLeave)
    EndWith
  EndIf
EndProcedure

Procedure SetTextImgButtonEx(ID, text.s)
  If IsGadget(ID)
    With _ImgButtonEx_(Str(ID))
      \text = text
      ImgButtonExDraw(\ID, #PB_EventType_MouseLeave)
    EndWith    
  EndIf
EndProcedure

Procedure SetFontImgButtonEx(ID, hFont = -1)
  If IsGadget(ID)
    With _ImgButtonEx_(Str(ID))
      \hFont = hFont
      ImgButtonExDraw(\ID, #PB_EventType_MouseLeave)
    EndWith
  EndIf
EndProcedure

Procedure SetImageImgButtonEx(ID, Image = -1)
  If IsGadget(ID)
    With _ImgButtonEx_(Str(ID))
      \Image = Image
      ImgButtonExDraw(\ID, #PB_EventType_MouseLeave)
    EndWith
  EndIf
EndProcedure

Procedure FreeImgButtonEx(ID)
  If IsGadget(ID)
    DeleteMapElement(_ImgButtonEx_(), Str(ID))
    FreeGadget(ID)
  EndIf
EndProcedure

Procedure ImgButtonEx(ID, x, y, w, h, text.s,
                        textcolor = -1, ; Textfarbe. Default ist schwarz.
                        hotcolor = -1,  ; Farbe, wenn Button den Fokus hat. Default ist weiß.
                        backcolor = -1, ; Hintergrundfarbe, Default ist die Systemfarbe für Controls.
                        hFont = -1,     ; handle eines geladenen Fonts (FontID(#Font)).
                        Image = -1)     ; ID des geladenen Bildes.
                       
  Protected result = CanvasGadget(ID, x, y, w, h)
 
  If ID = #PB_Any : ID = result : EndIf
  With _ImgButtonEx_(Str(ID))
    \ID = ID
    \x = x
    \y = y
    \w = w
    \h = h
    \text = text
    If textcolor = -1
      \textcolor = 0
    Else
      \textcolor = textcolor
    EndIf
    If hotcolor = -1
      \hotcolor = RGB(255, 255, 255)
    Else
      \hotcolor = hotcolor
    EndIf
    If backcolor = -1
      CompilerIf #PB_Compiler_OS = #PB_OS_Windows
        \backcolor = GetSysColor_(#COLOR_BTNFACE)
      CompilerElse
        \backcolor = RGB(238, 237, 236)
      CompilerEndIf
    Else
      \backcolor = backcolor
    EndIf
    \Image = Image
    \hFont = hFont
  EndWith
  ImgButtonExDraw(ID)
 
  ProcedureReturn result
EndProcedure

CompilerIf Not #PB_Compiler_IsIncludeFile
UsePNGImageDecoder()

Define button
CatchImage(0, ?Information_png_start)
CatchImage(1, ?ExitSign_png_start)
LoadFont(0, "Arial", 10)
OpenWindow(0, #PB_Ignore, #PB_Ignore, 150, 90, "Button Test")
ImgButtonEx(0, 20, 10, 100, 25, "Über", -1, -1, -1, FontID(0), 0)
; DisableImgButtonEx(0)
button = ImgButtonEx(#PB_Any, 20, 50, 100, 25, "Beenden", -1, -1, -1, FontID(0), 1)
GadgetToolTip(button, "Hiermit wird das Programm beendet!")

Repeat
  Select WaitWindowEvent()
    Case #PB_Event_CloseWindow
      Break
    Case #PB_Event_Gadget
      Select EventGadget()
        Case 0
          If EventType() = #PB_EventType_LeftClick
            SetTextImgButtonEx(0, "Test")
            MessageRequester("Button Test", "Beispiel zum ImgButtonEx")
          Else
            ImgButtonExDraw(0, EventType())
          EndIf
        Case button
          Select EventType()
            Case #PB_EventType_LeftClick
              Select MessageRequester("Button Test", "Wirklich beenden", #PB_MessageRequester_YesNo)
                Case #PB_MessageRequester_Yes
                  Break
              EndSelect
            Case #PB_EventType_RightClick
            Case #PB_EventType_LeftDoubleClick
            Default
              ImgButtonExDraw(button, EventType())
          EndSelect
      EndSelect
  EndSelect
ForEver

DataSection
  Information_png_start:
    ; size : 484 bytes
    Data.q $0A1A0A0D474E5089,$524448490D000000,$1000000010000000,$FFF31F0000000608,$414449AB01000061
    Data.q $024BCF939DDA7854,$2FDB2CABBFC71051,$5D904410EB2484D7,$5D16105104450EC2,$241427F5BA5C820A
    Data.q $AE8763C13753A5D4,$4E8240FD26E952DD,$4125D514BA325D46,$9B5D5B6176B448B3,$CCC303A85929AE57
    Data.q $871E76666F3E663E,$9220D40E02040932,$914E262B9F0D2524,$4BB24005AB9D2559,$B972380195D027EA
    Data.q $5F4CD9B01DBB19F8,$A43217023CC9B711,$74CCA5CC3BF45691,$BB698B1033F3C75A,$6EDC27658AE65804
    Data.q $B386F077C4CC94BE,$DBA6563C9D261CFB,$6E6344489067AE2A,$A7411508F1E00957,$D43F30573BD81F37
    Data.q $A0C10F57E141D98C,$56BC38E8AD2037FA,$60A2014E1303C2D1,$63AB29E0075CD982,$B2CEC551EC4144FB
    Data.q $5ABBC157D7C88708,$F05921BD5555E240,$5F1E000D1D384479,$82DA34B16508D873,$1580CFE29D0101A9
    Data.q $AA7B14D8D61C316A,$E1E0CFDCD80605FE,$160B5B19934B0F25,$71D193210CFC76F4,$707B1A75C965AC7C
    Data.q $D166D2B567D07B47,$094A15AC8051F289,$3C406FF6DD0E36B6,$1ED20B5468D97FAE,$70E93ACC91600648
    Data.q $B776E3396593B5B5,$A5AF32F2E0162D5B,$C43F28D78E827A52,$DCD9C616F3FE0795,$52F6FB337678C6C6
    Data.q $9562946A1C399FB2,$872805D7951BE641,$9FCE7F2CDA300C34,$F9A81272ABBFF53B,$444E454900000000
    Data.b $AE,$42,$60,$82
  Information_png_end:
EndDataSection

DataSection
  ExitSign_png_start:
    ; size : 367 bytes
    Data.q $0A1A0A0D474E5089,$524448490D000000,$1000000010000000,$FFF31F0000000608,$4144493601000061
    Data.q $3010A06463DA7854,$00F10E874380C552,$B3B3B27EF5123E29,$84E4076CD408C2FB,$34A603205580E991
    Data.q $E18E70C73ECA6F7D,$AA9431A529E6101D,$E930C499DF7431E4,$31F07EF8BAAC2CDE,$4D76717431687168
    Data.q $88DB203DF0101B05,$5C026DDF392C08C1,$92FA8D143F2EFDA1,$5DEC213B74930C9A,$B00C4037381B0C76
    Data.q $9609C0C9CD976EFB,$A4A04170C58A5548,$CC34C15BE7FAC337,$0F38870C3A5DD900,$2290018496400C21
    Data.q $E3E06C0576EC7810,$C359AAD01B714FEF,$44EBD8AC05BD7D50,$204D60558B36C318,$7C193B9796C0C0D7
    Data.q $CCE817E80D31DDC4,$11CDFFB4D20C9986,$7689B3B0456E1506,$08D9388AE4104801,$94095E283A6DD906
    Data.q $AB1A60ADE3C18605,$031DE7F77858A001,$641857816DA04FC3,$1BC54837001AA3D7,$76965EFB2CCC2C6B
    Data.q $8403101D3816E18B,$B280E961080D5080,$DA640BCA29220894,$4DC3AE587F00070C,$490000000017426F
    Data.b $45,$4E,$44,$AE,$42,$60,$82
  ExitSign_png_end:
EndDataSection
CompilerEndIf

Viel Spaß damit

// edit
Diese Version wird nicht mehr von mir supported,
eine verbesserte Version als Klasse, findet Ihr hier:
http://www.purebasic.fr/english/viewtop ... 35#p405635

Beitrag von **RSBasic** » 21.02.2013 15:11

Ich hätte normalerweise einen ButtonGadget mit Icons als Flat-Flag erstellt:

Code: Alles auswählen

EnableExplicit

Define EventID
Define Null

#BCM_FIRST = $1600
#BCM_SETIMAGELIST = #BCM_FIRST + 2
#BUTTON_IMAGELIST_ALIGN_LEFT = 0

Structure BUTTON_IMAGELIST
  himl.l
  margin.RECT
  uAlign.l
EndStructure

InitCommonControls_()

If OpenLibrary(1,"comctl32.dll")
  Prototype ImageList_AddIcon(List,Icon)
  Global ImageList_AddIcon.ImageList_AddIcon
  ImageList_AddIcon=GetFunction(1,"ImageList_AddIcon")
  
  CloseLibrary(1)
EndIf

Procedure AddIconToButton(ButtonID,IconID,w=16,h=16)
  Protected buttonImgList.BUTTON_IMAGELIST
  Protected himlIcons

  himlIcons = ImageList_Create_(w,h, #ILC_MASK |#ILC_COLOR32, 1, 0)
     
  ImageList_AddIcon(himlIcons, IconID)

  With buttonImgList
    \uAlign = #BUTTON_IMAGELIST_ALIGN_LEFT
    \margin\top = 3
    \margin\bottom = 3
    \margin\left = 3
    \margin\right = 3
    \himl = himlIcons
  EndWith
   
  SendMessage_(ButtonID, #BCM_SETIMAGELIST, 0, buttonImgList) 
EndProcedure

If OpenWindow(0,0,0,500,400,"Window",#PB_Window_SystemMenu|#PB_Window_ScreenCentered)
  ButtonGadget(1,10,10,100,40,"Button",0)
  
  AddIconToButton(GadgetID(1),LoadIcon_(0,#IDI_APPLICATION),32,32);oder ImageID(#Icon)
  SetWindowTheme_(GadgetID(1),@Null,@Null)
  SetWindowLongPtr_(GadgetID(1),#GWL_STYLE,GetWindowLongPtr_(GadgetID(1),#GWL_STYLE)|#BS_FLAT) 
  
  Repeat
    EventID=WaitWindowEvent()
    If EventID = #PB_Event_CloseWindow
      End
    EndIf
  ForEver
EndIf

Aber dein selbstgemachter Button ist natürlich viel besser, weils dann überall läuft und nicht nur unter Windows.
Danke fürs Teilen.

ts-soft · Beitrag von **ts-soft** » 21.02.2013 15:18

@RSBasic
Sollte Dein Button ein Bild darstellen? (funktioniert nur unter x86

)

Code: Alles auswählen

Structure BUTTON_IMAGELIST
  himl.i
  margin.RECT
  uAlign.l
EndStructure

Ansonsten finde ich meinen Button auch schöner, wenn er gedrückt ist.

Aber das wichtigste ist natürlich, es ist Crossplattform.

Schön, wenn es Dir gefällt
Thomas

Beitrag von **RSBasic** » 21.02.2013 15:23

@ts-soft
Stimmt, es funktioniert nur unter x86. Danke für den Verbesserungscode der Struktur. Diesen wird beim nächsten Update von WAPIL ausgetauscht.

Mir ist noch aufgefallen, dass der Klick noch als Klick ausgewertet wird, wenn man die Maustaste beim Drücken woanders loslässt.

ts-soft · Beitrag von **ts-soft** » 21.02.2013 17:40

Update:

Neue Funktionen:
ResizeImgButtonEx()
SetFontImgButtonEx()
SetImageImgButtonEx()
SetColorImgButtonEx() ; mit folgenden Typen:

Code: Alles auswählen

  #ImgButton_Color_TextColor
  #ImgButton_Color_HotColor
  #ImgButton_Color_BackColor

sowie Fehlerbeseitigung.

Bilder werden der Buttongrösse jetzt automatisch angepasst!

ts-soft · Beitrag von **ts-soft** » 22.02.2013 09:51

Update 1.5

letzte fehlende Funktion hinzugefügt:
SetTextImgButtonEx()

Gruß
Thomas

ts-soft · Beitrag von **ts-soft** » 22.02.2013 17:18

Eine verbesserte Version als Klasse, findet Ihr hier:
http://www.purebasic.fr/english/viewtop ... 35#p405635

Gruß
Thomas

Beitrag von **Andesdaf** » 22.02.2013 18:30

schick, danke

Beitrag von **RSBasic** » 03.03.2013 19:11

Es ist leider immernoch nicht möglich, den gedrückten Mausklick abzubrechen, indem man die Maustaste außerhalb des Buttons loslässt, wie das normalerweise so ist.
Kannst du das noch implementieren?

ts-soft · Beitrag von **ts-soft** » 03.03.2013 19:16

RSBasic hat geschrieben:Es ist leider immernoch nicht möglich, den gedrückten Mausklick abzubrechen, indem man die Maustaste außerhalb des Buttons loslässt, wie das normalerweise so ist.
Kannst du das noch implementieren?

Nutze bitte die Version, die ich im vorherigen Posting verlinkt habe, dort ist es gefixed.

Diese Version sollte besser nicht verwendet werden, da ich nur noch die neue Supporte!
Sonst wird mir das irgendwann doch zu viel

Gruß
Thomas

PureBoard

ImgButtonEx - Crossplattform

ImgButtonEx - Crossplattform

Re: ImgButtonEx - Crossplattform

Re: ImgButtonEx - Crossplattform

Re: ImgButtonEx - Crossplattform

Re: ImgButtonEx - Crossplattform

Re: ImgButtonEx - Crossplattform

Re: ImgButtonEx - Crossplattform

Re: ImgButtonEx - Crossplattform

Re: ImgButtonEx - Crossplattform

Re: ImgButtonEx - Crossplattform