仿网易新闻框架实现

基于OC简要模仿网易新闻头部标题栏，实现点击对应标题时相关性标题居中功能。供小伙伴学习参考，高手忽略。
　　详细代码参考demo。
　　实现效果如下图：

NeteaseNews.gif

　 　1.首先布局整个界面：①配置导航控制器相关；②创建标题栏的子标题对应的子控制器；
　　2.具体标题栏的逻辑代码实现过程如下：
①引入对应的头文件，定义必要的属性。

#import "ViewController.h"
#import "MEHotViewController.h"
#import "MEVideoViewController.h"
#import "METoplineViewController.h"
#import "MEScoietyViewController.h"
#import "MEScienceViewController.h"
#import "MEReaderViewController.h"
#define MEScreenW [UIScreen mainScreen].bounds.size.width
#define MEScreenH [UIScreen mainScreen].bounds.size.height
@interface ViewController ()
@property (nonatomic, strong) NSMutableArray *buttons;
@property (nonatomic, weak) UIButton *selectButton;
@property (nonatomic, weak) UIScrollView *titleScrollView;
@property (nonatomic, weak) UIScrollView *contentScrollView;
@end```
②逻辑代码过程实现：

@implementation ViewController

• (NSMutableArray *)buttons
  {
  if (_buttons == nil) {
  _buttons = [NSMutableArray array];
  }
  return _buttons;
  }

• (void)viewDidLoad {
  [super viewDidLoad];
  [self setupTitleScrollView];
  [self setupContentScrollView];
  [self setupAllChildViewController];
  [self setupAllTitle];
  self.automaticallyAdjustsScrollViewInsets = NO;
  }
  // 选中按钮

• (void)selButton:(UIButton *)button
  {
  // 让按钮标题颜色变成红色
  _selectButton.transform = CGAffineTransformIdentity;
  [_selectButton setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
  [button setTitleColor:[UIColor redColor] forState:UIControlStateNormal];
  // 按钮居中显示:本质修改titleScrollView的contentOffsetX
  CGFloat offsetX = button.center.x - MEScreenW * 0.5;

  if (offsetX < 0) {
  offsetX = 0;
  }
  CGFloat maxOffsetX = self.titleScrollView.contentSize.width - MEScreenW;
  // 处理最大偏移量
  if (offsetX > maxOffsetX) {
  offsetX = maxOffsetX;
  }
  [self.titleScrollView setContentOffset:CGPointMake(offsetX, 0) animated:YES];
  // 设置标题缩放
  button.transform = CGAffineTransformMakeScale(1.3, 1.3);
  _selectButton = button;
  }

pragma mark - UIScrollViewDelegate

// 只要滚动scrollView就会调用

• (void)scrollViewDidScroll:(UIScrollView *)scrollView
  {
  NSInteger leftI = scrollView.contentOffset.x / MEScreenW;
  NSInteger rightI = leftI + 1;
  // 缩放按钮
  UIButton *leftButton = self.buttons[leftI];
  UIButton *rightButton = nil;
  NSInteger count = self.buttons.count;
  if (rightI < count) {
  rightButton = self.buttons[rightI];
  }
  // 缩放比例,根据滚动计算
  CGFloat scaleR = scrollView.contentOffset.x / MEScreenW - leftI;
  CGFloat scaleL = 1 - scaleR;
  // 0 ~ 1 => 1 ~ 1.3
  leftButton.transform = CGAffineTransformMakeScale(scaleL * 0.3 + 1, scaleL * 0.3 + 1);
  rightButton.transform = CGAffineTransformMakeScale(scaleR * 0.3 + 1, scaleR * 0.3 + 1);

  // 做颜色渐变 黑色 变成 红色
  UIColor *colorR = [UIColor colorWithRed:scaleR green:0 blue:0 alpha:1];
  UIColor *colorL = [UIColor colorWithRed:scaleL green:0 blue:0 alpha:1];
  [leftButton setTitleColor:colorL forState:UIControlStateNormal];
  [rightButton setTitleColor:colorR forState:UIControlStateNormal];
  }

// 滚动完成的时候调用

• (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView
  {
  NSInteger i = scrollView.contentOffset.x / MEScreenW;
  UIButton *btn = self.buttons[i];
  [self selButton:btn];
  [self setupOneChildViewController:i];
  }

// 切换控制器的view

• (void)setupOneChildViewController:(NSInteger)i{
  UIViewController *vc = self.childViewControllers[i];
  if (vc.view.superview == nil) {
  CGFloat x = i * [UIScreen mainScreen].bounds.size.width;
  vc.view.frame = CGRectMake(x, 0, MEScreenW, self.contentScrollView.frame.size.height);
  [self.contentScrollView addSubview:vc.view];
  }

}

// 点击标题就会调用

• (void)titleClick:(UIButton *)button
  {
  NSInteger i = button.tag;
  [self selButton:button];
  [self setupOneChildViewController:i];
  CGFloat x = i * [UIScreen mainScreen].bounds.size.width;
  self.contentScrollView.contentOffset = CGPointMake(x, 0);
  }
  // 设置标题

• (void)setupAllTitle
  {
  NSInteger count = self.childViewControllers.count;
  CGFloat x = 0;
  CGFloat w = 100;
  CGFloat h = 35;

  for (int i = 0; i < count; i++) {
  UIButton *titleButton = [UIButton buttonWithType:UIButtonTypeCustom];
  titleButton.tag = i;
  UIViewController *vc = self.childViewControllers[i];
  [titleButton setTitle:vc.title forState:UIControlStateNormal];
  [titleButton setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
  x = i * w;
  titleButton.frame = CGRectMake(x, 0, w, h);
  // 监听按钮标题
  [titleButton addTarget:self action:@selector(titleClick:) forControlEvents:UIControlEventTouchUpInside];
  [self.titleScrollView addSubview:titleButton];
  [self.buttons addObject:titleButton];
  if (i == 0) {
  [self titleClick:titleButton];
  }
  }
  self.titleScrollView.contentSize = CGSizeMake(count * w, 0);
  self.titleScrollView.showsHorizontalScrollIndicator = NO;
  // 设置内容滚动视图滚动范围
  self.contentScrollView.contentSize = CGSizeMake(count * MEScreenW, 0);
  self.contentScrollView.bounces = NO;
  self.contentScrollView.pagingEnabled = YES;
  self.contentScrollView.delegate = self;
  }

//添加所有的子控制器

• (void)setupAllChildViewController
  {
  // 头条
  METoplineViewController *t = [[METoplineViewController alloc] init];
  t.title = @"头条";
  [self addChildViewController:t];
  // 热点
  MEHotViewController *h = [[MEHotViewController alloc] init];
  h.title = @"热点";
  [self addChildViewController:h];
  // 视频
  MEVideoViewController *v = [[MEVideoViewController alloc] init];
  v.title = @"视频";
  [self addChildViewController:v];
  // 社会
  MEScoietyViewController *so = [[MEScoietyViewController alloc] init];
  so.title = @"社会";
  [self addChildViewController:so];
  // 订阅
  MEReaderViewController *r = [[MEReaderViewController alloc] init];
  r.title = @"订阅";
  [self addChildViewController:r];
  // 科技
  MEScienceViewController *s = [[MEScienceViewController alloc] init];
  s.title = @"科技";
  [self addChildViewController:s];
  }
  // 添加顶部的标题滚动视图
• (void)setupTitleScrollView
  {
  UIScrollView *titleScrollView = [[UIScrollView alloc] init];
  CGFloat y = 64;
  CGFloat w = self.view.bounds.size.width;
  CGFloat h = 35;
  titleScrollView.frame = CGRectMake(0, y, w, h);
  _titleScrollView = titleScrollView;
  [self.view addSubview:titleScrollView];
  }
  //添加底部的内容滚动视图
• (void)setupContentScrollView
  {
  UIScrollView *contentScrollView = [[UIScrollView alloc] init];
  CGFloat y = CGRectGetMaxY(_titleScrollView.frame);
  CGFloat w = self.view.bounds.size.width;
  CGFloat h = self.view.bounds.size.height - y;
  _contentScrollView = contentScrollView;
  contentScrollView.frame = CGRectMake(0, y, w, h);
  contentScrollView.backgroundColor = [UIColor purpleColor];
  [self.view addSubview:contentScrollView];
  }

@end