0
Tải bản đầy đủ (.pdf) (49 trang)

Xây dựng giao diện với XML Layout

Một phần của tài liệu TÌM HIỂU ANDROID VÀ VIẾT ỨNG DỤNG MINH HỌA GAME TOUCHTHEBALL (Trang 28 -28 )

Sau khi sửa lại code trong phương thức onCreate() ta đã tìm hiểu được về các lớp cơ bản trong một ứng dụng Android cũng như cách xây dựng giao diện trực tiếp bằng mã lệnh hay còn gọi là "programmatic" UI layout. Nhưng với cách tiếp cận này có những nhược điểm nhất định: sửa đổi giao diện khó khăn, dễ phát sinh lỗi trong những đoạn mã làm giao diện,…

Đó là l{ do tại sao Android cung cấp một cách đơn giản hơn để xây dựng giao diện: dựa hoàn toàn trên XML. Mở file main.xml trong thư mục res/layout/ bạn sẽ thấy nó như sau: <?xml version="1.0" encoding="utf-8"?> <TextView xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/textview" android:layout_width="fill_parent" android:layout_height="fill_parent" android:text="@string/hello" />

file main.xml này được Eclipse tạo ra tự động khi bạn tạo 1 project mới

Cấu trúc của một file layout rất đơn giản: nó là một văn bản XML với mỗi node là tên của một lớp View (mỗi mọi thành phần giao diện phải là một View - xem ở trên), tất nhiên bạn hoàn toàn có thể sử dụng tên của một lớp bất kz miễn sao nó được kế thừa từ lớp View. Cấu trúc này làm cho việc tạo giao diện trở nên đơn giản hơn rất nhiều so với "programmatic" UI layout, cũng giống phần nào với cấu trúc của html. Đồng thời mô hình này cho phép ứng dụng của bạn tách bạch giữa phần trình bày (giao diện) với phần code xử l{ bên dưới.

Trong file main.xml bên trên, chỉ có một View được sử dụng: TextView, với vài thuộc tính. Dưới đây là giải thích cho mỗi thuộc tính:

xmlns:android

Khai báo cho cho trình biên dịch nơi định nghĩa các thuộc tính của thẻ xml. Các thẻ ngoài cùng trong mỗi file layout đều cần phải có thuộc tính này, các thẻ khác không cần phải có.

android:id

Thuộc tính này chỉ định một ID duy nhất trong toàn bộ ứng dụng cho phần tử View này (ở đây là TextView). Sau đó bạn có thể dùng ID này để tham chiếu tới View này từ source code hoặc từ các file xml khác. Trong trường hợp này, ID được chỉ định là "textview"

android:layout_width

Chỉ định chiều rộng cho phần tử khi hiển thị. Trong trường hợp này, chỉ có duy nhất một View cho nên bạn muốn nó chiếm toàn màn hình, và giá trị

"fill_parent" được sử dụng.

android:layout_height

Giống như layout_width, chỉ khác là thuộc tính này chỉ định chiều cao.

android:text

Chỉ định chuỗi nội dung cho TextView. Trong trường hợp này, bạn sử dụng một string resource thay vì sử dụng một chuỗi cụ thể. String resource ở đây (hello) được định nghĩa trong file res/values/strings.xml. Sử dụng string resource được khuyến khích hơn là sử dụng một chuỗi cụ thể, vì nó sẽ giúp cho việc sửa đổi nội dung dễ dàng mà không cần đụng đến file layout. Ứng dụng của việc này đó là xây dựng các ứng dụng đa ngôn ngữ.

Giờ ta sẽ sửa đôi chút ở string resource, để ứng dụng Hello world chạy khác so với ban đầu. Mở file strings.xml trong thư mục res/values/ bạn sẽ thấy nó như sau:

T ì m h i ể u A n d r o i d | 29

<?xml version="1.0" encoding="utf-8"?> <resources>

<string name="hello">Hello World, HelloAndroid!</string> <string name="app_name">Hello, Android</string>

</resources>

Đây là file chứa toàn bộ định nghĩa các chuỗi được sử dụng trong ứng dụng. Bạn sửa lại như sau: (dòng in đậm)

<?xml version="1.0" encoding="utf-8"?> <resources>

<string name="hello">Hellooooooooooooo</string>

<string name="app_name">Hello Hello Hello </string>

</resources>

Quay lại file HelloAndroid.java , sửa lại trong phương thức onCreate() như sau:

public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState);

setContentView(R.layout.main); }

Thay vì truyền vào phương thức setContentView() một thể hiện của View như đã trình bày ở phần trên, lần này ta truyền vào một tham chiếu tới một resource là main layout bằng cách sử dụng lớp R. Eclipse tự động tạo ra lớp R này bên trong file

R.java, dùng để tham chiếu tới mọi nguồn resource có trong thư mục res/. Chú {

không bao giờ được sửa file R.java này bằng tay. Chạy thử ứng dụng, bạn sẽ thấy giao diện đã thay đổi:

Tóm tắt

Kết thúc chương này ta đã nắm rõ hơn về các thành phần trong một ứng dụng Android cũng như có khái niệm về vài lớp cơ bản (Context, Activity, View, TextView).

Ta cũng biết về XML Layout, nguyên tắc khi xây dựng file layout, đồng thời biết về các thuộc tính của thẻ TextView sử dụng trong layout như thế nào.

Ta cũng đã tìm hiểu sơ qua string resource, và làm thế nào sử dụng được string resource từ file xml layout.

T ì m h i ể u A n d r o i d | 31

[4]

ACTIVITY

Một phần của tài liệu TÌM HIỂU ANDROID VÀ VIẾT ỨNG DỤNG MINH HỌA GAME TOUCHTHEBALL (Trang 28 -28 )

×