關于tableView頭部視圖下拉縮放的效果

在開發過程中,很多小伙伴會遇到頁面不需要導航欄,然后tableView上面有一個headerView,但是實際上又好像不是headerView,因為headerView隨著tableView下拉之后會頂部會出現斷層的現象如下圖:

這樣的斷層就很不和諧,如果能做到上面不出現斷層,是不是會更美觀一點呢,所以這樣時候就想著如果下拉的時候只是等比拉伸該多好啊是不是想要這種效果呢如圖松手的時候還會彈回具有彈性

沒有拉伸的時是這樣子的:

完美,思路是怎樣的呢,要想隨著滾動

思路一:那就要么是tableView的頭部,但是會出現斷層現象

思路二:不是taleView頭部固定在父視圖上,但是這樣不會出現縮放和一起滾動的效果

吧兩個方案綜合一下,我們固定在父視圖上,讓頭部隨著tableView滾動的時候改變高度即可做到頭部縮放的效果咯;

- (void)scrollViewDidScroll:(UIScrollView*)scrollView 在這個方法里面控制

要想下拉之后tableView還有彈性,那么久需要在tableView的contentInset這個屬性上做文章了,我們設置它的contentInset 為_

tabView.contentInset = UIEdgeInsetsMake(topHeight, 0, 0, 0); ?

_tabView.scrollIndicatorInsets = _tabView.contentInset;

?topHeight是你頭部視圖的高度,這樣你下拉的時候tableView就會有彈性了

然后在滾動的方法里面改變頭部視圖的高度

這一塊是核心地方 解釋一下為什么偏移量不是contentOffset.y ?為什么要加上?scrollView.contentInset.top; 因為開始我們設置了tableView的偏移量

所以綜上所述,就兩步,第一設置tableView的偏移量,第二在滾動的時候讓頭部視圖跟隨一起縮放,當然記得設置圖面的contentMode屬性,否則是不會縮放的哦

_topBackView.contentMode = UIViewContentModeScaleAspectFill;

好了,這就是我開發中遇到的一點小問題然后自己總結了一下怎么處理的方法,其實細心的小伙伴會發現這樣所貌似會和tableView的下拉刷新方法出現沖突,這里留給各位小伙伴思考一下哦。下次做解答!

?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容