点击文本以显示所有内容答案

【问题标题】：Tap the text to show all of it点击文本以显示所有内容
【发布时间】：2019-11-17 13:04:48
【问题描述】：

我想在新闻提要上创建一个 查看更多... 功能，类似于 Facebook。 SwiftUI 列表有行，一行由（HStack（用户名，发布时间）的 VStack、文本（默认仅显示 2 行并且可消耗以显示所有内容）和最后一个自定义大小的图像组成。我能够实现切换并将 lineLimit 设置为 nil 以反映这一点，但问题是顶部 HStack 在行的高度之外并隐藏在前一行的后面。我使用绑定变量来触发视图刷新但结果如何.

【问题讨论】：

也许你可以添加一些你所做的代码，或者你可以附加一个链接到你的演示项目。
我的回答对你有帮助吗？
是的，非常感谢，抱歉耽搁了
没问题！确保为对您有帮助的答案投票。

标签： swiftui swiftui-list

【解决方案1】：

这是一个工作示例，说明如何使用 ScrollView 和表示行的简单 struct 实现此目的：

import SwiftUI

struct FeedList: View {
    var body: some View {
        ScrollView {
            ForEach(1...50, id: \.self) { item in
                VStack {
                    FeedRow()
                    Divider()
                }
            }
        }
    }
}

struct FeedRow: View {

    @State var value: Bool = false

    var body: some View {
        VStack {
            HStack {
                Text("Username")
                Text("17:17h")
            }
            .padding(10)
            Text("I would like to create a See more... feature on the news feed, pretty much like Facebook. The SwiftUI list has rows, a row is composed of a VStack of (HStack (username, post time), Text (showing only 2 lines by default and expendable to show all of it is toggled) and finally an image with custom size. I was able to implement the toggle and set lineLimit to nil to reflect that but the problem is that the top HStack is outside the height of the row and hidden behind the previous row. I used a binding variable to trigger the views to refresh but ho results.")
                .fixedSize(horizontal: false, vertical: true)
                .lineLimit(self.value ? nil : 2)
                .padding(.horizontal, 10)
            HStack {
                Spacer()
                Button(action: {
                    withAnimation {
                        self.value.toggle()
                    }
                }, label: {
                    if self.value {
                        Text("show less")
                    } else {
                        Text("show more")
                    }
                }).padding(.horizontal, 10)
            }
        }
        .animation(.easeInOut)
    }
}

struct ContentView: View {

    var body: some View {
        FeedRow()
    }

}

还是有一些问题，希望对你有帮助！

【讨论】：