iOS 仿网易新闻结构

1.首页效果

2.滑动过程中颜色渐变，文字缩放

3.滑动结束边缘标题自动适当居中

实现代码：

//
//  ViewController.m
//  网易新闻
//
//  Created by llkj on 2017/11/20.
//  Copyright © 2017年 LayneCheung. All rights reserved.
//

#import "ViewController.h"
#import "TopLineViewController.h"
#import "HotViewController.h"
#import "VideoViewController.h"
#import "SocietyViewController.h"
#import "TechViewController.h"
#import "ReadViewController.h"

#define ScreenW [UIScreen mainScreen].bounds.size.width
#define ScreenH [UIScreen mainScreen].bounds.size.height

@interface ViewController ()<UIScrollViewDelegate>
/** 标题scrollView */
@property (nonatomic, weak) UIScrollView *titleScrollView;
/** 内容scrollView */
@property (nonatomic, weak) UIScrollView *contentScrollView;
/** 标题数组 */
@property (nonatomic, strong) NSArray *titles;
/** 上一次点击选中的按钮 */
@property (nonatomic, weak) UIButton *previousClickButton;
/** 保存所有标题按钮的数组 */
@property (nonatomic, strong) NSMutableArray *titleButtons;
@end

@implementation ViewController

#pragma mark - 懒加载
- (NSMutableArray *)titleButtons {
    if (_titleButtons == nil) {
        _titleButtons = [NSMutableArray array];
    }
    return _titleButtons;
}
- (NSArray *)titles {
    if (_titles == nil) {
        _titles = @[@"头条", @"热点", @"视频", @"社会", @"订阅", @"科技",];
    }
    return _titles;
}

- (void)viewDidLoad {
    [super viewDidLoad];

    self.navigationItem.title = @"网易新闻";
    //1.添加标题滚动视图
    [self setupTitleScrollView];

    //2.添加内容滚动视图
    [self setupContentScrollView];

    //3.添加所有子控制器
    [self setupAllChildVC];

    //4.设置所有标题
    [self setupAllTitle];


}

