iPhone開發入門（4）---應用程式開發的第一步

這一回開始，介紹一下實際的iPhone應用程式開發的步驟。

建立Xcode工程

現在就讓我們開始第一個iPhone應用程式吧。啟動Xcode，在Xcode的菜單中點擊「檔案」→「新項目...」。

 

從模板中選擇「View-Based Application」

模板選擇「View-Based Application」。這回取得開發例子是已經登入到App Store的一款應用程式「BargainSale」，它是自動計算打折後價格的一款應用程式。取名為「BargainSale」後，選擇儲存。

儲存之後，會基於選擇的模板產生工程與原始碼檔案。我們來看看都有哪些。

原始碼檔案

 

左邊的Classes目錄中儲存了自動產生的.h和.m檔案。他們是Objective-C語言的標頭檔和原始碼檔案。

XIB檔案

XIB檔案是記錄應用程式畫面構成和配置的檔案。位於Resources目錄下。用Cocoa Touch來開發程式，編輯XIB檔案是最基本的。編輯XIB檔案的時候，使用「Interface Builder」可以在畫面上簡單，隨意的拖動各種控制項。

 

XIB檔案與Interface Builder

資源檔

其他為了製作應用程式的檔案都是資源檔。XIB檔案也是資源檔的一種，因為比較重要，就單獨羅列出來了。比較簡單的應用程式也許不需要什麼資源檔，但是隨著程式的複雜度提升，做好資源檔的管理也很重要。

Interface Builder

前面已經說到了用Xcode附帶的「Interface Builder」來編輯XIB檔案。在Xcode中雙擊XIB檔案，就會自動啟動Interface Builder。

Interface Builder啟動之後，點擊Tools→Library可以開啟標準容器庫協助。這裡羅列了 Cocoa Touch 開發時用到的各種組件。通過 Library→Cocoa Touch Plugin→Inputs & Values，可以更加深入的瞭解各種組件的使用。

 

由菜單選擇程式庫

比如，表示文字的Label控制項，Round Rect Button按鈕，Text Field 文字框。你可以選擇喜歡的控制項拖動到你的配置中。

 

配置控制項標籤

首先我們來使用表示文字用的「Label」控制項。

 

Label控制項

起初控制項預設的顯示Label幾個字母，這裡我們雙擊它，將其改為「123456789」。

 

Text Field

接下來，我們將「Text Field」控制項拖動到View視圖上。

 

Text Field

這裡的Text Field在實際iPhone使用的時候，單擊它就會彈出鍵盤。標準的鍵盤是輸入文字的，這裡因為只是輸入價格，所以限定為數字鍵台。

 

如果你想更改Text Field的預設設定，點擊Interface Builder功能表列的Tools→Inspector。

 

Inspector

在Inspector內，你可以更改各種控制項的屬性。

 

Inspector的上部有4個並排的tab按鈕。設定控制項屬性的時候，選擇最左邊的tab。這裡Text Field只需要輸入數字，所以將鍵盤種類「Keyboard Type」選擇為「Number Pad」就好了。

 

KeyBoard Type

Segmented Control

Segmented Control是一個多選一的按鈕。這裡，我們使用它來表示各種折扣的比率。

 

Segmented Control

配置好了，就可以設定不同的選擇。首先設定4種折扣率。在Inspector的「Segments」中選擇4。

 

接下來，設定不同折扣的比率。在Segmented Control控制項的不同按鈕上雙擊，設定折扣文字。

 編譯與測試

到這裡為止，我們已經配置了最基本的控制項。也許你會留意到這些控制項都被放到螢幕的上半部了，當你運行程式的時候你就會明白其中的緣由了。先編譯一下看看。在Xcode中點擊「編譯」，並選擇儲存當前工程後，就可以開始編譯了。

編譯完了之後，啟動iPhone模擬器，就可以看到我們剛剛配置好的程式介面了。注意在iPhone模擬器上，是由滑鼠代替實際裝置上的觸摸動作的。

單擊Segmented Control控制項，選擇20%後來確認一下。或者點擊Text Field控制項，鍵盤被表示出來了吧。

 

就像剛才在Segmented Control中設定的那樣，只有數字鍵台表示出來了。這個鍵盤佔據了螢幕下方的領域。這也正是我們剛才將所有的控制項都配置到螢幕上方的原因。

如果你將控制項配置到了螢幕的下半部分時又使用了鍵盤，那麼這些控制項會被鍵盤遮蓋掉。所以當有使用鍵盤的時候，建議將控制項都設定到螢幕上方，否則需要程式動態更改控制項位置，比較麻煩。

 

這回我們主要學習了控制項的配置與使用，下一回我們將具體實現輸入價格到打折後價格的計算與表示。如：

 作者：易飛揚