![](/img/trans.png)
[英]SwiftUI NavigationLink in LazyVGrid picking random index
[英]NavigationLink inside LazyVGrid cycles all entries on back, SwiftUI
我有一個圖像網格。 每個點擊的圖像都應該在 NavigationView 上推送一個帶有圖像詳細信息的視圖。
導航鏈接按預期工作,但是當我按下后退按鈕時,它會打開下一個圖像,依此類推,直到它循環所有圖像。 到底是怎么回事?
這是View
:
struct ImageGrid: View {
@ObservedObject var part: Part
@State private var showingImagePicker = false
@State private var inputImage: UIImage?
var body: some View {
Button("add images"){
self.showingImagePicker = true
}
LazyVGrid(columns: [GridItem(.adaptive(minimum:100))]){
ForEach(part.images){ image in
ZStack {
Image(uiImage: image.thumb)
.resizable()
.scaledToFit()
NavigationLink (
destination: ImageDetail(image:image),
label: {
EmptyView()
}
).buttonStyle(PlainButtonStyle())
}
}
}
.sheet(isPresented: $showingImagePicker, onDismiss: loadImage) {
ImagePicker(image: self.$inputImage)
}
}
// other functions ...
...
}
這是詳細View
struct ImageDetail: View {
@ObservedObject var image: TrainingImage
var body: some View {
VStack {
Image(uiImage: image.content)
.resizable()
.scaledToFit()
}
}
}
編輯:
這是一個隔離行為的獨立示例。 當網格位於表單部分內時,它似乎停止正常工作。 消除表單和導航鏈接部分可以正常工作
import SwiftUI
extension String: Identifiable {
public var id:Int {
self.hashValue
}
}
struct ImageDetail: View {
var image: String
var body: some View {
VStack {
Image(uiImage: UIImage(systemName: image)!)
.resizable()
.scaledToFit()
}
}
}
struct ContentView: View {
@State var images:[String] = ["plus", "minus"]
var body: some View {
NavigationView {
Form {
Section {
LazyVGrid(columns: [GridItem(.adaptive(minimum:100))]){
ForEach(images){ image in
NavigationLink (
destination: ImageDetail(image: image),
label: {
Image(uiImage: UIImage(systemName: image)!)
.resizable()
.scaledToFit()
}
).buttonStyle(PlainButtonStyle())
}
}
}
}
}
}
}
struct ContentView_Previews: PreviewProvider {
static var previews: some View {
ContentView()
}
}
它是表單/列表功能,可以自動檢測行中的鏈接,但是你有幾個行,所以效果。 解決方案是從自動檢測中分離單元格視圖並隱藏鏈接。
使用 Xcode 12.0 / iOS 14 測試
struct ContentView: View {
@State var images:[String] = ["plus", "minus"]
var body: some View {
NavigationView {
Form {
Section {
LazyVGrid(columns: [GridItem(.adaptive(minimum:100))]){
ForEach(images){
ImageCellView(image: $0)
}
}
}
}
}
}
}
struct ImageCellView: View {
var image: String
@State private var isActive = false
var body: some View {
Image(uiImage: UIImage(systemName: image)!)
.resizable()
.scaledToFit()
.onTapGesture {
self.isActive = true
}
.background(
NavigationLink (
destination: ImageDetail(image: image), isActive: $isActive,
label: {
EmptyView()
}
))
}
}
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.