重點：ContentOffset偏移量計算

判斷防止View視圖重復(fù)加載

UIViewController * vc = self.childViewControllers[i];//FIXME:防止重復(fù)加載View視圖if (vc.viewIfLoaded) {//iOS 9.0之后return;}//FIXME:通用if (vc.view.superview) {return;}

?

代碼：(未抽取)

#import "ViewController.h" #import "TopLineViewController.h" #import "HotViewController.h" #import "VideoViewController.h" #import "ScienceViewController.h" #import "SocietyViewController.h" #import "ReaderViewController.h" #define ScreenW [[UIScreen mainScreen] bounds].size.width #define ScreenH [[UIScreen mainScreen] bounds].size.height @interface ViewController ()<UIScrollViewDelegate> /** 標題按鈕數(shù)組 */ @property (nonatomic, strong) NSMutableArray * titleBtns ; /** 上一次選中的按鈕 */ @property (nonatomic, strong) UIButton * selectedBtn ; @property (nonatomic, weak) UIScrollView *titleScrollView; @property (nonatomic, weak) UIScrollView *contentScrollView;@end@implementation ViewController -(NSMutableArray *)titleBtns {if (!_titleBtns) {_titleBtns = @[].mutableCopy;}return _titleBtns; } - (void)viewDidLoad {[super viewDidLoad];self.navigationItem.title = @"網(wǎng)易新聞";// 1.添加標題滾動視圖 [self setupTitleScrollView];// 2.添加內(nèi)容滾動視圖 [self setupContentScrollView];//3.添加所有的子控制器 [self setupAllChildViewController];//4.設(shè)置所有的標題 [self setupAllTitles];//5.處理標題的點擊//7.FIXME:scrollView的額外滾動區(qū)域64//iOS 7以后，導(dǎo)航控制器中scrollView頂部會添加64的額外滾動區(qū)域self.automaticallyAdjustsScrollViewInsets = NO;} #pragma mark - 設(shè)置所有的標題 - (void)setupAllTitles {//已經(jīng)把我們想要的內(nèi)容展示上去 -> 展示的效果是否是我們想要的(調(diào)整細節(jié))//1.標題的顏色 為黑色//2.需要讓titleScrollView可以滾動//添加所有標題按鈕NSInteger count = self.childViewControllers.count;CGFloat btnW = 100;CGFloat btnH = self.titleScrollView.bounds.size.height;CGFloat btnX = 0;for (NSInteger i = 0; i<count; i++) {UIButton *titleBtn = [UIButton buttonWithType:UIButtonTypeCustom];titleBtn.tag = i;//設(shè)置標題UIViewController * vc = self.childViewControllers[i];[titleBtn setTitle:vc.title forState:UIControlStateNormal];//設(shè)置FramebtnX = i * btnW;titleBtn.frame = CGRectMake(btnX, 0, btnW, btnH);[titleBtn setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];//監(jiān)聽按鈕點擊 [titleBtn addTarget:self action:@selector(titleClick:) forControlEvents:UIControlEventTouchUpInside];//設(shè)置第一個按鈕默認選中(頭條默認選中)if (i == 0) {[self titleClick:titleBtn];}//把標題按鈕保存到對應(yīng)的數(shù)組中 [self.titleBtns addObject:titleBtn];[self.titleScrollView addSubview:titleBtn];}//設(shè)置標題滾動范圍self.titleScrollView.contentSize = CGSizeMake(count * btnW, 0);self.titleScrollView.showsHorizontalScrollIndicator = NO;//6.設(shè)置內(nèi)容的滾動范圍self.contentScrollView.contentSize = CGSizeMake(count * ScreenW, 0);//bug:代碼跟我的一樣，但是標題顯示不出來//bug: 內(nèi)容往下移動，莫名其妙//FIXME:9.選中標題居中處理->選中標題//10.標題文字縮放 }#pragma mark - 選中標題 - (void)selButton:(UIButton*)button {_selectedBtn.transform = CGAffineTransformIdentity;[_selectedBtn setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];[button setTitleColor:[UIColor redColor] forState:UIControlStateNormal];//_selectedBtn = button;//標題居中處理 [self setupTitleCenter:button];//字體縮放: 形變button.transform = CGAffineTransformMakeScale(1.3, 1.3);_selectedBtn = button;[self setupTitleScale]; } #pragma mark - 字體縮放 - (void)setupTitleScale {} #pragma mark - 標題居中處理 - (void)setupTitleCenter:(UIButton*)button {//本質(zhì)：修改titleScrollView的偏移量CGFloat offsetX = button.center.x - ScreenW * 0.5;NSLog(@"offsetX==%f",offsetX);//頭條、熱點(offsetX<0)if (offsetX < 0) {offsetX = 0;}//最大偏移量計算（解決訂閱和科技）CGFloat maxOffsetX = self.titleScrollView.contentSize.width - ScreenW;if (offsetX > maxOffsetX) {offsetX = maxOffsetX;}[self.titleScrollView setContentOffset: CGPointMake(offsetX, 0) animated:YES];//此時有bug:點擊每個按鈕都居中了，例如：頭條、熱點(offsetX<0) }#pragma mark - 添加一個子控制器的View - (void)setupOneViewController:(NSInteger)i {UIViewController * vc = self.childViewControllers[i];//FIXME:防止重復(fù)加載View視圖 // if (vc.viewIfLoaded) { // //iOS 9.0之后 // return; // }//FIXME:通用if (vc.view.superview) {return;}CGFloat x = i * ScreenW;vc.view.frame = CGRectMake(x, 0, ScreenW, self.contentScrollView.bounds.size.height);[self.contentScrollView addSubview:vc.view]; } #pragma mark - 處理標題點擊 - (void)titleClick:(UIButton*)button {//FIXME:8.監(jiān)聽內(nèi)容視圖滾動NSInteger i = button.tag;//1.標題顏色變?yōu)榧t色 [self selButton:button];//2.把對應(yīng)子控制器的View添加上去 [self setupOneViewController:i];//3.滾動到對應(yīng)的位置self.contentScrollView.contentOffset = CGPointMake(i * ScreenW, 0); } #pragma mark - 添加所有子控制器 - (void)setupAllChildViewController {//頭條TopLineViewController * vc = [TopLineViewController new];vc.title = @"頭條";[self addChildViewController:vc];//熱點HotViewController * hotVC = [HotViewController new];hotVC.title = @"熱點";[self addChildViewController:hotVC];//視頻VideoViewController * videoVC = [VideoViewController new];videoVC.title = @"視頻";[self addChildViewController:videoVC];//社會SocietyViewController * societyVC = [SocietyViewController new];societyVC.title = @"社會";[self addChildViewController:societyVC];//訂閱ReaderViewController * readerVC = [ReaderViewController new];readerVC.title = @"訂閱";[self addChildViewController:readerVC];//科技ScienceViewController * scienceVC = [ScienceViewController new];scienceVC.title = @"科技";[self addChildViewController:scienceVC];} #pragma mark - 添加標題滾動視圖 - (void)setupTitleScrollView {// 創(chuàng)建titleScrollViewUIScrollView *titleScrollView = [[UIScrollView alloc] init];//titleScrollView.backgroundColor = [UIColor redColor];CGFloat y = self.navigationController.navigationBarHidden ? 20 : 64;titleScrollView.frame = CGRectMake(0, y, self.view.bounds.size.width, 44);[self.view addSubview:titleScrollView];_titleScrollView = titleScrollView;}#pragma mark - 添加內(nèi)容滾動視圖 - (void)setupContentScrollView {// 創(chuàng)建contentScrollViewUIScrollView *contentScrollView = [[UIScrollView alloc] init];contentScrollView.backgroundColor = [UIColor greenColor];CGFloat y = CGRectGetMaxY(self.titleScrollView.frame);contentScrollView.frame = CGRectMake(0, y, self.view.bounds.size.width, self.view.bounds.size.height - y);[self.view addSubview:contentScrollView];_contentScrollView = contentScrollView;//設(shè)置contentScrollView的屬性// 分頁self.contentScrollView.pagingEnabled = YES;// 彈簧self.contentScrollView.bounces = NO;// 指示器self.contentScrollView.showsHorizontalScrollIndicator = NO;//設(shè)置代理.目的：監(jiān)聽內(nèi)容滾動視圖 什么時候滾動完成self.contentScrollView.delegate = self;} #pragma mark - UIScrollViewDelegate #pragma mark - 滾動完成的時候調(diào)用 -(void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView {//獲取當前的角標NSInteger i = scrollView.contentOffset.x / ScreenW;//偏移量/屏幕寬度//獲取標題按鈕UIButton *titleBtn = self.titleBtns[i];//1.選中標題 [self selButton:titleBtn];//2.把對應(yīng)子控制器的view添加上去 [self setupOneViewController:i];} #pragma mark - 只要一滾動就需要字體漸變 - (void)scrollViewDidScroll:(UIScrollView *)scrollView {//字體縮放 1.縮放比例 2.縮放哪兩個按鈕NSInteger page = scrollView.contentOffset.x / ScreenW;NSLog(@"%ld",page);NSInteger leftI = scrollView.contentOffset.x / ScreenW;NSInteger rightI = leftI + 1;// 獲取左邊的按鈕UIButton * leftBtn = self.titleBtns[leftI];NSInteger count = self.titleBtns.count;// 獲取右邊的按鈕UIButton * rightBtn;if (rightI < count) {rightBtn = self.titleBtns[rightI];}// 0~1 => 1~1.3CGFloat scaleR = scrollView.contentOffset.x / ScreenW;scaleR -= leftI;CGFloat scaleL = 1- scaleR;NSLog(@"%f",scaleR);//縮放按鈕leftBtn.transform = CGAffineTransformMakeScale(scaleL * 0.3+1, scaleL * 0.3+1);rightBtn.transform = CGAffineTransformMakeScale(scaleR * 0.3+1, scaleR * 0.3+1);//FIXME:顏色漸變//黑色變成紅色UIColor * rightColor = [UIColor colorWithRed:scaleR green:0 blue:0 alpha:1];UIColor * leftColor = [UIColor colorWithRed:scaleL green:0 blue:0 alpha:1];[rightBtn setTitleColor:rightColor forState:UIControlStateNormal];[leftBtn setTitleColor:leftColor forState:UIControlStateNormal];} /*顏色：3種顏色通道組成： R:紅 G 綠 B: k藍白色： 1 1 1黑色： 0 0 0紅色： 1 0 0*/

?代碼：(已抽取)

BaseVC:

#import "ViewController.h" #define ScreenW [[UIScreen mainScreen] bounds].size.width #define ScreenH [[UIScreen mainScreen] bounds].size.height @interface ViewController ()<UIScrollViewDelegate> /** 標題按鈕數(shù)組 */ @property (nonatomic, strong) NSMutableArray * titleBtns ; /** 上一次選中的按鈕 */ @property (nonatomic, strong) UIButton * selectedBtn ; @property (nonatomic, weak) UIScrollView *titleScrollView; @property (nonatomic, weak) UIScrollView *contentScrollView; /** 判斷是否初始化 */ @property (nonatomic, assign) BOOL isInitialize; @end@implementation ViewController -(void)viewWillAppear:(BOOL)animated {[super viewWillAppear:animated];if (_isInitialize == NO) {//4.設(shè)置所有的標題 [self setupAllTitles];_isInitialize = YES;} } -(NSMutableArray *)titleBtns {if (!_titleBtns) {_titleBtns = @[].mutableCopy;}return _titleBtns; } - (void)viewDidLoad {[super viewDidLoad];self.navigationItem.title = @"網(wǎng)易新聞";// 1.添加標題滾動視圖 [self setupTitleScrollView];// 2.添加內(nèi)容滾動視圖 [self setupContentScrollView];//5.處理標題的點擊//7.FIXME:scrollView的額外滾動區(qū)域64//iOS 7以后，導(dǎo)航控制器中scrollView頂部會添加64的額外滾動區(qū)域self.automaticallyAdjustsScrollViewInsets = NO; } #pragma mark - 設(shè)置所有的標題 - (void)setupAllTitles {//已經(jīng)把我們想要的內(nèi)容展示上去 -> 展示的效果是否是我們想要的(調(diào)整細節(jié))//1.標題的顏色 為黑色//2.需要讓titleScrollView可以滾動//添加所有標題按鈕NSInteger count = self.childViewControllers.count;CGFloat btnW = 100;CGFloat btnH = self.titleScrollView.bounds.size.height;CGFloat btnX = 0;for (NSInteger i = 0; i<count; i++) {UIButton *titleBtn = [UIButton buttonWithType:UIButtonTypeCustom];titleBtn.tag = i;//設(shè)置標題UIViewController * vc = self.childViewControllers[i];[titleBtn setTitle:vc.title forState:UIControlStateNormal];//設(shè)置FramebtnX = i * btnW;titleBtn.frame = CGRectMake(btnX, 0, btnW, btnH);[titleBtn setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];//監(jiān)聽按鈕點擊 [titleBtn addTarget:self action:@selector(titleClick:) forControlEvents:UIControlEventTouchUpInside];//設(shè)置第一個按鈕默認選中(頭條默認選中)if (i == 0) {[self titleClick:titleBtn];}//把標題按鈕保存到對應(yīng)的數(shù)組中 [self.titleBtns addObject:titleBtn];[self.titleScrollView addSubview:titleBtn];}//設(shè)置標題滾動范圍self.titleScrollView.contentSize = CGSizeMake(count * btnW, 0);self.titleScrollView.showsHorizontalScrollIndicator = NO;//6.設(shè)置內(nèi)容的滾動范圍self.contentScrollView.contentSize = CGSizeMake(count * ScreenW, 0); }#pragma mark - 選中標題 - (void)selButton:(UIButton*)button {_selectedBtn.transform = CGAffineTransformIdentity;[_selectedBtn setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];[button setTitleColor:[UIColor redColor] forState:UIControlStateNormal];//_selectedBtn = button;//標題居中處理 [self setupTitleCenter:button];//字體縮放: 形變button.transform = CGAffineTransformMakeScale(1.3, 1.3);_selectedBtn = button;[self setupTitleScale]; } #pragma mark - 字體縮放 - (void)setupTitleScale {} #pragma mark - 標題居中處理 - (void)setupTitleCenter:(UIButton*)button {//本質(zhì)：修改titleScrollView的偏移量CGFloat offsetX = button.center.x - ScreenW * 0.5;NSLog(@"offsetX==%f",offsetX);//頭條、熱點(offsetX<0)if (offsetX < 0) {offsetX = 0;}//最大偏移量計算（解決訂閱和科技）CGFloat maxOffsetX = self.titleScrollView.contentSize.width - ScreenW;if (offsetX > maxOffsetX) {offsetX = maxOffsetX;}[self.titleScrollView setContentOffset: CGPointMake(offsetX, 0) animated:YES];//此時有bug:點擊每個按鈕都居中了，例如：頭條、熱點(offsetX<0) }#pragma mark - 添加一個子控制器的View - (void)setupOneViewController:(NSInteger)i {UIViewController * vc = self.childViewControllers[i];//FIXME:防止重復(fù)加載View視圖 // if (vc.viewIfLoaded) { // //iOS 9.0之后 // return; // }//FIXME:通用if (vc.view.superview) {return;}CGFloat x = i * ScreenW;vc.view.frame = CGRectMake(x, 0, ScreenW, self.contentScrollView.bounds.size.height);[self.contentScrollView addSubview:vc.view]; } #pragma mark - 處理標題點擊 - (void)titleClick:(UIButton*)button {//FIXME:8.監(jiān)聽內(nèi)容視圖滾動NSInteger i = button.tag;//1.標題顏色變?yōu)榧t色 [self selButton:button];//2.把對應(yīng)子控制器的View添加上去 [self setupOneViewController:i];//3.滾動到對應(yīng)的位置self.contentScrollView.contentOffset = CGPointMake(i * ScreenW, 0); } #pragma mark - 添加標題滾動視圖 - (void)setupTitleScrollView {// 創(chuàng)建titleScrollViewUIScrollView *titleScrollView = [[UIScrollView alloc] init];//titleScrollView.backgroundColor = [UIColor redColor];CGFloat y = self.navigationController.navigationBarHidden ? 20 : 64;titleScrollView.frame = CGRectMake(0, y, self.view.bounds.size.width, 44);[self.view addSubview:titleScrollView];_titleScrollView = titleScrollView;}#pragma mark - 添加內(nèi)容滾動視圖 - (void)setupContentScrollView {// 創(chuàng)建contentScrollViewUIScrollView *contentScrollView = [[UIScrollView alloc] init];contentScrollView.backgroundColor = [UIColor greenColor];CGFloat y = CGRectGetMaxY(self.titleScrollView.frame);contentScrollView.frame = CGRectMake(0, y, self.view.bounds.size.width, self.view.bounds.size.height - y);[self.view addSubview:contentScrollView];_contentScrollView = contentScrollView;//設(shè)置contentScrollView的屬性// 分頁self.contentScrollView.pagingEnabled = YES;// 彈簧self.contentScrollView.bounces = NO;// 指示器self.contentScrollView.showsHorizontalScrollIndicator = NO;//設(shè)置代理.目的：監(jiān)聽內(nèi)容滾動視圖 什么時候滾動完成self.contentScrollView.delegate = self;} #pragma mark - UIScrollViewDelegate #pragma mark - 滾動完成的時候調(diào)用 -(void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView {//獲取當前的角標NSInteger i = scrollView.contentOffset.x / ScreenW;//偏移量/屏幕寬度//獲取標題按鈕UIButton *titleBtn = self.titleBtns[i];//1.選中標題 [self selButton:titleBtn];//2.把對應(yīng)子控制器的view添加上去 [self setupOneViewController:i];} #pragma mark - 只要一滾動就需要字體漸變 - (void)scrollViewDidScroll:(UIScrollView *)scrollView {//字體縮放 1.縮放比例 2.縮放哪兩個按鈕NSInteger page = scrollView.contentOffset.x / ScreenW;NSLog(@"%ld",page);NSInteger leftI = scrollView.contentOffset.x / ScreenW;NSInteger rightI = leftI + 1;// 獲取左邊的按鈕UIButton * leftBtn = self.titleBtns[leftI];NSInteger count = self.titleBtns.count;// 獲取右邊的按鈕UIButton * rightBtn;if (rightI < count) {rightBtn = self.titleBtns[rightI];}// 0~1 => 1~1.3CGFloat scaleR = scrollView.contentOffset.x / ScreenW;scaleR -= leftI;CGFloat scaleL = 1- scaleR;NSLog(@"%f",scaleR);//縮放按鈕leftBtn.transform = CGAffineTransformMakeScale(scaleL * 0.3+1, scaleL * 0.3+1);rightBtn.transform = CGAffineTransformMakeScale(scaleR * 0.3+1, scaleR * 0.3+1);//FIXME:顏色漸變//黑色變成紅色UIColor * rightColor = [UIColor colorWithRed:scaleR green:0 blue:0 alpha:1];UIColor * leftColor = [UIColor colorWithRed:scaleL green:0 blue:0 alpha:1];[rightBtn setTitleColor:rightColor forState:UIControlStateNormal];[leftBtn setTitleColor:leftColor forState:UIControlStateNormal];}

