Render Menu Items with Icon (e.g SFSymbol) on Catalyst

Question

arthurfromberlin OP

Created Nov ’23

Replies 2

Boosts 0

Views 1.1k

Participants 3

Hello,

is there a recommended way to render Menu items, e.g in a SwiftUI ContextMenu with icon (SFSymbols)?

Let's say I have the following setup:

Screenshot 2023-11-15 at 12.22.14.png

Both buttons render fine on native macOS (e.g Sonoma) but Catalyst refuses to render the symbol at all. I tried every possible combination I could think off. The only way I found was to directly copy and paste a symbol from the SF symbols app and inline it with the label string as unicode. Unfortunately I have a couple custom SF symbols so this isn't really an option for me.

I feel like this is a perfectly valid usecase, as it makes the menu visually a lot easier scannable. With UIKit and Ventura this at least worked for Menubar items but now also seems broken on Sonoma.

I would greatly appreciate any hints. Thanks!

Boost

Answer 1

Frameworks Engineer OP

Apple

Nov ’23

This is not currently possible on Mac Catalyst. FWIW the use of images (including symbols) is discouraged in Mac context menus, and is generally against macOS HI guidelines. You'll notice that the built-in system apps on the Mac do not use images in their context menus. Menu bar menus, however, can have images in them (such as in Safari) though this is still quite uncommon.

Copying and pasting symbols from the SF Symbols app as unicode text is also not supported. The character requires the SF Symbols app/fonts to be installed, which the vast majority of users with your app won't have. The character will render as an unknown character for them. It is intended to be used for design prototypes only.

If you believe you have a valid use case for images in Mac Catalyst context menus, we would appreciate a feedback report with more details. Thank you!

0

Answer 2

justme1968 OP

Nov ’23

a use case for this would be a context menu for an image that allows the user to change this icon by choosing from a list of sf symbol images. or something like an emoji picker

i have found the current limitations for catalyst swiftui context menus are a problem more than once.

1