| Website | https://hacknicity.com/adaptivity |
| App Store | https://apps.apple.com/app/id1054670022 |
Fun #sfSymbols fact: there are 24 symbols with three letter names and none of them have been renamed (yet!)
The first screenshot shows them all in a custom collection I made in Adaptivity. I’ve configured the availability annotation to only annotate symbols added (or renamed) in iOS 13.1 or later. Those without an annotation have been available since iOS 13.
A much simpler way to see the symbols available since iOS 13 is to change to the iOS 13 data set, which hides newer symbols. There’s 13.
A nice way to randomly discover interesting #sfSymbols is to use Adaptivity’s symbol widget(s) on your Home Screen. They support all sizes and have configuration parameters to select specific categories, render mode, refresh interval and light/dark appearance.
Adaptivity’s comprehensive collection of SF Symbol data sets is also available in the form of a Mac menu bar app: SF Menu Bar. It makes finding symbols and copying the name very easy. Or copy the Unicode character for a symbol to use in Figma, Sketch, Pixelmator Pro etc. It has configurable layout and symbol sizes to work well from the smallest laptop to the largest external monitor.
https://apps.apple.com/app/id1615595104
See @sfmenubar for tips and news about SF Menu Bar.
SF Menu Bar helps developers and designers browse Apple's collection of over 4,400 SF Symbols and quickly copy a symbol's name or unicode character to the clipboard. FEATURES • Instantly-accessible menu bar app with optional global keyboard shortcut • Smart search algorithm to quickly find symbols…
Browsing SF Symbols is one of many #iosdev features in Adaptivity. It has some very useful features that Apple’s SF Symbols app does not. Browse any of the eleven (!) different SF Symbol data sets over time, with names that were valid in that version (and later). It’s very easy to see which iOS version symbols were added or renamed using annotations on the symbols or the separate smart collections for added and renamed symbols. See other posts in this account for more.
Adaptivity is an invaluable tool for developers and designers. Use it to visualize how Size Classes and margins for layout, readable content and the safe area look on real devices and how they change with respect to orientation, iPad multitasking and Dynamic Type size changes. A comprehensive System…
iOS 15 added hierarchical rendering to show two or three layers of compatible symbols in different intensities to indicate depth. A tint color can be applied and affects all layers.
Palette rendering allowed the colors for each layer to be customised individually.
A “hierarchical / palette” category was added to make it easier to find symbols supporting these render modes.
iOS 14 added a multicolor render mode for some symbols (it was pretty buggy in UIKit until iOS 15). Some or all parts of symbols supporting multicolor rendering would have fixed colors (such as a white plus symbol on a green circle for “add” symbols). The tint color was used for any parts that were not fixed.
A “multicolor” category was added to make it easier to find multicolor-capable symbols.
A short thread on #sfsymbols render modes over history. Screenshots are taken from Adaptivity, browsing different iOS version data sets, categories and using various render modes and colors.
When first introduced in iOS 13 they were all monochrome. A tint color could be applied (system mint in the second screenshot).
When displaying text in an iOS app, the readableContentGuide is a useful layout margin to use. From Apple’s documentation: “This layout guide defines an area that can easily be read without forcing users to move their head to track the lines.” (https://developer.apple.com/documentation/uikit/uiview/1622644-readablecontentguide).
Adaptivity shows the guide and how it changes with the user’s text size (content size category). Table views can optionally inset their cells to match the guide. Unfortunately, there is no SwiftUI equivalent.
