SwiftUI - zIndex 更改不适用于 LazyVStack 内部的项目

问题描述 投票:0回答:1

我的应用程序中的 zIndex 与图像集合有问题 我已向图像添加了捏缩放功能,但是当缩放图像时,它不会位于集合中下一个图像的顶部。

使用VStack时一切都很好。仅在使用 LazyVStack 时出现问题

这是内容视图的源代码。

struct ContentView: View {
    @StateObject var vm: PostsViewModel
    
    init(_ viewModel: PostsViewModel? = nil) {
        let vm = viewModel != nil ? viewModel : PostsViewModel()
        
        _vm = StateObject(wrappedValue: vm!)
    }
    
    var body: some View {
        if vm.isLoading {
            ProgressView()
        } else {
            ScrollView (.vertical, showsIndicators: false) {
                LazyVStack (spacing: 34) {
                    ForEach(vm.collectionResponse.data, id: \.id, content: {
                        post in
                        PostView(imageUrl: post.attachments.first!.url)
                    })
                }
                .padding([.horizontal], 12)
            }
        }
    }
}

帖子查看源代码:

struct PostView: View {
    @State var imageUrl: String
    @State var offset: CGPoint = .zero
    @State var scale: CGFloat = 0
    @State var scalePosition: CGPoint  = .zero
    
    init(imageUrl: String) {
        self.imageUrl = imageUrl
    }
    var body: some View {
        KFImage(URL(string: imageUrl))
            .cacheMemoryOnly()
            .resizable()
            .scaledToFill()
            .frame(maxWidth: getRect().width, maxHeight: 500)
            .cornerRadius(12.0)
            .offset(x: offset.x, y: offset.y)
            .overlay(
                ZoomGesture(
                    scale: $scale,
                    offset: $offset,
                    scalePosition: $scalePosition)
            )
            .scaleEffect(
                1 + (scale < 0 ? 0 : scale),
                anchor: .init(x: scalePosition.x, y: scalePosition.y))
            .zIndex(scale > 0 ? 1000 : 0)
    }
}

谢谢你

ios xcode swiftui pinchzoom lazyvstack
1个回答
0
投票

它对我有用,有两个小变化:

  • 将图像的默认值
    zIndex
    设置为 2:
.zIndex(scale > 0 ? 1000 : 2)
  • zIndex
    上的
    LazyVStack
    设置为 1:
LazyVStack (spacing: 34) {
    // ...
}
.padding([.horizontal], 12)
.zIndex(1)
© www.soinside.com 2019 - 2024. All rights reserved.