Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to prevent text compression when centering a View in SwiftUI?

Tags:

swiftui

See attached:

Squished Toggle in SwiftUI

... The code for this centered toggle is simply:

@State var rememberMe: Bool = false

HStack(alignment: .center) {
    Spacer()
    Toggle(
        "Remember Me",
        isOn: $rememberMe
    )
    Spacer()
}

Obviously, there's no need for ellipsis here, but by eliminating the Spacer() on each side, it'll grow to fill the width.

How do you center the Toggle without squishing its text? 🤔

like image 845
Ben Capital Avatar asked Oct 19 '25 14:10

Ben Capital


1 Answers

fixedSize() seems to fix the issue on my end. We don't even need a HStack:

import SwiftUI

struct ContentView: View {
    @State var rememberMe: Bool = false
    var body: some View {
        Toggle(
            "Remember Me",
            isOn: $rememberMe
        ).fixedSize()
    }
}

#if DEBUG
struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}
#endif

Result

result

From Apple:

fixedSize() Fixes this view at its ideal size.

like image 64
backslash-f Avatar answered Oct 21 '25 22:10

backslash-f