SwiftUI text-alignment

You can do this via the modifier .multilineTextAlignment(.center).

Apple Documentation

From SwiftUI beta 3 forward, you can center a text view with the frame modifier:

Text("Centered")    .frame(maxWidth: .infinity, alignment: .center)

Was trying to understand this myself as other answers here mention Text.multilineTextAlignment(_:) / VStack(alignment:) / frame(width:alignment:) but each solution solves a specific problem. Eventually it depends on the UI requirement and a combination of these.

VStack(alignment:)

The alignment here is for the inner views in respective to one another.
So specifying .leading would associate all inner views to have their leading aligned with one another.

VStack(alignment: .leading, spacing: 6) {  Text("Lorem ipsum dolor")        .background(Color.gray.opacity(0.2))  Text("sit amet")        .background(Color.gray.opacity(0.2))}.background(Color.gray.opacity(0.1))

.frame

In frame(width:alignment:) or frame(maxWidth:alignment:), the alignment is for the contents within the given width.

VStack(alignment: .leading, spacing: 6) {  Text("Lorem ipsum dolor")      .background(Color.gray.opacity(0.2))  Text("sit amet")      .background(Color.gray.opacity(0.2))}.frame(width: 380, alignment: .trailing).background(Color.gray.opacity(0.1))

The inners views are leading aligned respective to one another but the views themselves are trailing aligned respective to the VStack.

.multilineTextAlignment

This specifies the alignment of the text inside and can be seen best when there are multiple lines otherwise without a defined frame(width:alignment), the width is automatically adjusted and gets affected by the default alignments.

VStack(alignment: .trailing, spacing: 6) {  Text("0. automatic frame\n+ view at parent's specified alignment\n+ multilineTA not set by default at leading")    .background(Color.gray.opacity(0.2))  Text("1. automatic frame\n+ view at parent's specified alignment\n+ multilineTA set to center")  .multilineTextAlignment(.center)  .background(Color.gray.opacity(0.2))  Text("2. automatic frame\n+ view at parent's specified alignment\n+ multilineTA set to trailing")  .multilineTextAlignment(.trailing)  .background(Color.gray.opacity(0.2))}.frame(width: 380, alignment: .trailing).background(Color.gray.opacity(0.1))

Tests with combinations:

VStack(alignment: .trailing, spacing: 6) {  Text("1. automatic frame, at parent's alignment")  .background(Color.gray.opacity(0.2))  Text("2. given full width & leading alignment\n+ multilineTA at default leading")  .frame(maxWidth: .infinity, alignment: .leading)  .background(Color.gray.opacity(0.2))  Text("3. given full width & center alignment\n+ multilineTA at default leading")  .frame(maxWidth: .infinity, alignment: .center)  .background(Color.gray.opacity(0.2))  Text("4. given full width & center alignment\n+ multilineTA set to center")  .multilineTextAlignment(.center)  .frame(maxWidth: .infinity, alignment: .center)  .background(Color.gray.opacity(0.2))  Text("5. given full width & center alignment\n+ multilineTA set to trailing")  .multilineTextAlignment(.trailing)  .frame(maxWidth: .infinity, alignment: .center)  .background(Color.gray.opacity(0.2))  Text("6. given full width but no alignment\n+ multilineTA at default leading\n+ leading is based on content, looks odd sometimes as seen here")  .frame(maxWidth: .infinity)  .background(Color.gray.opacity(0.2))}.frame(width: 380).background(Color.gray.opacity(0.1))