RError.com

RError.com Logo RError.com Logo

RError.com Navigation

  • 主页

Mobile menu

Close
  • 主页
  • 系统&网络
    • 热门问题
    • 最新问题
    • 标签
  • Ubuntu
    • 热门问题
    • 最新问题
    • 标签
  • 帮助
主页 / 问题 / 1047771
Accepted
Andrew_STOP_RU_AGRESSION_IN_UA
Andrew_STOP_RU_AGRESSION_IN_UA
Asked:2020-11-19 04:33:35 +0000 UTC2020-11-19 04:33:35 +0000 UTC 2020-11-19 04:33:35 +0000 UTC

如何制作乒乓动画?(一个方向1次,相反方向1次)

  • 772

动画必须先朝一个方向前进,然后朝相反方向泛滥。按下一个按钮后。没有无尽的动画。

现在它只向一个方向移动。怎么修?

@State private var anim: Bool = true

TextField("description", text: $descr)
            .blur(radius: anim ? 0 : 10)
            .animation(.easeInOut)

Button("Commit"){
    if (self.descr == "")
    {
          withAnimation(.easeInOut(duration: 4)) {
               self.anim.toggle()
          }
    }
}
swift
  • 2 2 个回答
  • 10 Views

2 个回答

  • Voted
  1. Best Answer
    VAndrJ
    2020-11-19T06:20:07Z2020-11-19T06:20:07Z

    制作一个单独的重复动画并使用它。

    您的代码示例:

    // Создаем требуемую нам анимацию, которая будет повторяться бесконечно
    var repeatingAnimation: Animation {
        Animation
            .easeInOut(duration: 4)
            .repeatForever()
    }
    
    var body: some View {
        VStack {
            TextField("Description", text: $descr)
                // Что и как будем анимировать, от начального значения 0 при anim = false и 10 при anim = true
                .blur(radius: anim ? 10 : 0)
                // Анимируем? Тогда используем ранее созданную анимацию, а для остановки передаем nil
                .animation(anim ? repeatingAnimation : nil)
            Button("Commit") {
                if self.descr.isEmpty {
                    self.anim.toggle() // Запускаем/останавливаем анимацию
                }
            }
        }
    }
    

    底线是在需要时使用无限重复动画,不需要时将其移除。


    不幸的是,SwiftUI 中的动画没有完成块或类似的东西来编写 .onAnimationCompleted { // Some work... }。

    因此,我们将做一些额外的手势并包装 TextField 以便它完成我们需要的操作:

    struct ContentView: View {
        @State var descr: String = ""
        @State var onError = PassthroughSubject<Void, Never>()
    
        var body: some View {
            VStack {
                BlurredTextField(title: "Description", text: $descr, onError: $onError)
                Button("Commit") {
                    if self.descr.isEmpty {
                        self.onError.send()
                    }
                }
            }
        }
    }
    
    struct BlurredTextField: View {
        let title: String
        @Binding var text: String
        @Binding var onError: PassthroughSubject<Void, Never>
        @State private var anim: Bool = false
        // Да, банально используем таймер для реверса анимации
        @State private var timer: Timer?
        @State private var cancellables: Set<AnyCancellable> = Set()
        private let animationDiration: Double = 1
    
        var body: some View {
            TextField(title, text: $text)
                .blur(radius: anim ? 10 : 0)
                // Так как анимация простая, вернем обратно для уменьшения строчек
                .animation(.easeInOut(duration: animationDiration))
                .onAppear {
                    self.onError
                        .sink(receiveValue: self.toggleError)
                        .store(in: &self.cancellables)
            }
        }
    
        func toggleError() {
            // Инвалидируем таймер, дабы избежать блымканий
            timer?.invalidate()
            // Гоняем туда-сюда. Можно заменить на значение радиуса блюра
            anim = true
            timer = Timer.scheduledTimer(withTimeInterval: animationDiration, repeats: false) { _ in
                self.anim = false
            }
        }
    }
    

    结果

    在此处输入图像描述

    • 1
  2. Andrew_STOP_RU_AGRESSION_IN_UA
    2020-11-23T16:22:40Z2020-11-23T16:22:40Z

    用英语 SO 提出了一个更优雅的解决方案

    extension View {
        func addOpacityBlinker<T: Publisher>(subscribedTo publisher: T, duration: Double = 1)
            -> some View where T.Output == Void, T.Failure == Never {
                self.modifier(OpacityBlinker(subscribedTo: publisher.eraseToAnyPublisher(),
                                             duration: duration))
        }
    }
    
    struct OpacityBlinker: ViewModifier {
        @State private var isBlurred = false
        var publisher: AnyPublisher<Void, Never>
        var duration: Double
    
        init(subscribedTo publisher: AnyPublisher<Void, Never>, duration: Double = 1) {
            self.publisher = publisher
            self.duration = duration
        }
    
        func body(content: Content) -> some View {
            content
                .blur(radius: isBlurred ? 10 : 0)
                .onReceive(publisher) { _ in
                    withAnimation(.linear(duration: self.duration / 2)) {
                        self.isBlurred = true
                        DispatchQueue.main.asyncAfter(deadline: .now() + self.duration / 2) {
                            withAnimation(.linear(duration: self.duration / 2)) {
                                self.isBlurred = false
                            }
                        }
                    }
            }
        }
    }
    

    和示例用法:

    import SwiftUI
    import Combine
    
    struct ContentView: View {
        //ивент по которому будет срабатывать пинг-понг анимация
        let blinkPublisher = PassthroughSubject<Void, Never>()
    
        var body: some View {
            VStack(spacing: 10) {
                Button("Blink") {
                    // генерим ивент по нажатию на кнопку
                    self.blinkPublisher.send()
                }
                Text("Hi")
                    //подпись на блюр-анимацию по ивенту
                    .addOpacityBlinker(subscribedTo: blinkPublisher)
                Text("Hi")
                    //подпись на блюр-анимацию по ивенту, но анимация другой длительности
                    .addOpacityBlinker(subscribedTo: blinkPublisher, duration: 0.5)
            }
        }
    }
    
    • 1

相关问题

Sidebar

Stats

  • 问题 10021
  • Answers 30001
  • 最佳答案 8000
  • 用户 6900
  • 常问
  • 回答
  • Marko Smith

    根据浏览器窗口的大小调整背景图案的大小

    • 2 个回答
  • Marko Smith

    理解for循环的执行逻辑

    • 1 个回答
  • Marko Smith

    复制动态数组时出错(C++)

    • 1 个回答
  • Marko Smith

    Or and If,elif,else 构造[重复]

    • 1 个回答
  • Marko Smith

    如何构建支持 x64 的 APK

    • 1 个回答
  • Marko Smith

    如何使按钮的输入宽度?

    • 2 个回答
  • Marko Smith

    如何显示对象变量的名称?

    • 3 个回答
  • Marko Smith

    如何循环一个函数?

    • 1 个回答
  • Marko Smith

    LOWORD 宏有什么作用?

    • 2 个回答
  • Marko Smith

    从字符串的开头删除直到并包括一个字符

    • 2 个回答
  • Martin Hope
    Alexandr_TT 2020年新年大赛! 2020-12-20 18:20:21 +0000 UTC
  • Martin Hope
    Alexandr_TT 圣诞树动画 2020-12-23 00:38:08 +0000 UTC
  • Martin Hope
    Air 究竟是什么标识了网站访问者? 2020-11-03 15:49:20 +0000 UTC
  • Martin Hope
    Qwertiy 号码显示 9223372036854775807 2020-07-11 18:16:49 +0000 UTC
  • Martin Hope
    user216109 如何为黑客设下陷阱,或充分击退攻击? 2020-05-10 02:22:52 +0000 UTC
  • Martin Hope
    Qwertiy 并变成3个无穷大 2020-11-06 07:15:57 +0000 UTC
  • Martin Hope
    koks_rs 什么是样板代码? 2020-10-27 15:43:19 +0000 UTC
  • Martin Hope
    Sirop4ik 向 git 提交发布的正确方法是什么? 2020-10-05 00:02:00 +0000 UTC
  • Martin Hope
    faoxis 为什么在这么多示例中函数都称为 foo? 2020-08-15 04:42:49 +0000 UTC
  • Martin Hope
    Pavel Mayorov 如何从事件或回调函数中返回值?或者至少等他们完成。 2020-08-11 16:49:28 +0000 UTC

热门标签

javascript python java php c# c++ html android jquery mysql

Explore

  • 主页
  • 问题
    • 热门问题
    • 最新问题
  • 标签
  • 帮助

Footer

RError.com

关于我们

  • 关于我们
  • 联系我们

Legal Stuff

  • Privacy Policy

帮助

© 2023 RError.com All Rights Reserve   沪ICP备12040472号-5