我刚刚开始在零售版本中使用SwiftUI。我无法使我的文本视图之一自动扩展为多行。我已经阅读了许多关于SO和HackingWithSwift的主题,但无法使其正常工作。我认为可能与我的其他框架有关,但我不确定从哪里开始
struct Message: View {
var body: some View {
ZStack() {
Color.blue.cornerRadius(8)
VStack(alignment: .leading, spacing: 8) {
Text("Lorem Ipsum")
.foregroundColor(.white)
.bold()
.font(.system(size: 20))
Text("Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Donec enim diam vulputate ut pharetra. Sed turpis tincidunt id aliquet risus feugiat in. Interdum velit laoreet id donec ultrices tincidunt arcu non. Lorem END")
.foregroundColor(.white)
.lineLimit(nil)
Text("Sent to Group1 by iShaymus")
.foregroundColor(.white)
.italic()
.opacity(0.5)
.font(.system(size: 12))
}
.frame(minWidth: 0, maxWidth: .infinity, minHeight: 0, maxHeight: .infinity, alignment: .topLeading)
.padding(12)
}
}
}
我尝试将框架应用于Text()
。我尝试添加.font(.body)
。我尝试设置.lineLimit(100)
。他们都没有工作。输出始终如下:
整个身体的弦明显更长:
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Donec enim diam vulputate ut pharetra. Sed turpis tincidunt id aliquet risus feugiat in. Interdum velit laoreet id donec ultrices tincidunt arcu non. Lorem END
这是Marc的工作代码
import SwiftUI
struct Message: View {
@State var title = ""
@State var messageBody = ""
@State var sentBy = ""
@State var targetSite = ""
var body: some View {
VStack(alignment: .leading, spacing: 8) {
Text(title)
.foregroundColor(.white)
.bold()
.font(.system(size: 20))
Text(messageBody)
.foregroundColor(.white)
.fixedSize(horizontal: false, vertical: true)
Text("Sent to \(targetSite) by \(sentBy)")
.foregroundColor(.white)
.italic()
.opacity(0.5)
.font(.system(size: 12))
}
.frame(minWidth: 0, maxWidth: .infinity, alignment: .topLeading)
.padding(12)
.background(Color.blue)
.cornerRadius(10)
}
}
答案 0 :(得分:3)
我认为这就是您要寻找的。根据需要使用.fixedSize(horizontal: false, vertical: true)
。
struct Message: View {
var body: some View {
ZStack() {
Color.blue.cornerRadius(8)
VStack(alignment: .leading, spacing: 8) {
Text("Lorem Ipsum")
.foregroundColor(.white)
.bold()
.font(.system(size: 20))
Text("Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Donec enim diam vulputate ut pharetra. Sed turpis tincidunt id aliquet risus feugiat in. Interdum velit laoreet id donec ultrices tincidunt arcu non. Lorem END")
.foregroundColor(.white)
.fixedSize(horizontal: false, vertical: true)
Text("Sent to Group1 by iShaymus")
.foregroundColor(.white)
.italic()
.opacity(0.5)
.font(.system(size: 12))
}
// .frame(minWidth: 0, maxWidth: .infinity, minHeight: 0, maxHeight: .infinity, alignment: .topLeading)
.padding(12)
}
.fixedSize(horizontal: false, vertical: true)
}
}
答案 1 :(得分:2)
您的代码与您的屏幕截图不匹配,因此我无法完全对其进行测试,但是我认为您想要的是布局优先级修饰符(.layoutPriority(1)
)。
使用此修饰符可在布局视图时优先考虑间距。
看看这段代码中的注释:
struct LayoutPriority_Intro: View {
var body: some View {
VStack(spacing: 20) {
Text("Layout Priority").font(.largeTitle)
Text("Introduction").foregroundColor(.gray)
Text("Use layout priority to tell the parent which child views get priority when it comes to assigning layout space.")
.layoutPriority(1) // Second highest priority
.frame(maxWidth: .infinity)
.padding()
.background(Color.yellow)
.foregroundColor(.black)
Text("No layout priority (default is 0)")
VStack(alignment: .leading, spacing: 8) {
HStack {
Image("profile2").mask(Circle())
Text("Janice Okoro").font(.largeTitle)
}
Text("Lorem ipsum dolor amet laborum gastropub laboris magna.")
.font(.body)
}
.padding()
.foregroundColor(.black)
.background(Color.yellow.cornerRadius(8))
.padding(.horizontal)
Text("Layout priority used")
VStack(alignment: .leading, spacing: 8) {
HStack {
Image("profile2").mask(Circle())
Text("Janice Okoro").font(.largeTitle)
}
Text("Lorem ipsum dolor amet laborum gastropub laboris magna.")
.font(.body)
}
// Give this view spacing priority over the other child views
.layoutPriority(2) // Highest priority
.padding()
.foregroundColor(.black)
.background(Color.yellow.cornerRadius(8))
.padding(.horizontal)
}
.font(.title)
.edgesIgnoringSafeArea(.bottom)
}
}
当我看您的代码示例时,它看起来不错,但是我怀疑如果用.lineLimit(nil)
代替.layoutPriority(1)
(不需要),那么它可能会解决您的问题。
如果这样做没有帮助,请将布局优先级放在VStack上。