iOS:九宫格算法

九宫格算法的目的就是实现下图所示的布局效果

找规律:

0号控件的x = 横向间距 + 0 * (控件宽度 + 横向间距)

1号控件的x = 横向间距 + 1 * (控件宽度 + 横向间距)

2号控件的x = 横向间距 + 2 * (控件宽度 + 横向间距)

规律:

n号控件的x = 横向间距 + 列数 * (控件宽度 + 横向间距)

0号控件的y = 纵向间距 + 0 * (控件高度 + 纵向间距)

4号控件的y = 纵向间距 + 1 * (控件高度 + 纵向间距)

8号控件的y = 纵向间距 + 2 * (控件高度 + 纵向间距)

规律:

n号控件的y = 纵向间距 + 行数 * (控件高度 + 纵向间距)

xib视图的.h文件:

#import <UIKit/UIKit.h>

@interface MCView : UIView
@property(nonatomic,assign)NSInteger index;
@end

xib视图的.m文件:

#import "MCView.h"

@interface MCView ()
@property (weak, nonatomic) IBOutlet UILabel *numLabel;

@end

@implementation MCView

- (instancetype)init{
    return [[[NSBundle mainBundle] loadNibNamed:@"MCView" owner:nil options:nil] lastObject];
}

- (void)setIndex:(NSInteger)index{
    _index = index;
    self.numLabel.text = [NSString stringWithFormat:@"%ld",(long)index];
}
@end

主控器中的视图:

<pre name="code" class="objc">#import "ViewController.h"
#import "MCView.h"

@interface ViewController ()

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
//xib视图的宽
#define kXibViewW 70
//xib视图的高
#define kXibViewH 70
//纵向间距
#define kMarginY 30
//列数 也就是每一行放几个视图
#define kColCount 4
//xib视图的个数
#define sum 19
    //横向间距
    CGFloat marginX = (self.view.bounds.size.width - kColCount * kXibViewW) / (kColCount + 1);
    for (int i = 0; i < sum; i++) {
        //列数
        int col = i % kColCount;
        //行数
        int row = i / kColCount;
        //xib视图的x值(横向间距 + 列数 * (横向间距 + 视图宽度))
        CGFloat xibViewX = marginX + col * (marginX + kXibViewW);
        //xib视图的y值(纵向间距 + 行数 * (纵向间距 + 视图宽度))
        CGFloat xibViewY = kMarginY + row * (kMarginY + kXibViewH);
        MCView *view = [[MCView alloc] init];
        //设置xib视图的frame值
        view.frame = CGRectMake(xibViewX, xibViewY, kXibViewW, kXibViewH);
        view.index = i;
        //将视图添加到父视图
        [self.view addSubview:view];
    }
}
@end