我以前是做windows phone開發的，後來轉做IOS的開發，因此很多windows phone上面的開發經驗也被我帶到了IOS中。其實有些經驗本身跟平台無關，跟平台有關的無非就是實現方法而已。好了，廢話不多說。

  我今天給大家介紹一個IOS自動華布局的輔助類(UIPanel   UIStackPanel  UIGridPanel)，做過windows phone開發的同學看到這三個類肯定很眼熟，沒錯，這三個類正是windows phone布局的核心，只是名稱稍微有點不一樣而已。   我先介紹下我開發這個類庫的背景，有助於大家理解我為什麼要這麼做。   在IOS上開發程序的界面目前有三種方式，第一種純代碼開發，第二種使用XIB開發，第三種是使用storyboard開發。先不說哪種方式好吧，三種方式各有優劣，我本身開發是傾向於純代碼開發的，因為我一開是學IOS的時候使用XIB做的，有可能是我對XIB不是很熟練，XIB跟windows phone的界面開發兩項一比較，我實在沒有興趣繼續使用XIB來開了，storyboard是後來才出的一種技術，所以我一開始幾乎就是一直采用純代碼的方式來開發IOS的界面。   純代碼的方式在固定分辨率下開發還是不錯的選擇，但是遇到可以旋轉界面或者要適配ipad那就有點力不從心了。對於這個問題，在蘋果還沒推出autolayout這個技術之前基本沒辦法。但是蘋果從IOS6.0開始引入了autolayout的技術，自從這個技術的引入使用xib來開發界面就變得相對比較方便了，如果還是用純代碼來做autolayout就顯得無比的蛋疼了，當然熟悉以後還是很好用的啦(但是看著一堆的約束信息就顯得郁悶了)。   最近在考慮這個問題的時候靈機一動，突然想到能否參考windows phone上面的布局方式呢，既然IOS6.0已經加入了autolayout技術，那麼我是否可以使用autolayout技術開發一個類似windows phone中的stackpanle和gridview 那樣的控件呢，想到就干。花了幾天時間的研究還真被我研究出來了。這就是我前面提到的(UIPanel   UIStackPanel  UIGridPanel)三個類。   我先介紹下這三個類的使用方法   UIPanel，UIPanel是所有其他派生panel的基類。添加到其中的subview的大小都跟uipanel的大小一樣。 UIStackPanel，UIStackPanel繼承UIPanel，UIStackPanel有一個屬性isHorizontal，就是subviews的排列是否是水平排列，默認是垂直自上而下的排列，添加到UIStackPanel中的subview如果是垂直排序，那麼subview的寬度跟UIStackPanel的寬度一樣，高度通過UIView的擴展屬性size來控制。反之如果是水平排列，那麼subview的高度跟UIStackPanel的高度一樣，寬度通過UIView的擴展屬性size來控制。 UIGridPanel，UIGridPanel繼承UIPanel，UIGridPanel類似表格，有rows和colums的兩個屬性，可以指定subview的row和colum的擴展屬性來實現詳細的排列，甚至可以通過subview的rowSpan和columSpan兩個擴展屬性實現跨多列或多行布局。           上面的截圖中除了黑色的是uilable和一個clicke me的一個按鈕以外，其他每種顏色代表一個uipanel，panel裡面嵌套其他的panel就組成了如上圖的布局界面。點擊按鈕以後還能看到隨著屬性的改變，布局的方式也會改變。   下面我以代碼的形式介紹各個panel的用法。   首先是gridpanel。 復制代碼     gridPanel=[[UIGridPanel alloc] init];     gridPanel.rows=3;     gridPanel.colums=3;     gridPanel.isBindSizeToSuperView=YES;     gridPanel.margin=UIEdgeInsetsMake(20, 0, 0, 0);     gridPanel.backgroundColor=[UIColor grayColor];     [self.view addSubview:gridPanel];     currentPanle=gridPanel; 復制代碼 rows和colums屬性指定該gridpanel有三行三列。isBindSizeToSuperView屬性指定該panel的高寬是否綁定到父視圖的高寬。如果綁定了，那麼只要父視圖的高寬改變，子視圖的高寬也一並跟著變。margin屬性指定該視圖左上右下四個方向的間距，這個指定gridpanel永遠距離頂部20像素。現在gridpanel已經初始化完畢，後面就是添加各個子視圖了。既然是gridpanel，那麼我可能希望裡面的子視圖是對角線排列的。也就是我們需要三個子視圖。代碼如下：   復制代碼     UILabel *label = [[UILabel alloc] init];     label.backgroundColor = [UIColor blackColor];     label.textColor=[UIColor whiteColor];     label.font=[UIFont systemFontOfSize:12];     label.text = @"Label1";     label.textAlignment = NSTextAlignmentCenter;     label.size=CGSizeMake(50, 50);     label.row=0;//第一行     label.colum=0;//第一列     [currentPanle addSubview:label];               label = [[UILabel alloc] init];     label.backgroundColor = [UIColor blackColor];     label.textColor=[UIColor whiteColor];     label.font=[UIFont systemFontOfSize:12];     label.text = @"Label2";     label.textAlignment = NSTextAlignmentCenter;     label.size=CGSizeMake(50, 30);     label.row=1;//第二行     label.colum=1;//第二列     [currentPanle addSubview:label];          label = [[UILabel alloc] init];     label.backgroundColor = [UIColor blackColor];     label.textColor=[UIColor whiteColor];     label.font=[UIFont systemFontOfSize:12];     label.text = @"Label3";     label.textAlignment = NSTextAlignmentCenter;     label.size=CGSizeMake(50, 30);     label.row=2;//第三行     label.colum=2;//第三列     [currentPanle addSubview:label];         如果我想把lable2改成橫跨兩列，並且下間距為5，那麼代碼如下： 復制代碼     label = [[UILabel alloc] init];     label.backgroundColor = [UIColor blackColor];     label.textColor=[UIColor whiteColor];     label.font=[UIFont systemFontOfSize:12];     label.text = @"Label2";     label.textAlignment = NSTextAlignmentCenter;     label.size=CGSizeMake(50, 30);     label.row=1;//第二行     label.colum=1;//第二列     label.columSpan=2;//跨兩列     label.margin=UIEdgeInsetsMake(0, 0, 5, 0);     [currentPanle addSubview:label];  ：       下面介紹stackpanel的用法   先看下初始化的代碼：       復制代碼     UILabel *label = [[UILabel alloc] init];     label.backgroundColor = [UIColor blackColor];     label.textColor=[UIColor whiteColor];     label.font=[UIFont systemFontOfSize:12];     label.text = @"Label1";     label.textAlignment = NSTextAlignmentCenter;     label.size=CGSizeMake(50, 50);     [currentPanle addSubview:label];               label = [[UILabel alloc] init];     label.backgroundColor = [UIColor blackColor];     label.textColor=[UIColor whiteColor];     label.font=[UIFont systemFontOfSize:12];     label.text = @"Label2";     label.textAlignment = NSTextAlignmentCenter;     label.size=CGSizeMake(50, 30);     label.margin=UIEdgeInsetsMake(5, 0, 5, 0);     [currentPanle addSubview:label];               label = [[UILabel alloc] init];     label.backgroundColor = [UIColor blackColor];     label.textColor=[UIColor whiteColor];     label.font=[UIFont systemFontOfSize:12];     label.text = @"Label3";     label.textAlignment = NSTextAlignmentCenter;     label.size=CGSizeMake(50, 30);     [currentPanle addSubview:label]; 復制代碼     這個是垂直排列的，如果要是實現水平排列，那麼只要把stackPanel的isHorizontal屬性設為yes就可以了。   以上的布局不管在橫屏和豎屏下都能正常布局。而且自適應。   而要實現第一張圖裡面那麼復雜的布局，直接看我的demo就可以了。