用标签页TitleSwitch切换不通的控制器

用标签页TitleSwitch切换不通的控制器

教程效果:

项目开发中效果:

各种源码:

TitleSwitch.h 与 TitleSwitch.m (这个是修改过的升级版本)

//
//  TitleSwitch.h
//  TitleSwitch
//
//  Created by YouXianMing on 14/11/4.
//  Copyright (c) 2014年 YouXianMing. All rights reserved.
//

#import <UIKit/UIKit.h>

/**
 * 使用细节
 *
 
 TitleSwitch *titleSwitch              = [[TitleSwitch alloc] initWithFrame:CGRectMake(0, 100, 320, 40)];
 titleSwitch.titles                    = @[@"YouXianMing", @"NoZuoNoDie", @"BlueShit"];
 titleSwitch.titleFont                 = [UIFont systemFontOfSize:15.f];
 titleSwitch.lineWidth                 = 1.f;
 titleSwitch.canTouchOnlyButtonOneTime = YES;
 titleSwitch.delegate                  = self;
 [titleSwitch createTitleSwitchView];
 
 [self.view addSubview:titleSwitch];
 
 *
 *
 */

@protocol TitleSwitchDelegate <NSObject>
@optional
- (void)willSelectIndex:(NSInteger)index;
- (void)didSelectIndex:(NSInteger)index;
@end

@interface TitleSwitch : UIView

/**
 *  协议
 */
@property (nonatomic, assign) id<TitleSwitchDelegate> delegate;

/**
 *  作为按钮的标题
 */
@property (nonatomic, strong) NSArray  *titles;

/**
 *  线的宽度
 */
@property (nonatomic, assign) CGFloat   lineWidth;

/**
 *  线的颜色
 */
@property (nonatomic, strong) UIColor  *lineColor;

/**
 *  标题字体
 */
@property (nonatomic, strong) UIFont   *titleFont;

/**
 *  普通标题颜色
 */
@property (nonatomic, strong) UIColor  *normalTitleColor;

/**
 *  选中标题的颜色
 */
@property (nonatomic, strong) UIColor  *selectedTitleColor;

/**
 *  一次只能按一个按钮触发动画效果
 */
@property (nonatomic, assign) BOOL      canTouchOnlyButtonOneTime;

/**
 *  开启按钮点击时高亮颜色的效果 & 高亮颜色
 */
@property (nonatomic, assign) BOOL      enableButtonTitleHighlighted;
@property (nonatomic, strong) UIColor  *highlightedTitleColor;



/**
 *  小横线条的X方向的位移值(可以设置动画)
 */
@property (nonatomic, assign) CGFloat   linePositionX;
/**
 *  根据linePositionX重设标题颜色
 */
- (void)resetTilte;


/**
 *  创建TitleSwitch的view出来
 */
- (void)createTitleSwitchView;

@end

//
//  TitleSwitch.m
//  TitleSwitch
//
//  Created by YouXianMing on 14/11/4.
//  Copyright (c) 2014年 YouXianMing. All rights reserved.
//

#import "TitleSwitch.h"

typedef enum : NSUInteger {
    NORMAL_BUTTON = 0x11,
    LINE_VIEW     = 0x1122,
} ENUM_VIEWTAG;

@implementation TitleSwitch

- (void)createTitleSwitchView {
    
    // 如果没有title,则直接返回
    if (_titles.count == 0) {
        return;
    }
    
    // 获取尺寸
    CGFloat frameWidth  = self.bounds.size.width;
    CGFloat frameHeight = self.bounds.size.height;
    
    // 计算按钮的宽度&高度
    CGFloat buttonWidth      = frameWidth / _titles.count;
    CGFloat buttonHeight     = 0;
    CGFloat defaultLineWidth = 2.f;
    if (_lineWidth == 0) {
        buttonHeight = frameHeight - defaultLineWidth; // 默认线条占用一个像素
    } else {
        buttonHeight = frameHeight - _lineWidth;
    }
    
    // 初始化所有按钮
    for (int i = 0; i < _titles.count; i++) {
        UIButton *button = [[UIButton alloc] initWithFrame:CGRectMake(buttonWidth * i,
                                                                      0,
                                                                      buttonWidth,
                                                                      buttonHeight)];
        button.tag       = NORMAL_BUTTON + i;
        [self addSubview:button];
        
        [button setTitle:_titles[i] forState:UIControlStateNormal];
        
        // 普通颜色
        if (i == 0) {
            [self selectButtonStyle:button];
        } else {
            [self normalButtonStyle:button];
        }
        
        // 高亮颜色
        if (_enableButtonTitleHighlighted == YES && _highlightedTitleColor) {
            [button setTitleColor:_highlightedTitleColor forState:UIControlStateHighlighted];
        }

        // 添加事件
        [button addTarget:self action:@selector(buttonsEvent:) forControlEvents:UIControlEventTouchUpInside];
        
        // 设置字体
        if (_titleFont) {
            button.titleLabel.font = _titleFont;
        }
    }
    
    // 初始化横线view
    UIView *lineView = [[UIView alloc] initWithFrame:CGRectMake(0, buttonHeight + 1, buttonWidth,
                                                                (_lineWidth == 0 ? defaultLineWidth : _lineWidth))];
    lineView.tag     = LINE_VIEW;
    [self addSubview:lineView];
    if (_lineColor) {
        lineView.backgroundColor = _lineColor;
    } else {
        lineView.backgroundColor = [UIColor redColor];
    }
}

