创建类似于网易新闻的头部

  • 网易新闻的头部点击切换不同界面主要运用到了iOS中父子控制器知识点。
//ViewController.m //01-MG新闻 // //Created by ming on 15/12/13. //Copyright ? 2015年 ming. All rights reserved.#import "ViewController.h" #import "HotViewController.h" #import "ReaderVeiwController.h" #import "ScienceVeiwController.h" #import "SocietyVeiwController.h" #import "TopVeiwController.h" #import "VideoVeiwController.h"#define screenW [UIScreen mainScreen].bounds.size.width #define screenH [UIScreen mainScreen].bounds.size.height@interface ViewController () /** titleScrollView */ @property (nonatomic,weak) UIScrollView *titleScrollView; /** contentScrollView */ @property (nonatomic,weak) UIScrollView *contentScrollView; /** 按钮数组 */ @property (nonatomic,strong) NSMutableArray *titleButtons; /** 选中按钮 */ @property (nonatomic,weak) UIButton *seltitleButton; @end#pragma mark ========= 常量 ============ CGFloat const LYMNavHeight = 64; CGFloat const titleScrollViewH = 44; static CGFloat const maxTitleScale = 1.35; @implementation ViewController #pragma mark ========= 懒加载 ============ - (NSMutableArray *)titleButtons{ if (!_titleButtons) { _titleButtons = [NSMutableArray array]; } return _titleButtons; }- (void)viewDidLoad { [super viewDidLoad]; self.title = @"MG新闻"; // 不需要额外的滚动区域 self.automaticallyAdjustsScrollViewInsets = NO; // 1.初始化标题TitleScrollView [self setUPTittelscrollView]; // 2.初始化标题ContentlscrollView [self setUPContentlscrollView]; // 3.初始化所有的子控制器 [self setUPAllChildViewController]; // 4.添加所有标题按钮 [self setupAllTitleButton]; }#pragma mark ========= 初始化标题TitleScrollView ============ // 1.初始化标题TitleScrollView - (void)setUPTittelscrollView{ UIScrollView *titleScrollView = [[UIScrollView alloc] init]; CGRect frame = titleScrollView.frame; frame.origin.y = LYMNavHeight; frame.size.width = screenW; frame.size.height = titleScrollViewH; titleScrollView.frame = frame; titleScrollView.showsHorizontalScrollIndicator = NO; [self.view addSubview:titleScrollView]; self.titleScrollView = titleScrollView; titleScrollView.backgroundColor = [UIColor grayColor]; }// 添加所有标题按钮 - (void)setupAllTitleButton{ CGFloat buttonW = 100; CGFloat buttonH = titleScrollViewH; CGFloat buttonX = 0; CGFloat buttonY = 0; NSInteger count = self.childViewControllers.count; for (int i = 0; i 红色 R:0 -> 1 // 红色 -> 黑色 R:1 -> 0 UIColor *leftColor = [UIColor colorWithRed:scaleL green:0 blue:0 alpha:1]; UIColor *rightColor = [UIColor colorWithRed:0 green:scaleR blue:0 alpha:1]; // 3.1 让左边按钮的颜色 [leftButton setTitleColor:leftColor forState:UIControlStateNormal]; // 3.2 让左边按钮的颜色 [rightButton setTitleColor:rightColor forState:UIControlStateNormal]; }#pragma mark ========= 让选中按钮居中显示的方法 ============ - (void)setselButtonOnCenter:(UIButton *)btn{ CGFloat offsetX = btn.center.x - 0.5 * screenW; 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]; }#pragma mark ========= 初始化所有的子控制器 ============ // 3.初始化所有的子控制器 - (void)setUPAllChildViewController{ // 头条 TopVeiwController *toptVC = [[TopVeiwController alloc] init]; toptVC.title = @"头条"; [self addChildViewController:toptVC]; // 热点 HotViewController *hotVC = [[HotViewController alloc] init]; hotVC.title = @"热点"; [self addChildViewController:hotVC]; // 视频 VideoVeiwController *videoVC = [[VideoVeiwController alloc] init]; videoVC.title = @"视频"; [self addChildViewController:videoVC]; // 社会 SocietyVeiwController *scoietyVC = [[SocietyVeiwController alloc] init]; scoietyVC.title = @"社会"; [self addChildViewController:scoietyVC]; // 订阅 ReaderVeiwController *readerVC = [[ReaderVeiwController alloc] init]; readerVC.title = @"订阅"; [self addChildViewController:readerVC]; // 科技 ScienceVeiwController *scienceVC = [[ScienceVeiwController alloc] init]; scienceVC.title = @"科技"; [self addChildViewController:scienceVC]; }@end```- ###效果:由于制作GIF比较麻烦,于是网上找了一个类似的效果图在(注:本文代码默认选中的titleButton会居中显示),如下: ![类似效果.gif](http://upload-images.jianshu.io/upload_images/1429890-fe2ac1ac0c73154f.gif?imageMogr2/auto-orient/strip)

    推荐阅读