1. 程式人生 > >iPhone開發學習筆記001——Xib介面上的控制元件與程式碼的相互關聯方法

iPhone開發學習筆記001——Xib介面上的控制元件與程式碼的相互關聯方法

(注:環境Mac OS X Lion 10.7.3 + Xcode 4.2.1 + iOS SDK 5.0.)
比如工程中添加了一個UIViewController的sub class,新建的時候選中“With XIB for user interface”,則新建完成會同時生成三個檔案:xxx.h, xxx.m, xxx.xib(前期也可是*.nib,xib和nib都指UI原始檔,後來蘋果統一用xib字尾名了)。

xxx.h預設內容:
#import <UIKit/UIKit.h>
@interface xxx : UIViewController
@end


xxx.m預設內容:

除了工程自動新增的介面,其它的任何內容都沒有。

*.xib預設有一個view,這個就是UIViewController的預設view,也是其它的任何子view都沒有新增.  此時從Xcode的Object Library中拖兩個控制元件到該view:一個label,一個button.
最後如下圖:


此後在xxx.h中也新增一個UILabel和一個UIButton,並且做為屬性。此時會發現Xcode自動在屬性的定義旁邊生成了兩個用於連線的小圓標誌,如下圖:

可以看到上面對應的成員變數註釋掉了,其實在以前的老版本上面是必須要寫上的,表示對應的@property和@synthesize生成的屬性訪問器getter setter方法操作的是這兩個成員變數。後期的版本成員變數可以不用再這樣寫了。即:
(1)以前的版本:


標頭檔案:
@interface
xxx :UIViewController {
    UILabel *label;
    UIButton *button;
}

@property (nonatomic,retain)IBOutletUILabel *label;
@property (nonatomic,retain)IBOutletUIButton *button;
@end

*.m原始檔:
@implementation xxx
@synthesize
label;
@synthesize button;
。。。

(2)Xcode 4.2的版本:

標頭檔案:
@interface
 xxx : 

UIViewController {
//    UILabel *label;
//    UIButton *button;
}

@property (nonatomic,retain)IBOutletUILabel *label;
@property (nonatomic,retain)IBOutletUIButton *button;
@end

*.m原始檔:
@implementation xxx
@synthesize
 label = _label;
@synthesize button = _button;
。。。

後來的版本表示屬性訪問方法預設操作的是_lable和_button成員變數。標頭檔案中省寫了,當然*.m中也還是可以像以前那樣寫,不用在後面新增=_label和=_button也沒有任何問題,應該是編譯器預設作處理了。細節沒多追究。

現在原始碼中有label和button,對應的xib檔案中也有label和button,現在想把它們對應聯絡起來,畢竟很多時候一些動態的效果是需要程式碼來實現的。現在介紹方法:

方法:“拖拽”
如下圖:

注意右上腳Editor位置,將檢視打到assistant editor,使顯示方式變成上面左邊是xxx.xib,右邊是xxx.h,此時點中右側label property宣告左側的小圓,按住並移向左側xib檢視區域的Label控制元件上面。Xcode產生連線,此時鬆開即完成介面上label和程式碼中label屬性的連線,button同理。連完後相應的小圓變成實心。滑鼠移到上面,會變成+號,並且左側xib介面上會顯示已經和介面上哪個控制元件建立了連線。
如下圖:

這就是所謂的拖拽方法,然後就可以在*.m檔案裡面隨意控制該控制元件的顯示樣式了,包括背景顏色、背景影象,圓角,字型大小,所顯示的文字等等。

補充:
最近在網上偶然看到一位大牛的博文,對Xcode4中xib的繫結原理又有了新的理解,下面摘錄原文敘述如下:
1. 第一步:設定xib檔案的File's Owner的class屬性:
在xib檔案中有一個最重要的就是File's Owner,這個物件指的就是Class屬性中設定的那個類的物件。只有設定了Class屬性中的類才有辦法進行xib介面上的控制元件與IBOutlet與IBAction的繫結關聯。也就是說要先檢查xib檔案中的File's Owner的屬性Class是否設定正確,然後再去設定對應的Outlet與Action。即設定了File's Owner對應的實體類之後Xcode就知道這個實體類有哪些IBOutet與IBAction,這樣在拖動進行連線的時候就會顯示實體類的標頭檔案中定義好的IBOulet與IBAction。


2. 第二步:在上面指定的所屬類標頭檔案中,宣告IBOutlet與IBAction:
在標頭檔案中宣告IBOutlet與IBAction這兩個作用就是讓編譯器知道這些屬性與事件呼叫是公共給介面呼叫的。IBOutet就是把介面(xib)中的物件讀取到實現類中,這樣就可以在實現類中對這些介面控制元件進行屬性的設定,從而改為介面的展示。


3. 第三步:在xib編輯器中(IB)進行關聯繫結(選中xib的File's Owner,Utilities視窗切換到connections inspector選項卡)
將connections inspector選項卡下的Outlets(如果在指定所屬類的標頭檔案中宣告有IBOutlet),和Received Actions(如果有指定所屬類的標頭檔案中宣告有IBAction)與中間視窗中的Objects下的控制元件相拖拽連線。
具體即通過左鍵拖動關聯介面控制元件與實現類的IBOulet或IBAction即可完成介面編輯與繫結的操作。
放兩張圖:
Outlets:


Received Actions:


在此再次感謝這位大牛的部落格!