How to modify the size of SF Symbol in SwiftUI

2022-01-11 ｜ Swift ｜ #Words: 234 ｜中文原版

Apple provides many symbols to developers, which improves developer efficiency and unifies the usage of many symbols to avoid misunderstandings. These synbols are called as SF symbols. Apple provides an App for developers to find these symbols, also called SF Symbol, which can be found on the Apple Developer website, as follows:

SF Symbol Page

You can use them in SwiftUI by:

 Image(systemName: "Name")

You can copy the name of symbol in SF Symbol App through selecting “Copy Name”, as follows:

copy the name of symbol in `SF Symbol` App through selecting "Copy Name"

But the size will be very small, and the size cannot be changed by adjusting the frame. Here you need to use .imageScale() to adjust the size:

Image(systemName: "flashlight.off.fill")
	.imageScale(.large)

If it is still too small, or needs fine-tuning, you can use the following methods:

Image(systemName: "flashlight.off.fill")
	.font(.system(size: 32, weight: .black))

SF symbols can be adjusted as fonts. Of course, this kind of adaptation requires some adjustments.

I hope these will help someone in need~