如何仅将动画应用于一个特定的修改器更改? [英] How to apply animation for one specific modifier change only?

问题描述

如何仅将 .animation 应用于 .offset ，同时保持其他修饰符更改不受其影响.在偏移之后添加 .animation 也会使更改字体大小成为动画.

How to only apply .animation to .offset while keeping other modifier change not affected by it. Adding .animation after offset would also animate the font size changing.

// Main view
var body: some View {
    GeometryReader { geo in
        VStack {
            DynamicText()
        }
        .frame(height: geo.size.height)
        .offset(y: self.viewModel.offset ? 5.0 : 0)
        .animation(.default)
    }
}

// DynamicText view
var body: some View {
    return GeometryReader { geo in
        VStack {
            Text("Foo")
                .font(
                    .system(size: geo.size.height * 0.95, weight: .regular, design: .monospaced))
                .minimumScaleFactor(0.05)
                .lineLimit(1)
                .foregroundColor(Color("primary"))
        }
        .frame(height: geo.size.height)
    }
}

还尝试将上述修饰符的 .animation(nil)放到动画中，但是，它也使偏移量无法动画化.由于 ZStack 包含不​​同的条件渲染的 DynamicText ，因此动画修改器还在内容更改之间应用了淡入淡出过渡，这是我要避免的事情.

Also tried putting .animation(nil) for modifiers above have no intention for animating, however, it also stops the offset from animating. Because of the ZStack contains different conditional rendered DynamicText the animation modifier also applies the fade-in-out transition between the content changes which is something I want to avoid.

// Main view
var body: some View {
    GeometryReader { geo in
        VStack {
            DynamicText()
        }
        .animation(nil)
        .frame(height: geo.size.height)
        .offset(y: self.viewModel.offset ? 5.0 : 0)
        .animation(.default)
    }
}

推荐答案

提供的快照是不可测试的，因此，请考虑一下-尝试将动画限制为显式偏移值，例如

The provided snapshot is not testable, so just a thought - try to limit animation to offset value explicitly, like

var body: some View {
    GeometryReader { geo in
        VStack {
            DynamicText()
        }
        .frame(height: geo.size.height)
        .offset(y: self.viewModel.offset ? 5.0 : 0)
        .animation(.default, value: self.viewModel.offset)     // << here !!
    }
}

这篇关于如何仅将动画应用于一个特定的修改器更改?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！