🎨

SF Symbolsを多色対応するのにsymbolRenderingModeは不要だった

2024/01/10に公開

はじめに

SF Symbolsを多色対応する為に、いつも.symbolRenderingMode(.palette)を記述してました。

Image(systemName: "sos.circle.fill")
    .symbolRenderingMode(.palette)
    .foregroundStyle(.white, .red)

sos

.symbolRenderingModeを使用しなくても同様の結果が得られる

しかし、.symbolRenderingMode(.palette)を記述しない場合でも同様の結果が得られました。

Image(systemName: "sos.circle.fill")
    .foregroundStyle(.white, .red)

sos

理由

symbolRenderingModeの概要を見てみると下記の記載がある。

The current symbol rendering mode, or nil denoting that the mode is picked automatically using the current image and foreground style as parameters.

symbolRenderingModenilの場合は現在の画像とforeground styleを使用して自動的にレンダリングするモードを選択してくれる為、.foregroundStyleで複数の色を設定するだけでおそらくパレットモードになってくれています。

まとめ

「状態によって、モードを切り分けたい」や「階層カラーやマルチカラーを使いたい」場合は、.symbolRenderingMode(_:)修飾子を使って、モードを切り替える必要がありますが、単純にパレットモードでレンダリングしたい場合では、.symbolRenderingMode(_:)の記述は不要でした。

この機会に是非ともSF Symbolsに色を与えて遊んであげてください。

littleossa

参考

https://developer.apple.com/documentation/swiftui/symbolrenderingmode
https://developer.apple.com/documentation/swiftui/environmentvalues/symbolrenderingmode

Discussion