点击文本以显示所有文本

Question

我想创建一个查看更多在新闻推送上的功能，很像Facebook。SwiftUI列表有行，一行由VStack(HStack(用户名，发布时间((、Text(默认情况下只显示2行，可消耗以显示所有内容(组成，最后是一个自定义大小的图像。我能够实现切换并将lineLimit设置为nil来反映这一点，但问题是顶部的HStack在行的高度之外，隐藏在前一行后面。我使用了一个绑定变量来触发视图以刷新但没有结果。

Answer 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()
}
}

它仍然有一些问题，但我希望它能有所帮助！