微博個人主頁下拉時圖片產生放大/位移效果
文章同步在個人主頁~
一直以來都發現很多App的信息展示頁中,上部分是圖片的話,都會帶有這樣的一個效果:
新浪微博個人頁gif
所以自己也寫了個Demo,分別用手寫代碼和xib兩種方式實現了這個效果,供大家參考,寫的不好的地方還望大家指正.
關于這個效果,其實只要了解了原理,實現起來非常簡單:
1.上部分的圖片,在下拉的時候沒有跟隨TableView一起往下走,所以這個頭部不是TableView.tableHeaderView,而是TableView的contentInset.top=X,即內容往下偏移了頭部視圖的高度;
2.這個HeaderView視圖要添加到tableView上,并且放在下面[tableView insertSubview:headerView atIndex:0];
3.headerView中ImageView的contentMode要設置成UIViewContentModeScaleAspectFill,這樣在下拉上啦的時候,只要動態改變容器的寬高,那里面的視圖就會隨之產生形變;
知道了原理,實現起來就比較方便了,新浪微博這個我使用的xib實現的,建議這樣比較簡單;