#pragma mark - 
//滚动完成调用
- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView {
    //获取当前角标
    NSInteger i = scrollView.contentOffset.x / scrollView.frame.size.width;
    //获取标题按钮
    UIButton *titleButton = self.titleButtons[i];

    //1.选中标题
    [self selectedButton:titleButton];

    //2.把对应子控制器的View添加上去
    [self addOneViewController:i];
}
- (void)scrollViewDidScroll:(UIScrollView *)scrollView {
    //字体缩放

    //1.获得左边按钮
    NSInteger leftI = scrollView.contentOffset.x / ScreenW;;
    UIButton *leftButton = self.titleButtons[leftI];
    //2.获得右边按钮
    NSInteger rightI = leftI + 1;
    UIButton *rightButton;
    if (rightI < self.titleButtons.count) {
        rightButton = self.titleButtons[rightI];
    }
    // 0 ~ 1 => 1 ~ 1.2
    CGFloat scaleR = scrollView.contentOffset.x / ScreenW;
    scaleR -= leftI;

    CGFloat scaleL = 1 - scaleR;
    //3.缩放按钮
    leftButton.transform = CGAffineTransformMakeScale(scaleL * 0.2 + 1, scaleL * 0.2 + 1);
    rightButton.transform = CGAffineTransformMakeScale(scaleR * 0.2 + 1, scaleR * 0.2 + 1);
    //4.颜色渐变
    UIColor *rightColor = [UIColor colorWithRed:scaleR green:0 blue:0 alpha:1];
    UIColor *leftColor = [UIColor colorWithRed:scaleL green:0 blue:0 alpha:1];
    [rightButton setTitleColor:rightColor forState:UIControlStateNormal];
    [leftButton setTitleColor:leftColor forState:UIControlStateNormal];
}
#pragma mark - 设置所有标题
- (void)setupAllTitle {

    // 添加所有标题按钮
    CGFloat btnX = 0;
    CGFloat btnW = 100;
    CGFloat btnH = self.titleScrollView.frame.size.height;
    for (NSInteger i = 0; i < self.titles.count; i++) {
        UIButton *titleButton = [UIButton buttonWithType:UIButtonTypeCustom];
        titleButton.tag = i;
        btnX = i * btnW;
        titleButton.frame = CGRectMake(btnX, 0, btnW, btnH);
        [titleButton setTitle:self.titles[i] forState:UIControlStateNormal];
        [titleButton setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
        [titleButton addTarget:self action:@selector(titleButtonClick:) forControlEvents:UIControlEventTouchUpInside];
        [self .titleScrollView addSubview:titleButton];
        //把按钮保存在titleButtons数组中
        [self.titleButtons addObject:titleButton];
        if (i == 0) {//默认选中第0个标题
            [self titleButtonClick:titleButton];
        }
    }
    self.titleScrollView.contentSize = CGSizeMake(self.titles.count * btnW, 0);
    self.contentScrollView.contentSize = CGSizeMake(self.titles.count * ScreenW, 0);
}
#pragma mark - 选中按钮
- (void)selectedButton:(UIButton *)button {
    self.previousClickButton.transform = CGAffineTransformIdentity;

    [self.previousClickButton setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
    [button setTitleColor:[UIColor redColor] forState:UIControlStateNormal];
    //标题居中
    [self setupTitleCenter:button];
    //字体缩放
    button.transform = CGAffineTransformMakeScale(1.2, 1.2);

    self.previousClickButton = button;
}
#pragma mark - 标题居中
- (void)setupTitleCenter:(UIButton *)button {
    //修改titleScrollView的偏移量
    CGFloat offSetX = button.center.x - ScreenW * 0.5;
    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 - 加载对应子控制器View
- (void)addOneViewController:(NSInteger)i {
    UIViewController *childVC = self.childViewControllers[i];
    //如果View已经被加载直接返回
//    if (childVC.view.superview) return;
    if (childVC.viewIfLoaded) return; //ios 9.0之后可以使用
    CGFloat childViewW = self.contentScrollView.bounds.size.width;
    CGFloat childViewH = self.contentScrollView.bounds.size.height;;
    CGFloat childViewX = i * childViewW;
    childVC.view.frame = CGRectMake(childViewX, 0, childViewW, childViewH);
    [self.contentScrollView addSubview:childVC.view];
}
#pragma mark - 标题点击
- (void)titleButtonClick:(UIButton *)titleButton {
    // 1.标题颜色变红
    [self selectedButton:titleButton];
    // 2.加载对应子控制器View
    [self addOneViewController:titleButton.tag];
    // 3.内容滚动视图滚动到对应的位置
    self.contentScrollView.contentOffset = CGPointMake(titleButton.tag * self.contentScrollView.bounds.size.width, 0);
}
#pragma mark - 添加所有子控制器
- (void)setupAllChildVC {
    //注意:控制器加载的顺序要和titles中的一一对应，顺序和数量自己也可以调整
    // 头条
    [self addChildViewController:[[TopLineViewController alloc] init]];
    // 热点
    [self addChildViewController:[[HotViewController alloc] init]];
    // 视频
    [self addChildViewController:[[VideoViewController alloc] init]];
    // 社会
    [self addChildViewController:[[SocietyViewController alloc] init]];
    // 订阅
    [self addChildViewController:[[ReadViewController alloc] init]];
    // 科技
    [self addChildViewController:[[TechViewController alloc] init]];
}
#pragma mark - 添加标题滚动视图
- (void)setupTitleScrollView {
    //创建titleScrollView
    UIScrollView *titleScrollView = [[UIScrollView alloc] init];
    CGFloat y = self.navigationController.navigationBarHidden ? 20 : 64;
    titleScrollView.frame = CGRectMake(0, y, ScreenW, 44);
    titleScrollView.showsHorizontalScrollIndicator = NO;
    [self.view addSubview:titleScrollView];
    _titleScrollView = titleScrollView;
}
#pragma mark - 添加内容滚动视图
- (void)setupContentScrollView {
    //创建contentScrollView
    UIScrollView *contentScrollView = [[UIScrollView alloc] init];
    CGFloat y = CGRectGetMaxY(self.titleScrollView.frame);
    contentScrollView.frame = CGRectMake(0, y, ScreenW, ScreenH - y);
    contentScrollView.pagingEnabled = YES;
    contentScrollView.showsHorizontalScrollIndicator = NO;
    contentScrollView.bounces = NO;
    contentScrollView.delegate = self;
    [self.view addSubview:contentScrollView];
    _contentScrollView = contentScrollView;
}
- (void)didReceiveMemoryWarning {
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.
}
@end