在不改变视觉效果的情况下用Swift材料更改视图的不透明度

Question

我试图动画在SwiftUI中的(图像)视图的转换，该视图是使用系统物质视觉效果来模糊的：

ZStack {
   Image(uiImage: UIImage(named: "Landscape-Color.jpg")!)
      .resizable()
      .aspectRatio(contentMode: .fit)
      .frame(width: 200, height: 200)
   VisualEffectView(UIBlurEffect(style: .systemThinMaterial))
   Text("Hello, world!")
}.opacity(0.5)

您可以找到一个有完整代码示例这里的游乐场。

这一转变应该在不改变快速材料的模糊效果的情况下，激发视图的不透明度。正如您在下面的代码示例和图片中所看到的，设置不透明度会减少模糊效果，并使底层内容更加可见。在我的示例中，当视图被移除时，视觉效果不应该改变。

​

​

我正在寻找一个解决方案，如何降低不透明的ZStack，而不改变外观的视觉效果。(只有后面的蓝色背景应该更可见，而不是视图中的图片)。

任何帮助都是非常感谢的，我不介意解决方案是在SwiftUI还是UIKit中，只要我可以在SwiftUI中嵌入任何东西。如果有什么不清楚的地方请告诉我。

Answer 1

你有没有试过把他的照片放进.background

import SwiftUI

@available(iOS 15.0, *)
struct OpacityView: View {
    @State var opacity: CGFloat = 0.5
    var body: some View {
        VStack{
            Slider(value: $opacity)
            ZStack {
                Color.blue
                //Other View elements here
                Text("Hello, world!")
            }.opacity(opacity)
            
        }.background(
            Image(systemName: "person")
                .resizable()
                .aspectRatio(contentMode: .fit)
                .frame(width: 200, height: 200)
                .overlay(Material.ultraThin)
        )
        
    }
}
@available(iOS 15.0, *)
struct OpacityView_Previews: PreviewProvider {
    static var previews: some View {
        OpacityView()
    }
}

它似乎提供了你想要的效果。

不透明度== 0

​

​

不透明度== 0.5

​

​

不透明度== 1

​

​

在1处，图像被Color隐藏，因为它在ZStack后面。如果这不是你想要的，你能