Page 1 of 1

ButtonImageGadget background deleted

Posted: Tue Nov 18, 2025 2:52 pm
by rndrei
How to remove the background of the button if the icon is smaller than the button itself? (MacOS)
Image

Code: Select all

OpenWindow(0, 0,0,100,100, "image_button",#PB_Window_MaximizeGadget|#PB_Window_MinimizeGadget)
UsePNGImageDecoder()
LoadImage(3,"icon.png")
ButtonImageGadget(1, 20, 20,128,128,ImageID(3))
Repeat    
  EventID=WaitWindowEvent(0)      
Until Eventid = #PB_Event_CloseWindow
End

Re: ButtonImageGadget background deleted

Posted: Tue Nov 18, 2025 2:59 pm
by Mindphazer
The background of your png image has to be transparent

Re: ButtonImageGadget background deleted

Posted: Tue Nov 18, 2025 3:05 pm
by rndrei
The background is transparent, the picture is 64x64 and the button is 128x128 and the background is darker at the edges of the button, how to change it?

Re: ButtonImageGadget background deleted

Posted: Tue Nov 18, 2025 3:11 pm
by mk-soft
All OS

Code: Select all

;-TOP

#ProgramTitle = "Main Window"
#Version = "v1.01.1"

Enumeration Windows
  #Main
EndEnumeration

Enumeration Menus
  #MainMenu
EndEnumeration

Enumeration MenuItems
  #MainMenuExitApplication
EndEnumeration

Enumeration Gadgets
  
EndEnumeration

Enumeration Status
  #MainStatusBar
EndEnumeration

Global ExitApplication

UsePNGImageDecoder()

; ----

Procedure CenterImage(Image, NewImage, Width, Height, Depth = 32, BackColor = #PB_Image_Transparent)
  Protected r1, x, y, dx, dy, image2
  
  r1 = CreateImage(NewImage, Width, Height, Depth, BackColor)
  If r1
    If NewImage = #PB_Any
      NewImage = r1
    EndIf
    dx = ImageWidth(Image)
    dy = ImageHeight(Image)
    x = (Width - dx) / 2
    y = (Height - dy) / 2
    If StartDrawing(ImageOutput(NewImage))
      DrawAlphaImage(ImageID(Image), x, y)
      StopDrawing()
    EndIf
  EndIf
  ProcedureReturn r1
EndProcedure

; ----

Procedure UpdateWindow()
  Protected dx, dy
  dx = WindowWidth(#Main)
  dy = WindowHeight(#Main) - StatusBarHeight(#MainStatusBar) - MenuHeight()
  ; Resize gadgets
  
EndProcedure

; ----

Procedure Main()
  Protected dx, dy

  #MainStyle = #PB_Window_SystemMenu | #PB_Window_SizeGadget | #PB_Window_MaximizeGadget | #PB_Window_MinimizeGadget
  
  If OpenWindow(#Main, #PB_Ignore, #PB_Ignore, 800, 600, #ProgramTitle , #MainStyle)
    ; Menu
    CreateMenu(#MainMenu, WindowID(#Main))
    MenuTitle("File")
    MenuItem(#MainMenuExitApplication, "E&xit")
    ; For Mac
    CompilerIf #PB_Compiler_OS = #PB_OS_MacOS
      If Not IsMenu(#MainMenu)
        CreateMenu(#MainMenu, WindowID(#Main))
      EndIf
      MenuItem(#PB_Menu_About, "")
      MenuItem(#PB_Menu_Preferences, "")
    CompilerEndIf
    ; StatusBar  
    CreateStatusBar(#MainStatusBar, WindowID(#Main))
    AddStatusBarField(#PB_Ignore)
    StatusBarText(#MainStatusBar, 0, " " + #Version)
    ; Gadgets
    dx = WindowWidth(#Main)
    dy = WindowHeight(#Main) - StatusBarHeight(#MainStatusBar) - MenuHeight()
    file.s = #PB_Compiler_Home + "examples"+#PS$+"sources"+#PS$+"Data"+#PS$+"world.png"
    LoadImage(0, file)
    ;CenterImage(0, 1, 200, 60, 32, #Blue)
    CenterImage(0, 1, 200, 60)
    ButtonImageGadget(0, 10, 10, 200, 60, ImageID(1))
    
    ; Bind events
    BindEvent(#PB_Event_SizeWindow, @UpdateWindow(), #Main)
    
    ; Main loop
    Repeat
      Select WaitWindowEvent()
        Case #PB_Event_CloseWindow
          ExitApplication = #True
          
        Case #PB_Event_Menu
          Select EventMenu()
            CompilerIf #PB_Compiler_OS = #PB_OS_MacOS   
              Case #PB_Menu_About
                MessageRequester("Info", #ProgramTitle + " " + #Version)
                
              Case #PB_Menu_Preferences
                
              Case #PB_Menu_Quit
                ExitApplication = #True
                
            CompilerEndIf
              
            Case #MainMenuExitApplication
              ExitApplication = #True
              
          EndSelect
          
        Case #PB_Event_Gadget
          Select EventGadget()
            
          EndSelect
          
      EndSelect
      
    Until ExitApplication
    
  EndIf
  
EndProcedure : Main()

Re: ButtonImageGadget background deleted

Posted: Tue Nov 18, 2025 3:43 pm
by rndrei
Doesn't work, the same! I changed the code for simplicity, it doesn't work, the color remains gray!?

Code: Select all

OpenWindow(0, 0,0,300,300, "image_button",#PB_Window_MaximizeGadget|#PB_Window_MinimizeGadget)
UsePNGImageDecoder()
LoadImage(3,#PB_Compiler_Home + "examples"+#PS$+"sources"+#PS$+"Data"+#PS$+"world.png")
r1 = CreateImage(5, 128, 128, 32, #Red)
If StartDrawing(ImageOutput(5))
  DrawAlphaImage(ImageID(3), 10, 10)
  StopDrawing()
EndIf
ButtonImageGadget(1, 20, 20,128,128,ImageID(5))
Repeat    
  EventID=WaitWindowEvent(0)      
Until Eventid = #PB_Event_CloseWindow
End

Re: ButtonImageGadget background deleted

Posted: Tue Nov 18, 2025 4:55 pm
by Piero
Happens also with Sequoia dark mode (quick test)

PS: rndrei, aren't there other nice Russian girls, less interested in cute computer interfaces? ;P

PPS: rndrei, the interface guy! 👍

Re: ButtonImageGadget background deleted

Posted: Wed Nov 19, 2025 8:01 am
by rndrei
It's probably a bug? (MacOS 26.1)

Piero, :D I don't know, but I like programs with a beautiful interface!

Re: ButtonImageGadget background deleted

Posted: Wed Nov 19, 2025 6:12 pm
by mk-soft
Test it ...

Update Example

Code: Select all

;-TOP by mk-soft, v1.01.2, 19.11.2025

#ProgramTitle = "Example Create Button Image"
#Version = "v1.01.2"

Enumeration Windows
  #Main
EndEnumeration

Enumeration Menus
  #MainMenu
EndEnumeration

Enumeration MenuItems
  #MainMenuExitApplication
EndEnumeration

Enumeration Gadgets
  #MainButton1
  #MainButton2
  #MainButton3
EndEnumeration

Enumeration Status
  #MainStatusBar
EndEnumeration

Enumeration Images
  #MainButtonIcon1
  #MainButtonImage1
  #MainButtonImage2
  #MainButtonImage3
EndEnumeration

Global ExitApplication

UsePNGImageDecoder()

; ----

Procedure CenterImage(Image, NewImage, Width, Height, Depth = 32, BackColor = #PB_Image_Transparent)
  Protected r1, x, y, dx, dy, image2
  
  r1 = CreateImage(NewImage, Width, Height, Depth, BackColor)
  If r1
    If NewImage = #PB_Any
      NewImage = r1
    EndIf
    dx = ImageWidth(Image)
    dy = ImageHeight(Image)
    x = (Width - dx) / 2
    y = (Height - dy) / 2
    If StartDrawing(ImageOutput(NewImage))
      DrawAlphaImage(ImageID(Image), x, y)
      StopDrawing()
    EndIf
  EndIf
  ProcedureReturn r1
EndProcedure

Procedure CreateButtonImage(Image, Width, Height, Text.s, Icon=#PB_Ignore, TextColor=#Black,BackColor=#Gray)
  Protected r1, x, y, dx, dy, x2, y2, dx2, dy2
  
  dx = DesktopScaledX(Width)
  dy = DesktopScaledY(Height)
  
  r1 = CreateImage(Image, dx, dy, 32, #PB_Image_Transparent)
  If r1
    If Image = #PB_Any
      Image = r1
    EndIf
    If StartDrawing(ImageOutput(Image))
      x = 3
      y = 3
      dx2 = dx - 6
      dy2 = dy - 6
      DrawingMode(#PB_2DDrawing_AllChannels)
      RoundBox(x, y, dx2, dy2, 4, 4, $FF000000 | BackColor)
      DrawingMode(#PB_2DDrawing_Outlined)
      RoundBox(x, y, dx2, dy2, 4, 4, $FF000000 | #Gray)
      If icon <> #PB_Ignore
        DrawingMode(#PB_2DDrawing_Transparent)
        dx2 = ImageWidth(Icon)
        dy2 = ImageHeight(Icon)
        x = dx2
        y = (dy - dy2) / 2
        DrawAlphaImage(ImageID(Icon), x, y)
        dy2 = TextHeight("X")
        x + dx2 * 3 / 2
        y = (dy /2 - dy2 / 2)
        DrawText(x, y, Text, TextColor)
      Else
        DrawingMode(#PB_2DDrawing_Transparent)
        dx2 = TextWidth(Text)
        dy2 = TextHeight("X")
        x = (dx / 2 - dx2 / 2)
        y = (dy / 2 - dy2 / 2)
        DrawText(x, y, Text, TextColor)
      EndIf
      StopDrawing()
    EndIf
  EndIf
  ProcedureReturn r1
EndProcedure

; ----

Procedure UpdateWindow()
  Protected dx, dy
  dx = WindowWidth(#Main)
  dy = WindowHeight(#Main) - StatusBarHeight(#MainStatusBar) - MenuHeight()
  ; Resize gadgets
  
EndProcedure

; ----

Procedure Main()
  Protected dx, dy, IconFile.s

  #MainStyle = #PB_Window_SystemMenu | #PB_Window_SizeGadget | #PB_Window_MaximizeGadget | #PB_Window_MinimizeGadget
  
  If OpenWindow(#Main, #PB_Ignore, #PB_Ignore, 800, 600, #ProgramTitle , #MainStyle)
    ; Menu
    CreateMenu(#MainMenu, WindowID(#Main))
    MenuTitle("File")
    MenuItem(#MainMenuExitApplication, "E&xit")
    ; For Mac
    CompilerIf #PB_Compiler_OS = #PB_OS_MacOS
      If Not IsMenu(#MainMenu)
        CreateMenu(#MainMenu, WindowID(#Main))
      EndIf
      MenuItem(#PB_Menu_About, "")
      MenuItem(#PB_Menu_Preferences, "")
    CompilerEndIf
    ; StatusBar  
    CreateStatusBar(#MainStatusBar, WindowID(#Main))
    AddStatusBarField(#PB_Ignore)
    StatusBarText(#MainStatusBar, 0, " " + #Version)
    ; Gadgets
    dx = WindowWidth(#Main)
    dy = WindowHeight(#Main) - StatusBarHeight(#MainStatusBar) - MenuHeight()
    
    IconFile = #PB_Compiler_Home + "examples"+#PS$+"sources"+#PS$+"Data"+#PS$+"world.png"
    LoadImage(#MainButtonIcon1, IconFile)
    
    CreateButtonImage(#MainButtonImage1, 180, 40, "Hell World", 0, #White, #Blue)
    ButtonImageGadget(#MainButton1, 10, 10, 180, 40, ImageID(#MainButtonImage1))
    
    CreateButtonImage(#MainButtonImage2, 180, 40, "Hell World", 0)
    ButtonImageGadget(#MainButton2, 10, 60, 180, 40, ImageID(#MainButtonImage2))
    
    CreateButtonImage(#MainButtonImage3, 180, 40, "Alarm", #PB_Ignore, #Yellow, #Red)
    ButtonImageGadget(#MainButton3, 10, 110, 180, 40, ImageID(#MainButtonImage3))
    
    ; Bind events
    BindEvent(#PB_Event_SizeWindow, @UpdateWindow(), #Main)
    
    ; Main loop
    Repeat
      Select WaitWindowEvent()
        Case #PB_Event_CloseWindow
          ExitApplication = #True
          
        Case #PB_Event_Menu
          Select EventMenu()
            CompilerIf #PB_Compiler_OS = #PB_OS_MacOS   
              Case #PB_Menu_About
                MessageRequester("Info", #ProgramTitle + " " + #Version)
                
              Case #PB_Menu_Preferences
                
              Case #PB_Menu_Quit
                ExitApplication = #True
                
            CompilerEndIf
              
            Case #MainMenuExitApplication
              ExitApplication = #True
              
          EndSelect
          
        Case #PB_Event_Gadget
          Select EventGadget()
            
          EndSelect
          
      EndSelect
      
    Until ExitApplication
    
  EndIf
  
EndProcedure : Main()

Re: ButtonImageGadget background deleted

Posted: Wed Nov 19, 2025 8:35 pm
by rndrei
It's work! Thank's!

Re: ButtonImageGadget background deleted

Posted: Wed Nov 19, 2025 11:51 pm
by mk-soft
Update Example
- Optimize code

:wink: