码迷,mamicode.com
首页 > 其他好文 > 详细

同一个界面多个子控制器切换视图

时间:2016-07-13 16:58:53      阅读:245      评论:0      收藏:0      [点我收藏+]

标签:

先看示例:
技术分享
EssenceViewController为父控制器。
AllViewController =》全部
VideoViewController =》视频
VoiceViewController =》声音
PictureViewController =》图片
WordViewController =》段子

一、分析
1.顶部菜单栏
大的UIView里包含 一个子UIView(菜单选中的底部指示器)和5个菜单UIButton。
2.中间内容区域是UIScrollView。点击不同菜单切换子控制器,滚动scrollView也要切换,并且菜单栏也跟着切换。

二、详细看代码

//
//  EssenceViewController.m


#import "EssenceViewController.h"
#import "RecommendTagsViewController.h"
#import "AllViewController.h"
#import "VideoViewController.h"
#import "VoiceViewController.h"
#import "PictureViewController.h"
#import "WordViewController.h"

@interface EssenceViewController ()<UIScrollViewDelegate>
/**
 *  标签底部红色指示器
 */
@property(nonatomic,weak)UIView *indicatorView;
/**
 *  当前选中的顶部标签内部的按钮
 */
@property(nonatomic,weak)UIButton *selectedButton;

/**
 *  顶部所有标签的view
 */
@property(nonatomic,weak)UIView *titlesView;

/**
 *  内容视图
 */
@property(nonatomic,weak)UIScrollView *contentView;

@end

@implementation EssenceViewController

- (void)viewDidLoad {
    [super viewDidLoad];

    // 设置导航栏
    [self setupNav];

    // 初始化所有子控制器
    [self setupChildVces];

    // 设置顶部的标签栏
    [self setupTitlesView];

    // 底部cententView
    [self setupContentView];
}

/**
 *  初始化所有子控制器
 */
- (void)setupChildVces
{
    AllViewController *all = [[AllViewController alloc] init];
    [self addChildViewController:all];

    VideoViewController *video = [[VideoViewController alloc]init];
    [self addChildViewController:video];

    VoiceViewController *voice = [[VoiceViewController alloc] init];
    [self addChildViewController:voice];

    PictureViewController *picture = [[PictureViewController alloc] init];
    [self addChildViewController:picture];

    WordViewController *word = [[WordViewController alloc] init];
    [self addChildViewController:word];
}

/**
 *  底部cententView
 */
- (void)setupContentView
{
    // 不要自动调整inset
    self.automaticallyAdjustsScrollViewInsets = NO;

    UIScrollView *contentView = [[UIScrollView alloc] init];
    contentView.frame = self.view.bounds;
    contentView.delegate = self;
    contentView.pagingEnabled = YES;
    [self.view insertSubview:contentView atIndex:0];
    contentView.contentSize = CGSizeMake(contentView.width * self.childViewControllers.count, 0);
    self.contentView = contentView;

    // 添加第一个控制器的view
    [self scrollViewDidEndScrollingAnimation:contentView];
}

/**
 *  设置顶部的标签栏
 */
- (void)setupTitlesView
{
    // 标签栏整体
    UIView *titlesView = [[UIView alloc] init];
    titlesView.backgroundColor = [[UIColor whiteColor] colorWithAlphaComponent:0.7];
    titlesView.width = self.view.width;
    titlesView.height = 35;
    titlesView.y = 64;
    [self.view addSubview:titlesView];
    self.titlesView = titlesView;

    // 底部红色指示器
    UIView *indicatorView = [[UIView alloc] init];
    indicatorView.backgroundColor = [UIColor redColor];
    indicatorView.height = 2;
    indicatorView.tag = -1;
    indicatorView.y = titlesView.height - indicatorView.height;
    self.indicatorView = indicatorView;

    // 内部子标签
    NSArray *titles = @[@"全部 ",@"视频",@"声音",@"图片",@"段子"];
    CGFloat height = titlesView.height;
    CGFloat width = titlesView.width / titles.count;

    for (NSInteger i=0; i<titles.count; i++) {
        UIButton *button = [[UIButton alloc] init];
        button.tag = i;
        button.height = height;
        button.width = width;
        button.x = i * button.width;
        [button setTitle:titles[i] forState:UIControlStateNormal];
        [button layoutIfNeeded]; // 强制布局(强制更新子控件的frame)
        [button setTitleColor:[UIColor grayColor] forState:UIControlStateNormal];
        [button setTitleColor:[UIColor redColor] forState:UIControlStateDisabled];
        button.titleLabel.font = [UIFont systemFontOfSize:14];
        [button addTarget:self action:@selector(titleClick:) forControlEvents:UIControlEventTouchUpInside];
        [titlesView addSubview:button];

        // 默认点击了第一个按钮
        if (i == 0) {
            button.enabled = NO;
            self.selectedButton = button;

            // 让按钮内部的label根据文字内容计算尺寸
            [button.titleLabel sizeToFit];
            self.indicatorView.width = button.titleLabel.width;
            self.indicatorView.centerX = button.centerX;
        }
    }

    // indicatorView最后才添加到titlesView里
    // 为了后面从titlesView取button方便
    [titlesView addSubview:indicatorView];
}

