效果图
Paste_Image.png大体说一下思路,此页面是由顶部的HeadView以及一个TableView两部分构成,TableView有一个headView,分别是我的订单,优惠劵以及我的消息,通过闭包的回调完成点击的事件
1. 顶部的HeadView - UIImageView
步骤:
1. 定义相关控件
2. 在init(frame: CGRect)方法中设置相关属性并添加
3. 在layoutSubviews()方法中设置各个控件的frame
注意:如果你需要添加其它的参数(如: 点击方法),需要使用便利构造器,在第1步的时候,定义一个方法
便利构造器是类的次要构造器, 你需要让便利构造器调用同一个类中的指定构造器, 并将这个指定构造器中的参数填上你想要的默认参数.
关于构造器可以参考我写的这篇简书Swift 类构造器的使用
代码
import UIKit
class MineHeadView: UIImageView {
// 第1步:定义相关控件
let setUpBtn: UIButton = UIButton(type: .Custom)
let iconView: IconView = IconView()
// 定义方法
var buttonClick:(Void -> Void)?
override init(frame: CGRect) {
super.init(frame: frame)
// 第2步:设置相关属性并添加
image = UIImage(named: "v2_my_avatar_bg")
setUpBtn.setImage(UIImage(named: "v2_my_settings_icon"), forState: .Normal)
setUpBtn.addTarget(self, action: Selector("setUpButtonClick"), forControlEvents: .TouchUpInside)
addSubview(setUpBtn)
addSubview(iconView)
self.userInteractionEnabled = true
}
// 便利构造器
convenience init(frame: CGRect, settingButtonClick:(() -> Void)) {
// 调用同一个类中的指定构造器
self.init(frame: frame)
buttonClick = settingButtonClick
}
required init?(coder aDecoder: NSCoder) {
fatalError("init(coder:) has not been implemented")
}
// 第3步:设置frame
override func layoutSubviews() {
super.layoutSubviews()
}
func setUpButtonClick() {
buttonClick?()
}
2. TableView - headView
效果图
TableView有一个headView,分别是我的订单,优惠劵以及我的消息,这是三个view,并在view上添加了一个button,我通过for...in循环分别给这三个view添加手势,实现点击事件,同时,定义了一个枚举并设置view的tag值,在点击事件中通过tap.view!.tag进行判断,实现相应的点击方法
代码
import UIKit
enum MineHeadViewButtonType: Int {
case Order = 0
case Coupon = 1
case Message = 2
}
class MineTabeHeadView: UIView {
// 第1步:定义相关控件和方法
var mineHeadViewClick:((type: MineHeadViewButtonType) -> ())?
override init(frame: CGRect) {
super.init(frame: frame)
backgroundColor = UIColor.whiteColor()
// 第2步:设置相关属性并添加
buildUI()
}
required init?(coder aDecoder: NSCoder) {
fatalError("init(coder:) has not been implemented")
}
override func layoutSubviews() {
super.layoutSubviews()
// 第3步:设置frame
}
private func buildUI() {
// 设置了view的tag值
orderView.tag = 0
addSubview(orderView)
couponView.tag = 1
addSubview(couponView)
messageView.tag = 2
addSubview(messageView)
// 通过for...in循环分别给这三个view添加手势,实现点击事件
for index in 0...2 {
let tap = UITapGestureRecognizer(target: self, action: Selector("click:"))
let subView = viewWithTag(index)
subView?.addGestureRecognizer(tap)
}
}
func click(tap: UIGestureRecognizer) {
if mineHeadViewClick != nil {
// 在点击方法中,通过tag值,实现相应的点击方法
switch tap.view!.tag {
case MineHeadViewButtonType.Order.rawValue:
mineHeadViewClick!(type: MineHeadViewButtonType.Order)
break
case MineHeadViewButtonType.Coupon.rawValue:
mineHeadViewClick!(type: MineHeadViewButtonType.Coupon)
break
case MineHeadViewButtonType.Message.rawValue:
mineHeadViewClick!(type: MineHeadViewButtonType.Message)
break
default: break
}
}
}
}
注意: view上button的图片和文字位置和button默认位置不一样,需要重写button的titleLabel和imageView两个属性,具体参考
UpImageDownTextButton这个类和相关代码
3. 自定义Cell
步骤:
1. 模型类 - 这里是从Plist中获取数据
2. 懒加载控件
3. 定义模型属性,并在didSet{}中进行赋值 - 相当于OC中的重写set方法
4. 在init(style: UITableViewCellStyle, reuseIdentifier: String?)方法中设置相关属性并添加
5. 在layoutSubviews()方法中设置各个控件的frame
注意:需要将控件添加到contentView上
可以在cell中定义一个快速创建cell的方法
import UIKit
class MineCell: UITableViewCell {
// 第3步:定义模型属性,并在didSet{}中进行赋值
var mineModel: MineCellModel? {
didSet {
titleLabel.text = mineModel!.title
iconImageView.image = UIImage(named: mineModel!.iconName!)
}
}
static private let identifier = "CellID"
// 快速创建cell的方法
class func cellFor(tableView: UITableView) -> MineCell {
var cell = tableView.dequeueReusableCellWithIdentifier(identifier) as? MineCell
if cell == nil {
cell = MineCell(style: .Default, reuseIdentifier: identifier)
}
return cell!
}
// 第2步:懒加载控件
let bottomLine = UIView()
private lazy var iconImageView = UIImageView()
private lazy var titleLabel = UILabel()
private lazy var arrowView = UIImageView()
// 第4步:设置相关属性并添加
override init(style: UITableViewCellStyle, reuseIdentifier: String?) {
super.init(style: style, reuseIdentifier: reuseIdentifier)
}
required init?(coder aDecoder: NSCoder) {
fatalError("init(coder:) has not been implemented")
}
// 第5步:设置frame
override func layoutSubviews() {
super.layoutSubviews()
}
}
// 第1步:模型类 - 从Plist中获取数据
class MineCellModel: NSObject {
var title: String?
var iconName: String?
class func loadMineCellModels() -> [MineCellModel] {
var mines = [MineCellModel]()
let path = NSBundle.mainBundle().pathForResource("MinePlist", ofType: "plist")
let arr = NSArray(contentsOfFile: path!)
for dic in arr! {
mines.append(MineCellModel.mineModel(dic as! NSDictionary))
}
return mines
}
// 相当于OC中的类方法/对象方法
class func mineModel(dic: NSDictionary) -> MineCellModel {
let model = MineCellModel()
model.title = dic["title"] as? String
model.iconName = dic["iconName"] as? String
return model
}
}
网友评论