Swiftui 按钮依次显示一组图像

发布于10月28日

我正在try 在Swiftui中创建一个图像动画.我想单击一个带有标签的按钮作为图像(该图像是图像数组中的第一个元素).单击按钮后，我希望显示数组中的其余图像，并使标签图像随着数组中的每个新元素而每秒更改.在这方面有任何帮助都是很好的.

目前，我可以使用一个按钮点击来改变图像后，每次点击，但我想要一次点击后的图像动画

我所拥有的:

   Button {
       activeImageIndex += 1
   } label: {
      Image(images[activeImageIndex])
   }

推荐答案

我们可以简单地使用Combine的delay()运算符.

import SwiftUI
import Combine

struct ContentView: View {
    let images = [ "square.and.arrow.up", "pencil.circle.fill", "moon.stars.fill"]
    @State private var activeImageIndex = 0
    @State private var cancellable: AnyCancellable? = nil
    
    var body: some View {
        Button {
            cancellable = [0,1,2].publisher
                .flatMap(maxPublishers: .max(1)) { Just($0).delay(for: 3, scheduler: RunLoop.main) } //<- delay for: 3 sec
                .sink { value in
                    activeImageIndex = value
                }
            
        } label: {
            Image(systemName: images[activeImageIndex])
                .animation(.easeIn, value: activeImageIndex)
        }
    }
}