自古一樓只鎮(zhèn)樓拷邢、不說事
依舊沒什么可前言的袱院、有圖誰嗶嗶是吧。
正文
去年就注意到支付寶的這個效果瞭稼、但當(dāng)時沒什么特別好的想法忽洛。只是覺得、哎呀环肘、這個tableView挪下去了欲虚、上面還能一起滑動好流弊。
之前確實(shí)也做過一些嘗試悔雹。通過在scrollView上添加tableView复哆、然后模擬上推的效果。但是上推途中需要不斷的控制tableView腌零、一個簡單的上滑事件做了N多操作以及判斷梯找、結(jié)果就是卡頓、犧牲了很大一部分性能益涧。我并沒有用Reveal去撬開看支付寶的具體層級锈锤。但我相信、一個大廠的團(tuán)隊(duì)不會打造出一個華而不實(shí)的效果（事實(shí)上闲询、人家確實(shí)不卡久免、絲般順滑）。
我一直覺得扭弧。并不是每一個看似牛逼的功能阎姥、都有著難以想象的復(fù)雜度。沒必要為了自己覺得流弊而復(fù)雜鸽捻。
然后昨天呼巴、靈感突然一現(xiàn)氨淌。
既然想那么流暢、那用系統(tǒng)的tableView不就好了伊磺。
至于滑動條盛正、完全可以用scrollIndicatorInsets來偽裝一下。
于是屑埋、有了下面這個想法豪筝。（不要在意錯別字~這是昨天和別人討論完善時的一個截圖而已）
關(guān)于核心代碼
既然想法已經(jīng)出來了、那核心代碼其實(shí)猜都猜得到了摘能。真的沒多少续崖。
首先、是之前想到的頁面層級搭建
#pragma mark - setter && getter
- (UITableView *)tableView {
if (!_tableView) {
_tableView = [[UITableView alloc]initWithFrame:CGRectZero style:UITableViewStyleGrouped];
_tableView.delegate = self;
_tableView.dataSource = self;
/* 這里用一個透明的view將header撐開 */
UIView *tableHeaderView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, SCREEN_WIDTH, 200)];
tableHeaderView.backgroundColor = [UIColor clearColor];
_tableView.tableHeaderView = tableHeaderView;
/* 修改scrollIndicatorInsets团搞。仿造出tableView從下方開始的效果 */
_tableView.scrollIndicatorInsets = UIEdgeInsetsMake(200, 0, 0, 0);
/* 再在header下方安裝一個刷新用的view */
[_tableView.tableHeaderView addSubview:self.refreshHeaaderView];
}
return _tableView;
}
然后是對上推以及刷新實(shí)現(xiàn)
- (void)scrollViewDidScroll:(UIScrollView )scrollView {
CGFloat tableViewoffsetY = scrollView.contentOffset.y;
/ topView聯(lián)動 */
if ( tableViewoffsetY>=-64) {
self.topView.frame = CGRectMake(0, 0, SCREEN_WIDTH, 200);
}else if( tableViewoffsetY < -64){
self.topView.frame = CGRectMake(0, 64 + tableViewoffsetY, SCREEN_WIDTH, 200);
}
/* 刷新用 */
if (tableViewoffsetY > -64.0f) {
self.refreshHeaaderView.type = typeNull;
}else if (tableViewoffsetY > - 125.0f){
self.refreshHeaaderView.type = typeWillRefresh;
}else {
self.refreshHeaaderView.type = typeRefreshing;
}
}
末了严望、有一個小坑注意一下
/* 這里。展示用的topView需要添加在tableView上逻恐。不然導(dǎo)致在topView上面上下滑動的時候無法與tableView聯(lián)動 */
[self.tableView addSubview:self.topView];
ps:關(guān)于MJ刷新怎么加像吻、講真我沒做~~（不過我想、不愿意自己實(shí)現(xiàn)复隆〔Υ遥可以干脆在tableView上面放一個MJ刷新應(yīng)該也好使...反正上面有個TopView蓋著也看不出來是在上面還有個刷新）
最后
本來想高仿一下、或者加點(diǎn)輪播啊之類的挽拂。但感覺功能太多代碼太長自己就會懶得寫博客了....
所以惭每、依舊只是個demo。老板要是能隨手來個贊就更好了亏栈。
https://github.com/kiritoSong/KTAlipayDemo
