将.animation(.default)替换为withAnimation或.animation(.default，value)

Question

我使用ScrollView以FAQ样式显示信息。在ScrollView内部，我打开三个定制的视图。我的问题是，这些观点不是动画片。我已经尝试过在.animation(.default, value: xxx)中使用Binding var和FAQListView，但这是行不通的。

使用旧的.animation(.default)动画效果很好，但我想去掉警告。那么，我怎样才能用新的取代旧的呢？

FAQListView显示一个标题文本。通过点击它，一个更详细的描述将出现在标题的底部。

struct FAQListView: View {
    let header: Text
    let content: Text
    @State public var collapsed = true
    
    var body: some View {
        VStack {
            HStack {
                header
                    .font(.headline)
                Spacer()
                Image(systemName: "chevron.forward")
                        .rotationEffect(.degrees(collapsed ? 0 : 90))
                        .animation(.linear, value: collapsed)
                        .foregroundColor(.blue)
            }
            .padding(.bottom, 10)
                
            if !collapsed {
                HStack {
                    content
                    Spacer()
                }
            }
                
        }
        .onTapGesture {
            collapsed.toggle()
        }
        .animation(.default, value: collapsed)
        .padding(20)
    }
}

struct FAQView: View {
    @Binding var dismiss: Bool
    var body: some View {
        NavigationView {
            ScrollView {
                FAQListView(header: Text("missingValuesHeader"), content: Text("missingValuesDesc"))
                FAQListView(header: Text("cannotImportFileHeader"), content: Text("cannotOpenFileDesc"))
                FAQListView(header: Text("logfileMissingHeader"), content: Text("logfileMissingDesc"))
            }
            .navigationBarTitleDisplayMode(.inline)
            .navigationTitle(Text("FAQ"))
            .toolbar {
                ToolbarItem(placement: .navigationBarTrailing) {
                    Button("close") {
                        dismiss.toggle()
                    }
                }
            }
        }
    }
}

Answer 1

当collapsed被更改时，您的动画应该会发生。用collapsed.toggle()包装withAnimation { }：

.onTapGesture {
    withAnimation {
        collapsed.toggle()
    }
}

您可以通过传递动画值来控制动画的类型和速度。例如，对于非常慢的动画：

.onTapGesture {
    withAnimation(.easeIn(duration: 2)) {
        collapsed.toggle()
    }
}