/**
 *  点击了标签栏里的按钮
 */
- (void)titleClick:(UIButton *)button
{
    // 修改按钮的状态
    self.selectedButton.enabled = YES;
    button.enabled = NO;
    self.selectedButton = button;

    // 让标签执行动画
    [UIView animateWithDuration:.025 animations:^{
        self.indicatorView.width = self.selectedButton.titleLabel.width;
        self.indicatorView.centerX = self.selectedButton.centerX;
    }];

    // 滚动contentView
    CGPoint offset = self.contentView.contentOffset;
    offset.x = button.tag * self.contentView.width;
    [self.contentView setContentOffset:offset animated:YES];
}

/**
 *  设置导航栏
 */
- (void)setupNav
{
    // 设置导航栏标题
    self.navigationItem.titleView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"MainTitle"]];

    // 设置导航栏左边的按钮
    self.navigationItem.leftBarButtonItem = [UIBarButtonItem itemWithImage:@"MainTagSubIcon" highImage:@"MainTagSubIconClick" target:self action:@selector(tagButtonClick)];

    // 设置背景色
    self.view.backgroundColor = GlobalBgColor;
}

/**
 *  点击了导航栏左边的按钮
 */
- (void)tagButtonClick
{
    RecommendTagsViewController *vc = [[RecommendTagsViewController alloc] init];
    [self.navigationController pushViewController:vc animated:YES];
}

#pragma mark - <UIScrollViewDelegate>
/**
 *  滚动完毕就会调用(如果不是人为拖拽scrollView导致滚动完毕,才会调用这个方法
 */
- (void)scrollViewDidEndScrollingAnimation:(UIScrollView *)scrollView
{
    // 当前的索引
    NSInteger index = scrollView.contentOffset.x / scrollView.width;

    // 取出子控制器
    UITableViewController *vc = self.childViewControllers[index];
    vc.view.x = scrollView.contentOffset.x;
    vc.view.y = 0; //设置控制器view的y值为0(默认是20)
    vc.view.height = scrollView.height; //设置控制器view的height值为整个屏幕的高度(默认是比屏幕高度少20)

    // 设置内边距
    CGFloat top = CGRectGetMaxY(self.titlesView.frame);
    CGFloat bottom = self.tabBarController.tabBar.height;
    vc.tableView.contentInset = UIEdgeInsetsMake(top, 0, bottom, 0);
    // 设置滚动条的内边距
    vc.tableView.scrollIndicatorInsets = vc.tableView.contentInset;
    [scrollView addSubview:vc.view];
}

/**
 *  在scrollview停止滑动的时候执行
 */
- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView
{
    [self scrollViewDidEndScrollingAnimation:scrollView];

    // 点击菜单按钮
    NSInteger index = scrollView.contentOffset.x / scrollView.width;
    [self titleClick:self.titlesView.subviews[index]];
}
@end

三、其他
上面代码还用到一个UIView分类:

//
//  UIView+Extension.h

//  封装frame的修改

#import <UIKit/UIKit.h>

@interface UIView (Extension)

@property(nonatomic,assign)CGSize size;
@property(nonatomic,assign)CGFloat width;
@property(nonatomic,assign)CGFloat height;
@property(nonatomic,assign)CGFloat x;
@property(nonatomic,assign)CGFloat y;
@property(nonatomic,assign)CGFloat centerX;
@property(nonatomic,assign)CGFloat centerY;
/*
 在分类中声明@property,只会生成方法的声明,不会生成方法的实现和带有_下划线的成员变量
 */
@end
//
//  UIView+Extension.m


#import "UIView+Extension.h"

@implementation UIView (Extension)

- (void)setSize:(CGSize)size {
    CGRect frame = self.frame;
    frame.size = size;
    self.frame = frame;
}
- (CGSize)size {
    return self.frame.size;
}

- (void)setWidth:(CGFloat)width {
    CGRect frame = self.frame;
    frame.size.width = width;
    self.frame = frame;
}
- (CGFloat)width {
    return  self.frame.size.width;
}

- (void)setHeight:(CGFloat)height {
    CGRect frame = self.frame;
    frame.size.height = height;
    self.frame = frame;
}
- (CGFloat)height {
    return self.frame.size.height;
}

- (void)setX:(CGFloat)x {
    CGRect frame = self.frame;
    frame.origin.x = x;
    self.frame = frame;
}
- (CGFloat)x {
    return self.frame.origin.x;
}

- (void)setY:(CGFloat)y {
    CGRect frame = self.frame;
    frame.origin.y = y;
    self.frame = frame;
}
- (CGFloat)y {
    return  self.frame.origin.y;
}

- (void)setCenterX:(CGFloat)centerX
{
    CGPoint center = self.center;
    center.x = centerX;
    self.center = center;
}

- (CGFloat)centerX
{
    return self.center.x;
}

- (void)setCenterY:(CGFloat)centerY
{
    CGPoint center = self.center;
    center.y = centerY;
    self.center = center;
}

- (CGFloat)centerY
{
    return self.center.y;
}
@end

同一个界面多个子控制器切换视图

标签:

原文地址:http://blog.csdn.net/github_26672553/article/details/51888923

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!