Question

.multilineTextAlignment(.center)在Text位于Form内时似乎无效，我该如何居中？

Form {
    Text("I am left aligned")
    Text("Why won't I center?").multilineTextAlignment(.center)
}

Answer 1

这有效。

Form {
    Text("I am left aligned")
    Text("I am centered!")
    .frame(minWidth: 0, maxWidth: .infinity, minHeight: 0, maxHeight: .infinity, alignment: .center)
}

Answer 2

您可以将文本换成HStack：

Form {
    Text("I am left aligned")
    HStack {
        Spacer()
        Text("I am centered!")
        Spacer()
    }
}

Answer 3

如果您需要将多个项目放在表单中心，请使用以下结构，该结构接受符合视图的对象以供您显示：

struct CenterInForm<V: View>: View {

    var content: V

    init(_ content: V) { self.content = content }

    var body: some View {
        HStack {
            Spacer()
            content
            Spacer()
        }
    }
}

用法：

CenterInForm(Text("TOTAL: $100"))
CenterInForm(Button("Confirm order") { print("placing order") })

Answer 4

如果HStack中有两个元素（即2个文本），并且需要将第二个Text放在中间，那么一个小技巧就是插入第三个隐藏元素，如第一个。

HStack(alignment: .center) {
            Button(action: {
                print("later...")
            }) {
                Text("Later")
            }
            .font(font)
            Text("Centered Text")
                .foregroundColor(SwiftUI.Color(.white))
                .frame(minWidth: 0,
                       maxWidth: .infinity,
                       minHeight: 0,
                       maxHeight: .infinity,
                       alignment: .center)
            Button(action: {
                print("later...")
            }) {
                Text("Later")
            }
            .hidden()
        }

Answer 5

使用 frame 将文本框架扩展到全宽，使用 multilineTextAlignment 使文本（包括换行文本）居中。

Form {
    Text("Centered text, even if wraps")
        .frame(maxWidth: .infinity)
        .multilineTextAlignment(.center)
}

SwiftUI如何在表单中居中放置文本？

5 个答案: