UICollectionView是iOS开发中很重要的控件容器，我的经验中如果需要横向滚动或者九宫格和瀑布流的页面都会用UICollectiongView来作为视图的容器
还是先提出需求，然后用OC和Swift纯手码给出解决方案，最后如果可以的话会分析下下.h的代理方法。

---

需求一：横向滚动（广告轮播图）

7.png

解决方案

OC

#define SCREENWIDTH [UIScreen mainScreen].bounds.size.width
#define SCREENHEIGHT [UIScreen mainScreen].bounds.size.height
/**< rgb值设置颜色 */
#define RGBCOLOR(r,g,b) [UIColor colorWithRed:(r)/255.0f green:(g)/255.0f blue:(b)/255.0f alpha:1]
/**< 16进制值设置颜色 */
#define UIColorFromRGB(rgbValue) [UIColor colorWithRed:((float)((rgbValue & 0xFF0000) >> 16))/255.0 green:((float)((rgbValue & 0xFF00) >> 8))/255.0 blue:((float)(rgbValue & 0xFF))/255.0 alpha:1.0]
/**< 16进制值设置颜色和透明度 */
#define UIColorFromRGBA(rgbValue,alph) [UIColor colorWithRed:((float)((rgbValue & 0xFF0000) >> 16))/255.0 green:((float)((rgbValue & 0xFF00) >> 8))/255.0 blue:((float)(rgbValue & 0xFF))/255.0 alpha:alph]
/**< 随机颜色 */
#define randomColor RGBCOLOR(arc4random_uniform(255)%255, arc4random_uniform(255)%255, arc4random_uniform(255)%255)

@interface RootViewController : UIViewController<UICollectionViewDelegate,UICollectionViewDataSource,UICollectionViewDelegateFlowLayout>
@property (nonatomic, strong) UICollectionView *collectionView;
@end

@implementation RootViewController
- (void)viewDidLoad{
    [super viewDidLoad];
    self.title = @"横向滚动";
    self.view.backgroundColor = randomColor;
    [self.view addSubview:self.collectionView];
}

#pragma mark==collectionView
- (UICollectionView *)collectionView{
    if (!_collectionView) {
        //layout  --》collectionView的布局类
        UICollectionViewFlowLayout *layout = [[UICollectionViewFlowLayout alloc]init];
        //最小行间距
        layout.minimumLineSpacing = 0;
        //最小列间距
        layout.minimumInteritemSpacing = 0;
        //滚动方向：横向和竖向
        layout.scrollDirection = UICollectionViewScrollDirectionHorizontal;
        
        //collectionView初始化
        _collectionView = [[UICollectionView alloc]initWithFrame:self.view.bounds collectionViewLayout:layout];
        _collectionView.delegate = self;
        _collectionView.dataSource = self;
        _collectionView.pagingEnabled = YES;
        _collectionView.backgroundColor = randomColor;
        //注册cell
        [_collectionView registerClass:[UICollectionViewCell class] forCellWithReuseIdentifier:@"cell"];
    }
    return _collectionView;
}
//collectionView's delegate and datasource:
- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section{
    return 3;
}
- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath{
    return CGSizeMake(SCREENWIDTH, SCREENHEIGHT);
}
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath{
    UICollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:@"cell" forIndexPath:indexPath];
    cell.backgroundColor = randomColor;
    return cell;
}
@end

#pragma mark==========MYFAppDelegate
@interface MYFAppDelegate : NSObject<UIApplicationDelegate>
@property (nonatomic, strong) UIWindow *window;
@end
@implementation MYFAppDelegate
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions{
    
    self.window = [[UIWindow alloc]initWithFrame:CGRectMake(0, 0,SCREENWIDTH,SCREENHEIGHT)];
    UINavigationController *nav = [[UINavigationController alloc]initWithRootViewController:[[RootViewController alloc]init]];
    self.window.rootViewController = nav;
    [self.window makeKeyAndVisible];
    return YES;
}

@end
#pragma mark==========程序入口
int main(int argc, char * argv[]) {
    @autoreleasepool {
        return UIApplicationMain(argc, argv, nil, NSStringFromClass([MYFAppDelegate class]));
    }
}

8.gif

Swift

let SCREENWIDTH = UIScreen.mainScreen().bounds.size.width
let SCREENHEIGHT = UIScreen.mainScreen().bounds.size.height

class ViewController: UIViewController,UICollectionViewDelegate,UICollectionViewDataSource{

    var collectionView:UICollectionView!
    
    override func viewDidLoad() {
        super.viewDidLoad()
        self.setupUI()
    }
    
