【问题标题】:SwiftUI - Multi-Lined text macOSSwiftUI - 多行文本 macOS
【发布时间】:2020-07-02 14:12:00
【问题描述】:

如何在 SwiftUI 列表中显示具有多行换行的 Text UI 元素。

以下代码生成以下Image,我似乎无法找到一种方法来使其按预期工作。

let test = "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"


var body: some View {
    List(){
        Text(test).lineLimit(nil)
        Divider()
        Text(test).fixedSize(horizontal: false, vertical: true)
        Divider()
        Text(test)
    }
}

.lineLimit(nil) 无法工作


.fixedSize(horizontal: false, vertical: true) 也无法正常工作

【问题讨论】:

  • 使用 Xcode 11.2 / iOS 13.2 和 Xcode 11.4 / iOS 13.4 测试 - 所有三个变体都提供相同正确包装的文本。
  • “按预期”是什么意思??
  • 抱歉没有提到这是针对 macOS 的
  • 作为多行换行文本
  • 改用 ScrollView

标签: macos swiftui swiftui-list


【解决方案1】:

好的,这里是针对 macOS 的(为了更好的可见性也添加了标签),不是默认情况下,但对于 List 也可以实现,如果需要 List 的性能等,并且无需任何硬编码。

使用 Xcode 11.4 / macOS 10.15.3 测试

var body: some View {
    GeometryReader { gp in
        List {
            Text(self.test)
                .padding(.trailing)
                .frame(width: gp.size.width)
            Divider()
        }
    }
}

【讨论】:

  • 一如既往的好答案
【解决方案2】:

你需要使用 ScrollView,而不是 List

import SwiftUI

struct ContentView: View {
    let test = "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"


    var body: some View {
        ScrollView {
            Text(test).lineLimit(1).padding()
            Text(test).lineLimit(3).padding()
            Text(test).padding()
        }.frame(maxWidth: 400)
    }
}


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

【讨论】:

    猜你喜欢
    • 2020-12-24
    • 2019-12-31
    • 2020-08-01
    • 2022-06-21
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2020-01-22
    • 1970-01-01
    相关资源
    最近更新 更多