swift - 如何使用 NavigationView 将我的 ContentView 链接到另一个视图
问题描述
我正在创建一个在主页 ContentView() 上显示服务列表的应用程序。用户应该能够从 ServiceListView() 中选择一个服务并在新页面上查看 ServiceDetailView()。
我的问题是:当我运行代码时,服务列表动画,服务列表没有填满整个页面(在底部留出空间),ServiceDetailView() 显示来自 ContentView() 的信息。
内容视图()代码:
NavigationBarView()
.padding(.horizontal, 15)
.padding(.bottom)
.padding(.top, UIApplication.shared.windows.first?.safeAreaInsets.top)
.background(Color.white)
ScrollView(.vertical, showsIndicators: false, content: {
VStack(spacing: 0) {
FeaturedTabView()
.aspectRatio(contentMode: .fill)
.frame(width: (UIScreen.main.bounds.width - 0), height: 200)
.padding(.vertical, 10)
ServiceListView()
.aspectRatio(contentMode: .fit)
} //:VSTACK
}) //:SCROLL
}
}
.background(colorBackground.ignoresSafeArea(.all, edges: .all))
} //:ZSTACK
.ignoresSafeArea(.all, edges: .top)
}
ServiceDetailView() 代码:
var service: Service
@State var currentlocation: String = ""
var body: some View {
ZStack{
Color(UIColor.systemGray6).ignoresSafeArea()
VStack {
HStack {
Image(service.imageName)
.resizable()
.scaledToFit()
.frame(height:80)
Text(service.title)
.font(.title)
.fontWeight(.semibold)
.lineLimit(/*@START_MENU_TOKEN@*/2/*@END_MENU_TOKEN@*/)
}
HStack {
Image("green_start")
.resizable()
.scaledToFit()
.frame(height:11)
//.padding(.horizontal, 10)
TextField("Current Location", text: $currentlocation)
.textFieldStyle(RoundedBorderTextFieldStyle())
//.scaledToFit()
//.padding()
}.padding(.horizontal, 35)
VStack{
HStack {
Image("red_stop")
.resizable()
.scaledToFit()
.frame(height:11)
TextField("Where to?", text: $currentlocation)
.textFieldStyle(RoundedBorderTextFieldStyle())
}.padding(.horizontal, 35)
}
Spacer()
VStack{
MapView()
}
Link(destination: /*@START_MENU_TOKEN@*/URL(string: "https://www.apple.com")!/*@END_MENU_TOKEN@*/, label: {
Text("CONFIRM")
.bold()
.font(.title2)
.frame(width:260, height:50)
.foregroundColor(.white)
.background(Color.green)
.cornerRadius(10)
})
}//.padding()
}
ServiceListView() 代码:
var body: some View {
NavigationView {
List(services, id: \.id) { service in
NavigationLink(destination: ServiceDetailView(service: service), label: {
Image(service.imageName)
.resizable()
.scaledToFit()
.frame(height:60)
.padding(.vertical,1)
VStack(alignment: .leading) {
Text(service.title)
.fontWeight(.black)
.lineLimit(2)
Text(service.subheading)
.fontWeight(.semibold)
Text(service.description)
.font(.subheadline)
.foregroundColor(.black)
.lineLimit(5)
.padding(1)
}
})
}
.navigationBarTitle("Services")
Spacer()
}
}
解决方案
推荐阅读
- file - Perl CGI 脚本错误地读取带有反斜杠的文本文件内容
- c++ - 使用 constexpr 过度渴望 C++ 联合零初始化
- performance - 虚拟机上的 IBM Portal 9 服务器(VM 映像)
- css - 封面有 4 张不同尺寸的图片?
- django - 如何将值插入相关模型?
- jupyter-notebook - 禁止在 Jupyter Notebook PDF 导出中打印单元格
- android - 在约束布局中是否可以将 4 个 TextViews 放在一个水平链中,每个视图之间的空间不同?
- tensorflow - 为什么我的卷积实现比 Tensorflow 的慢?
- sql - SQL如何设置这个where子句来检查两个不同的字段?
- python - 在 IPython 控制台中运行内核的问题