    func setupUI() {
        self.view.backgroundColor = UIColor.yellowColor()
        self.title = "横向滚动"
        //layout
        let layout:UICollectionViewFlowLayout = UICollectionViewFlowLayout()
        layout.minimumLineSpacing = 0
        layout.minimumInteritemSpacing = 0
        layout.scrollDirection = .Horizontal
        layout.itemSize = self.view.bounds.size
        //collectionView
        collectionView = UICollectionView.init(frame:self.view.bounds, collectionViewLayout:layout)
        collectionView.delegate = self
        collectionView.dataSource = self
        collectionView.pagingEnabled = true
        collectionView.registerClass(UICollectionViewCell.classForCoder(), forCellWithReuseIdentifier: "cell")
        collectionView.backgroundColor = UIColor.yellowColor()
        self.view.addSubview(collectionView)
    }

    func collectionView(collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
        return 3;
    }
    
    func collectionView(collectionView: UICollectionView, cellForItemAtIndexPath indexPath: NSIndexPath) -> UICollectionViewCell {
        let cell:UICollectionViewCell! = collectionView.dequeueReusableCellWithReuseIdentifier("cell", forIndexPath: indexPath)
        let colorArray : [UIColor] = [UIColor.blueColor(),UIColor.redColor(),UIColor.yellowColor()]
        cell.contentView.backgroundColor = colorArray[indexPath.row]
        return cell
        
    }

}

9.gif

需求二 内边距

通过设置collectionView的collectionViewLayout属性来设置collection的内边距

sectionn内边距

方案一

let layout:UICollectionViewFlowLayout = UICollectionViewFlowLayout()
        layout.sectionInset = UIEdgeInsetsMake(100, 40,100, 40);

10.gif

方案二

** 用section代替row**

11.gif

需求三：九宫格

Paste_Image.png

OC

#import "ViewController.h"

#define SCREENWIDTH [UIScreen mainScreen].bounds.size.width
#define SCREENHEIGHT [UIScreen mainScreen].bounds.size.height
@interface ViewController ()<UICollectionViewDelegate,UICollectionViewDataSource,UICollectionViewDelegateFlowLayout>
@property (nonatomic, strong) UICollectionView *collectionView;
@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    
    UICollectionViewFlowLayout *layout = [[UICollectionViewFlowLayout alloc]init];
    layout.itemSize = CGSizeMake(SCREENWIDTH*0.3-33, SCREENWIDTH*0.3-33);
    layout.minimumLineSpacing = 10;
    layout.minimumInteritemSpacing = 10;
    layout.sectionInset = UIEdgeInsetsMake(64, 20, 64, 20);
    self.collectionView = [[UICollectionView alloc]initWithFrame:self.view.bounds collectionViewLayout:layout];
    self.collectionView.delegate = self;
    self.collectionView.dataSource = self;
    [self.collectionView registerClass:[UICollectionViewCell class] forCellWithReuseIdentifier:@"cell"];
    self.collectionView.backgroundColor = [UIColor whiteColor];
    [self.view addSubview:self.collectionView];
}
- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section{
    return 9;
}
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath{
    UICollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:@"cell" forIndexPath:indexPath];
    cell.backgroundColor = [UIColor colorWithRed:arc4random_uniform(255)/255.0 green:arc4random_uniform(255)/255.0 blue:arc4random_uniform(255)/255.0 alpha:1];
    return cell;
}
@end

Swift

import UIKit
let SCREENWIDTH = UIScreen.mainScreen().bounds.size.width
let SCREENHEIGHT = UIScreen.mainScreen().bounds.size.height

class ViewController: UIViewController ,UICollectionViewDataSource,UICollectionViewDelegate{
    var collectionView:UICollectionView!
    
    override func viewDidLoad() {
        super.viewDidLoad()
        let layout:UICollectionViewFlowLayout = UICollectionViewFlowLayout()
        layout.itemSize = CGSizeMake(SCREENWIDTH*0.33-33, SCREENWIDTH*0.33-33)
        layout.minimumInteritemSpacing = 10
        layout.minimumLineSpacing = 10
        layout.sectionInset = UIEdgeInsetsMake(64, 20, 64, 20)
        collectionView = UICollectionView.init(frame: self.view.bounds, collectionViewLayout: layout)
        collectionView.delegate = self
        collectionView.dataSource = self
        collectionView.registerClass(UICollectionViewCell.classForCoder(), forCellWithReuseIdentifier:"cell")
        collectionView.backgroundColor = UIColor.whiteColor()
        self.view.addSubview(collectionView)
        
    }
    
    func collectionView(collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
        return 9;
    }
    func collectionView(collectionView: UICollectionView, cellForItemAtIndexPath indexPath: NSIndexPath) -> UICollectionViewCell {
        let cell:UICollectionViewCell = collectionView.dequeueReusableCellWithReuseIdentifier("cell", forIndexPath: indexPath)
        cell.backgroundColor = UIColor.init(red:CGFloat(arc4random_uniform(255))/255.0, green: CGFloat(arc4random_uniform(255))/255.0, blue: CGFloat(arc4random_uniform(255))/255.0, alpha: 1)
        return cell
        
    }
}

Paste_Image.png

需求四：瀑布流

瀑布流其实是不规则的九宫格

1.jpg