iOS中万能的自定义头部条封装(swift版)

目前正在用swift3.0以上版本写项目,swift版本重构了一下以前经典的“头部条”,先来看下效果:

iOS中万能的自定义头部条封装(swift版)_第1张图片
遮罩样式


iOS中万能的自定义头部条封装(swift版)_第2张图片
下划线+渐变色


iOS中万能的自定义头部条封装(swift版)_第3张图片
字体缩放


实现的大致思路:

iOS中万能的自定义头部条封装(swift版)_第4张图片

上面的标题View和下面的内容View共同组成了整个的pageView,首先

pageView自定义构造方法,让外界直接调用方法,就能马上创建出想要的pageView:

init(frame:CGRect, titles: [String], childVCs: [UIViewController], parentVC:UIViewController, titleStyle:DLPageStyle) {

self.titles= titles

self.childVCs= childVCs

self.parentVC= parentVC

self.titleStyle= titleStyle

super.init(frame:frame)//init之前必须初始化所有的属性

setupUI()

}

再初始化UI界面:

extensionDLPageView{

fileprivatefuncsetupUI(){

//添加titleView

lettitleFrame =CGRect(x:0, y:64, width:bounds.width, height:titleStyle.titleViewHeight)

lettitleView =DLTitleView(frame: titleFrame, titles:titles, style:titleStyle)

titleView.backgroundColor=UIColor.init(hexString:"##FF0022")

addSubview(titleView)

//添加contentView

letcontentFrame =CGRect(x:0, y: titleFrame.maxY, width:bounds.width, height:bounds.height-64)

letcontentView =DLContentView(frame: contentFrame, childVs:childVCs, parentVc:parentVC)

contentView.backgroundColor=UIColor.randColor()

addSubview(contentView)

//两个View联系起来

titleView.delegate= contentView

contentView.delegate= titleView

}

}

然后就是在titleView 和contentView之间通讯问题,答题思路:

1.对标题View的title进行点击,通过代理的方式,将tag值/index值传递给contentView,contentView通过改变contentOffset滚动到相应地方;

2.在scrollViewDidScroll方法中,根据contentSize/屏幕宽度,计算出index,再代理传递给标题View进行切换;

3.以上两点完成了主要骨架功能,关于“下划线效果”,“渐变颜色效果”,“遮罩效果”,等可归类为同类:必须拿到三个重要元素:a.之前的标题按钮sourceLabel,b.将要点击的targetLabel,  c.进度progress(进度主要通过偏移量与屏幕宽度的比值来计算),拿到这三个元素,就可做一系列你想要的效果,实现思路一致;

重点提示:

整个小框架中遇到的坑:

1.swift中的颜色RGB值,在不同iOS8.0,iOS10.0的各种版本上有时候会存在bug,就是255的问题,根据实际的项目里可对颜色rgb进行打印,确保是0-1就没事;

2.titleView和contenView相互代理的时候,有时候相互代理导致偏离误差,这时候,需要定义bool值,在适当出进行约束;

3.合理运用懒加载对控件进行优化;

现在提供一个完整版的demo地址:swift最新版自定义头部条

你可能感兴趣的:(iOS中万能的自定义头部条封装(swift版))