项目源码下载
框架实现效果图
对于该功能的需求分析
1.切换标题,被点击的标题和原标题的比例和颜色都会渐变,并且会切换控制器
2.滑动内容视图也会产生点击标题的效果
3.内容视图一开始不加载,有一张占位图占位
4.视频和社会标题被点击后会滑动到屏幕中央
一步步实现导航标题栏
搭建基本框架
1.该功能由2个ScrollView组成
2.标题导航栏可以使用三目运算来判断y值(根据是否存在导航控制器)设置标题
1.通过遍历所有的子控制器来创建对应标题
2.设置标题按钮的X值时,使用下标乘以按钮宽度获得
3.标题也可以通过label来实现,只需要为label添加点按手势,并且将userInteractionEnabled设置为YES监听标题按钮点击
1.通过下标来为按钮tag赋值,并且给按钮添加一个监听方法
2.在监听方法中恢复上一个按钮文字颜色并将被点击按钮颜色变红,记录下当前被点击按钮
3.通过按钮tag来获取对应子控制器并设置frame
4.设置内容控制器的偏移量监听内容视图滚动
1.为内容视图添加代理,并在scrollViewDidEndDecelerating:方法中实现
2.通过内容视图偏移量的X除以屏幕宽度来获得角标
3.通过角标来选中按钮和获取子控制器的View
4.在获取子控制器View的方法内判断当前视图是否存在superview,如果存在就return,这段代码可以实现最开始切换在该视图时有个占位图片,实现懒加载按钮居中处理
1.通过被选中按钮中心点的X值减去屏幕宽度的一半来计算偏移量
2.通过偏移量来判断如果小于0或者大于最大滚动宽度时不移动,否则会造成每个标题都居中标题缩放
1.通过偏移量除以屏幕宽度来获得左边按钮角标,左边按钮角标加一来获得右边按钮角标
2.在设置标题按钮方法中,将每个按钮加入可变数组
3.通过角标来获得2个按钮,这里需要判断如果左边按钮角标为5时,不取右边按钮
4.通过CGAffineTransformMakeScale方法来对2个按钮缩放-
标题文字渐变
- 为什么文字颜色能渐变?通过RGB来实现,更改R的值就能实现黑色和红色的渐变
具体实现请看源码,若有疑问,会第一时间解答
还在学习中,若有错误请大家指出,谢谢!
