Swift-UIKit-自定义视图

1.描述

iOS中自定义视图有两种方式:

1.1.xib自定义

• 创建一个继承自UIView的swift类

image.png

• 创建同名的view类型的xib文件

  
  
  image.png

• 将xib的FileOwner对象改为创建的类名

image.png

• 打开Assistant:

image.png

• 关联view对象到我们创建的swift文件中:

点击xib中的view视图,后点击右侧工具栏的,连接检查器(connection inspector),后左键点击New Referencing Outlet右侧的原点,拖到swift文件的属性区域,添加我们的关联对象:

image.png

image.png

• 添加以下码:

  override init(frame: CGRect) {
  super.init(frame: frame)
  initViewFromNib()
  }

  required init?(coder aDecoder: NSCoder) {
  super.init(coder: aDecoder)
  initViewFromNib()
  }

  private func initViewFromNib(){
  // 需要这句代码，不能直接写UINib(nibName: "MyView", bundle: nil)，不然不能在storyboard中显示
  let bundle = Bundle(for: type(of: self))
  let nib = UINib(nibName: "CustomSecondXibView", bundle: bundle)
  self.view = nib.instantiate(withOwner: self, options: nil)[0] as? UIView
  self.view.frame = bounds
  self.addSubview(view)
  }

• 此时我们可以在xib中进行添加我们的自定义视图:

我们只需要在xib中添加一个UIView,将其背景色改为蓝色,后将其的class改为我们创建的class,此时我们xib中样式是这样的:

image.png

• 如果想要显示我们自定义的xib样式我们需要在创建的class前面加入注解:

  @IBDesignable class CustomSecondXibView: UIView {
  ...
  }

即可显示:

image.png

1.2.代码自定义方式

• 创建一个普通的swift文件,继承自UIView

image.png

• 添加如下代码即可:

  override func draw(_ rect: CGRect) {
    // Drawing code
    self.backgroundColor = UIColor.systemBlue
    let label = UILabel()
    label.text = "Hello Second"
    label.backgroundColor = UIColor.green
    label.frame = CGRect.init(x: rect.width/2, y: rect.height/2, width: rect.width/2, height: rect.height/2)
    self.addSubview(label)
  }
  

• 在vc中添加如下代码即可:

  override func viewDidLoad() {
    super.viewDidLoad()
    self.view.backgroundColor = UIColor.white
    let myView1 = CustomSecondCodeView.init(frame: CGRect.init(x: 0, y: 220, width: 100, height: 100))
    self.view.addSubview(myView1)
  }
  

• 最终效果:

image.png

• 工程下载地址:

https://github.com/DeveloperZhang/SwiftStudyDemo

代码路径: SwiftUIKit->UIKitCustomViewDemo

2.总结

自定义View在我们开发中会经常使用,希望此篇文章能对大家有所帮助.