swiftUI：使用 offset() 隐藏组件时动画混乱答案

【问题标题】：swiftUI: Animation messed up when hide component by using offset()swiftUI：使用 offset() 隐藏组件时动画混乱
【发布时间】：2021-09-22 19:34:40
【问题描述】：

正如您在 gif 中看到的那样，当我尝试隐藏 buttonPanel 时，动画被搞砸了。这是通用按钮

struct GenericButtonViews<T: View>: View {
    
    @StateObject var model: CoreMLViewModel
    var name: String
    var symbol: T
    let action: () -> Void
    let buttonType: ButtonStyle
    
    var body: some View {
        
        Button {
            action()
        } label: {
            VStack(spacing: 5) {
                symbol
                Text(name)
                    .foregroundColor(Color("theme"))
            }
            .frame(width: UIScreen.main.bounds.size.width / 3)
            .scaleEffect(model.isAudioRecording && buttonType == .styled ? 1.25 : 1)
            .opacity(model.isAudioRecording  && buttonType == .styled ? 0.5 : 1)
            .animation(model.isAudioRecording  && buttonType == .styled ? Animation.linear(duration: 1).repeatForever(autoreverses: true) : .none)
        }        
    }
}

enum ButtonStyle {
    case normal, styled
}

我的可重用按钮，按钮类型枚举设置为 .styled，在 ButtonPanel.swift 中实现

GenericButtonViews(
   model: model,
   name: "", symbol: ButtonContent(symbol: model.isAudioRecording ? "micro" : "micro-off"),
   action: {
            model.isAudioRecording.toggle()
            model.toggleEngine()
   },
   buttonType: .styled)

在 MainView.swift 中实现 ButtonPanel。这里的逻辑是当点击显示/隐藏按钮时面板将隐藏在屏幕之外。

ButtonPanelView(model: model, width: geo.size.width)
  .offset(y: !model.showingBtnPanel ? 0 : geo.size.height)
  .transition(.move(edge: .bottom))
  .animation(.spring(blendDuration: 0.25))

我尝试了几种方法，但仍然会发生这种情况。任何建议都会非常感谢！

【问题讨论】：

我假设您需要将每个动画的值链接到其触发状态，因为它们在某处发生冲突。
@Asperi 它有效，您能否向我解释为什么会发生这种情况或链接到我可以阅读更多有关它的任何文档？谢谢

标签： animation swiftui

【解决方案1】：

感谢@Asperi 帮助我，我基本上都增加了价值：model.isAudioRecording 到任何涉及的 .animation，它就像一个魅力

【讨论】：