SwiftUI实战之Picker弹出式显示进行背景模糊(教程含源码)

本文价值与收获

看完本文后,您将能够作出下面的界面

Jietu20200419-171053@2x.jpg
Jietu20200419-171132.gif

看完本文您将掌握的技能

  • 掌握Picker基础使用
  • 类似alert的调用模式
  • 获取响应数据
  • 学会使用ViewModifier
  • 学会fileprivate
  • 学会使用extention

代码

1、主页面代码

import SwiftUI

struct ContentView: View,Picker_Image_Pro {

    @State var isShow = false
    @State var fruit = "选择水果"
    var body: some View {
        VStack{
            Spacer()
            Button("\(self.fruit)"){
                self.isShow.toggle()
            }
            //为了测试背景模糊
            List{
                ForEach(1..<20){ item in
                    Text("\(item)")
                }
            }
            Spacer()
        }
        //链式调用效果
        .showPicker(isPresented: self.$isShow,delegate: self)
            
    }
    //选择后响应函数
    func pickerSelect(selectItem: String) {
        self.fruit = "选择的水果:"+selectItem
    }
    
}

2、制作个view 扩展

extension View {
    
    func showPicker(isPresented: Binding<Bool>,delegate:Picker_Image_Pro) -> some View {
        
        self.modifier(PickerVM(isPresented: isPresented,delegate: delegate))

    }

}

3、制作个modifier

struct PickerVM: ViewModifier {
    @Binding var isPresented: Bool
    var delegate:Picker_Image_Pro
    func body(content: Content) -> some View {
        
        ZStack {
            content
            .disabled(self.isPresented)
                               .blur(radius: self.isPresented ? 6 : 0)
            if isPresented {
                Picker_Image(isPresented: self.$isPresented,delegate: self.delegate)
                .zIndex(1)
          
            }
        }
  
    }
    
}
还有 68% 的精彩内容
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。
支付 ¥2.59 继续阅读

推荐阅读更多精彩内容