代码示例

Question

在Apple的春季动画定义文件中说：

blendDuration：插值的持续时间（以秒为单位）会改变弹簧的响应值。

代码示例

struct Spring_BlendDuration: View {
    @State private var change = false
    @State private var blendDuration = 100.0

    var body: some View {
        VStack(spacing: 20) {
            Circle()
                .foregroundColor(.green)
                .scaleEffect(change ? 0.2 : 1)
                .animation(.spring(response: 1, dampingFraction: 0.5, blendDuration: blendDuration))

            HStack {
                Image(systemName: "hare")
                Slider(value: $blendDuration, in: 0...200)
                Image(systemName: "tortoise")
            }.foregroundColor(.green).padding()

            Button("Change") {
                self.change.toggle()
            }.font(.title)
        }
    }
}

看起来是什么

具有快速响应参数和慢速响应参数的比较

我没什么区别。

注意

我向Apple提交了反馈，以对此进行澄清。如果我收到他们的回音，我将更新此问题。

Answer 1

这里是将多个spring（）动画应用于同一属性的示例。

struct Spring_BlendDuration: View {
    @State private var change = false
    @State private var secondChange = false
    @State private var blendDuration = 1.0

    var body: some View {
        VStack(spacing: 20) {
            Circle()
                .foregroundColor(.green)
                .scaleEffect(change ? secondChange ? 0.1 : 0.3 : secondChange ? 0.5 : 1.0)
                .animation(.spring(response: 1, dampingFraction: 0.1, blendDuration: blendDuration), value: change)
                .animation(.spring(response: 10, dampingFraction: 1, blendDuration: blendDuration), value: secondChange)

             HStack {
                Image(systemName: "hare")
                Slider(value: $blendDuration, in: 0...2)
                Image(systemName: "tortoise")
            }.foregroundColor(.green).padding()

            Text("\(self.blendDuration)")

            Button("Change") {
                withAnimation{
                    self.change.toggle()}
            }.font(.title)

            Button("SecondChange") {
                withAnimation{
                    self.secondChange.toggle()}
            }.font(.title)
        }
    }
}

如果在弹簧动画结束之前单击另一个按钮，则应用blendDuration时可能会注意到一些差异。例如，与没有blendDuration的情况相比，圆可以轻松地非常大地扩展。

根据文档：

持久的春季动画。与其他spring()混合使用时或同一属性上的interactiveSpring()个动画，每个动画将由其后继者替换，保留从一个动画到下一个动画的速度。（可选）将一段时间内弹簧之间的响应值。

Answer 2

要执行Spring Animation，您需要更改blendDuration，但我们还必须像这样更改response参数，

struct Spring_BlendDuration: View {
    @State private var change = false
    @State private var blendDuration = 100.0
    @State private var response = 0.5
    var calcResponseTime: Double {
        (blendDuration / 200.0)
    }

    var body: some View {
        VStack(spacing: 20) {

            Circle()
                .foregroundColor(.green)
                .scaleEffect(change ? 0.2 : 1)
                .animation(.spring(response: response, dampingFraction: 0.5, blendDuration: blendDuration))

            HStack {
                Image(systemName: "hare")
                Slider(value: $blendDuration, in: 0...200) {_ in

                    self.response =  self.calcResponseTime
                }
                Image(systemName: "tortoise")
            }.foregroundColor(.green).padding()

            Button("Change") {
                self.change.toggle()
                       }.font(.title)
        }
    }
}

根据Apple的春季动画定义文件，

响应：弹簧的刚度，定义为以秒为单位的近似持续时间。零值要求无限刚性春天，适合开车

Spring Animation：blendDuration参数有什么作用？

代码示例

看起来是什么

具有快速响应参数和慢速响应参数的比较

注意

2 个答案: