山寨今日头条的标题title效果

山寨今日头条的标题title效果

效果：

源码：

//
//  ViewController.m
//  今日头条
//
//  Created by YouXianMing on 14/11/26.
//  Copyright (c) 2014年 YouXianMing. All rights reserved.
//

#import "ViewController.h"

@interface ViewController ()<UIScrollViewDelegate>
@property (nonatomic, strong) UIScrollView  *scrollView;
@property (nonatomic, strong) UIView        *alphaView;
@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];

    [self.view addSubview:[self theSubView]];
    [self.view addSubview:[self theFrontView]];

    self.scrollView               = [[UIScrollView alloc] initWithFrame:self.view.bounds];
    self.scrollView.delegate      = self;
    self.scrollView.pagingEnabled = YES;
    self.scrollView.contentSize   = CGSizeMake(self.scrollView.bounds.size.width * 2,
                                               self.scrollView.bounds.size.height);
    [self.view addSubview:self.scrollView];
}

- (void)scrollViewDidScroll:(UIScrollView *)scrollView {
    CGRect rect          = self.alphaView.frame;
    rect.origin.x        = scrollView.contentOffset.x / 2.f;
    self.alphaView.frame = rect;
}

- (UIView *)theSubView {
    // 添加前景色
    UIView *backView         = [[UIView alloc] initWithFrame:CGRectMake(0, 50, 320, 70)];
    backView.backgroundColor = [UIColor colorWithRed:0.922 green:0.922 blue:0.922 alpha:1];
    [self.view addSubview:backView];

    // 标题1
    UILabel *title1      = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, 160, 70)];
    title1.text          = @"今日头条";
    title1.textAlignment = NSTextAlignmentCenter;
    title1.font          = [UIFont systemFontOfSize:20.f];
    title1.textColor     = [UIColor colorWithRed:0.443 green:0.439 blue:0.439 alpha:1];
    [backView addSubview:title1];

    // 标题2
    UILabel *title2      = [[UILabel alloc] initWithFrame:CGRectMake(160, 0, 160, 70)];
    title2.text          = @"YouXianMing";
    title2.textAlignment = NSTextAlignmentCenter;
    title2.font          = [UIFont systemFontOfSize:20.f];
    title2.textColor     = [UIColor colorWithRed:0.443 green:0.439 blue:0.439 alpha:1];
    [backView addSubview:title2];

    return backView;
}

- (UIView *)theFrontView {
    // 添加前景色
    UIView *backView         = [[UIView alloc] initWithFrame:CGRectMake(0, 50, 320, 70)];
    backView.backgroundColor = [UIColor colorWithRed:0.808 green:0.208 blue:0.212 alpha:1];
    [self.view addSubview:backView];

    // 标题1
    UILabel *title1      = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, 160, 70)];
    title1.text          = @"今日头条";
    title1.textAlignment = NSTextAlignmentCenter;
    title1.font          = [UIFont systemFontOfSize:20.f];
    title1.textColor     = [UIColor colorWithRed:0.945 green:0.827 blue:0.827 alpha:1];
    [backView addSubview:title1];

    // 标题2
    UILabel *title2      = [[UILabel alloc] initWithFrame:CGRectMake(160, 0, 160, 70)];
    title2.text          = @"YouXianMing";
    title2.textAlignment = NSTextAlignmentCenter;
    title2.font          = [UIFont systemFontOfSize:20.f];
    title2.textColor     = [UIColor colorWithRed:0.945 green:0.827 blue:0.827 alpha:1];
    [backView addSubview:title2];

    self.alphaView                 = [[UIView alloc] initWithFrame:CGRectMake(0, 10, 160, 50)];
    self.alphaView.backgroundColor = [UIColor blackColor];
    self.alphaView.layer.cornerRadius = 15.f;
    backView.maskView              = self.alphaView;

    return backView;
}

@end

图片：

一切尽在不言中:)