/**
 *  按钮事件
 *
 *  @param button 触摸事件中的按钮
 */
- (void)buttonsEvent:(UIButton *)button {
    // 获取到lineView
    UIView *lineView      = [self viewWithTag:LINE_VIEW];
    
    // 哪一个button
    NSInteger whichButton = button.tag - NORMAL_BUTTON;
    
    // 计算按钮的宽度&高度
    CGFloat frameWidth    = self.bounds.size.width;
    CGFloat buttonWidth   = frameWidth / _titles.count;
    
    
    [[self subviews] enumerateObjectsUsingBlock:^(id obj, NSUInteger idx, BOOL *stop) {
        UIButton *tmp = (UIButton *)obj;
        if ([tmp isKindOfClass:[UIButton class]]) {
            if (tmp == button) {
                [self selectButtonStyle:tmp];
            } else {
                [self normalButtonStyle:tmp];
            }
        }
    }];
    
    
    // 做动画
    if (_canTouchOnlyButtonOneTime == YES) {
        self.userInteractionEnabled = NO;
    }
    
    if (_delegate && [_delegate respondsToSelector:@selector(willSelectIndex:)]) {
        [_delegate willSelectIndex:whichButton];
    }
    
    [UIView animateWithDuration:0.25f animations:^{
        CGRect rect    = lineView.frame;
        rect.origin.x  = whichButton * buttonWidth;
        lineView.frame = rect;
    } completion:^(BOOL finished) {
        if (_canTouchOnlyButtonOneTime == YES) {
            self.userInteractionEnabled = YES;
        }
        
        if (_delegate && [_delegate respondsToSelector:@selector(didSelectIndex:)]) {
            [_delegate didSelectIndex:whichButton];
        }
    }];
}

/**
 *  选中按钮的样式
 *
 *  @param button 按钮
 */
- (void)selectButtonStyle:(UIButton *)button {
    
    if (_selectedTitleColor) {
        [button setTitleColor:_selectedTitleColor
                     forState:UIControlStateNormal];
    } else {
        [button setTitleColor:[UIColor redColor]
                     forState:UIControlStateNormal];
    }
}

/**
 *  普通按钮样式
 *
 *  @param button 按钮
 */
- (void)normalButtonStyle:(UIButton *)button {
    
    if (_normalTitleColor) {
        [button setTitleColor:_normalTitleColor
                     forState:UIControlStateNormal];
    } else {
        [button setTitleColor:[UIColor colorWithRed:0.369 green:0.369 blue:0.369 alpha:1]
                     forState:UIControlStateNormal];
    }
}

- (void)resetTilte {

    // 获取尺寸
    CGFloat frameWidth  = self.bounds.size.width;
    
    // 计算按钮的宽度&高度
    CGFloat buttonWidth      = frameWidth / _titles.count;

    // 获取到位置
    NSInteger index = _linePositionX / buttonWidth + 1;
    
    [[self subviews] enumerateObjectsUsingBlock:^(id obj, NSUInteger idx, BOOL *stop) {
        
        UIButton *tmp = (UIButton *)obj;
        if ([tmp isKindOfClass:[UIButton class]]) {
            if (idx == index) {
                [self selectButtonStyle:tmp];
            } else {
                [self normalButtonStyle:tmp];
            }
        }
    }];
}

