你好,歡迎來到IOS教程網

 Ios教程網 >> IOS編程開發 >> IOS開發綜合 >> iOS下用一行代碼實現tableview(collectionview)的parallax效果

iOS下用一行代碼實現tableview(collectionview)的parallax效果

編輯:IOS開發綜合

 

 

原理很簡單,就是一個等比公式

cell的圖片位置 / cell圖片可以滑動的總長 cell在table中的位置 / cell 可滑動總長

 

實現方法:

1》 在cell的UIImageView上添加父視圖UIView,clipsToBounds設置為yes,用來剪切UIImageView,為其限定大小。

 

2》在vc的

-(void)scrollViewDidScroll:(UIScrollView *)scrollView

中實時更新每個cell的圖片位置。

代碼如下

 

 

-(void)scrollViewDidScroll:(UIScrollView *)scrollView
{
    for(WELTableViewCell * cell in [self.tableView visibleCells])
    {
        cell.image.frame = CGRectOffset(cell.image.frame, 0, ((cell.image.frame.size.height - cell.imageFrameView.frame.size.height) * ((cell.frame.origin.y + cell.imageFrameView.frame.size.height - self.tableView.contentOffset.y) / (self.tableView.frame.size.height + cell.imageFrameView.frame.size.height * 2)) + cell.imageFrameView.frame.size.height - cell.image.frame.size.height) - cell.image.frame.origin.y);
    }
}

PS:確實是一行代碼,哈哈。其實一行代碼只是一個噱頭,完全可以多寫幾行增加可讀性。之所以寫一行代碼,是想表達這個效果其實蠻簡單的。用算式算出偏移量,重設frame。

 

 

3》在tableView初次刷新完畢後,調用

[self scrollViewDidScroll:nil];

例如

 

-(void)viewDidAppear:(BOOL)animated

{

[super viewDidAppear:YES];

[self scrollViewDidScroll:nil];

}

 

最後,附上源代碼demo(發帖不易,討個積分,哈哈)

簡單demo(附注釋)

 

以上


  1. 上一頁:
  2. 下一頁:
蘋果刷機越獄教程| IOS教程問題解答| IOS技巧綜合| IOS7技巧| IOS8教程
Copyright © Ios教程網 All Rights Reserved