目的
大家好我是iOS開(kāi)發(fā)一枚抹蚀，目前就職于暴雞電競(jìng)剿牺；由于老板很給力，融資了很多錢(qián)环壤，老板們都想搞事晒来，所以就苦了開(kāi)發(fā)哥哥們了；在老板的大力規(guī)劃下郑现，暴雞電競(jìng)APP快速迭代湃崩，每一次迭代時(shí)間都非常有限，容不得我精雕細(xì)琢接箫，第一版都是盡早上線攒读；然后交個(gè)運(yùn)營(yíng)推廣；接下去就是搶占市場(chǎng)打入目標(biāo)用戶辛友；最后產(chǎn)品薄扁、設(shè)計(jì)同學(xué)覺(jué)得用戶體驗(yàn)不夠好就開(kāi)始找研發(fā)哥哥一個(gè)一個(gè)優(yōu)化直到滿意為止；等優(yōu)化完成后下個(gè)版本又來(lái)了废累，這是一個(gè)非常有意思的循環(huán)過(guò)程邓梅。
接下來(lái)我要講的主要是暴雞電競(jìng)V2.20發(fā)現(xiàn)主頁(yè)滑動(dòng)到一定高度itemBar懸浮停窗優(yōu)化思路。
效果圖
效果圖1.jpeg
效果圖2.jpeg
思路+結(jié)構(gòu)
- 整個(gè)主頁(yè)是一個(gè)
UITableView -
UITableView只有一個(gè)cell九默，頂部的banner和話題當(dāng)做tableHeaderView -
cell的頂部是一個(gè)itemBar和一個(gè)scrollView組成 -
cell中的scrollView作為4個(gè)childViewController的容器 - 項(xiàng)目采用的MVC結(jié)構(gòu)
UITableView``itemBar``scrollView的初始化放在parentViewController
以下部分代碼：
#pragma mark lazy init
- (UIScrollView *)scrollView {
if (!_scrollView) {
_scrollView = [[UIScrollView alloc] init];
_scrollView.frame = CGRectMake(0, PageMenuH + (PageMenuShadowH - 2), SCREEN_WIDTH, ScrollViewH);
_scrollView.delegate = self;
_scrollView.pagingEnabled = YES;
_scrollView.showsVerticalScrollIndicator = NO;
_scrollView.showsHorizontalScrollIndicator = NO;
_scrollView.backgroundColor = COLORF7F9FA;
_scrollView.contentSize = CGSizeMake(SCREEN_WIDTH*self.titles.count, 0);
}
return _scrollView;
}
- (LLTableView *)tableView {
if (!_tableView) {
_tableView = [[LLTableView alloc] initWithFrame:CGRectMake(0, IS_IPHONEX?88:64, SCREEN_WIDTH, SCREEN_HEIGHT - (IS_IPHONEX?34+49+88:49+64)) style:UITableViewStylePlain];
_tableView.tableFooterView = [[UIView alloc] initWithFrame:CGRectZero];
_tableView.dataSource = self;
_tableView.delegate = self;
_tableView.showsVerticalScrollIndicator = NO;
_tableView.backgroundColor = COLORF7F9FA;
}
return _tableView;
}
- (LLMsgRemindHeaderView *)pageMenu
{
if(!_pageMenu)
{
_pageMenu = [[LLMsgRemindHeaderView alloc] initWithTitles:self.titles isBack:NO];
_pageMenu.delegate = self;
}
return _pageMenu;
}
- (void)configUI
{
/**scrollView和子控制器*/
self.titles = @[@"最新",@"陪玩", @"約玩", @"關(guān)注"];
for (NSInteger i = 0; i < self.titles.count; i++) {
DiscoverFeedNewsType feedType = FeedNewsNewest;
if (i == 0) {
feedType = FeedNewsNewest;
}
if (i == 1) {
feedType = FeedNewsPeiWan;
}
if (i == 2) {
feedType = FeedNewsYueWan;
}
if (i == 3) {
feedType = FeedNewsAttention;
}
LLDiscoverHomeChildController *childVC = [[LLDiscoverHomeChildController alloc] initFeedNewsType:feedType];
childVC.delegate = self;
[self addChildViewController:childVC];
[childVC didMoveToParentViewController:self];
if (i == 0) {
self.childVC = childVC;
childVC.view.frame = CGRectMake(i * SCREEN_WIDTH, 0, SCREEN_WIDTH, ScrollViewH);
[self.scrollView addSubview:childVC.view];
}
}
/**監(jiān)聽(tīng)子控制器發(fā)出的通知*/
[[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(subTableViewDidScroll:) name:@"SubTableViewDidScroll" object:nil];
/**添加刷新*/
self.tableView.mj_header = [MJRefreshNormalHeader headerWithRefreshingBlock:^{
/**刷新所需的數(shù)據(jù)*/
/**未讀數(shù)字提醒*/
[self loadNoReadMessage];
[self.childVC refreshChildViewControllerWhenPull];
}];
}
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:NSStringFromClass([UITableViewCell class])];
if (cell == nil) {
cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleValue1 reuseIdentifier:NSStringFromClass([UITableViewCell class])];
}
cell.contentView.backgroundColor = [UIColor whiteColor];
cell.separatorInset = UIEdgeInsetsMake(0, SCREEN_WIDTH, 0, 0);
cell.selectionStyle = UITableViewCellSelectionStyleNone;
/**添加懸浮菜單*/
[cell.contentView addSubview:self.pageMenu];
[cell.contentView addSubview:self.scrollView];
return cell;
}
- 主要處理
childViewController的UITableView的滑動(dòng)監(jiān)聽(tīng) - 這里因?yàn)楦缚刂破骱妥涌刂破鞫加袀€(gè)
tableView震放，滑動(dòng)時(shí)會(huì)有沖突宾毒，我解決的方法新建一個(gè)繼承與UITableView的父類(lèi)驼修，在父類(lèi).m文件里面添加下面代碼：
/*
* 是否允許多個(gè)手勢(shì)識(shí)別器共同識(shí)別殿遂，一個(gè)控件的手勢(shì)識(shí)別后是否阻斷手勢(shì)識(shí)別繼續(xù)向下傳播，默認(rèn)返回NO乙各；如果為YES墨礁，響應(yīng)者鏈上層對(duì)象觸發(fā)手勢(shì)識(shí)別后，如果下層對(duì)象也添加了手勢(shì)并成功識(shí)別也會(huì)繼續(xù)執(zhí)行耳峦，否則上層對(duì)象識(shí)別后則不再繼續(xù)傳播
*/
- (BOOL)gestureRecognizer:(UIGestureRecognizer *)gestureRecognizer shouldRecognizeSimultaneouslyWithGestureRecognizer:(UIGestureRecognizer *)otherGestureRecognizer
{
return [gestureRecognizer isKindOfClass:[UIPanGestureRecognizer class]] && [otherGestureRecognizer isKindOfClass:[UIPanGestureRecognizer class]];
}
- 這樣在滑動(dòng)主控制器的
tableView時(shí)恩静，可以設(shè)置子控制器的偏移量
在子控制器這邊的代碼：
- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
if (self.uid.length == 0 || self.uid == nil) {
/**非動(dòng)態(tài)界面時(shí)滾動(dòng)時(shí)發(fā)出通知*/
[[NSNotificationCenter defaultCenter] postNotificationName:@"SubTableViewDidScroll" object:scrollView];
}
}
在主控制器這邊的代碼：
#pragma mark addObserver SEL
- (void)subTableViewDidScroll:(NSNotification *)notific
{
UIScrollView *scrollView = notific.object;
self.childVCScrollView = scrollView;
if (self.tableView.contentOffset.y < self.maxOffsetY) {
scrollView.contentOffset = CGPointZero;
} else {
self.tableView.contentOffset = CGPointMake(0, self.maxOffsetY + DistanceOffsetY);
}
}
- (void)scrollViewWillBeginDragging:(UIScrollView *)scrollView
{
if (self.scrollView == scrollView) {
self.tableView.scrollEnabled = NO;
}
if (self.tableView == scrollView) {
self.scrollView.scrollEnabled = NO;
}
}
- (void)scrollViewWillEndDragging:(UIScrollView *)scrollView
withVelocity:(CGPoint)velocity
targetContentOffset:(inout CGPoint *)targetContentOffset
{
if (self.scrollView == scrollView) {
self.tableView.scrollEnabled = YES;
}
if (self.tableView == scrollView) {
self.scrollView.scrollEnabled = YES;
}
}
- (void)scrollViewDidScroll:(UIScrollView *)scrollView {
if (self.tableView == scrollView) {
if (scrollView.contentOffset.y >= 0) {
if (self.maxOffsetY != 0) {
CGFloat percentage = scrollView.contentOffset.y / self.maxOffsetY;
if (percentage >= 1.f) {
percentage = 1.f;
}
if (percentage <= 0.f) {
percentage = 0.f;
}
[self.pageMenu ll_layerShadow:[UIColor colorWithRGB:0x000000 alpha:0.05] offset:CGSizeMake(0, -2 * percentage) radius:PageMenuShadowH * percentage];
self.pageMenu.separatorColor = [UIColor colorWithRGB:0xE1E1E1 alpha:1 - percentage];
}
}
if (self.childVCScrollView && self.childVCScrollView.contentOffset.y > 0) {
self.tableView.contentOffset = CGPointMake(0, self.maxOffsetY + DistanceOffsetY);
}
if (self.tableView.contentOffset.y >= self.maxOffsetY) {
self.tableView.contentOffset = CGPointMake(0, self.maxOffsetY + DistanceOffsetY);
}
}
if (self.scrollView == scrollView) {
if (self.scrollView.contentOffset.x < 0 ||
self.scrollView.contentOffset.x > (self.titles.count - 1) * SCREEN_WIDTH) {
return;
}
CGFloat offsetX = scrollView.contentOffset.x;
}
}
- 注意的細(xì)節(jié)，通過(guò)網(wǎng)絡(luò)請(qǐng)求得到
banner和話題數(shù)據(jù)蹲坷，確定了maxOffset高度
結(jié)尾
- 在優(yōu)化之前我查閱了網(wǎng)上很多案例驶乾，但是方法過(guò)于復(fù)雜，我做事喜歡能簡(jiǎn)單完成的絕不復(fù)雜化循签，包括我自己一開(kāi)始我用了一個(gè)大
scrollView包含一個(gè)小scrollView嵌套實(shí)現(xiàn)了效果级乐，但是體驗(yàn)很差，待版本上線后我沉下心把他優(yōu)化了县匠，新的效果要等到V2.3.0才能看到风科。 - 采用主控制器包含一個(gè)
UITbaleViewCell和子控制器結(jié)構(gòu)，既可以方便將來(lái)新功能接入乞旦，也可以快速實(shí)現(xiàn)需求贼穆。 - 這里僅僅提供一個(gè)思路，如果本文反饋的人數(shù)達(dá)到一定量兰粉，再考慮出一個(gè)Demo吧
- 下一期分享我個(gè)人使用YYKit實(shí)現(xiàn)添加話題故痊、用系統(tǒng)的
UISearchController搜索話題以及用YYLabel實(shí)現(xiàn)feed詳情并且話題可點(diǎn)擊，雖然聽(tīng)起來(lái)很簡(jiǎn)單亲桦，但是我還是愿意把我在實(shí)現(xiàn)過(guò)程中遇到的問(wèn)題分享給大家
