修复与主视图相关的 VStack,即使页面滚动,它也保持在同一个位置

Posted

技术标签:

【中文标题】修复与主视图相关的 VStack,即使页面滚动,它也保持在同一个位置【英文标题】:Fixing VStack in relation to the main view so that it stays in the same place even if page is scrolled 【发布时间】:2020-08-27 07:02:44 【问题描述】:

如何修复相对于主视图的 VStack,这意味着即使页面滚动,它也始终保持在同一个位置。我尝试过使用叠加层、ZStack 等。但是,我没有太多运气。下图显示了我想在 SwiftUI 中执行的操作的示例

【问题讨论】:

我认为你没有正确使用覆盖 【参考方案1】:

我相信这就是你想要做的:

struct IntroView: View 
    var body: some View 
        VStack 
            ScrollView 
                Text("Apollo 1, initially designated AS-204, was the first crewed mission of the United States Apollo program, the project to land the first men on the Moon.\n\nPlanned as the first low Earth orbital test of the Apollo command and service module, to launch on February 21, 1967, the mission never flew; a cabin fire during a launch rehearsal test at Cape Kennedy Air Force Station Launch Complex 34 on January 27 killed all three crew members—Command Pilot Virgil I. \"Gus\" Grissom, Senior Pilot Ed White, and Pilot Roger B. Chaffee—and destroyed the command module (CM).\n\nThe name Apollo 1, chosen by the crew, was made official by NASA in their honor after the fire.\n\nApollo 7 was an October 1968 human spaceflight mission carried out by the United States. It was the first mission in the United States' Apollo program to carry a crew into space. It was also the first U.S. spaceflight to carry astronauts since the flight of Gemini XII in November 1966.\n\nThe AS-204 mission, also known as \"Apollo 1\", was intended to be the first crewed flight of the Apollo program. It was scheduled to launch in February 1967, but a fire in the cabin during a January 1967 test killed the crew.\n\nCrewed flights were then suspended for 21 months, while the cause of the accident was investigated and improvements made to the spacecraft and safety procedures, and uncrewed test flights of the Saturn V rocket and Apollo Lunar Module were made. Apollo 7 fulfilled Apollo 1's mission of testing the Apollo command and service module (CSM) in low Earth orbit.")
                    .font(.title)
            
            .overlay(
                Text("Mission Description")
                    .font(.largeTitle)
                    .padding(10)
                    .background(Color.blue)
            )
        
    

【讨论】:

以上是关于修复与主视图相关的 VStack,即使页面滚动,它也保持在同一个位置的主要内容,如果未能解决你的问题,请参考以下文章

如何修复滚动缓慢的表格视图

滚动视图滚动时页面控制不改变

如何在 SwiftUI 中动态调整可垂直滚动的 VStack 中的一行中的项目数?

即使大于高度,如何将 VStack 对齐到顶部?

SwiftUI VStack 间距:无法正常工作

与成长中的孩子反应本机滚动视图