Phát triển Android khi sử dụng Eclipse và các widget của Android (kỳ 2) docx

Hệ thống phân cấp các widget của Android Một ứng dụng mẫu có sử dụng widget Bây giờ chúng ta sẽ thay đổi ứng dụng hiện có của mình để trông giống như Hình 8.. này là làm cho độc giả qu

Phát triển Android khi sử dụng Eclipse và các widget của Android (kỳ 2)

Tóm tắt: Hướng dẫn này dành

cho bất cứ ai quan tâm đến việc bắt đầu phát triển Android trên Eclipse bằng cách sử dụng trình cắm thêm (plug-in) các công cụ phát triển Android (ADT) Hướng dẫn này mang đến cái nhìn thấu đáo

về các tính năng nổi bật của một ứng dụng Android, cùng với lời giải thích ngắn gọn về các thành phần

cơ bản của nó Quá trình Android được giới thiệu để

phát triển các Giao diện người dùng (UI) phong phú cho các ứng dụng, như các widget (tiện ích) Cuối cùng, nó giới thiệu một cách dễ dàng để kiểm thử các ứng dụng đã phát triển bằng cách triển khai ứng dụng đó trên một trình mô phỏng thiết bị Android có kèm trong bộ công cụ phát triển phần mềm (SDK) Tiếp theo kỳ 2 như sau:

7 Chạy ứng dụng trên trình mô phỏng thiết bị

Để triển khai và chạy ứng dụng này, bạn cần phải xác

định một cấu hình chạy Chọn Open > Run > Dialog

hoặc phím tắt trên thanh công cụ trong Eclipse và

chọn ứng dụng Android Nhấn New và điền vào tên

của cấu hình chạy này Chỉ rõ tên dự án của bạn và hoạt động mặc định Sau đó trong tab đích, chọn một

số giá trị cài đặt trình mô phỏng mong muốn và xác định một AVD mà bạn muốn khởi động Nhấn vào

Run (Chạy) Bạn sẽ nhận được một AVD như trong

Hình 6 Màn hình của thiết bị được hiển thị bên trái,

cùng với một bàn phím QWERTY ở dưới cùng bên trái và các nút di động thông thường như quay số, ngắt kết nối, tắt tiếng, âm lượng và trang chủ ở trên cùng bên trái

Hình 6 Thiết bị ảo Android (AVD)

8 Các widget Android

Bây giờ chúng ta biết cách tạo và chạy một ứng dụng Android cơ bản, chúng ta hãy làm đẹp mọi thứ bằng các widget (xem Hình 7):

 textView bao gồm các widget như editText, nút

ấn (Button), v.v Các nút ấn có thể được được phân loại thêm nữa:

o CheckBox (Hộp kiểm tra)

o RadioButton (Nút ấn tròn)

o ToggleButton (Nút ấn đảo chiều), v.v

 ImageView bao gồm các widget như ImageButton

 ViewGroup bao gồm các bố trí như:

o Relative Layout (Bố trí tương đối)

o Table Layout (Bố trí bảng)

o Frame Layout (Bố trí khung)

o Adapter View (Khung nhìn của bộ tiếp hợp)

o Linear Layout (Khung nhìn tuyến tính)

Để biết thông tin về các widgetHướng dẫn trực quan

về các widget Giao diện đồ họa người dùng của Android (GUI Android Widget) là hướng dẫn tốt

nhất Tuy nhiên, hãy thận trọng với các sai lệch có thể xuất hiện ở đó do những thay đổi nhanh chóng của nền tảng Android Một ví dụ rõ ràng là việc sử dụng id như là một thuộc tính của trình định danh cho một widget trong tệp main.xml trong hướng dẫn nêu trên Trong nền tảng Android mới nhất, nên sử dụng tên phân biệt đầy đủ android:id

Hình 7 Hệ thống phân cấp các widget của

Android

Một ứng dụng mẫu có sử dụng widget

Bây giờ chúng ta sẽ thay đổi ứng dụng hiện có của mình để trông giống như Hình 8 Mục đích của ví dụ

này là làm cho độc giả quen thuộc với việc sử dụng của một số widget cơ bản như textView, editText, Button, và Toast trong một ứng dụng thực tế

