How to set a color on mouse hover for custom toolbar icon for my extension

image
I am creating a toolbar icon in SketchUp for my extension. How to change the color of the toolbar icon on hover as shown in the pic ? Is there a method in UI::toolbar or a way to do that. All the icons have the default hover color but it is not being applied to my extension toolbar icon.

 # Adding the toolbar icon 
    toolbar = UI.toolbar('Extension')
    cmd = UI::Command.new("Extension") {
     # commands
    }
    cmd.tooltip = "Extension"
    cmd.status_bar_text = "Extension"
    menu.add_item(cmd)
    
    if Sketchup.platform == :platform_osx
      cmd.small_icon ="/assets/icons/Extension.svg"
      cmd.large_icon = "/assets/icons/Extension.svg"
    else
      cmd.small_icon = "/assets/icons/Extension.svg"
      cmd.large_icon = "/assets/icons/Extension.svg"
    end
    toolbar.add_item cmd
    toolbar.restore
    toolbar.show

(1) The icon file type for Mac is pdf not svg. Try:

    ext =( Sketchup.platform == :platform_osx ? 'pdf' : 'svg' )
    path = "assets/icons/Extension.#{ext}"
    cmd.small_icon= cmd.large_icon= path

Note, relative paths should not begin with a '/' otherwise the system believes you are starting from the current drives root. If the path is relative to the location of the ruby file, then you can use:

    path = File.join(__dir__, "assets/icons/Extension.#{ext}")

REF: Kernel#__dir__() global method


(2) You cannot make any custom hover color for toolbar icons. It is controlled by the SketchUp application according to how it sets the hover style for its’ Qt interface.
And, … the button hover highlighting is working fine for me on an Nvidia GTX-1060 in SketchUp 24. However there have been complaints that the hover style is too much (exactly) like the pressed style for toolbar buttons.

1 Like

image
So basically if this is the icon (Example) on hovering over it, the blue background is not shown but for other existing icons it does. Even the ones downloaded form extension warehouse, those icons on hover shows the same color. So that’s why I am confused whether there is a property for this or some method

Are you using a custom Windows GUI theme ? SketchUp has never played nice with custom themes.

In fact I think that SU2024 will not honor any Windows theme settings as it is completely controlled by the Qt framework now.

In the past some of the theme settings did come through, some did not because the Qt migration was incomplete.

1 Like

And additional info. Native toolbar buttons and Ruby toolbar buttons are handled differently.
We (users) cannot place Ruby buttons on native toolbars or visa versa.

1 Like

You can use a transparent background for your images. Then the highlighting that you see will show through. Also, the icons should be square. The reason you see the blue in your example is that the icon image is rectangular.

The Microsoft Snipping Tool has resizing and Remove Background options.

2 Likes

Good call JD. It didn’t dawn on me that the icon background was solid white.

2 Likes

No I am not but thats interesting, I will make sure to remember that, Thank you

Yes I am not using a transparent background for the image, thanks for the cue

Thank you for your help, I will make sure to do this