1. 前言及案例說明

  上篇內(nèi)容我們學習了標簽和按鈕,下面呢 我們通過一個具備用戶交互功能的工程案例進一步練習這兩個控件的使用,以及動作和輸出口的控制。 

 

  此案例基于上篇內(nèi)容的界面設計,功能的概念流程如圖:

大學生就業(yè)培訓,高中生培訓,在職人員轉行培訓,企業(yè)團訓

 

  此案例的動作和輸出口機制如圖:

大學生就業(yè)培訓,高中生培訓,在職人員轉行培訓,企業(yè)團訓

 

 

 

2. 什么是動作?

  動作是為了響應一個控件的事件而定義的方法,類似于.NET中WinForm為控件某一事件添加的動作方法:

1 private void OnClick(object sender, EventArgs e) {2     // ...3 }

 

  不過在iOS中,動作代碼的返回值類型為IBAction,示例代碼如下:

1 @IBAction func onClick(sender: AnyObject) {2     // ...3 }

 

  該方法的返回類型是IBAction,說明這個方法是一個動作。

  與.NET WinForm中動作方法相同:sender是參數(shù),是事件源,表示發(fā)出當前事件的控件對象,也可以省略如下:

1 @IBAction func onClick() {2     // ...3 }

 

 

 

3. 什么是輸出口?

注意:

  “輸出口”這玩意兒叫法挺奇葩,可能有的朋友不理解,我就從.NET和Android方面舉兩個例子吧(別的我也不會。。)。

  大家能聽懂最好,聽不懂的話不必深究這兩個例子,直接轉眼來看iOS的就行了。

 

  在.NET WinForm的設計界面中,我們拖放一個控件,VS會自動在當前窗體的后置代碼(xxx.Designer.cs)中生成響應的控件創(chuàng)建代碼。

  這樣,我們就可以在前置代碼文件中使用 this.控件名 來訪問后置代碼中的控件變量,從而操作窗體上的控件。

 

  在Android中,我們在設計界面上擺放控件之后,如果需要在代碼文件中訪問該控件,例如:

1 Button btn = (Button)findViewByid(R.id.btnXXX);

  這樣就可以在功能代碼中,通過對象btn來控制界面上id為btnXXX的控件了。

 

  從這兩個例子大家應該就能猜到了,iOS中的“輸出口”其實指的就是上面這個控件在功能代碼中的對象。

 

  在iOS中,為了使控件的某個事件與定義的動作關聯(lián)在一起,我們可以通過Interface Builder或者代碼建立關聯(lián),本篇中我們重點是用第一種方式。

  跟動作一樣,我們也需要為輸出口和控件建立聯(lián)系,這里也可以通過Interface Builder或者代碼來實現(xiàn)。

 

提示:

  Interface Builder設計器就是Interface Builder,在Xcode 4之后被集成到Xcode工具中。

  打開Storyboard故事板或xib文件,就會自動打開Interface Builder設計器。

 

 

 

4. 實戰(zhàn)

  為了實現(xiàn)本篇的目標案例,使按鈕能夠控制標簽,我們需要給標簽定義并連接輸出口,給按鈕實現(xiàn)動作。

 

  點擊右上角的“打開輔助編輯器”按鈕,打開如圖的界面,這樣,就可以在設計界面的同時編寫功能代碼了:

 大學生就業(yè)培訓,高中生培訓,在職人員轉行培訓,企業(yè)團訓

 

  選中標簽Label,同時按住control鍵,將其拖拽到右邊的輔助編輯器窗口后松開鼠標,如圖所示:

大學生就業(yè)培訓,高中生培訓,在職人員轉行培訓,企業(yè)團訓 

 

  松開鼠標后,會彈出一個對話框,如圖,在Connection欄中選擇Outlet,設置輸出口名稱為Label1,Type類型為UILabel:

大學生就業(yè)培訓,高中生培訓,在職人員轉行培訓,企業(yè)團訓

 

  點擊Connect按鈕,便會發(fā)現(xiàn)右側的輔助編輯器中自動添加了如下代碼:

大學生就業(yè)培訓,高中生培訓,在職人員轉行培訓,企業(yè)團訓

 

  按照同樣的方式,按住control鍵,將Button按鈕拖拽到輔助編輯器窗口,設置如下:

大學生就業(yè)培訓,高中生培訓,在職人員轉行培訓,企業(yè)團訓

 

  點擊Connect按鈕,便會發(fā)現(xiàn)右側的輔助編輯器中生動添加了一個動作方法:

大學生就業(yè)培訓,高中生培訓,在職人員轉行培訓,企業(yè)團訓

 

  我們在動作方法onClick中實現(xiàn)如下代碼:

大學生就業(yè)培訓,高中生培訓,在職人員轉行培訓,企業(yè)團訓

 

  這樣,當我們點擊Button按鈕的時候,就會響應執(zhí)行onClick動作方法,從而通過Label1對象,修改其綁定的標簽的text文本內(nèi)容。

 

  案例運行效果如下:

大學生就業(yè)培訓,高中生培訓,在職人員轉行培訓,企業(yè)團訓 

 

 

5. 小結

  雖然應用并不是多么的高大上,但是畢竟是咱們親手做出來的第一個案例。還是蠻激動的。

  “麻雀雖小 五臟俱全”,我們一起加油,讓這只麻雀飛的更傲嬌、??