分析：
横着滚动需要ScrollView 竖着滚动需要TableView
1>在精华控制器的View里面需要先添加一个scroller，且这个scroller的尺寸设置为屏幕的尺寸。但是scrollView的contentSize（占位视图）需要设置成 5个屏幕的宽度。然后再往contentSize上添加5个tableView。
2>头部的5个标题栏，不会随着TableView向上滑而移动。所以时在scrollView上面添加一个UIView，然后在往UIView上面添加5个UIbutton按钮。
3>当点击头部的标题栏按钮时，下面的ScrollView会向右滑动。所以需要创建5个TableView控制器分别对其进行管理，ScrollView在5个TableView上来回移动。
/**
* 添加scrollView
*/
- (void)setupScrollView
{
// 不允许自动修改UIScrollView的内边距
self.automaticallyAdjustsScrollViewInsets = NO;
UIScrollView *scrollView = [[UIScrollView alloc] init];
scrollView.backgroundColor = [UIColor blueColor];
//scrollView的尺寸等于屏幕的尺寸
scrollView.frame = self.view.bounds;
//隐藏水平方向的滚动条
scrollView.showsHorizontalScrollIndicator = NO;
//隐藏垂直方向的进度条
scrollView.showsVerticalScrollIndicator = NO;
//设置分页功能
scrollView.pagingEnabled = YES;
[self.view addSubview:scrollView];
// 添加子控制器的view
NSUInteger count = self.childViewControllers.count;
CGFloat scrollViewW = scrollView.xmg_width;
CGFloat scrollViewH = scrollView.xmg_height;
// 这种方法当控制器加载时，就创建5个TableView，性能不好,需要当点击标题按钮时在进行对应页面的创建。
// for (NSUInteger i = 0; i < count; i++) {
// // 取出i位置子控制器的view
// UIView *childVcView = self.childViewControllers[i].view;
// childVcView.frame = CGRectMake(i * scrollViewW, 0, scrollViewW, scrollViewH);
// [scrollView addSubview:childVcView];
// }
scrollView.contentSize = CGSizeMake(count * scrollViewW, 0);
}
/**
* 初始化子控制器tableView的5个子控制器
*/
- (void)setupAllChildVcs
{
[self addChildViewController:[[XMGAllViewController alloc] init]];
[self addChildViewController:[[XMGVideoViewController alloc] init]];
[self addChildViewController:[[XMGVoiceViewController alloc] init]];
[self addChildViewController:[[XMGPictureViewController alloc] init]];
[self addChildViewController:[[XMGWordViewController alloc] init]];
}
/**
* 添加标题栏
*/
/** 标题栏 */
@property (nonatomic, weak) UIView *titlesView;
//添加标题栏view
- (void)setupTitlesView
{
UIView *titlesView = [[UIView alloc] init];
titlesView.backgroundColor = [[UIColor whiteColor] colorWithAlphaComponent:0.5];
titlesView.frame = CGRectMake(0, 64, self.view.xmg_width, 35);
[self.view addSubview:titlesView];
self.titlesView = titlesView;
// 标题栏按钮
[self setupTitleButtons];
// 标题下划线
[self setupTitleUnderline];
}
/**
* 添加标题栏按钮
*自定义UIbutton按钮。效果图是点击按钮时将按钮颜色设置成红色，当取点击另一个按钮时，需要将前一个按钮选中取消并设置为灰色，点击的按钮颜色设置
*/
- (instancetype)initWithFrame:(CGRect)frame
{
//重写系统的方法
if (self = [super initWithFrame:frame]) {
self.titleLabel.font = [UIFont systemFontOfSize:16];
//默认为灰色
[self setTitleColor:[UIColor darkGrayColor] forState:UIControlStateNormal];
//选中为红色
[self setTitleColor:[UIColor redColor] forState:UIControlStateSelected];
}
return self;
}
// 只要重写了这个方法，按钮就无法进入highlighted状态
- (void)setHighlighted:(BOOL)highlighted
{
}
/*添加标题栏按钮*/
- (void)setupTitleButtons
{
// 文字
NSArray *titles = @[@"全部", @"视频", @"声音", @"图片", @"段子"];
NSUInteger count = titles.count;
// 标题按钮的尺寸
CGFloat titleButtonW = self.titlesView.xmg_width / count;
CGFloat titleButtonH = self.titlesView.xmg_height;
// 创建5个标题按钮
for (NSUInteger i = 0; i < count; i++) {
XMGTitleButton *titleButton = [[XMGTitleButton alloc] init];
//将每一个标题按钮绑定一个标识
titleButton.tag = i;
[titleButton addTarget:self action:@selector(titleButtonClick:) forControlEvents:UIControlEventTouchUpInside];
[self.titlesView addSubview:titleButton];
// frame
titleButton.frame = CGRectMake(i * titleButtonW, 0, titleButtonW, titleButtonH);
// 文字
[titleButton setTitle:titles[i] forState:UIControlStateNormal];
}
}
/**
* 添加标题下划线
*/
/** 标题下划线 */
@property (nonatomic, weak) UIView *titleUnderline;
//添加标题下划线
- (void)setupTitleUnderline
{
// 标题按钮
XMGTitleButton *firstTitleButton = self.titlesView.subviews.firstObject;
// 下划线
UIView *titleUnderline = [[UIView alloc] init];
titleUnderline.xmg_height = 2;
titleUnderline.xmg_y = self.titlesView.xmg_height - titleUnderline.xmg_height;
titleUnderline.backgroundColor = [firstTitleButton titleColorForState:UIControlStateSelected];
[self.titlesView addSubview:titleUnderline];
self.titleUnderline = titleUnderline;
// 切换按钮状态
firstTitleButton.selected = YES;
self.previousClickedTitleButton = firstTitleButton;
// 让label根据文字内容计算尺寸
[firstTitleButton.titleLabel sizeToFit];
self.titleUnderline.xmg_width = firstTitleButton.titleLabel.xmg_width + 10;
self.titleUnderline.xmg_centerX = firstTitleButton.xmg_centerX;
}
#pragma mark - 监听
/**
* 点击标题按钮
*/
/** 上一次点击的标题按钮 */
@property (nonatomic, weak) XMGTitleButton *previousClickedTitleButton;
//点击标题按钮
- (void)titleButtonClick:(XMGTitleButton *)titleButton
{
// 切换按钮状态（三部曲）
self.previousClickedTitleButton.selected = NO;
titleButton.selected = YES;
self.previousClickedTitleButton = titleButton;
[UIView animateWithDuration:0.25 animations:^{
// 处理下划线
self.titleUnderline.xmg_width = titleButton.titleLabel.xmg_width + 10;
self.titleUnderline.xmg_centerX = titleButton.xmg_centerX;
//当点击标题栏时，scrollview会跟着一起滑动
//scrollview会跟着创建UIbutton时绑定的标识，滑动到对应的界面
CGFloat offsetX = self.scrollView.xmg_width * titleButton.tag;
//scrollview在X轴上移动
self.scrollView.contentOffset = CGPointMake(offsetX, self.scrollView.contentOffset.y);
//（反过来）将scrollview往右滑动时，标题栏按钮也会跟着滑动
}completion:^(BOOL finished) {
//取出按钮索引对应的控制器
UIViewController *childVc = self.childViewControllers[titleButton.tag].view;
// 设置子控制器view的frame
childVcView.frame = CGRectMake(index * scrollViewW, 0, self.scrollView.xmg_width, self.scrollView.xmg_height);
// 添加子控制器的view到scrollView中
[self.scrollView addSubview:childVcView];
}];
}
#pragma mark -（反过来）将scrollview往右滑动时，标题栏按钮也会跟着滑动
/*
* 当用户松开scrollView并且滑动结束时调用这个代理方法（scrollView停止滚动的时候）
*/
- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView
{
// 求出标题按钮的索引
NSUInteger index = scrollView.contentOffset.x / scrollView.xmg_width;
// 当滑动结束后，就再次调用点击标题索引标题按钮
XMGTitleButton *titleButton = self.titlesView.subviews[index];
[self titleButtonClick:titleButton];
}
网友评论