網(wǎng)易VC

#import <UIKit/UIKit.h> #import "ViewController.h" NS_ASSUME_NONNULL_BEGIN @interface HKWYViewController : ViewController @end NS_ASSUME_NONNULL_END#import "HKWYViewController.h" #import "TopLineViewController.h" #import "HotViewController.h" #import "VideoViewController.h" #import "ScienceViewController.h" #import "SocietyViewController.h" #import "ReaderViewController.h" @interface HKWYViewController ()@end@implementation HKWYViewController- (void)viewDidLoad {[super viewDidLoad];//3.添加所有的子控制器 [self setupAllChildViewController];} #pragma mark - 添加所有子控制器 - (void)setupAllChildViewController {//頭條TopLineViewController * vc = [TopLineViewController new];vc.title = @"頭條";[self addChildViewController:vc];//熱點HotViewController * hotVC = [HotViewController new];hotVC.title = @"熱點";[self addChildViewController:hotVC];//視頻VideoViewController * videoVC = [VideoViewController new];videoVC.title = @"視頻";[self addChildViewController:videoVC];//社會SocietyViewController * societyVC = [SocietyViewController new];societyVC.title = @"社會";[self addChildViewController:societyVC];//訂閱ReaderViewController * readerVC = [ReaderViewController new];readerVC.title = @"訂閱";[self addChildViewController:readerVC];//科技ScienceViewController * scienceVC = [ScienceViewController new];scienceVC.title = @"科技";[self addChildViewController:scienceVC];}

?

轉(zhuǎn)載于:https://www.cnblogs.com/StevenHuSir/p/10037622.html

總結(jié)

以上是生活随笔為你收集整理的实战项目-网易的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。