SwiftUI多行文本始终在1行处截断

基础概念

SwiftUI 是苹果公司推出的一个声明式 UI 框架，用于构建 macOS、iOS、watchOS 和 tvOS 应用程序的用户界面。在 SwiftUI 中，文本显示通常使用 Text 视图。默认情况下，Text 视图会根据其内容自动调整大小，但如果文本内容过长，默认情况下可能会在一行内截断。

相关优势

• 声明式编程：SwiftUI 使用声明式编程模型，使得 UI 的描述更加直观和简洁。
• 跨平台：SwiftUI 可以用于开发多个平台的应用，提高了代码的复用性。
• 性能优化：SwiftUI 在渲染和更新 UI 时进行了优化，提供了更好的性能。

类型

在 SwiftUI 中，有多种方式可以处理多行文本：

1. Text 视图：基本的文本显示视图。
2. ScrollView：用于包含大量内容的滚动视图。
3. LazyVGrid 或 LazyHGrid：用于布局网格系统。
4. GeometryReader：用于根据父视图的几何形状调整子视图的大小。

应用场景

当需要在 SwiftUI 中显示多行文本，并且不希望文本被截断时，可以使用以下方法：

• 显示完整的段落。
• 创建可滚动的文本区域。
• 使用自定义的文本布局。

问题原因及解决方法

如果遇到 Text 视图中的多行文本始终在一行处截断的问题，可能是因为没有正确设置文本视图的宽度或者没有使用适当的容器来允许文本换行。

解决方法示例

import SwiftUI

struct ContentView: View {
    var body: some View {
        VStack {
            // 使用 fixedSize() 修饰符来确保 Text 视图有一个固定的大小
            Text("这是一个非常长的文本，它应该能够跨越多行而不被截断。")
                .fixedSize(horizontal: false, vertical: true)
                .frame(maxWidth: .infinity) // 设置最大宽度为父视图的宽度
                .background(Color.gray.opacity(0.1)) // 添加背景色以便观察效果
        }
        .padding()
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

在这个示例中，.fixedSize(horizontal: false, vertical: true) 修饰符允许文本视图在垂直方向上扩展，而 .frame(maxWidth: .infinity) 确保文本视图不会超出其父视图的宽度，从而允许文本换行。

参考链接

SwiftUI Text 文档

通过上述方法，可以有效地解决 SwiftUI 中多行文本被截断的问题。