Ứng dụng của chúng ta sẽ bao gồm một thanh tiêu đề với thông điệp "WELCOME!!!" Nó sẽ có ba widget textView bắt đầu từ trên xuống, sắp xếp theo chiều dọc: widget thứ nhất nói "Hello World, how're you (Chào thế giới, Bạn thế nào)?" theo phông chữ mặc định, widget tiếp theo là "Welcome to my first Android app (Chào mừng đến với ứng dụng Android đầu tiên của tôi)" với chữ serif nghiêng, canh chính giữa, có nền trắng; và widget thứ ba nói "Type anything and press the button (Gõ vào gì đó và nhấn nút)" với chữ đậm, độ rộng bằng nhau, có nền màu

đỏ Sau ba widget này là widget editText để lấy đầu vào từ người dùng, theo sau là một widget nút nhấn, nút này đi cùng với thông điệp "Click Me!" (Nhấn vào tôi) Mọi thứ bạn gõ vào trong widget editText sẽ

xuất hiện trong một widget Toast ở dưới đáy giữa màn hình khi nhấn vào nút này

Không có nhiều mã triển khai thực hiện liên quan ở đây Độc giả nên chú ý rằng các widget có thể được đưa vào trong ứng dụng dễ dàng như thế nào khi sử dụng trình soạn thảo GUI của ADT cho các tệp XML

và các đặc tính của widget được thiết lập thuận tiện như thế nào khi sử dụng khung nhìn "properties" (các thuộc tính) do Eclipse cung cấp Ví dụ này cũng sẽ cho thấy giao diện người dùng và các phần triển khai thực hiện có thể được mã hoá độc lập như thế nào

Hình 8 Thiết bị ảo Android với các widget

Tệp string.xml

Hãy thêm một số chuỗi mới vào tệp string.xml, thay đổi chuỗi chào mừng hiện có và cuối cùng là chuỗi tiêu đề Chúng ta cũng xác định các màu trắng và màu đỏ ở đây để làm nền cho hai widget textView

Liệt kê 2 Tệp string.xml

<string name="title">WELCOME!!!</string>

<string name="mainText">Welcome to my first

Tệp main.xml

Hãy sử dụng tab bố trí của tệp main.xml để kéo và thả hai widget textView: một widget editText và một widget nút ấn Sau đó chúng ta sẽ sử dụng tab các

thuộc tính trong tệp main.xml để chỉnh sửa các thuộc

tính cho mỗi widget

Liệt kê 3 Tệp main.xml

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

<LinearLayout

xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical"

/>

<TextView

android:layout_height="wrap_content" android:layout_width="fill_parent" android:id="@+id/mainTextView" android:gravity="center"

android:gravity="left"

</EditText>

<Button

android:text="Click me!"

android:id="@+id/Button01"

Đây là tệp thực sự liên kết giao diện người dùng với

mã triển khai thực hiện Cũng giống như ứng dụng HelloWorld, chúng ta sử dụng phương thức Activity.onCreate(Bundle) để trang trí tất cả các phần

tử UI trên màn hình Phương thức onClick(View) bị ghi đè này sẽ chứa chức năng nhấn nút, nơi văn bản đầu vào của người dùng sẽ được đọc và được hiển thị trên màn hình trong một widget toast

Liệt kê 4 Tệp MainActivity.java

public class MainActivity extends Activity {

/** Called when the activity is first created */

@Override

public void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.main);

String title = getString(R.string.title);

setTitle(title); // done so that we can change the default title

//get handles to editText and button widgets

final EditText eText = (EditText) findViewById(R.id.EditText01);

final Button button = (Button) findViewById(R.id.Button01);