#pragma mark - 重写各种setter,getter方法
@synthesize linePositionX = _linePositionX;
- (void)setLinePositionX:(CGFloat)linePositionX {
    _linePositionX = linePositionX;
    
    // 获取到lineView
    UIView *lineView   = [self viewWithTag:LINE_VIEW];
    if (lineView) {
        CGRect rect    = lineView.frame;
        rect.origin.x  = linePositionX;
        lineView.frame = rect;
    }
}
- (CGFloat)linePositionX {
    return _linePositionX;
}

@end

WxHxD.h 与 WxHxD.m

//
//  WxHxD.h
//  PM2.5
//
//  Created by YouXianMing on 14/10/29.
//  Copyright (c) 2014年 YouXianMing. All rights reserved.
//

#import <Foundation/Foundation.h>

@interface WxHxD : NSObject

/**
 *  应用程序中可以放置view的区间的高度(部分区域会被导航栏控制器的高度占有而不计算在类)
 *
 *  @return 高度
 */
+ (CGFloat)appHeight;

/**
 *  屏幕高度
 *
 *  @return 屏幕高度
 */
+ (CGFloat)screenHeight;

/**
 *  屏幕宽度
 *
 *  @return 屏幕宽度
 */
+ (CGFloat)screenWidth;

/**
 *  状态栏高度
 *
 *  @return 状态栏高度
 */
+ (CGFloat)statusBarHeight;

/**
 *  导航栏控制器的高度
 *
 *  @return 导航栏控制器的高度
 */
+ (CGFloat)navigationBarHeight;

/**
 *  标签栏控制器的高度
 *
 *  @return 标签栏控制器的高度
 */
+ (CGFloat)tabbarHeight;

/**
 *  状态栏与导航栏控制器一起的高度
 *
 *  @return 状态栏与导航栏控制器一起的高度
 */
+ (CGFloat)statusBarAndNavigationBarHeight;

@end

//
//  WxHxD.m
//  PM2.5
//
//  Created by YouXianMing on 14/10/29.
//  Copyright (c) 2014年 YouXianMing. All rights reserved.
//

#import "WxHxD.h"

@implementation WxHxD

+ (CGFloat)appHeight {
    return [UIScreen mainScreen].applicationFrame.size.height;
}

+ (CGFloat)screenHeight {
    return [UIScreen mainScreen].bounds.size.height;
}

+ (CGFloat)screenWidth {
    return [UIScreen mainScreen].bounds.size.width;
}

+ (CGFloat)statusBarHeight {
    return 20.f;
}

+ (CGFloat)navigationBarHeight {
    return 44.f;
}

+ (CGFloat)tabbarHeight {
    return 49.f;
}

+ (CGFloat)statusBarAndNavigationBarHeight {
    return (20.f + 44.f);
}

@end

控制器源码:

//
//  FirstController.m
//  SwitchController
//
//  Created by YouXianMing on 14/11/5.
//  Copyright (c) 2014年 YouXianMing. All rights reserved.
//

#import "FirstController.h"

@interface FirstController ()

@end

@implementation FirstController

- (void)viewDidLoad {
    [super viewDidLoad];
    
    UILabel *label      = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, 320, 40)];
    label.center        = self.view.center;
    label.text          = @"FirstController";
    label.font          = [UIFont fontWithName:@"HelveticaNeue-Thin" size:35.f];
    label.textAlignment = NSTextAlignmentCenter;

    [self.view addSubview:label];
}

@end

//
//  SecondController.m
//  SwitchController
//
//  Created by YouXianMing on 14/11/5.
//  Copyright (c) 2014年 YouXianMing. All rights reserved.
//

#import "SecondController.h"

@interface SecondController ()

@end

@implementation SecondController

- (void)viewDidLoad {
    [super viewDidLoad];
    
    UILabel *label      = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, 320, 40)];
    label.center        = self.view.center;
    label.text          = @"SecondController";
    label.font          = [UIFont fontWithName:@"HelveticaNeue-Thin" size:35.f];
    label.textAlignment = NSTextAlignmentCenter;
    
    [self.view addSubview:label];
}

@end

主控制器源码:

//
//  ViewController.m
//  SwitchController
//
//  Created by YouXianMing on 14/11/5.
//  Copyright (c) 2014年 YouXianMing. All rights reserved.
//

#import "ViewController.h"
#import "TitleSwitch.h"
#import "WxHxD.h"

#import "FirstController.h"
#import "SecondController.h"

