swfti-ios实现自定义UIView等控件的方法。
在目前我的摸索中,有三种方法:
- 自己定义代码.swfit文件
- 自己定义代码.swfit文件和.xib文件使用Bundle.main.loadNibNamed(“BookView”, owner: nil, options:nil)?.first as? BookView//BookView是自己定义的组件名字
- 自定义代码.swift文件和.xib文件。可以直接从storyboard中加载,也能在代码里面加载
方法一:
// example
import Foundation
import UIKit
class BookCell: UIView {
// 自己要的控件
var bookCover : UIImageView
var Description : UILabel
var addToShelf : UIButton
override init(frame:CGRect) {
//控件的相对父组件的位置
bookCover = UIImageView(frame: CGRect(x: 0, y: 0, width: frame.size.width, height: frame.size.height/5 * 4));
Description = UILabel(frame: CGRect(x: 2, y: frame.size.height/5 * 4+2, width: frame.size.width, height: 10))
Description.textColor = UIColor(hexString: "#FF6967")
Description.font = UIFont(name: Description.font.fontName, size: 10)
Description.textAlignment = NSTextAlignment.center
addToShelf = UIButton(frame: CGRect(x: frame.size.width/2+10, y: Description.frame.origin.y+12, width: 50, height:20))
addToShelf.titleLabel?.font = UIFont(name: (addToShelf.titleLabel?.font.fontName)!, size: 9);
addToShelf.setTitleColor(#colorLiteral(red: 0, green: 0, blue: 0, alpha: 1), for: UIControl.State.normal)
addToShelf.layer.masksToBounds = true
addToShelf.layer.cornerRadius = 10
addToShelf.layer.borderWidth = 1.0;
addToShelf.layer.borderColor = UIColor(hexString: "#FF6A68").cgColor
super.init(frame:frame)
}
required init?(coder aDecoder: NSCoder) {
fatalError("init(coder:) has not been implemented")
}
}
// 在别的界面调用 xxx(frame:CGRect)j进行调用
- 总结起来就是实现override init(frame:CGRect) 方法
-
required init?(coder aDecoder: NSCoder) 空实现即可
- 实现方法简单,但是不能使用xib,需要手写控件,甚至是约束
方法二:
- 新建代码.swft文件
- 新建xib文件最好的上面的同名。(选择View)
- 然后在view中进行绑定
在view的地方,设定他的类,这样就可以拉控件到代码里面,然后进行编辑了
@IBOutlet weak var downloadBtn: UIButton!
@IBOutlet weak var title: UILabel!
required init?(coder aDecoder: NSCoder) {
super.init(coder: aDecoder)
}
///加载后会调用这个方法:
override func awakeFromNib() {
super.awakeFromNib()
downloadBtn.layer.borderWidth = 1
downloadBtn.layer.borderColor = UIColor(hexString: "#FF6968").cgColor
downloadBtn.layer.masksToBounds = true
downloadBtn.layer.cornerRadius = 10
}
然后在代码中使用:
let xx = Bundle.main.loadNibNamed(“Xxx(类名字)”, owner: nil, options:nil)?.first as! Xx(类名字)进行加载
方法三:
- 同二,新建两个文件,同名
- 进行绑定,注意这次不是绑定在view
图示:
绑定之后,打开assitant
可以拉入你想要的控件,进行属性设置,
class BookView: UIView {
@IBOutlet weak var bookImageView: UIImageView!
@IBOutlet weak var progressLabel: UILabel!
// 在storyborad中调用了
override func awakeFromNib() {
print("call awakeFromNib")
super.awakeFromNib()
}
/ ## 后面的是关键的代码
//初始化时将xib中的view添加进来
var contentView:UIView!
///
/// - 代码中实例画的时候调用
override init(frame: CGRect) {
super.init(frame: frame)
print("frame")
contentView = loadViewFromNib()
addSubview(contentView)
}
/// 从storyborad中实例化的时候调用:
required init?(coder aDecoder: NSCoder) {
print("coder")
super.init(coder: aDecoder)
contentView = loadViewFromNib()
addSubview(contentView)
}
//加载xib
func loadViewFromNib() -> UIView {
let className = type(of: self)
let bundle = Bundle(for: className)
let name = NSStringFromClass(className).components(separatedBy: ".").last
let nib = UINib(nibName: name!, bundle: bundle)
let view = nib.instantiate(withOwner: self, options: nil).first as! UIView
return view
}
init(coder:)和init(frame:)是在两个不同的情境下被调用的。前者是当自定义控件在XIB中使用的时候被调用,后者是使用代码直接创建自定义控件时被调用的。
当自定义控件在XIB中使用时候还有一个方法会被触发:awakeFromeNib,此方法是当控件从NIB文件加载完毕之后触发的, 它和init(coder:)的触发机制是不同的, init(coder:)要做真正的反序列化的工作, awakeFromNib是反序列化完毕并且设置好相关的Outlet变量之后被调用的。
- 完成的效果是能够在代码中通过 init(frame: CGRect)进行初始化
- 在storyborad中,能够通过给UIview绑定class
在run之后,显示控件的样式;
可以设置在右侧设计版的属性:
注意, 你必须给变量定义一个明确的类型, 否则在IB上是看不到的
保存之后就可以在storyboard中,右侧的属性栏中编辑属性了,即可见即所得吧。
有什么问题可以留言哦,你的点赞就是我最大的动力!