我們在項(xiàng)目中經(jīng)常看見這樣的效果
我們第一印象是個(gè)UICollectionView 可是是否發(fā)現(xiàn)這個(gè)不需要去創(chuàng)建一個(gè)UICollectionView
我們只需要六個(gè)按鈕就可以了，當(dāng)然 如果很多的話，也是一樣的我們只需要改變個(gè)數(shù)就可以了
廢話不多說 直接上代碼
小弟為了給大家方便理解，給大家每一行都加了注釋
![Uploading 2406962-d7d7867e64c1596b_785170.png . . .]
給大家看一下效果圖
如果你不是需要8個(gè)按鈕，而是需要9個(gè) 只需要改一下個(gè)數(shù)就可以了，是不是很方便。
同時(shí)，如果你需要改變每個(gè)按鈕的大小，直接改變那個(gè)寬:W 高:W的值就可以了。
這里涉及到一個(gè)自定義按鈕，我就下篇文章告訴大家吧，這個(gè)其實(shí)也很簡單，為了大家方便，快速的使用起來，我給大家上代碼，可以直接復(fù)制過去使用
int totalColumns = 4; // 每行放多少個(gè)
//按鈕的寬
CGFloat W = 80;
//按鈕的高
CGFloat H = W;
//按鈕之間的間隔 同時(shí)也是按鈕距離左右屏幕的間隔
CGFloat margin = (self.view.frame.size.width - totalColumns*W)/(totalColumns + 1);
//總數(shù)是多少個(gè)
NSInteger number = 8;
//循環(huán)創(chuàng)建按鈕
for (int i = 0; i < number; i++)
{
//自定義按鈕
UIButton *button = [UIButton buttonWithType:UIButtonTypeCustom];
//決定在哪一行
int row = i /totalColumns;
//決定在哪一列
int col = i %totalColumns;
//按鈕的背景顏色
button.backgroundColor = [UIColor redColor];
//給按鈕設(shè)圖片
[button setImage:[UIImage imageNamed:@"1.jpg"] forState:UIControlStateNormal];
//每個(gè)按鈕的X值
CGFloat X = margin + col *(W + margin);
//每個(gè)按鈕的Y值
CGFloat Y = 20 + row*(H + margin);
//按鈕尺寸大小和位置
button.frame = CGRectMake(X, Y, W, H);
//每個(gè)按鈕添加到父控件上
[self.view addSubview:button];
}
還有需求是這樣的
當(dāng)然如果你需要讓他們左右兩邊沒有邊距，但是中間所有的按鈕都有邊距，然后文字在圖片的下面，我們知道系統(tǒng)提供的按鈕設(shè)置圖片和文字的話，圖片在左邊，文字會(huì)在圖片 所以我們需要自定義按鈕 右邊看效果圖
同樣直接給大家上代碼哈
這里涉及到一個(gè)自定義按鈕，我就下篇文章告訴大家吧，這個(gè)其實(shí)也很簡單，為了大家方便，快速的使用起來，我給大家上代碼，可以直接復(fù)制過去使用
// 每行放多少個(gè)
int totalColumns = 3;
//每個(gè)按鈕的寬
CGFloat W = WIDTH/3;
//每個(gè)按鈕的高
CGFloat H = W;
//總數(shù)是多少個(gè)
int number = 12;
//創(chuàng)建按鈕
for (int i = 0; i < number; i++)
{
//自定義按鈕
CustomButton *button = [CustomButton buttonWithType:UIButtonTypeCustom];
//按鈕所在哪一行
int row = i / totalColumns;//行
//按鈕所在哪一列
int col = i % totalColumns;//列
//按鈕設(shè)置圖片
[button setImage:[UIImage imageNamed:@"1.jpg"] forState:UIControlStateNormal];
//按鈕設(shè)置文字
[button setTitle:@"你好" forState:UIControlStateNormal];
//按鈕的X
CGFloat X = col * (W + 1);
//按鈕的Y
CGFloat Y = row * (H + 1);
//按鈕的尺寸位置
button.frame = CGRectMake(X, Y, W, H);
//添加都父控件
[self.view addSubview:button];
}
最后給大家看一下思路，直接看圖，基本就懂了
備注：
如果有不足或者錯(cuò)誤的地方還望各位讀者批評指正，可以評論留言，筆者收到后第一時(shí)間回復(fù)。
QQ/微信：2366889552 /lan2018yingwei。
簡書號：凡塵一笑：[簡書]
http://m.itdecent.cn/users/0158007b8d17/latest_articles
感謝各位觀眾老爺?shù)拈喿x，如果覺得筆者寫的還湊合，可以關(guān)注或收藏一下，不定期分享一些好玩的實(shí)用的demo給大家。
文／凡塵一笑（簡書作者）
原文鏈接： http://m.itdecent.cn/p/8ae080edb3ea
著作權(quán)歸作者所有，轉(zhuǎn)載請聯(lián)系作者獲得授權(quán)，并標(biāo)注“簡書作者”。
