1.我们在做APP应用中经常需要去动态的排版九宫格列表的界面,所以我们需要了解九宫格的算法。
九宫格算法的核心思路:
列号计算:i % 列数 列号用来计算X
行号计算:i / 列数 行号用来计算Y
每一个应用视图的X = 左边距 + (应用视图的宽 + 应用左右间距)* 列号
每一个应用视图的Y = 上边距 + (应用视图的高 + 应用上下间距)* 行号
2.例子说明九宫格算法
效果图:
3.关键代码实现:
//根据数据对象设计界面排版
NSInteger columnCount = 3;
//self.apps.count 是需要设置的应用图标个数
for (NSInteger i = 0; i < self.apps.count; i++) {
//创建一个视图
UIView *appView = [[UIView alloc]init];
//使用九宫格算法,排版视图
//设置视图的宽
CGFloat appViewW = 100;
//设置视图的高
CGFloat appViewH = 120;
//计算列号
NSInteger column = i % columnCount;
//间隔
CGFloat margin = 20;
//左边距
CGFloat leftMargin = (self.view.bounds.size.width - appViewW * columnCount - margin * (columnCount -1)) * 0.5;
//计算AppX
CGFloat appViewX = leftMargin + (appViewW + margin) * column;
//行号
NSInteger row = i / columnCount;
//上边距
CGFloat topMargin = margin;
//计算AppY
CGFloat appViewY = topMargin + (appViewH + margin) * row;
//设定appView的frame
appView.frame = CGRectMake(appViewX, appViewY, appViewW, appViewH);
//设置appView的属性
appView.backgroundColor = [UIColor redColor];
[self.view addSubview:appView];
}