iOS - UICollectionView cell間距調(diào)整

記錄UICollectionView cell間距調(diào)整方法

啥東西不經(jīng)常用就會(huì)忘記,以后要做好筆記.? (⊙o⊙)

實(shí)例化了一個(gè)CollectionView

UICollectionViewFlowLayout*layout=[[UICollectionViewFlowLayout alloc]init];layout.minimumLineSpacing=kLineSpacing;layout.minimumInteritemSpacing=kItemSpacing;layout.scrollDirection=UICollectionViewScrollDirectionVertical;_cusCollectionView=[[UICollectionView alloc]initWithFrame:CGRectMake(0,0,SCREEN_WIDTH,SCREEN_HEIGHT)collectionViewLayout:layout];_cusCollectionView.backgroundColor=[UIColor whiteColor];_cusCollectionView.delegate=self;_cusCollectionView.dataSource=self;[_cusCollectionView registerClass:[DC_CustomizeViewclass]forCellWithReuseIdentifier:CustomizeCelliIdentify];

定義的一些值

staticNSString*CustomizeCelliIdentify=@"CustomizeCelliIdentify";staticconstCGFloat kLineSpacing=5.f;//列間距 |staticconstCGFloat kItemSpacing=8.f;//item之間的間距? --staticconstCGFloat kCellMargins=5.f;//左右縮進(jìn)staticconstNSInteger kRowNumber=4;//列數(shù)staticconstCGFloat kCellHeight=80.f;//Cell高度

常用的協(xié)議方法

//MARK: - UICollectionDatasoure//顯示幾個(gè)section-(NSInteger)numberOfSectionsInCollectionView:(UICollectionView*)collectionView{return1;}//每個(gè)section中顯示多個(gè)item-(NSInteger)collectionView:(UICollectionView*)collectionView numberOfItemsInSection:(NSInteger)section{return12;}//配置單元格的方法-(UICollectionViewCell*)collectionView:(UICollectionView*)collectionView cellForItemAtIndexPath:(NSIndexPath*)indexPath{DC_CustomizeView*cell=[collectionView dequeueReusableCellWithReuseIdentifier:CustomizeCelliIdentify forIndexPath:indexPath];cell.title=[NSString stringWithFormat:@"%td - %td",indexPath.section,indexPath.item];cell.editing=YES;returncell;}//MARK: - UICollectionDelegate//每個(gè)單元格的大小size-(CGSize)collectionView:(UICollectionView*)collectionView layout:(UICollectionViewLayout*)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath*)indexPath{returnCGSizeMake((SCREEN_WIDTH-kItemSpacing*(kRowNumber-1))/kRowNumber,kCellHeight);}

以上代碼寫出的效果如下:

我是效果~~~

以上代碼,可以看到我設(shè)置item行間距是8,列間距是5,我還想設(shè)置左右的縮進(jìn).就要用到其他的協(xié)議方法.

重點(diǎn)來了~~~

調(diào)整item之間行行(橫)間距

圖是拿的別人??

調(diào)用方法如下:

UICollectionViewFlowLayout的minimumInteritemSpacing(推薦這個(gè),盡量少用協(xié)議)

協(xié)議方法

//每個(gè)item之間的間距-(CGFloat)collectionView:(UICollectionView*)collectionView layout:(UICollectionViewLayout*)collectionViewLayout minimumInteritemSpacingForSectionAtIndex:(NSInteger)section{returnkItemSpacing;}

調(diào)整item之間的列(縱)間距

圖是拿的別人??

調(diào)用方法如下:

UICollectionViewFlowLayout的minimumLineSpacing(推薦這個(gè),盡量少用協(xié)議)

協(xié)議方法

//每個(gè)item之間的間距-(CGFloat)collectionView:(UICollectionView*)collectionView layout:(UICollectionViewLayout*)collectionViewLayout minimumLineSpacingForSectionAtIndex:(NSInteger)section{returnkLineSpacing;}

調(diào)整item 的大小

UICollectionViewFlowLayout的itemSize

協(xié)議方法

//每個(gè)單元格的大小size-(CGSize)collectionView:(UICollectionView*)collectionView layout:(UICollectionViewLayout*)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath*)indexPath{returnCGSizeMake(width,height);}

調(diào)整內(nèi)容的邊距(cell的左右上下縮進(jìn))

圖是拿的別人??

UICollectionViewFlowLayout的sectionInset

協(xié)議方法:

//邊距設(shè)置:整體邊距的優(yōu)先級，始終高于內(nèi)部邊距的優(yōu)先級-(UIEdgeInsets)collectionView:(UICollectionView*)collectionView layout:(UICollectionViewLayout*)collectionViewLayout insetForSectionAtIndex:(NSInteger)section{returnUIEdgeInsetsMake(kSectionMargin,kSectionMargin,kSectionMargin,kSectionMargin);//分別為上燃辖、左匆瓜、下乏盐、右}

以上幾個(gè)協(xié)議都出自UICollectionViewDelegateFlowLayout

//item的大小-(CGSize)collectionView:(UICollectionView*)collectionView layout:(UICollectionViewLayout*)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath*)indexPath;//內(nèi)容整體邊距設(shè)置-(UIEdgeInsets)collectionView:(UICollectionView*)collectionView layout:(UICollectionViewLayout*)collectionViewLayout insetForSectionAtIndex:(NSInteger)section;//item 列間距(縱)-(CGFloat)collectionView:(UICollectionView*)collectionView layout:(UICollectionViewLayout*)collectionViewLayout minimumLineSpacingForSectionAtIndex:(NSInteger)section;//item 行間距(橫)-(CGFloat)collectionView:(UICollectionView*)collectionView layout:(UICollectionViewLayout*)collectionViewLayout minimumInteritemSpacingForSectionAtIndex:(NSInteger)section;//headerview的size-(CGSize)collectionView:(UICollectionView*)collectionView layout:(UICollectionViewLayout*)collectionViewLayout referenceSizeForHeaderInSection:(NSInteger)section;//footer的size-(CGSize)collectionView:(UICollectionView*)collectionView layout:(UICollectionViewLayout*)collectionViewLayout referenceSizeForFooterInSection:(NSInteger)section;

以上方法都有對應(yīng)的屬性:

@property(nonatomic)CGFloat minimumLineSpacing;@property(nonatomic)CGFloat minimumInteritemSpacing;@property(nonatomic)CGSize itemSize;@property(nonatomic)CGSize estimatedItemSizeNS_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;

我加上內(nèi)容的整體邊距(縮進(jìn))之后,效果如下:

我是有縮進(jìn)的效果~

作者：魏什么_多喝水

鏈接：http://www.reibang.com/p/40914d5708af

著作權(quán)歸作者所有。商業(yè)轉(zhuǎn)載請聯(lián)系作者獲得授權(quán)，非商業(yè)轉(zhuǎn)載請注明出處。