SwiftUI 转换不适用于视图数组答案

【问题标题】：SwiftUI Transition not working with Array of ViewsSwiftUI 转换不适用于视图数组
【发布时间】：2020-11-21 16:53:40
【问题描述】：

我有一个简单的视图，它需要一个视图数组。这个想法是单击可见视图会将下一个视图滑入到位。如果我用常量索引我的 Views 数组，这工作正常，但如果索引是 @State var，则不起作用。

这是行不通的：

struct ImageCarousel<Page : View>: View {
    let pages:[Page]
    @State private var currentImage = 0
    init(_ views:[Page]) {
        pages = views
    }
    var body: some View {
        VStack {
            pages[self.currentImage]
                .transition(.slide)
                .animation(.easeInOut)
                .onTapGesture {
                    withAnimation {
                        self.currentImage = self.currentImage+1 >= self.pages.count ? 0 : self.currentImage+1
                    }
            }
        }
    }
}

但是这个版本的body 确实有效但没用：

var body: some View {
    VStack {
        if self.currentImage == 0 {
            pages[0]
                .transition(.slide)
                .animation(.easeInOut)
                .onTapGesture {
                    withAnimation {
                        self.currentImage = 1
                    }
            }
        } else {
            pages[1]
                .transition(.slide)
                .animation(.easeInOut)
                .onTapGesture {
                    withAnimation {
                        self.currentImage = 0
                    }
            }
        }
    }
}

如果我没有IF 语句而只使用pages[self.currentImage]，则转换不起作用。

你会像这样使用这个视图：

ImageCarousel([
            Rectangle().foregroundColor(.red),
            Rectangle().foregroundColor(.orange),
            Rectangle().foregroundColor(.yellow),
            Rectangle().foregroundColor(.green),
            Rectangle().foregroundColor(.blue),
            Rectangle().foregroundColor(.purple)
        ])

非常感谢任何见解。我觉得这是我没有看到的明显的东西。

【问题讨论】：

transition 不适用于这种情况，因为仅适用于视图插入/删除（如您在第二个代码快照中发现的那样）。您需要使用偏移/位置和动画进行操作。我认为this can be helpful
我会检查一下，但是更改索引变量与使用常量更改索引不同吗？关于 SwiftUI，我还没有掌握一些东西。

标签： ios swiftui transition

【解决方案1】：

我想出了一个不太复杂的解决方案（更像是一个 hack）：暂时用一个虚拟的 View 替换当前的 View，当它出现时，触发下一个 View 出现。这满足了移除一个View 并用另一个View 替换它的条件：

var body: some View {
    ZStack {
        if self.currentImage == -1 {
            Rectangle()
                .foregroundColor(.gray)
                .onAppear {
                    self.currentImage = self.nextImage
            }
        } else {
            pages[self.nextImage]
                .transition(.slide)
                .animation(.easeInOut)
                .onTapGesture {
                    withAnimation {
                        self.nextImage = self.nextImage+1 >= self.pages.count ? 0 : self.nextImage+1
                        self.currentImage = -1
                    }
            }
        }
    }
}

这适用于这种简化的情况。如果没有必要，我真的不想进入UIScrollView 或UIPageViewController 领域。

【讨论】：