很多朋友問鸦泳，如何快速創(chuàng)建行列布局银锻？如果要創(chuàng)建5行8列的布局，如何快速實現(xiàn)做鹰？其實很簡單击纬，只要通過frame，確定兩個因素就可以設(shè)置了钾麸。以其中兩行三列為例子更振。
1.列數(shù)
2.按鈕的大小
要如何實現(xiàn)快速行列的布局呢？
首先先創(chuàng)建按鈕的時候饭尝，讓按鈕先顯示在最中間位置肯腕。
先付上最終實現(xiàn)的代碼如下
for (int i = 0; i<images.count; i++) {
XMGVerticalButton *button = [[XMGVerticalButton alloc] init];
// 設(shè)置內(nèi)容
button.titleLabel.font = [UIFont systemFontOfSize:14];
[button setTitle:titles[i] forState:UIControlStateNormal];
[button setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
[button setImage:[UIImage imageNamed:images[i]] forState:UIControlStateNormal];
// 設(shè)置frame
button.width = buttonW;
button.height = buttonH;
int row = i / maxCols;
int col = i % maxCols;
button.x = buttonStartX + col * (xMargin + buttonW);
button.y = buttonStartY + row * buttonH;
[self.view addSubview:button];
}
Paste_Image.png
此時只是6個按鈕重疊在一起了，要把他們分開钥平，我的做法是先設(shè)置Y值实撒，然后再設(shè)置每個按鈕的X值。
此刻，應(yīng)該要確定的是有多少列知态，確定列數(shù)之后捷兰，計算出按鈕起始Y值，
如何求起始的Y值：
CGFloat buttonStartY=(JDScreenH-2*buttonH)*0.5;
button.y=buttonStartY +row*buttonH;
button.y=起始的Y值+列數(shù)*button的高度
效果如下：
Paste_Image.png
此時還差X值：
x值的計算肴甸，應(yīng)該考慮到左右兩邊的間距寂殉，如果要設(shè)置間距margin=15，那么中間的大的間距=（屏幕寬度-2倍的間距）/（按鈕的列數(shù)-1）
CGFloat buttonMargin =(JDScreenW-2*buttonStartX-maxCols*buttonW)/(maxCols-1);
button.x=buttonStartX+col*(buttonW+buttonMargin);
效果如圖：
總結(jié)：如果要快速設(shè)置這種流水布局原在，先確定多少列友扰，按鈕的大小，然后直接套公式：
按鈕的X=起始的X值+列數(shù)*（按鈕的寬度+中間間距）
按鈕的Y=起始的Y值+列數(shù)*button的高度
其中：
起始的Y值=（屏幕的高度-按鈕行數(shù)按鈕的高度）0.5
起始的X值=自己定義庶柿。
最終的效果就簡單的實現(xiàn)了：
Paste_Image.png
原著出自喬丹JD--《IOS開發(fā)》專題村怪，如需轉(zhuǎn)載請注明出處，歡迎廣大朋友投稿浮庐。喬丹postTime-2016-4-20
