SwiftUI - how to change text alignment of label in Toggle?

Question

Code for Toggle in SwiftUI is this:

Toggle(isOn: $vibrateOnRing) {
    Text("Vibrate on Ring")
}

This will produce a toggle button with text label looking like this:

Vibrate on Ring | [--empty space--] | Toggle

I need a right-aligned text label, like this:

[--empty space--] | Vibrate on Ring | Toggle

How to do it in SwiftUI?

Answer 1

Here it is

Toggle(isOn: $vibrateOnRing) {
    Text("Vibrate on Ring")
      .frame(maxWidth: .infinity, alignment: .trailing)
}

Answer 2

I was able to achieve this by decoupling the toggle button and the text label, that is:

HStack() {
    Spacer()
    Text("Vibrate on Ring")
    Toggle("", isOn: $vibrateOnRing).labelsHidden()
}

And for folks who are looking for a solution for center alignment, aka:

[--empty space--] | Vibrate on Ring | Toggle | [--empty space--]

simply add a trailing spacer:

HStack() {
    Spacer()
    Text("Vibrate on Ring")
    Toggle("", isOn: $vibrateOnRing).labelsHidden()
    Spacer()
}

Answer 3

This works for me

Toggle(isOn: $selPer, label: {
    HStack {
        Spacer()
        Image(systemName: "thermometer.sun")
            .foregroundColor(ITheme.IColor.sfImg)
            .font(.system(size: 12))
        if selPer {
            Text("关")
                .foregroundColor(Color.white)
                .font(ITheme.IFont.titleMin)
        } else {
            Text("开")
                .foregroundColor(Color.black)
                .font(ITheme.IFont.titleMin)
        }
    }
})