先看下效果
QQ20171114-144358.gif
导航栏的话还是用的上篇文章的自定义导航栏 , 可以看下层级关系.
QQ20171114-144804.png
最下面是UIScrollView, 然后上面添加了三个UITableView,然后设置一个TableViewHeader.根据滚动, 对ScrollView的运用熟练一点.
上代码吧!!!
1. 首先创建ScrollView和三个TableView.
- (void)setUI {
self.getScrollView = [[HBK_ScrollView alloc] init];
[self.view addSubview:self.getScrollView];
self.getScrollView.bounces = NO;
self.getScrollView.delaysContentTouches = NO;
self.getScrollView.pagingEnabled = YES;
self.getScrollView.showsVerticalScrollIndicator = NO;
self.getScrollView.showsHorizontalScrollIndicator = NO;
self.getScrollView.delegate = self;
self.getScrollView.contentSize = CGSizeMake(kScreenWidth*3, 0);
UIView *headerView = [[UIView alloc] init];
headerView.frame = CGRectMake(0, 0, 0, kHeaderViewHeight+kTitleHeight);
self.aTableView = [[UITableView alloc] init];
self.aTableView.delegate = self;
self.aTableView.dataSource = self;
self.aTableView.backgroundColor = kColor(245, 245, 245);
self.aTableView.tableFooterView = [[UIView alloc] init];
[self.getScrollView addSubview:self.aTableView];
[self.aTableView mas_makeConstraints:^(MASConstraintMaker *make) {
make.left.equalTo(self.getScrollView);
make.width.mas_equalTo(kScreenWidth);
make.top.equalTo(self.view);
make.bottom.equalTo(self.view).offset(-kIPhoneXBottomHeight);
}];
self.aTableView.tableHeaderView = headerView;
self.bTableView = [[UITableView alloc] init];
self.bTableView.delegate = self;
self.bTableView.dataSource = self;
self.bTableView.backgroundColor = kColor(245, 245, 245);
self.bTableView.tableFooterView = [[UIView alloc] init];
[self.getScrollView addSubview:self.bTableView];
[self.bTableView mas_makeConstraints:^(MASConstraintMaker *make) {
make.left.equalTo(self.getScrollView).offset(kScreenWidth);
make.width.equalTo(self.aTableView);
make.top.bottom.equalTo(self.aTableView);
}];
self.bTableView.tableHeaderView = headerView;
self.cTableView = [[UITableView alloc] initWithFrame:CGRectMake(kScreenWidth*2, 0, kScreenWidth, kScreenHeight) style:(UITableViewStylePlain)];
self.cTableView.delegate = self;
self.cTableView.dataSource = self;
self.cTableView.backgroundColor = kColor(245, 245, 245);
self.cTableView.tableFooterView = [[UIView alloc] init];
[self.getScrollView addSubview:self.cTableView];
[self.cTableView mas_makeConstraints:^(MASConstraintMaker *make) {
make.left.equalTo(self.getScrollView).offset(kScreenWidth * 2);
make.width.equalTo(self.aTableView);
make.top.bottom.equalTo(self.aTableView);
}];
self.cTableView.tableHeaderView = headerView;
}
2.创建tableViewHeader
- (void)setHeaderView {
self.disHeaderView = [[UIView alloc] init];
self.disHeaderView.backgroundColor = kThemeColor;
self.disHeaderView.frame = CGRectMake(0, 0, kScreenWidth, kHeaderViewHeight+kTitleHeight);
[self.view addSubview:self.disHeaderView];
self.titleView = [[HBK_SliderTitleView alloc] init];
[self.disHeaderView addSubview:self.titleView];
self.titleView.backgroundColor = [UIColor whiteColor];
[self.titleView mas_makeConstraints:^(MASConstraintMaker *make) {
make.left.right.mas_equalTo(self.disHeaderView);
make.bottom.equalTo(self.disHeaderView.mas_bottom);
make.height.mas_equalTo(kTitleHeight);
}];
[self.getScrollView mas_makeConstraints:^(MASConstraintMaker *make) {
make.left.right.equalTo(self.view);
make.bottom.equalTo(self.view).offset(-kIPhoneXBottomHeight);
make.top.mas_equalTo(self.disHeaderView.mas_top);
}];
_titleView.titles = @[@"动态", @"文章", @"更多"];
_titleView.selectedIndex = 0;
kWeakSelf(self);
_titleView.buttonSelected = ^(NSInteger index){
kStrongSelf(self);
[self.getScrollView setContentOffset:CGPointMake(kScreenWidth * index, 0) animated:YES];
};
}
3.接着就是ScrollView的代理方法了
#pragma mark --------------------- UIScrollViewDelegate
- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView {
if (scrollView == self.getScrollView) {
CGFloat contentOffsetX = scrollView.contentOffset.x;
NSInteger pageNum = contentOffsetX / kScreenWidth + 0.5;
self.titleView.selectedIndex = pageNum;
}
}
- (void)scrollViewDidScroll:(UIScrollView *)scrollView {
if (scrollView == self.getScrollView || !scrollView.window) {
return;
}
CGFloat offsetY = scrollView.contentOffset.y;
CGFloat originY = 0;
CGFloat otherOffsetY = 0;
if (offsetY <= (kHeaderViewHeight-kNavBarHeight)) {
originY = -offsetY;
if (offsetY < 0) {
otherOffsetY = 0;
} else {
otherOffsetY = offsetY;
}
} else {
originY = -kHeaderViewHeight+kNavBarHeight;
otherOffsetY = kHeaderViewHeight+kNavBarHeight;
}
self.disHeaderView.frame = CGRectMake(0, originY, kScreenWidth, kHeaderViewHeight+kTitleHeight);
for ( int i = 0; i < self.titleView.titles.count; i++ ) {
if (i != self.titleView.selectedIndex) {
UITableView *contentView = self.getScrollView.subviews[i];
CGPoint offset = CGPointMake(0, otherOffsetY);
if ([contentView isKindOfClass:[UITableView class]]) {
if (contentView.contentOffset.y < kHeaderViewHeight || offset.y < kHeaderViewHeight) {
[contentView setContentOffset:offset animated:NO];
self.getScrollView.offset = offset;
}
}
}
}
CGPoint offset = scrollView.contentOffset;
CGFloat y = offset.y;
CGFloat alphy = y / 150 > 1.0 ? 1.0 : y / 150;
self.hbk_navgationBar.bgColor = [UIColor colorWithRed:256 green:0 blue:0 alpha:alphy];
self.hbk_navgationBar.titleLabel.textColor = [UIColor colorWithRed:1 green:1 blue:1 alpha:alphy];
}
是不是很简单呀!
