首页投稿(暂停使用,暂停投稿)iOS开发iOS专题

iOS开发---仿简书个人主页(适配iPhone X)

2017-11-14  本文已影响364人  iOS_渔翁

先看下效果


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];

}

是不是很简单呀!

Github地址

上一篇下一篇

猜你喜欢

热点阅读