button.setOnClickListener(new Button.OnClickListener(){

@Override

public void onClick(View v) {

//get the String entered into the editText widget

CharSequence editText = eText.getText();

//display the toast

Toast.makeText(MainActivity.this, editText, Toast.LENGTH_LONG).show();

9 Sử dụng widget : Một ứng dụng mẫu

Trong phần này, chúng ta sẽ tạo một ứng dụng mẫu (xem hình 9a, 9b) để hiển thị tất cả các địa chỉ liên lạc trong danh bạ điện thoại bằng cách sử dụng widget listView Mục đích của ví dụ này là để giới thiệu không chỉ là việc sử dụng widget listView mà còn cho thấy dữ liệu điện thoại có thể được tìm nạp như thế nào khi sử dụng các lớp ContentProvider và ContentResolver Hãy chú ý đến các tệp XML của giao diện người dùng vì có hai cách bố trí giao diện người dùng: một để xác định cách widget listView sẽ hiển thị danh sách khít với giao với giao diện người dùng chính và cái kia để xác định cách hiển thị từng phần tử của danh sách đó Một điểm quan trọng là thiết lập các quyền hạn cho các ứng dụng có thể đọc

dữ liệu điện thoại Ví dụ này là bước đầu tiên để hiểu được cách có thể kết hợp các ý định (intent) và các bộ lọc ý định trong một ứng dụng Mặc dù các intent

nằm ngoài phạm vi của bài viết này, nhưng độc giả cũng nên lưu ý rằng để chuyển ứng dụng của ví dụ này thành một ứng dụng danh bạ điện thoại trong thế giới thực, chỉ cần triển khai thực hiện các thao tác nhấn vào các mục của danh sách và tạo một ý định (intent) cuộc gọi và bộ lọc ý định để bắt đầu một cuộc gọi đến địa chỉ liên lạc được chọn

Trong ví dụ này, các địa chỉ liên lạc sẽ được hiển thị theo mẫu thẳng theo chiều dọc và địa chỉ liên lạc được chọn sẽ xuất hiện ở đầu danh sách với một phông chữ in nghiêng lớn và một nền màu xanh dương Chúng ta cũng có một hộp kiểm tra ở phía dưới cùng bên trái của màn hình, mà khi được đánh dấu chọn, sẽ hiển thị chỉ các địa chỉ liên lạc được đánh dấu sao (hoặc các địa chỉ liên lạc ưa thích) Tiêu

đề của ứng dụng trong trường hợp này là "Contact Manager (Trình quản lý các địa chỉ liên lạc) Ở đây chúng ta sử dụng ba loại widget: textView, listView

và checkBox Chúng ta sử dụng widget textView để hiển thị địa chỉ liên lạc hiện đang được chọn Bạn có thể đoán ngay rằng widget listView là một danh sách các widget textView Widget listView sử dụng các mẫu thiết kế của bộ tiếp hợp để kết nối dữ liệu (trong trường hợp này là các địa chỉ liên lạc) và một khung nhìn dữ liệu (trong trường hợp này là một textView cho listView này Mọi thao tác nhấn trên listView có thể được bắt giữ lại bằng cách thực hiện phương thức AdapterView.OnItemClickListener()

Trước khi tiếp tục, chúng ta nên có một số các địa chỉ liên lạc được lưu trong phần các địa chỉ liên lạc của trình mô phỏng thiết bị của Android (AVD) Điều này có thể được thực hiện bằng cách nhấn vào

Contacts (Các địa chỉ liên lạc) trên màn hình chủ của AVD, sau đó nhấn vào Menu để có tùy chọn Add Contacts (Thêm các địa chỉ liên lạc) Phần Favorites

(Các địa chỉ liên lạc ưa thích) cho biết cách đánh dấu

một địa chỉ liên lạc như là ưa thích/được đánh dấu sao

Hình 9a Ứng dụng các địa chỉ liên lạc hiển thị tất cả

các địa chỉ liên lạc trong một widget listView

Hình 9b Ứng dụng các địa chỉ liên lạc hiển thị tất cả các địa chỉ liên lạc được đánh dấu sao trong một

widget listView khi đánh dấu chọn vào hộp kiểm tra

hiển thị các địa chỉ liên lạc có đánh dấu sao

Bây giờ chúng ta sẽ định nghĩa một vài chuỗi

Liệt kê 5 Các chuỗi được định nghĩa trong tệp strings.xml

<string name="selectedEntry" />

Liệt kê 6 Tệp main.xml

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

<LinearLayout

xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical"

android:id="@+id/showStarred"

android:text="@string/showStarred"/>

</LinearLayout>

Lưu ý rằng việc gán cho thuộc tính layout_weight giá

trị bằng 1 trong listView bảo đảm chắc chắn rằng

danh sách phủ hết vùng màn hình càng lớn càng tốt

cho đến khi một widget mới được định nghĩa

Tệp contactItem.xml

Bên cạnh bố trí chính, chúng ta cần phải xác định

một cách bố trí khác ở đây Việc này là để thể hiện

từng phần tử trong listView này Ở đây, ta sử dụng

một textView đơn giản

Liệt kê 7 Mã cho widget textView, thiết lập từng

phần tử của widget listView

Tệp ManageContacts.java

Liệt kê 8 cho thấy hoạt động chính được triển khai thực hiện như thế nào Phương thức populateContactList() là một phương thức mà chúng

ta sử dụng để truy vấn cơ sở dữ liệu các địa chỉ liên lạc và hiển thị chúng trong listView này

Liệt kê 8 Triển khai thực hiện của hoạt động chính

public class ManageContacts extends Activity {

private ListView mContactList;

private CheckBox mCheckBox;

private boolean mShowStarred;

private TextView selectedText;

/** Called when the activity is first created */

mContactList.setOnItemClickListener(new ClickListener());

populateContactList();

}

" COLLATE LOCALIZED ASC";

String selection = mShowStarred? ContactsContract.Contacts.STARRED +

" ='1'" : null;

Cursor c = getContentResolver().query(uri, projection, selection, selectionArgs,

sortOrder);

String[] fields = new String[] {

ContactsContract.Data.DISPLAY_NAME };

SimpleCursorAdapter adapter = new SimpleCursorAdapter(this, R.layout.contactitem,

c, fields, new int[] {R.id.contactItem});

đang được chọn Trình lắng nghe sau là để thiết lập trường mShowStarred và điền lại danh sách

 Để đọc các địa chỉ liên lạc từ cơ sở dữ liệu điện thoại, chúng ta cần phải truy vấn nó để có được một con trỏ Truy vấn này có các tham số sau:

1 uri — URI sử dụng content:// scheme để lấy

ra nội dung

2 projection (hình chiếu) — Một danh sách

các cột nào sẽ được trả về Nếu cho bằng null sẽ trả về tất cả các cột; điều này không nên làm để tránh đọc nhiều dữ liệu từ bộ nhớ

mà sẽ không dùng hết

3 selection (lựa chọn) — Một bộ lọc khai báo

sẽ trả về hàng nào, được định dạng như là một mệnh đề WHERE của SQL (ngoại trừ chính từ khóa WHERE) Cho bằng null sẽ trả về tất cả các hàng có trong URI đã cho

5 sortOrder — sắp xếp các hàng như thế nào,

được định dạng như là một mệnh đề SQL ORDER BY của SQL (ngoài trừ chính từ khóa ORDER BY) Cho bằng null sẽ sử dụng thứ tự sắp xếp mặc định, mà theo mặc định có thể là không theo thứ tự nào cả

Con trỏ của tập hợp kết quả đã thu được phải được liên kết với giao diện người dùng qua một bộ tiếp hợp

SimpleCursorAdapter ở đây, mặc dù Android cũng cung cấp một ListAdapter Khi nhận được bộ tiếp

hợp chúng ta cần phải gắn nó kèm theo vào listView

và thế là xong

10 Kết luận

Trong hướng dẫn này, chúng ta đã tìm hiểu cách thiết lập Eclipse để phát triển cho Android và các tính năng phong phú của Eclipse hỗ trợ từng bước để viết các ứng dụng Android như thế nào Chúng ta cũng đã tìm hiểu các ứng dụng có thể dễ dàng được triển khai

và thử nghiệm trên trình phỏng theo thiết bị Android

— AVD như thế nào Chúng ta trình bày các tính năng nổi bật của một ứng dụng Android bằng cách sử dụng một ví dụ Hello World và đã tìm hiểu về các tệp tạo ra một ứng dụng Android Chúng ta đã đề cập đến một số các widget do Android cung cấp và đã biết cách sử dụng chúng trong một số ví dụ thực tế Bây giờ bạn sẽ có thể bắt đầu tạo một ứng dụng thú vị với một giao diện người dùng gọn gàng Bước đầu tiên, hãy mở rộng ứng dụng các địa chỉ liên lạc để triển