为什么颜色视图似乎比 SwiftUI 中的图像视图褪色更快？

Question

我有以下代码，其中 SplashScreen 的内容顺利淡出。但似乎 Color("app_color") 视图比图像视图淡出得更快。

import SwiftUI

struct ContentView: View {
    var body: some View {
        ZStack {
            TabbedView()
            SplashScreen (duration: 2.0, delay: 2.0) {
                SplashContents()
            }
        }
    }
}

struct SplashContents: View {
    var body: some View {
        ZStack {
            Color("app_color")
            Image("app_logo")
                .resizable()
                .frame(width: 200, height: 200)
        }
    }
}

public struct SplashScreen<Content: View>: View {
    
    @State private var showSplash = true
    
    let duration: Double
    let delay: Double
    let content: Content
    
    public init(duration: Double = 0, delay: Double = 0, @ViewBuilder contentProvider: () -> Content){
        self.duration = duration
        self.delay = delay
        self.content = contentProvider()
    }
    
    public var body: some View {
        content
            .edgesIgnoringSafeArea(.all)
            .opacity(showSplash ? 1 : 0)
            .zIndex(0) //push this screen to the back
            .onAppear {
                DispatchQueue.main.asyncAfter(deadline: .now() + 2) {
                    withAnimation(.easeOut(duration: duration)) {
                            showSplash = false
                    }
                }
            }
    }
}

结果可以在附件视频中看到。

因此在视频中，您可以明显地看到方形图像与红色背景分开，因为它们似乎以不同的速率褪色。我的问题是，如何让颜色视图以与图像视图相同的速率淡化，使其看起来像图像和颜色视图是单个项目？

Answer 1

我认为不是图像褪色变慢，而是它们重叠了。你可以把它想象成在那个图像区域有两次你的红色。

将它们一起渲染的一种方法是使用修饰符 compositingGroup().

ZStack {
    Color("app_color")
    Image("app_logo")
        .resizable()
        .frame(width: 200, height: 200)
}
.compositingGroup()

A compositing group makes compositing effects in this view’s ancestor views, such as opacity and the blend mode, take effect before this view is rendered.

Use compositingGroup() to apply effects to a parent view before applying effects to this view.

您可以找到更多信息here。

为什么颜色视图似乎比 SwiftUI 中的图像视图褪色更快？

Why does Color view seem to fade faster than Image view in SwiftUI?

animation

opacity

swiftui