How do I resize a SF Symbol button in SwiftUI?

Question

I'm trying to resize a SF Symbol button in SwiftUI. I've tried .font(.system(size: 60)) and .imageScale(.medium) but it doesn't work. It still has this same error. This is my code:

var buttons: [Button<Image>] = [
    Button(action: {
        print("Add tapped")
    }) {
        Image(systemName: "plus.circle.fill")
    }
]

Cannot convert value of type 'some View' to closure result type 'Image'

Why do you need an array for this and/or can't you apply the size when you use the buttons in your view? — Joakim Danielson, Jul 08 '21 at 15:57

score 4 · Answer 1 · answered Jul 08 '21 at 16:17

4

Take the help of UIImage.

var buttons: [Button<Image>] = [
    Button(action: {
        print("Add tapped")
    }) {
        let config = UIImage.SymbolConfiguration(font: UIFont.systemFont(ofSize: 60))
        let image = UIImage(systemName: "plus.circle.fill", withConfiguration: config) ?? UIImage()
        return Image(uiImage: image)
    }
]

But the question is still why you need this [Button<Image>] ???

answered Jul 08 '21 at 16:17

Raja Kishan

16,767
2
26
52

thank you. It works! I'm new to this, I'm trying to make a customNavigationView. – Na'im Roslan Jul 09 '21 at 11:29
@Na'imRoslan you can accept / upvote answere if it helped you – Raja Kishan Jul 09 '21 at 12:35
I’m sorry I can’t. I need 15 reputation to upvote. I’m sorry – Na'im Roslan Jul 09 '21 at 17:58

score 1 · Answer 2 · answered Jul 08 '21 at 15:33

If all fails there is an option to resize UIImage's with SFSymbols. If you don't mind making the program a bit longer, I would recommend using,

extension UIImage {
    func resized(to newSize: CGSize) -> UIImage? {
        UIGraphicsBeginImageContextWithOptions(newSize, false, 0)
        defer { UIGraphicsEndImageContext() }

        draw(in: CGRect(origin: .zero, size: newSize))
        return UIGraphicsGetImageFromCurrentImageContext()
    }
}

which resizes the UIImage. So you can initialize your Image with a resized UIImage. The code will look something like...

Image(uiImage: UIImage(systemName: "plus.circle.fill")!.resized(to: CGSize(width: 40, height: 40)))

How do I resize a SF Symbol button in SwiftUI?

2 Answers2