【问题标题】:How can I remove/control fade effect from matchedGeometryEffect?如何从matchedGeometryEffect 中移除/控制淡入淡出效果?
【发布时间】:2021-12-10 13:36:16
【问题描述】:

我有一个测试代码来显示这个问题,当我使用matchedGeometryEffect 时,matchedGeometryEffect 会在渲染结果中添加一个不希望出现的淡入淡出效果,所以我喜欢移除这个淡入淡出效果甚至控制它。当我将视图的颜色从一种颜色更改为另一种颜色时可能是一件好事,但在我的情况下它并不好,因为颜色一直都是黑色的。

struct ContentView: View {
    
    @Namespace var animationNamespaceon
    @State private var start: Bool = Bool()
    
    var body: some View {
        
        VStack {
            
            Spacer()
            
            circle
            
            Spacer()
            
            Button("update") { start.toggle() }
            
        }
        .animation(Animation.linear(duration: 3), value: start)

    }
    
   @ViewBuilder var circle: some View {
        if start {
            
            Circle()
                .foregroundColor(Color.black)
                .matchedGeometryEffect(id: "Circle", in: animationNamespaceon)
                .frame(width: 300, height: 300)


        }
        else {
            Circle()
                .foregroundColor(Color.black)
                .matchedGeometryEffect(id: "Circle", in: animationNamespaceon)
                .frame(width: 50, height: 50)
                
        }
    }
}

【问题讨论】:

    标签: swift swiftui


    【解决方案1】:

    这是默认.transition(.opacity) 的效果,当视图从(插入到)视图层次结构中移除时应用。

    我假设您需要线性比例转换,例如

        if start {
            Circle()
                .foregroundColor(Color.black)
                .matchedGeometryEffect(id: "Circle", in: animationNamespaceon)
                .transition(.scale(scale: 1))
                .frame(width: 300, height: 300)
        }
        else {
            Circle()
                .foregroundColor(Color.black)
                .matchedGeometryEffect(id: "Circle", in: animationNamespaceon)
                .transition(.scale(scale: 1))
                .frame(width: 50, height: 50)
        }
    

    使用 Xcode 13 / iOS 15 测试

    【讨论】:

    • 谢谢,问题解决了。
    猜你喜欢
    • 1970-01-01
    • 2021-12-06
    • 1970-01-01
    • 2011-03-05
    • 2011-10-16
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2011-01-01
    相关资源
    最近更新 更多