我的第一個ANDROID APP (一)
來自
http://developer.android.com/training/basics/firstapp/building-ui.html
我使用的是 Eclipse + android4.4
剛剛開啟ANDROID的學習,如果有不足與錯誤,歡迎大家指正
首先建立一個簡單的使用者介面 (當然再次之前你需要建立一個android的工程 Flie-New -Project-Android-Android Application Project )
像這樣的
讓我們開始吧~
安卓支援使用XML來建立對應的子類的檢視和試圖組。簡單的說就是用XML來規劃檢視介面
Android provides an XML vocabulary that corresponds to the subclasses of View and ViewGroup so you can define your UI in XML using a hierarchy of UI elements.
1.Open the activity_main.xml file from the res/layout/ directory.
開啟在res/layout/directory的activity_main.xml
之後再點選左下角切換標籤頁 activity_main.xml
<?XML version = "1.0" encoding = "utf-8" ?> <LinearLayout xmlns:android = "http://schemas.android.com/apk/res/android" xmlns:tools = "http://schemas.android.com/tools"android:layout_width = "match_parent" android:layout_height = "match_parent" android:orientation = "horizontal" > </LinearLayout>
android:orientation = "horizontal" 這句話是保證橫向定位用的(應該是這樣- -!)
android:layout_width and android:layout_height, 這兩個就是所需檢視的大小
2.要建立一個使用者可編輯的文字欄位,新增一個<EditText>裡面的元素<LinearLayout>。
像每一個檢視物件,你必須定義某些XML屬性來指定的EditText物件的屬性。下面是你應該在裡面宣告它<LinearLayout>元素:
<?XML version = "1.0" encoding = "utf-8" ?>
<LinearLayout xmlns:android = "http://schemas.android.com/apk/res/android"
xmlns:tools = "http://schemas.android.com/tools"
android:layout_width = "match_parent"
android:layout_height = "match_parent"
android:orientation = "horizontal" >
<EditText android:id = "@+id/edit_message"
android:layout_width = "wrap_content"
android:layout_height = "wrap_content"
android:hint = "@string/edit_message" />
</LinearLayout>
具體為什麼要@+id/edit_message 原文是這樣寫的This provides a unique identifier for the view, which you can use to reference the object from your app code, such as to read and manipulate the object (you'll see this in the next lesson).
The at sign (@) is required when you're referring to any resource object from XML. It is followed by the resource type (id in this case), a slash, then the resource name (edit_message).
The plus sign (+) before the resource type is needed only when you're defining a resource ID for the first time. When you compile the app, the SDK tools use the ID name to create a new resource ID in your project's gen/R.java file that refers to the EditText element. Once the resource ID is declared once this way, other references to the ID do not need the plus sign. Using the plus sign is necessary only when specifying a new resource ID and not needed for concrete resources such as strings or layouts. See the sidebox for more information about resource objects. 3.當我們要加個文字在使用者介面的時候,我們總應該加入一個與其對應的資源 When you need to add text in the user interface, you should always specify each string as a resource.
一般情況下,開啟res/values/strings.xml 新增一個name為 “edit_message”並將其value設定為“Enter a message”的字串 .我的看起來像這樣,可能會比你多一點
<?xml version="1.0" encoding="utf-8"?>
<resources>
<string name="app_name">hello</string>
<string name="action_settings">Settings</string>
<string name="hello_world">Hello world!</string>
<string name="edit_message">Enter a message</string>
<string name="button_send">Send</string>
<string name="title_activity_display_message">DisplayMessageActivity</string>
</resources>
4.再新增一個按鈕 加在剛才的EditText 後面,像這樣
<?XML version = "1.0" encoding = "utf-8" ?>
<LinearLayout xmlns:android = "http://schemas.android.com/apk/res/android"
xmlns:tools = "http://schemas.android.com/tools"
android:layout_width = "match_parent"
android:layout_height = "match_parent"
android:orientation = "horizontal" >
<EditText android:id = "@+id/edit_message"
android:layout_width = "0dp"
android:layout_height = "wrap_content"
android:hint = "@string/edit_message" />
<Button
android:layout_width = "wrap_content"
android:layout_height = "wrap_content"
android:text = "@string/button_send" />
</LinearLayout>
點選執行 就會像這樣
共勉。
更新 如果想變成對齊 譬如這樣
可以新增一句 android:layout_weight = "1" 在<EditText>中 像這樣
<EditText android:id = "@+id/edit_message"
android:layout_weight = "1"
android:layout_width = "0dp"
android:layout_height = "wrap_content"
android:hint = "@string/edit_message" />
快試試把~ 在button中也可以新增 控制比例用 比如4:1 3:1等分效果