Hướng dẫn lập trình cơ bản với Android - Phần 8

B2: Đi tới res/main.xml để xây dựng giao diện cho chương trình: 
Mã: 
<LinearLayout 
xmlns:android="
id" 
 android:orientation="vertical" 
 android:layout_width="fill_parent" 
 android:layout_height="fill_parent" 
 > 
 <EditText 
 android:id="@+id/work_enter" 
 android:layout_width="fill_parent" 
 android:layout_height="wrap_content" 
 android:hint="@string/work_hint" 
 android:lines="1" 
 android:textSize="24px" 
 /> 
 <LinearLayout 
 android:layout_width="wrap_content" 
 android:layout_height="wrap_content" 
 android:orientation="horizontal" 
 > 
 <TextView 
 android:layout_width="50px" 
 android:layout_height="wrap_content" 
 android:text="@string/hour_edit" 
 android:typeface="normal" 
 android:textSize="15px" 
 android:textStyle="bold" 
 android:padding="5px" 
 /> 
 <EditText 
 android:id="@+id/hour_edit" 
 android:layout_width="45px" 
 android:layout_height="wrap_content" 
 android:hint="12" 
 android:textColorHint="@color/hint_color" 
 android:textSize="20px" 
 android:gravity="center" 
 android:padding="5px" 
 android:numeric="integer" 
 android:maxLength="2" 
 /> 
 <TextView 
 android:layout_width="65px" 
 android:layout_height="wrap_content" 
 android:text="@string/minute_edit" 
 android:typeface="normal" 
 android:textSize="15px" 
 android:textStyle="bold" 
 android:padding="5px" 
 /> 
 <EditText 
 android:id="@+id/minute_edit" 
 android:layout_width="45px" 
 android:layout_height="wrap_content" 
 android:hint="00" 
 android:textColorHint="@color/hint_color" 
 android:textSize="20px" 
 android:gravity="center" 
 android:padding="5px" 
 android:numeric="integer" 
 android:maxLength="2" 
 /> 
 <Button 
 android:id="@+id/button" 
 android:layout_width="wrap_content" 
 android:layout_height="wrap_content" 
 android:gravity="center" 
 android:text="@string/button_content" 
 /> 
 <ListView 
 android:id="@+id/list" 
 android:layout_width="fill_parent" 
 android:layout_height="wrap_content" 
 /> 
Giao diện ta thiết kế ở đây có 1 Linear Layout làm thành phần chính, các thành 
phần con của nó gồm 1 Edit Text (dùng để nhập nội dung công việc), 1 Linear 
Layout (lại gồm các thành phần con để nhập giờ và phút thực hiện công việc), 1 
Button (để thêm nội dung công việc vào List View) và 1 List View dùng để list các 
công việc bạn đã nhập. 
Từ khóa lines được dùng để cố định số dòng và nên sử dụng với Edit Text thay vì 
dùng mỗi wrap_content vì nếu sd wrap_content thì Edit Text sẽ tự giãn ra nếu 
dòng nhập vào vượt giới hạn đường bao (làm hỏng giao diện bạn thiết kế). 
Từ khóa gravity thông báo các thành phần con sẽ được sắp xếp ntn ở thành phần 
cha. Ở đây mình dùng "center" nghĩa là thành phần con nằm ở trung tâm. Hãy thử 
thêm vào 1 Edit Text: 
Mã: 
android:gravity="center" 
Bạn sẽ thấy dòng chữ nhập vào sẽ bắt đầu từ giữa của Edit Text chứ không bắt đầu 
từ bên trái như trước nữa. 
Từ khóa padding dùng để cách 1 khoảng cách cho thành phần. Nếu không có 
padding thì 2 thành phần con thuộc cùng 1 LinearLayout sẽ được xếp sát nhau, 
nhưng nếu 1 thành phần con sử dụng padding thì sẽ tạo được khoảng cách với 
thành phần còn lại theo mong muốn. Ngoài ra còn có paddingLeft, paddingRight, 
paddingTop, paddingBottom. 
Từ khóa numeric dùng để giới hạn dạng ký tự nhập vào. Ở đây mình muốn chỉ 
nhập vào chữ số nên dùng "integer" 
Từ khóa maxLength dùng để giới hạn số ký tự nhập vào. Do Edit Text này dùng để 
nhập giờ nên maxLength="2". 
Ok, giờ đến 1 chút kiến thức về các đơn vị của dimenson: 
- px (pixel): điểm chấm trên màn hình. 
- in (inch) 
- mm (milimet) 
- pt (point) = 1/72 m 
- dp (density - independent pixel): cái này hơi khó giải thích. Nói chung dp được 
sử dụng cho nhiều độ phân giải, và với độ phân giải 160 px/inch thì 1 dp = 1 px. 
- sp: gần giống dp, nên sử dụng cho text size. 
Nói chung nên sử dụng dp và sp để định nghĩa size cho các thành phần, vì nó có tỉ 
lệ cố định với độ phân giải của màn hình. Còn nếu bạn chủ tâm xây dựng cho 1 độ 
phân giải nhất định thì dùng px cho chính xác và chắc chắn. 
B3: Tới values/strings.xml chỉnh sửa như sau: 
Mã: 
 Example 2 
 Enter the work 
here 
 Hour 
 Minute 
 Add work 
B4: Tạo mới colors.xml trong values với nội dung: 
Mã: 
 #cccccc 
OK, vậy là đã hoàn thiện phần giao diện. Các bạn có thể cho chạy thử ngay để 
kiểm tra xem giao diện đã như ý muốn chưa chứ không cần đợi hoàn thành cả code 
(Run as -> Android Application).