swift - 当元素到达屏幕顶部时,将元素与 ScrollView 对接
问题描述
以下图为例。标题下方的整个屏幕,包括图像冠、人物图像和文本生命是一个 ScrollView。我想要的是文本“任务”到达“生活”区域,它停止上升,这使它看起来像停靠在顶部。另外,我希望“任务”可以是一个按钮,所以我们总是可以一点击就跳回任务列表。
因此,我应该在 SwiftUI 中使用什么元素来实现这一点?
解决方案
如果你在滚动视图中有一个 LazyVStack,你可以实现一个带有皇冠、文本和人物图标标题的部分(这 3 个将在 HStack 中),然后惰性堆栈有一个名为 pinnedViews 的参数,你将在其中放置。节头。当您向上滚动时,这应该将 HStack 固定在顶部。
var body: some View {
ZStack {
Color.red
ScrollView {
LazyVStack(pinnedViews: .sectionHeaders) {
Section(header:
HStack {
Button(action: { }) {
Text("Crown")
.foregroundColor(contentSelection == .one ? .black : .gray)
}
Spacer()
Button(action: { }) {
Text("Life")
.foregroundColor(contentSelection == .two ? .black : .gray)
}
Spacer()
Button(action: { }) {
Text("Person")
}
}
.padding()
.background(Color.green)
) {
VStack {
ForEach((1...50), id: \.self) { item in
ZStack {
Text("This is item number \(item)")
}
.frame(height: 80)
}
}
}
}
}
}
}
推荐阅读
- python - 您如何在 BeautifulSoup 的 for 循环中使用 .find 正确过滤链接?
- selenium - 如何使用 Selenium Webdriver Python 跳过身份验证弹出窗口
- python - Geopandas - ValueError:无法转换幼稚的几何图形。请先在对象上设置 crs
- java - 推荐用于表类数据和随机(索引)读取访问的 Java(或 Kotlin)序列化格式?
- typescript - 用于前端和后端的打字稿导入/导出
- reactjs - 在 react native 中创建日历组件
- javascript - 在页面中搜索特定 URL 并将第一个实例复制到剪贴板
- swiftui - 取消订阅组合框架
- multithreading - 多线程多核 cpu 渲染图像是否比单线程多核 cpu 更快?
- android-studio - 如何更改 *.arb 文件中本地化文本的字体