我们如何实现类似iOS 14 AppLibrary的模糊效果？（即搜索栏后面的模糊效果）

Question

我想制作一个像iOS 14 AppLibrary那样模糊的页眉。

请查看这张图片：

我有类似这样的代码：

  GeometryReader { proxy in
    ZStack(alignment: .leading){
      ScrollView(.vertical, showsIndicators: false, content: {
        Spacer()
         .frame(height: 48, alignment: .center)
         .padding(.horizontal, 24)
          .padding(.top, proxy.safeAreaInsets.top)
          .hidden()

        ...

      }).edgesIgnoringSafeArea(.all)
      
      //Need that beautiful blurry header here!          

      VStack(alignment: .center, content: {
        SearchBar()
         .frame(height: 48, alignment: .center)
         .padding(.horizontal, 24)
        
        Spacer()
      })
    }.frame(width: proxy.size.width)
  }

我不确定搜索栏和滚动视图之间是否有什么东西。

你对实现有什么想法吗？

- Behrad Kazemi

Answer 1

您正在寻找一个UIVisualEffectView。在纯SwiftUI中没有这个可用，但是您可以使用UIViewRepresentable从UIKit移植它。请查看此article。

- aheze

---

我之前测试过UIVisualEffectView，但它的效果和我附上的图片不一样。 - undefined