@interface ViewController ()<TitleSwitchDelegate, UIScrollViewDelegate>

{
    TitleSwitch  *titleSwitch;
}

@property (nonatomic, strong) UIScrollView *mainScrollView; // 滑动用的ScrollView

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
 
    // 隐藏状态栏(需要先设置plist文件)
    [UIApplication sharedApplication].statusBarHidden = YES; // 关闭状态栏
    
    // 初始化UIScrollView
    [self initScrollView];
    
    // 初始化标签控制器
    [self initTitleSwitch];
    
    // 初始化两个控制器
    FirstController *first  = [FirstController new];
    [self addChildViewController:first];  // 将控制器first变为当前控制器的子控制器
    CGRect firstRect        = first.view.frame;
    firstRect.origin.x      = [WxHxD screenWidth] * 0; // view值偏移量为 0*screenWidth
    first.view.frame        = firstRect;

    
    SecondController *second = [SecondController new];
    [self addChildViewController:second]; // 将控制器second变为当前控制器的子控制器
    CGRect secondRect        = second.view.frame;
    secondRect.origin.x      = [WxHxD screenWidth] * 1; // view值偏移量为 1*screenWidth
    second.view.frame        = secondRect;
    
    
    // 加载控制器的view
    [_mainScrollView addSubview:first.view];
    [_mainScrollView addSubview:second.view];
}

/**
 *  初始化UIScrollView
 */
- (void)initScrollView {
    // 当前显示艺术品的控制器
    _mainScrollView = [[UIScrollView alloc] initWithFrame:self.view.bounds];
    _mainScrollView.contentSize   = CGSizeMake([WxHxD screenWidth] * 2, [WxHxD screenHeight]);
    _mainScrollView.pagingEnabled = YES;
    _mainScrollView.delegate      = self;
    _mainScrollView.bounces       = NO;
    _mainScrollView.showsHorizontalScrollIndicator = NO;
    [self.view addSubview:_mainScrollView];
}

#pragma mark - UIScrollView的代理
- (void)scrollViewDidScroll:(UIScrollView *)scrollView {
    titleSwitch.linePositionX = scrollView.contentOffset.x / 2.f;
}

- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView {
    [titleSwitch resetTilte];
}

/**
 *  初始化标签控制器
 */
- (void)initTitleSwitch {
    // 标题切换用
    titleSwitch              = [[TitleSwitch alloc] initWithFrame:CGRectMake(0, 0, [WxHxD screenWidth], 40)];
    titleSwitch.tag          = 0x112244;
    
    // 添加灰色的线条
    UIView *grayLine = [[UIView alloc] initWithFrame:CGRectMake(0, 40, [WxHxD screenWidth], 1)];
    grayLine.backgroundColor = [UIColor colorWithRed:0.827 green:0.827 blue:0.827 alpha:1];
    [titleSwitch addSubview:grayLine];
    
    titleSwitch.backgroundColor           = [UIColor colorWithRed:0.949 green:0.949 blue:0.949 alpha:1];
    titleSwitch.selectedTitleColor        = [UIColor colorWithRed:0.843 green:0.000 blue:0.000 alpha:1];
    titleSwitch.titles                    = @[@"YouXianMing",
                                              @"NoZuoNoDie"];
    titleSwitch.lineWidth                 = 1.f;
    titleSwitch.titleFont                 = [UIFont systemFontOfSize:15.f];
    titleSwitch.canTouchOnlyButtonOneTime = YES;
    titleSwitch.delegate                  = self;
    [titleSwitch createTitleSwitchView];
    [self.view addSubview:titleSwitch];
}

#pragma mark - TitleSwitch的代理
- (void)willSelectIndex:(NSInteger)index {
    if (index == 0) {
        
        CGPoint point = _mainScrollView.contentOffset;
        point.x       = 0;
        [UIView animateWithDuration:0.25f animations:^{
            _mainScrollView.contentOffset = point;
        }];
        
        [self bringTitleToFrount];
        
    } else {
        CGPoint point = _mainScrollView.contentOffset;
        point.x       = [WxHxD screenWidth];
        [UIView animateWithDuration:0.25f animations:^{
            _mainScrollView.contentOffset = point;
        }];
        
        [self bringTitleToFrount];
    }
}

/**
 *  将标题提到最前面
 */
- (void)bringTitleToFrount {
    UIView *tmpView = [self.view viewWithTag:0x112244];
    [self.view bringSubviewToFront:tmpView];
}

@end

解析: