03.实战技术 网易新闻,开发中常见问题,bounds深入研究
@(iOS Study)[实战技术]
- 作者: Liwx
- 邮箱: 1032282633@qq.com
目录
- 03.实战技术 网易新闻,开发中常见问题,bounds深入研究
- 1.通知
- 通知的概念
- 通知的简单使用
- 通知的注意点
- 通知在多线程的使用
- 2.枚举中的位运算
- 位运算的使用
- 3.assign和weak的使用
- assign和weak的区别
- 4.网易新闻
- 1.基本界面搭建
- 2.监听标题按钮的点击
- 3.监听contentScrollView的滚动,
- 4.标题居中处理
- 5.标题文字缩放,颜色渐变(较难理解)
- 网易新闻抽取框架
- 5.bounds的深入研究
- bounds和frame的简介
- UIScrollView底层实现
1.通知
通知的概念
- 通知与代理的区别
通知支持一对多,代理支持一对一
- 通知的用法
凡是要发送或监听通知,都必须使用
通知中心[NSNotificationCenter defaultCenter]
通知的简单使用
-
监听通知的两种方式
- 监听通知方式一: 普通的addObserver方法监听
// 监听通知第一种方式 - (void)test { // 监听通知 // Observer;观察者 // selector;通知发出的时候,观察者调用方法 // name:通知名称 // object:谁发出通知,nil:匿名发送 [[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(note) name:@"wxNote" object:nil]; } // 当一个对象即将销毁的时候就会调用 - (void)dealloc { // 移除通知 [[NSNotificationCenter defaultCenter] removeObserver:self]; }- 监听通知方式二: block方式监听
只要是系统管理对象(通知是由系统管理的),都不需要自己手动管理,可以用weak.
@interface ViewController () @property (nonatomic, weak) id observer; @end - (void)test2 { // name:通知名称 // object:谁发出通知 // queue:决定block在哪个线程执行,nil:表示在发送通知的线程 // block:只要有通知发出,就会调用block // 返回值: 通知对象 self.observer = [[NSNotificationCenter defaultCenter] addObserverForName:@"wxNote" object:nil queue:[[NSOperationQueue alloc] init] usingBlock:^(NSNotification * _Nonnull note) { NSLog(@"%@",[NSThread currentThread]); }]; } // 当一个对象即将销毁的时候就会调用 - (void)dealloc { // 移除通知 [[NSNotificationCenter defaultCenter] removeObserver:self.observer]; } -
发送/移除通知的的几种方法
- 发送通知方法
// Notification: 通知对象 - (void)postNotification:(NSNotification *)notification; // Name: 通知名称 // object: 发送者 // userInfo:传递参数(字典) - (void)postNotificationName:(NSString *)aName object:(nullable id)anObject; - (void)postNotificationName:(NSString *)aName object:(nullable id)anObject userInfo:(nullable NSDictionary *)aUserInfo;- 移除通知方法
- (void)removeObserver:(id)observer; - (void)removeObserver:(id)observer name:(nullable NSString *)aName object:(nullable id)anObject;
-
在对象销毁时移除移除通知
// 当一个对象即将销毁的时候就会调用 - (void)dealloc { // 移除通知 [[NSNotificationCenter defaultCenter] removeObserver:self.observer]; }
通知的注意点
- 通知注意点
- 一定要记得移除通知.(通知中心调用removeObserver方法移除)
- 一定要
先监听通知,再发出通知.
通知在多线程的使用
-
通知在多线程中注意点
- 监听通知方法调用:跟发送通知线程有关系.
如果没指定通知在哪个线程执行,则通知监听调用的方法在发送通知的线程执行.
- 监听通知方法调用:跟发送通知线程有关系.
-
通知在多线程的使用
- 子线程发送通知,主线程监听通知.
// 发出通知:子线程 监听通知:主线程 方法调用:子线程 - (void)viewDidLoad { [super viewDidLoad]; // 监听通知:主线程监听通知, [[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(note) name:@"wxNote" object:nil]; // 发出通知 // name:通知名称 // object:谁发出通知 // 开启子线程条件:1.异步 2.并发队列(全局并发队列) // 2.异步 串行 也会开启子线程 dispatch_async(dispatch_get_global_queue(0, 0), ^{ // 异步任务 [[NSNotificationCenter defaultCenter] postNotificationName:@"wxNote" object:nil]; }); } // 监听通知发出,就会调用 - (void)note { NSLog(@"%@",[NSThread currentThread]); } // 当一个对象即将销毁的时候就会调用 - (void)dealloc { // 移除通知 [[NSNotificationCenter defaultCenter] removeObserver:self]; }-
主线程发送通知,子线程监听通知(如果监听通知没指定block在哪个线程执行(
queue: nil)时,则表示block在发送通知的线程中执行)
以下方法实际返回的是通知对象,需拿到通知对象,用于移除通知.
// 发送通知: 主线程 监听通知: 子线程 方法调用: 主线程 - (void)viewDidLoad { [super viewDidLoad]; // 子线程监听通知 dispatch_async(dispatch_get_global_queue(0, 0), ^{ [[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(note) name:@"wxNote" object:nil]; }); } - (void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event { // 主线程发送通知 [[NSNotificationCenter defaultCenter] postNotificationName:@"wxNote" object:nil]; } // 监听通知发出,就会调用 - (void)note { NSLog(@"%@",[NSThread currentThread]); } // 当一个对象即将销毁的时候就会调用 - (void)dealloc { // 移除通知 [[NSNotificationCenter defaultCenter] removeObserver:self]; }
2.枚举中的位运算
位运算的使用
- 位运算的简单使用
#import "ViewController.h"
// 定义位移枚举
typedef NS_OPTIONS(NSUInteger, WXDirection) {
WXDirectionTop = 1 << 0,
WXDirectionBottom = 1 << 1,
WXDirectionLeft = 1 << 2,
WXDirectionRight = 1 << 3,
};
@interface ViewController ()
@end
@implementation ViewController
- (void)viewDidLoad {
[super viewDidLoad];
[self testDirection:WXDirectionTop | WXDirectionRight];
}
- (void)testDirection:(WXDirection)directions {
// 用位与运算判断
if (directions & WXDirectionTop) {
NSLog(@"上");
}
if (directions & WXDirectionBottom) {
NSLog(@"下");
}
if (directions & WXDirectionLeft) {
NSLog(@"左");
}
if (directions & WXDirectionRight) {
NSLog(@"右");
}
}
3.assign和weak的使用
assign和weak的区别
-
assign关键字的介绍
- 用assign关键字描述对象成员属性,会报坏内存访问错误
- 用assign关键字描述的成员属性,在敲(_属性名)会提示__unsafe_unretained`.
-
__unsafe_unretained关键字表示:引用计数器不会+1,但是对象被销毁,指针不会清空,所以assign描述对象时,对象释放后,在用assign描述的成员属性,会导致坏内存访问错误.所以对象不能用assign描述;
// 错误写法,assign不能描述对象 @property (nonatomic, assign) UIView *blueView; -
weak关键字的介绍
- 用weak关键字描述的成员属性,在敲(_属性名)会提示
__weak.weak:弱指针,不会让引用计数器+1,当对象被销毁,这个弱指针会被清空,nil.所以weak关键字可以描述对象成员属性.
@property (nonatomic, weak) UIView *redView; - 用weak关键字描述的成员属性,在敲(_属性名)会提示
-
4.网易新闻
1.基本界面搭建
-
搭建基本界面
- 1.搭建标题滚动视图
- 2.搭建内容滚动视图
- 3.添加子控制器
- 4.添加TitleScrollView中所有button,设置标题(标题可以从子控制器中获取)
注意: 如果已经设置了按钮的标题,但是titleScrollView的按钮并没有显示,可以设置尝试self.automaticallyAdjustsScrollViewInsets = NO;,因为导航控制器下的ScrollView,系统会默认为所有ScrollView添加额外的滚动区域64.
2.监听标题按钮的点击
-
监听标题按钮的点击
- 1.切换选中状态,修改当前选中的按钮文字颜色
/** 切换选中状态,修改当前选中的按钮文字颜色 */ - (void)selectedBtn:(UIButton *)btn { // 还原上一个按钮的字体颜色和字体形变大小 [self.selectedBtn setTitleColor:[UIColor blackColor] forState:UIControlStateNormal]; self.selectedBtn.transform = CGAffineTransformIdentity; // 设置当前选中的按钮的字体颜色和字体形变大小 self.selectedBtn = btn; [self.selectedBtn setTitleColor:[UIColor redColor] forState:UIControlStateNormal]; self.selectedBtn.transform = CGAffineTransformMakeScale(1.3, 1.3); }- 2.将子控制器的view添加到_contentScrollView对应的位置
/** 将子控制器的view添加到_contentScrollView对应的位置 */ - (void)setupOneViewControllerView:(NSInteger)index { UIViewController *vc = self.childViewControllers[index]; // 判断该子控制器的view是否已经添加到当前的控制器view上,如果已添加,则直接退出 if (vc.view.superview) { return; } // 添加到contentScrollView对应的位置上 vc.view.frame = CGRectMake(index * WXScreenW, 0, WXScreenW, self.contentScrollView.frame.size.height); [self.contentScrollView addSubview:vc.view]; }- 3.
设置_contentScrollView的偏移量.如果没偏移,则还是之前的view,因为添加子控制器的view是添加到contentScrollView指定的位置上.
self.contentScrollView.contentOffset = CGPointMake(btn.tag * WXScreenW, 0);
3.监听contentScrollView的滚动,
-
监听contentScrollView的滚动
- 设置_contentScrollView和titleScrollView的contentSize
self.contentScrollView.contentSize = CGSizeMake(count * WXScreenW, 0); self.titleScrollView.contentSize = CGSizeMake(count * btnW, 0);- 在添加按钮的setupAllTitle方法中设置contentScrollView和titleScrollView的初始配置信息
- (void)setupAllScrollViewSetting { // 设置contentScrollView的代理 self.contentScrollView.delegate = self; // 设置contentScrollView和titleScrollView不添加额外滚动区域,隐藏滚动条,开启分页功能 self.automaticallyAdjustsScrollViewInsets = NO; self.contentScrollView.showsHorizontalScrollIndicator = NO; self.titleScrollView.showsHorizontalScrollIndicator = NO; self.contentScrollView.pagingEnabled = YES; }- 监听contentScrollView减速完成.在scrollViewDidEndDecelerating方法中切换刷新按钮显示和切换contentScrollView中显示的view
/** ScrollView减速完成调用 */ - (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView { // 获取按钮的角标 NSInteger index = scrollView.contentOffset.x / WXScreenW; // 通过角标从存放按钮的数组中取出按钮 UIButton *btn = self.buttons[index]; // 切换按钮的状态 [self selectedBtn:btn]; // 添加对应子控制器的view到contentScrollView [self setupOneViewControllerView:index]; }
4.标题居中处理
- 标题居中计算图解
1.标题居中计算图解.png
-
选中标题居中处理
- 在点击按钮时调用的selectedBtn方法中让标题居中
- 因为点击按钮和拖动contentScrollView都会调用
selectedBtn方法,所以在该方法的最后调用setupTitleButtonCenter方法,让按钮居中. - setupTitleButtonCenter方法中需对
最大最小偏移量进行判断,实现代码如下
/** 设置当前选中按钮居中 */ - (void)setupTitleButtonCenter:(UIButton *)selectedBtn { // 偏移量计算 偏移量 = selectedBtn.center.x - self.contentScrollView.frame.size.width * 0.5 CGFloat offSetX = selectedBtn.center.x - self.contentScrollView.frame.size.width * 0.5; NSLog(@"%0.2f", offSetX); // 如果计算出来的偏移量小于0,则不偏移,将偏移量置0 if (offSetX < 0) { offSetX = 0; } // 获取最大的x偏移量,如果超过最大偏移量,则偏移到最大偏移量的位置 CGFloat maxOffsetX = self.titleScrollView.contentSize.width - WXScreenW; if (offSetX > maxOffsetX) { offSetX = maxOffsetX; } // 开始偏移titleScrollView [self.titleScrollView setContentOffset:CGPointMake(offSetX, 0) animated:YES]; } 标题居中初步运行效果
2.网易新闻标题居中.gif
5.标题文字缩放,颜色渐变(较难理解)
-
实现标题文字缩放,颜色渐变功能
- 在拖动过程中计算左右按钮的形变比例和颜色渐变比例
- 实现标题文字缩放,颜色渐变参考代码
/** ScrollView滚动的时候调用 */ - (void)scrollViewDidScroll:(UIScrollView *)scrollView { // ------------------------------------------------------------------------ // 滚动过程中实现标题的文字大小变化(形变),标题文字颜色渐变 // 1.获取左右两个按钮 // 1.1 获取左右按钮的角标 NSInteger leftIndex = scrollView.contentOffset.x / WXScreenW; NSInteger rightIndex = leftIndex + 1; // 1.2 获取左右按钮 UIButton *leftBtn = self.buttons[leftIndex]; NSUInteger count = self.childViewControllers.count; UIButton *rightBtn = nil; if (rightIndex < count) { rightBtn = self.buttons[rightIndex]; } // 2.计算左右按钮缩放的比例 // 2.1 计算右边按钮的缩放比例 CGFloat rightScale = scrollView.contentOffset.x / WXScreenW; // 2.2 处理左边和右边的比例范围0.0 ~ 1.0 // 假设rightScale: 0.22 ,leftScale: 0.78 rightScale = rightScale - leftIndex; CGFloat leftScale = 1 - rightScale; // 3.改变文字的大小,不是修改字体,修改按钮的形变属性transform // 3.1 计算最终要缩放的比例, 将缩放比例0.0 ~ 1.0变成1.0 ~ 1.3 CGFloat lastRightScale = (rightScale * 0.3) + 1; CGFloat lastLeftScale = (leftScale * 0.3) + 1; // 3.2 开始缩放左右按钮 leftBtn.transform = CGAffineTransformMakeScale(lastLeftScale, lastLeftScale); rightBtn.transform = CGAffineTransformMakeScale(lastRightScale, lastRightScale); // 4.设置按钮颜色渐变 [leftBtn setTitleColor:[UIColor colorWithRed:leftScale green:0 blue:0 alpha:1] forState:UIControlStateNormal]; [rightBtn setTitleColor:[UIColor colorWithRed:rightScale green:0 blue:0 alpha:1] forState:UIControlStateNormal]; } 网易新闻最终运行效果
3.网易新闻最终运行效果.gif
网易新闻抽取框架
-
抽取框架步骤
- 将添加子控制器的操作移到外部,由子类自己决定要添加什么子控制器.
- 将设置titleBtn标题的方法放在viewWillAppear方法中调用,而且只需调用一次.
/** view即将显示的时候调用 */ - (void)viewWillAppear:(BOOL)animated { [super viewWillAppear:animated]; // 设置titleBtn的标题 if (self.isInitial == NO) { [self setupAllTitle]; self.isInitial = YES; } } -
抽取框架的好处
- 只要继承NewsViewController控制器, 就能实现功能.
- 子类继承NewsViewController控制器,并添加子控制器就能实现功能.
5.bounds的深入研究
bounds和frame的简介
frame:以
父控件左上角为原点
bounds:以自己内容左上角为原点
frame和bounds都是描述一块区域
frame描述的这块区域:可视范围
bounds描述的区域：可视范围在内容范围显示的区域。
区域和点一样，不同参照物，描述的区域不同
frame:参照父控件一直不变
frame:参照内容，位置会变动
其实bounds:x,y可以为其他值
疑问：bounds的y++，为什么内容往上走?
bounds的y++表示要看下面的内容，内容就会往上移走.
bounds:以
自己内容的左上角为原点，描述可视范围相对内容范围的位置。bounds和frame图解分析
4.bounds和frame图解分析.png
UIScrollView底层实现
- UIScrollView的实现原理是用bounds实现滚动
#import "ViewController.h"
@interface ViewController ()<UIScrollViewDelegate>
@property (weak, nonatomic) UIView *scrollView;
@property (nonatomic, assign) CGPoint offsetX;
@end
@implementation ViewController
- (void)viewDidLoad {
[super viewDidLoad];
UIView *scrollView = [[UIView alloc] initWithFrame:self.view.bounds];
[self.view addSubview:scrollView];
_scrollView = scrollView;
// 添加拖动手势pan
UIPanGestureRecognizer *pan = [[UIPanGestureRecognizer alloc] initWithTarget:self action:@selector(pan:)];
[scrollView addGestureRecognizer:pan];
// 添加子控件观察效果
UISwitch *switchV = [[UISwitch alloc] init];
[scrollView addSubview:switchV];
}
// 拖动的时候调用
- (void)pan:(UIPanGestureRecognizer *)pan
{
// 获取偏移量
CGPoint transP = [pan translationInView:pan.view];
_offsetX.x += -transP.x;
_offsetX.y += -transP.y;
// 修改其bounds值就能实现滚动效果
_scrollView.bounds = CGRectMake(_offsetX.x, _offsetX.y, self.view.bounds.size.width, self.view.bounds.size.height);
// 清0,复位
[pan setTranslation:CGPointZero inView:pan.view];
}
- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
NSLog(@"%f %f",scrollView.contentOffset.y,scrollView.bounds.origin.y);
}
