尝试使用视图作为列表行样式创建自定义列表(默认情况下,要摆脱列表中的丑陋行)。
但是,一旦我将ZStack行放入滚动视图中,滚动视图就会沿两个方向滚动,而不仅仅是垂直滚动。
这是contentView:
NavigationView {
ScrollView{
VStack(alignment: .leading){
ForEach(friends) { friends in
NavigationButton(destination: MessageDetailView(friend: friends)) {
CustomListItem(friend: friends)
}
}
Spacer()
}
}
.foregroundColor(.black)
.navigationBarTitle(Text("Messages"))
}
这是customListItem:
Group{
ZStack {
RoundedRectangle(cornerRadius: 10)
.shadow(radius: 1, y:1)
.frame(width: UIScreen.main.bounds.width - 32, height: 75)
.foregroundColor(.gray)
HStack {
Image(systemName: "person.crop.circle")
.resizable()
.frame(width: 50, height: 50)
VStack(alignment: .leading) {
HStack {
Text(friend.name)
.font(.headline)
Text("\(friend.date, formatter: dateFormatter)")
}
Text(friend.messagesReceived[0])
.font(.subheadline)
} .lineLimit(nil)
Spacer()
Image(systemName: "chevron.right.circle")
.foregroundColor(.black)
}.padding(10)
}.padding([.leading, .trailing])
}
有什么方法可以限制滚动到垂直方向或在此方向上强制画框吗?
尝试使用.frame(...)修饰符不起作用,因为我已经尝试过。这导致视图根本无法加载。
示例图片:
答案 0 :(得分:6)
这可以通过GeometryReader
来实现。将ScrollView
包裹起来,然后设置VStack
的宽度。
GeometryReader是一个非常简单且非常有用的技巧,可用于SwiftUI:)
这是我如何使用您的代码的方法:
NavigationView {
GeometryReader { geometry in
ScrollView {
VStack(alignment: .leading){
ForEach(self.friends) { friend in
NavigationButton(destination: MessageDetailView(friend: friend)) {
CustomListItem(friend: friend)
}
}
Spacer()
}.frame(width: geometry.size.width)
}
.foregroundColor(.black)
.navigationBarTitle(Text("Messages"))
}
}
答案 1 :(得分:4)
从Xcode 11 beta 3(11M362v)开始,在构造axes
时有一个ScrollView
参数,可以将其设置为.horizontal
或.vertical
ScrollView(.vertical, showsIndicators: true) { ... }
答案 2 :(得分:0)
尝试像这样的滚动方向更具体
ScrollView(.vertical) {}
答案 3 :(得分:0)
尽管在大多数情况下,上述答案都有效,但没有一个对我有用!
在我的情况下,问题是scrollView子级比scrollView宽!
为它们添加静态宽度可以解决问题。
答案 4 :(得分:0)
使用iOS 14,Swift 5,SwiftUI 2.0
这就是答案...您可以在一组中同时使用垂直和水平。
ScrollView([.vertical,.horizontal]) {
....
}