日常開(kāi)發(fā)中带欢，我們不能老是用collectionView去寫(xiě)运授，在某些場(chǎng)景中colectionView太重，好比用大炮打蚊子....
bg.png
成果
result.png
代碼
CGFloat margin_X = 1; // 水平間距
CGFloat _margin_Y = 1; // 數(shù)值間距
CGFloat itemWidth = 50; // 寬
CGFloat itemHeight = 50; // 高
int totalColumns = 3; // 每行最大列數(shù)（影響到底幾個(gè)換行）
NSInteger sourceNumber = 20; // 數(shù)據(jù)源
for(int index = 0; index < sourceNumber; index++) {
UIView * itemView = [[UIView alloc]init];
itemView.backgroundColor = [UIColor redColor];
int row = index / totalColumns;
int col = index % totalColumns;
NSLog(@"index----%d totalColumns------%ld row ------%d col--------%d",index,totalColumns,row,col);
CGFloat cellX = col * (itemWidth + _margin_X);
CGFloat cellY = row * (itemHeight + _margin_Y);
itemView.frame = CGRectMake(cellX,cellY, itemWidth, itemHeight);
[self.view addSubview:itemView];
}
打印日志
2019-05-14 09:56:09.269396+0800 九宮格算法[2642:91676] index----0 totalColumns------3 row ------0 col--------0
2019-05-14 09:56:09.269786+0800 九宮格算法[2642:91676] index----1 totalColumns------3 row ------0 col--------1
2019-05-14 09:56:09.269931+0800 九宮格算法[2642:91676] index----2 totalColumns------3 row ------0 col--------2
2019-05-14 09:56:09.270099+0800 九宮格算法[2642:91676] index----3 totalColumns------3 row ------1 col--------0
2019-05-14 09:56:09.270240+0800 九宮格算法[2642:91676] index----4 totalColumns------3 row ------1 col--------1
2019-05-14 09:56:09.270368+0800 九宮格算法[2642:91676] index----5 totalColumns------3 row ------1 col--------2
2019-05-14 09:56:09.270502+0800 九宮格算法[2642:91676] index----6 totalColumns------3 row ------2 col--------0
2019-05-14 09:56:09.270653+0800 九宮格算法[2642:91676] index----7 totalColumns------3 row ------2 col--------1
2019-05-14 09:56:09.270796+0800 九宮格算法[2642:91676] index----8 totalColumns------3 row ------2 col--------2
2019-05-14 09:56:09.270924+0800 九宮格算法[2642:91676] index----9 totalColumns------3 row ------3 col--------0
2019-05-14 09:56:09.271046+0800 九宮格算法[2642:91676] index----10 totalColumns------3 row ------3 col--------1
2019-05-14 09:56:09.271272+0800 九宮格算法[2642:91676] index----11 totalColumns------3 row ------3 col--------2
2019-05-14 09:56:09.271583+0800 九宮格算法[2642:91676] index----12 totalColumns------3 row ------4 col--------0
2019-05-14 09:56:09.271802+0800 九宮格算法[2642:91676] index----13 totalColumns------3 row ------4 col--------1
2019-05-14 09:56:09.272071+0800 九宮格算法[2642:91676] index----14 totalColumns------3 row ------4 col--------2
2019-05-14 09:56:09.272347+0800 九宮格算法[2642:91676] index----15 totalColumns------3 row ------5 col--------0
2019-05-14 09:56:09.272669+0800 九宮格算法[2642:91676] index----16 totalColumns------3 row ------5 col--------1
2019-05-14 09:56:09.272932+0800 九宮格算法[2642:91676] index----17 totalColumns------3 row ------5 col--------2
2019-05-14 09:56:09.273169+0800 九宮格算法[2642:91676] index----18 totalColumns------3 row ------6 col--------0
2019-05-14 09:56:09.273545+0800 九宮格算法[2642:91676] index----19 totalColumns------3 row ------6 col--------1
結(jié)論
從上面打印 可以發(fā)現(xiàn)一個(gè)規(guī)律
index / totalColumns = row
Index % totalColumns = col
行數(shù) = 編號(hào) / 每行最大列數(shù)
列數(shù) = 編號(hào) % 每行最大列數(shù)
所以我們的view 位置就可以寫(xiě)成
CGFloat cellX = col * (itemWidth + _margin_X);
CGFloat cellY = row * (itemHeight + _margin_Y);
itemView.frame = CGRectMake(cellX,cellY, itemWidth, itemHeight);
