Changing button icon for a Floating Menu Button

It would be great if there was an option to change the button icon on the Floating Menu using Apple Script, just as you can do with widgets and buttons on the Touch Bar.

that’s already possible :wink: I’ll post an example later!

1 Like

So in general you can update any property of a floating menu item via Apple Script. You can get the current properties of your button by copying it to your clipboard (cmd+c) and pasting it in some text editor.

Here is a example for a simple button with a SFSymbol icon (star.fill):

[
  {
    "BTTLastUpdatedAt" : 1697054613.9067469,
    "BTTTriggerType" : 773,
    "BTTTriggerTypeDescription" : "Standard Item",
    "BTTTriggerParentUUID" : "8FF605C0-F80C-4366-9402-C9E7BCA06FB2",
    "BTTIsPureAction" : true,
    "BTTTriggerClass" : "BTTTriggerTypeFloatingMenu",
    "BTTUUID" : "7C0D8C7D-04B0-42F9-BC2E-786B68747210",
    "BTTEnabled" : 1,
    "BTTTriggerName" : "Menu Item: test",
    "BTTMenuConfig" : {
      "BTTMenuItemMaxHeight" : 50,
      "BTTMenuCategoryItemIcon" : 1,
      "BTTMenuItemMinWidth" : 100,
      "BTTMenuItemImageHeight" : 30,
      "BTTMenuElementIdentifier" : "test",
      "BTTMenuItemBackgroundColorDark" : "108.442, 96.000, 190.435, 166.991",
      "BTTMenuItemSFSymbolName" : "star.fill",
      "BTTMenuItemImageOffsetX" : 5,
      "BTTMenuItemBorderColorHover" : "255.000000, 255.000000, 255.000000, 255.000000",
      "BTTMenuItemVisibleWhileInactive" : 1,
      "BTTMenuAlwaysUseLightMode" : 1,
      "BTTMenuCategoryBackground" : 1,
      "BTTMenuItemBackgroundTypeDark" : 4,
      "BTTLastChangeUUID" : "533DAD65-B1E7-48E9-947E-DC5E21A08A9B",
      "BTTMenuItemBackgroundType" : 4,
      "BTTMenuAppearanceStyle" : 1,
      "BTTMenuItemBackgroundColorHoverDark" : "90, 90.000, 180, 166.991",
      "BTTMenuItemBorderColorHoverDark" : "255.000000, 255.000000, 255.000000, 255.000000",
      "BTTMenuCategoryItemSizing" : 1,
      "BTTMenuItemBackgroundColor" : "108.442, 96.000, 190.435, 166.991",
      "BTTMenuItemMinHeight" : 50,
      "BTTMenuItemIconType" : 2,
      "BTTMenuItemBorderColorDark" : "255.000000, 255.000000, 255.000000, 255.000000",
      "BTTMenuItemBackgroundColorHover" : "90, 90.000, 180, 166.991",
      "BTTMenuHoverEndAnimationDuration" : 0.14999999999999999,
      "BTTMenuItemBorderColor" : "255.000000, 255.000000, 255.000000, 255.000000",
      "BTTMenuHoverStartAnimationDuration" : 0.14999999999999999,
      "BTTMenuItemVisibleWhileActive" : 1,
      "BTTMenuItemMaxWidth" : 200,
      "BTTMenuItemIconColor1" : "255.000000, 255.000000, 255.000000, 255.000000"
    }
  }
]

Now to change that icon you can either reference the item by name or by UUID. This example will change the icon to "star.slash" SFSymbol.

Apple Script Example With Item UUID:

tell application "BetterTouchTool"
    update_menu_item "044E5D2B-5661-4A1F-AB39-8D1EA2C1DBA1" json "{BTTMenuItemSFSymbolName: 'star.slash' }" persist true
end tell

Apple Script Example With Menu Name And Item Name:

tell application "BetterTouchTool"
    update_menu_item menu_name "TheMenuName" item_name "TheItemName" json "{BTTMenuItemSFSymbolName: 'star.slash' }" persist true
end tell

Alternatively you can return the json / json5 directly from the button's script.

1 Like

It's great that there is such an option, however, I am missing what is in the case of the Touch Bar, i.e. the icon_data value, which does not retrieve the icon from the SFSymbol database, but from the entered value. Is there such an option (and I may have overlooked it) or will it be added?

You can also change an image by image data, for that provide a json like this:

{BTTMenuItemImage: 'base64_encoded_image', BTTMenuItemIconType: 1}

Or if you want to load it from a file:

{BTTMenuItemIconPath: '/Users/username/absolute/path/to/image.png', BTTMenuItemIconType: 2}

I'm currently preparing a list of all possible properties and their various allowed values.

Thank you!

I am currently trying to add SF icons. How do I change their colors?
Here is my current non-working JSON code:

{
BTTMenuItemIconType : '2', 
BTTMenuItemSFSymbolName: 'battery.100percent', 
BTTMenuItemIconColor1: '"50.000000, 215.000000, 75.000000, 255.000000'
}

what symbol style do you have selected?
It should be set to "custom color palette" or "hierarchical" if you want to use custom colors.

You can also update the style via the JSON:

{
BTTMenuItemIconType : 2, 
BTTMenuItemSFSymbolName: 'battery.100percent', 
BTTMenuItemIconColor1: '50.000000, 215.000000, 75.000000, 255.000000',
BTTMenuItemSFSymbolStyle: 1

}

Also make sure BTTMenuItemIconType is a number, not a string. Oh and there was one quote too much in your icon color (at the beginning)

Thank you, it worked!