首先放上 github 地址:有需要的朋友可以下載查看,喜歡的話別忘了關注一下!
親們,喜歡的話就 star 一個吧! O(∩_∩)O謝謝!上傳的代碼每一行都有注釋哦!https://github.com/OneWang/FlowLayout 這個是不帶頭尾視圖的瀑布流的實現(xiàn)
https://github.com/OneWang/Header-Footer-FlowLayout 這個帶有頭尾視圖的瀑布流實現(xiàn)
https://github.com/OneWang/Layout 這個是 UICollectionView 的其它形式的布局的實現(xiàn)
UICollectionView相對于UITableView很相似渡蜻,但它的功能要更加強大,并且其基本用法和 UITableView 的一樣的,在這里基本的屬性和代理方法就不一一介紹了;
UICollectionView把視圖布局分離出來成為一個獨立的類揽祥,你想實現(xiàn)怎樣的視圖布局抡秆,就子類化這個類并在其中實現(xiàn)莲绰。在這主要介紹UICollectionViewLayout的定制,手寫自己喜歡的布局;首先上幾張圖看看效果,因為時間比較匆忙,都是靜態(tài)的還望見諒;
自定義布局的話主要是重寫一下幾個方法:
/** 只要顯示的邊界發(fā)生改變就重新布局,內部重新調用layoutAttributesForElementsInRect方法獲得 cell 布局的屬性 */
- (BOOL)shouldInvalidateLayoutForBoundsChange:(CGRect)newBounds
{
return YES;
}
/** 每次布局之前的準備 */
- (void)prepareLayout;
/** 計算每一個 Item 的屬性,返回每個indexPath對應的 Item 的屬性; */
- (UICollectionViewLayoutAttributes *)layoutAttributesForItemAtIndexPath:(NSIndexPath *)indexPath;
/** 返回 rect 矩形框范圍內的所有元素的布局屬性(cell(item)/header/footer) */
- (NSArray<UICollectionViewLayoutAttributes *> *)layoutAttributesForElementsInRect:(CGRect)rect;
//返回所有的尺寸(只有當是上下滑動的時候才用設置,不是流水布局的采用設置)
- (CGSize)collectionViewContentSize
/**
* 用來設置scrollview 停止?jié)L動哪一刻的位置
* proposedContentOffset:原本scrollview 停止?jié)L動哪一刻的位置
* velocity:滾動速度
* 這個方法主要是做那種反彈效果和那種居中顯示,看偏移量大小顯示那個 Item
*/
- (CGPoint)targetContentOffsetForProposedContentOffset:(CGPoint)proposedContentOffset withScrollingVelocity:(CGPoint)velocity;
插入刪除元素
一般來說彤守,我們對布局屬性從初始狀態(tài)到結束狀態(tài)進行線性插值來計算 collection view 的動畫參數(shù)挺智。然而饰迹,新插入或者刪除的元素并沒有最初或最終狀態(tài)來進行插值商架。要計算這樣的 cells 的動畫与纽,collection view 將通過 initialLayoutAttributesForAppearingItemAtIndexPath: 以及 finalLayoutAttributesForAppearingItemAtIndexPath: 方法來詢問其布局對象侣签,以獲取最初的和最后的屬性塘装。蘋果默認的實現(xiàn)中,對于特定的某個 indexPath影所,返回的是它的通常的位置蹦肴,但 alpha 值為 0.0,這就產生了一個淡入或淡出動畫猴娩。如果你想要更漂亮的效果阴幌,比如你的新的 cells 從屏幕底部發(fā)射并且旋轉飛到對應位置,你可以如下實現(xiàn)這樣的布局子類:
- (UICollectionViewLayoutAttributes*)initialLayoutAttributesForAppearingItemAtIndexPath:(NSIndexPath *)itemIndexPath
{
UICollectionViewLayoutAttributes *attr = [self layoutAttributesForItemAtIndexPath:itemIndexPath];
attr.transform = CGAffineTransformRotate(CGAffineTransformMakeScale(0.2, 0.2), M_PI);
attr.center = CGPointMake(CGRectGetMidX(self.collectionView.bounds), CGRectGetMaxY(self.collectionView.bounds));
return attr;
}
響應設備旋轉
設備方向變化通常會導致 collection view 的 bounds 變化卷中。如果通過 shouldInvalidateLayoutForBoundsChange: 判定為布局需要被無效化并重新計算的時候矛双,布局對象會被詢問以提供新的布局。UICollectionViewFlowLayout 的默認實現(xiàn)正確地處理了這個情況蟆豫,但是如果你子類化 UICollectionViewLayout 的話议忽,你需要在邊界變化時返回 YES
- (BOOL)shouldInvalidateLayoutForBoundsChange:(CGRect)newBounds
{
CGRect oldBounds = self.collectionView.bounds;
if (!CGSizeEqualToSize(oldBounds.size, newBounds.size)) {
return YES;
}
return NO;
}
其它主要是一些計算的一些數(shù)學知識了,有不懂的可以私信我哦!