ButtonImageGadget background deleted

Just starting out? Need help? Post your questions and find answers here.
User avatar
rndrei
Enthusiast
Enthusiast
Posts: 203
Joined: Thu Dec 28, 2023 9:04 pm

ButtonImageGadget background deleted

Post 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
User avatar
Mindphazer
Enthusiast
Enthusiast
Posts: 507
Joined: Mon Sep 10, 2012 10:41 am
Location: Savoie

Re: ButtonImageGadget background deleted

Post by Mindphazer »

The background of your png image has to be transparent
MacBook Pro 16" M4 Pro - 24 Gb - MacOS 26.1 - Iphone 17 Pro Max - iPad at home
...and unfortunately... Windows at work...
User avatar
rndrei
Enthusiast
Enthusiast
Posts: 203
Joined: Thu Dec 28, 2023 9:04 pm

Re: ButtonImageGadget background deleted

Post 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?
User avatar
mk-soft
Always Here
Always Here
Posts: 6421
Joined: Fri May 12, 2006 6:51 pm
Location: Germany

Re: ButtonImageGadget background deleted

Post 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()
My Projects ThreadToGUI / OOP-BaseClass / EventDesigner V3
PB v3.30 / v5.75 - OS Mac Mini OSX 10.xx - VM Window Pro / Linux Ubuntu
Downloads on my Webspace / OneDrive
User avatar
rndrei
Enthusiast
Enthusiast
Posts: 203
Joined: Thu Dec 28, 2023 9:04 pm

Re: ButtonImageGadget background deleted

Post 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
User avatar
Piero
Addict
Addict
Posts: 1144
Joined: Sat Apr 29, 2023 6:04 pm
Location: Italy

Re: ButtonImageGadget background deleted

Post 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! 👍
User avatar
rndrei
Enthusiast
Enthusiast
Posts: 203
Joined: Thu Dec 28, 2023 9:04 pm

Re: ButtonImageGadget background deleted

Post by rndrei »

It's probably a bug? (MacOS 26.1)

Piero, :D I don't know, but I like programs with a beautiful interface!
User avatar
mk-soft
Always Here
Always Here
Posts: 6421
Joined: Fri May 12, 2006 6:51 pm
Location: Germany

Re: ButtonImageGadget background deleted

Post 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()
Last edited by mk-soft on Wed Nov 19, 2025 11:50 pm, edited 1 time in total.
My Projects ThreadToGUI / OOP-BaseClass / EventDesigner V3
PB v3.30 / v5.75 - OS Mac Mini OSX 10.xx - VM Window Pro / Linux Ubuntu
Downloads on my Webspace / OneDrive
User avatar
rndrei
Enthusiast
Enthusiast
Posts: 203
Joined: Thu Dec 28, 2023 9:04 pm

Re: ButtonImageGadget background deleted

Post by rndrei »

It's work! Thank's!
User avatar
mk-soft
Always Here
Always Here
Posts: 6421
Joined: Fri May 12, 2006 6:51 pm
Location: Germany

Re: ButtonImageGadget background deleted

Post by mk-soft »

Update Example
- Optimize code

:wink:
My Projects ThreadToGUI / OOP-BaseClass / EventDesigner V3
PB v3.30 / v5.75 - OS Mac Mini OSX 10.xx - VM Window Pro / Linux Ubuntu
Downloads on my Webspace / OneDrive
Post Reply