Можно ли изменить изображение с помощью затухающей анимации, используя то же изображение? (SwiftUI) - PullRequest
1 голос
/ 15 марта 2020

Согласно моей логике c, при касании к изображению оно должно быть изменено с помощью анимации исчезновения, но фактический результат заключается в том, что изображение изменяется без анимации. Протестировано с Xcode 11.3.1, Simulator 13.2.2 / 13.3, если это важно.

PS Изображения называются "img1", "img2", "img3" и др. c.

enum ImageEnum: String {
    case img1
    case img2
    case img3

    func next() -> ImageEnum {
        switch self {
            case .img1: return .img2
            case .img2: return .img3
            case .img3: return .img1
        }
    }
}
struct ContentView: View {
    @State private var img = ImageEnum.img1
    var body: some View {
        Image(img.rawValue)
            .onTapGesture {
                withAnimation {
                    self.img = self.img.next()
                }
            }
    }
}

1 Ответ

0 голосов
/ 15 марта 2020

Здесь возможен подход с использованием одного изображения (для демонстрации внесены небольшие изменения с использованием изображений по умолчанию). Важные изменения отмечены комментариями.

demo

enum ImageEnum: String {
    case img1 = "1.circle"
    case img2 = "2.circle"
    case img3 = "3.circle"

    func next() -> ImageEnum {
        switch self {
            case .img1: return .img2
            case .img2: return .img3
            case .img3: return .img1
        }
    }
}
struct QuickTest: View {
    @State private var img = ImageEnum.img1
    @State private var fadeOut = false
    var body: some View {
        Image(systemName: img.rawValue).resizable().frame(width: 300, height: 300)
            .opacity(fadeOut ? 0 : 1)
            .animation(.easeInOut(duration: 0.25))    // animatable fade in/out
            .onTapGesture {
                self.fadeOut.toggle()                 // 1) fade out

                // delayed appear
                DispatchQueue.main.asyncAfter(deadline: .now() + 0.25) {
                    withAnimation {
                        self.img = self.img.next()    // 2) change image
                        self.fadeOut.toggle()         // 3) fade in
                    }
                }
            }
    }
}
...