從無到有-實戰Android系統開發-程式實戰(3)-使用者介面(User Interface)

使用者介面(User Interface)不好意思，最近公司比較忙。所以，在更新文章上，比較慢一些。預計，四月份會正常更新，請大家多多指教。

接下來，當我們順利的開啟一個新的專案後，接著就是要設計使用者介面了。首先，在Eclipse的平台上，打開「Memo」專案中的「res/layout/main.xml」檔案，就會先看到目前檔案的預覽畫面(就是在Layout預設的頁標籤)，如圖26所示。
接著我們來切換到另一個main.xml的頁標籤來看XML格式的文件，如圖27所示。

圖26

在Android平台上，使用者介面都是透過「View Group」或「View」類別來顯示。有關「View Group」或「View」類別，可以參考http://developer.android.com/guide/tutorials/views/index.html 的範例及說明。
Android提供非常豐富而多樣的介面元件，主要可以分成二種類型：
l 版面配置類型(例如：各種不同的Layout、Tab、List等)：如圖26上面的Layouts當中的元件。也可以參考表10，對於比較常用到的版面配置，進行說明的動作。在後續的章節中，會陸續應用到。

l 顯示介面類型(例如：文字框、按鈕、輸入欄位等)：如圖26上面的Views當中的元件。也可以參考表11，對於比較常用到的元件，一個一個的說明。在後續的章節中，會陸續應用到。






在Eclipse上，如圖26的畫面，目前，可以從Views或Layouts的視窗中，拖曳元件，拉到預覽畫面。而可以直接來設計介面。切換到「main.xml」的頁標籤來看XML格式的文件內容，如圖27所示。

基本上，就跟XML元素一樣，有開始的「<」符號就有結束的「>」符號。例如：一個文字顯示的元件在XML標籤表示方式為，包含在裡面的資料就是它的屬性設定，例如：
在設定寬度時，用到的屬性是：android:layout_width="fill_parent"
設定高度時，用到的屬性是：android:layout_height="wrap_content"
設定文字內容時，用到的屬性是：android:text="@string/hello"
等屬性的設定。


圖27

Tip 1：在Eclipse平台，選取選單「Source」中的「Format」選項，可以整理main.xml檔案裡面的XML資料。

Tips 1

從無到有-實戰Android系統開發-程式實戰(2)-專案架構(Project Files)

首先，我們就先由如何建立一個新的程式專案，來說明一下Android程式專案架構，進入Eclipse平台，選取選單「File」中的「New」選項，再選取「Android Project」的專案。就會出現新增Android專案的畫面，如圖24所示。

我們將新專案名稱命名為 Memo。 在「Contents」欄位裡，我們選擇「Create new project in workspace」(在工作區域中建立新專案)。所以欄位依預設值來設定即可。

不過，有一些欄位，是必須由使用者來輸入。請參考如圖7所示。我們要建立一個Memo的專案，可以依圖8的設定值來輸入。

專案輸入欄位，說明如下：


Memo專案，要輸入的欄位值如下：



圖24

填好所有的資料後，再按下「Finish」 按鈕，就建立好一個新的專案了。 請注意 Package Name 的設定，必須至少由兩個部分所構成。

「Create Activity」是指定用來產生預設 java 程式碼的文件名稱，與程式碼中預設 Activity 類別 (class) 的名稱。最好是依照 java 語言的命名習慣，將「Create Activity」採用開頭大寫的形式來命名即可。

回到 Eclipse 的主要畫面，我們會發現Eclipse會自動幫我們建立在 Package Explorer 視窗中的Memo目錄。如圖25所示。


圖25

而預設的目錄架構說明，請參考表9所示：