iOS 深入學習UICollectionView


前言: 這是博主在學習舊知識筆記中的一篇, 誰叫咱入門晚呢, 學習的過程中, 不會的知識, 就是因為我們年輕而已(囧~) 我總是這樣安慰自己(逃~), 所以我們需要補充一下”錯過”的重要的東西, 下面列出了本文會提到的一些概念. 如不感興趣直接退出即可
UICollectionView, UICollectionViewDataSource, UICollectionViewDelegate, UICollectionViewDelegateFlowLayout, UICollectionViewLayout

在開始之前先有必要回憶一下UICollectionView

使用collectionView有一段時間了, 進行一個簡單的總結和理解~~~.
UICollectionView是一種類似於UITableView不同於UITableView的布局方式.

  • Cells 用於展示內容的主體,對於不同的cell可以指定不同尺寸和不同的內容, 且可以復用(一般需要自定義 沒有提供類似於tableview那么多的屬性).
  • Supplementary Views 追加視圖 可以理解為tableView每個Section的Header或者Footer,用來標記每個section的view, 且也可以被復用.
  • Decoration Views 裝飾視圖 這是每個section的背景, 且也可以被復用.

關於Cell的說明:
- 首先是cell本身作為容器view
- 然后是一個大小自動適應整個cell的backgroundView,用作cell平時的背景
- 再其上是selectedBackgroundView,是cell被選中時的背景
- 最后是一個contentView,自定義內容應被加在這個view上

UICollectionViewDataSource

// 多少個Items
- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section; // 顯示cell - (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath; // 多少個Sections - (NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView;

實現上面三個方法, 基本就可以正常工作了.

UICollectionViewDelegate

進行一些行為操作時候用到的
- cell的高亮
- cell的點擊
- cell的選中狀態等等.

對於點擊cell發生哪些行為做一個說明

1collectionView:shouldHighlightItemAtIndexPath: 是否應該高亮?
2collectionView:didHighlightItemAtIndexPath: 如果1回答為是,那么高亮
3collectionView:shouldSelectItemAtIndexPath: 無論1結果如何,都詢問是否可以被選中?
4collectionView:didUnhighlightItemAtIndexPath: 如果1回答為是,那么現在取消高亮
5collectionView:didSelectItemAtIndexPath: 如果3回答為是,那么選中cell

UICollectionViewDelegateFlowLayout

可以對cell的大小, 間隙進行調整 使用協議的方式

UICollectionViewFlowLayout

是UICollectionViewLayout(稍后會提到)的子類, 他提供一些對cell進行簡單設置的屬性, Flow Layout簡單說是一個直線對齊的layout.

// 系統API提供的一些屬性
@property (nonatomic) CGFloat minimumLineSpacing;
@property (nonatomic) CGFloat minimumInteritemSpacing;
@property (nonatomic) CGSize itemSize;
@property (nonatomic) CGSize estimatedItemSize NS_AVAILABLE_IOS(8_0); // defaults to CGSizeZero - setting a non-zero size enables cells that self-size via -preferredLayoutAttributesFittingAttributes:
@property (nonatomic) UICollectionViewScrollDirection scrollDirection; // default is UICollectionViewScrollDirectionVertical
@property (nonatomic) CGSize headerReferenceSize;
@property (nonatomic) CGSize footerReferenceSize;
@property (nonatomic) UIEdgeInsets sectionInset;

// Set these properties to YES to get headers that pin to the top of the screen and footers that pin to the bottom while scrolling (similar to UITableView).
@property (nonatomic) BOOL sectionHeadersPinToVisibleBounds NS_AVAILABLE_IOS(9_0);
@property (nonatomic) BOOL sectionFootersPinToVisibleBounds NS_AVAILABLE_IOS(9_0);

UICollectionViewLayout

它負責了將各個cell、Supplementary View和Decoration Views進行組織,為它們設定各自的屬性.可以有:位置, 尺寸, 透明, 層級, 形狀, 等等. 所以自定義各種樣式的布局就需要自定義Layout了.
實現一個自定義layout一般繼承於UICollectionViewLayout然后需要重寫以下幾個方法:

// 返回CollectionView的內容尺寸
-(CGSize)collectionViewContentSize
// 返回rect中的所有的元素的布局屬性, 返回的是包含UICollectionViewLayoutAttributes的NSArray, UICollectionViewLayoutAttributes可以是cell, Supplementary View和Decoration View
-(NSArray *)layoutAttributesForElementsInRect:(CGRect)rect
// 返回對應於indexPath的位置的cell的布局屬性
-(UICollectionViewLayoutAttributes _)layoutAttributesForItemAtIndexPath:(NSIndexPath _)indexPath
// 返回對應於indexPath的位置的追加視圖的布局屬性
-(UICollectionViewLayoutAttributes _)layoutAttributesForSupplementaryViewOfKind:(NSString _)kind atIndexPath:(NSIndexPath *)indexPath
// 返回對應於indexPath的位置的裝飾視圖的布局屬性
-(UICollectionViewLayoutAttributes * )layoutAttributesForDecorationViewOfKind:(NSString_)decorationViewKind atIndexPath:(NSIndexPath _)indexPath: 
// 默認返回yes, 邊界發生變化時, 重新進行布局.
- (BOOL)shouldInvalidateLayoutForBoundsChange:(CGRect)newBounds: 

注意: UICollectionViewLayout實例化之后, 有一些方法將自動被調用

// 一般在該方法中設定一些必要的layout的結構和初始需要的參數
-(void)prepareLayout
// 處置collection應該占據的尺寸(所有內容所占的尺寸) collectionView的本質是一個scrollView, 需要滾動尺寸
-(CGSize) collectionViewContentSize

需要更新layout時, 調用這個方法 有點UIView的setNeedsLayout的意思…

- invalidateLayout

說了這么多, 我覺得我理解的更深一點了, 你呢?
說的再多不如show you my demo 稍后有時間補上… [大笑.png]
這里是官方的一個Dmeohttps://github.com/mpospese/CircleLayout.git

End

—————————————

走心文章, 值得點贊 —文/夏天然后
微博-點我@夏天是個大人了 || QQ群: 498143780


注意!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系我们删除。



 
  © 2014-2022 ITdaan.com