• Author:http://vnaking.com/ • Email: vnaking@gmail.com

Lập trình giao diện với Android

Mục tiêu

• Làm quen với các thành phần trong giao diện Android.

• Hiểu về XML layout.

• Biết cách xử lý các sự kiện xảy ra trong giao diện Android.

Activities và Tasks

• Activity – Dùng để hiển thị một màn hình.

– Thừa kế từ lớp android.app.Activity

– Các activity có những phương thức để bắt sự kiện sau (@Override):

• onCreate: activity “Lúc khởi tạo"

• onDestroy: activity “Lúc huỷ"

• onStart/onResume/onPause/onStop/onRestart flow

Activities và Tasks

• Task – Là một tiến trình được sử dụng thông qua Activity.

• Thường bắt đầu từ Home screen.

– Một task mới tạo ra một stack mới của activity

• Nút “back” sẽ gỡ bỏ task cao nhất và huỷ activity đó.

– Các task được phân biệt với nhau

• Task mới sẽ tạo một stack mới.

– Task có thể cross applications và processes

Các dạng của view

• View và ViewGroups – View là lớp cơ sở của “widgets”

– ViewGroup lớp cơ sở của Composite-patterned chứa các đối tượng khác của View.

– Mỗi Activity có thể giữ một nội dung view.

• Thông thường đây là một ViewGroup tạo thành một hệ thống phân cấp.

– Có thể tuỳ chỉnh View và ViewGroups

Các dạng của view

• Widgets (android.widget)

Các dạng của view

• Widgets (android.widget) – “Dạng push": Button, CompoundButton, CheckBox,

ImageButton, RadioButton – Dạng Text: EditText, TextView, NumberPicker, TextSwitcher – Graphics: Gallery, ImageSwitcher, ImageView – Selectors: RatingBar, SeekBar, Spinner, Switch – Time: AnalogClock, DigitalClock, Chronometer,

CalendarView, DatePicker, TimePicker – Composite: ListView, SlidingDrawer, TabHost – Media: MediaController – Space (tạo khoảng trống giữa các thành phần) – ...

Các dạng của view

• Layouts(android.widget) – LinearLayout: Sắp xếp theo hàng ngang/dọc

–RelativeLayout: Căn chỉnh giữa các view

–TableLayout: Sắp xếp theo bảng

–GridLayout: Sắp xếp theo lưới

–AbsoluteLayout: Sắp xếp theo toạ độ

– FrameLayout: Căn chỉnh dựa trên toạ độ gốc(top-left)

Các dạng của view

• Dialogs (android.app)

Các dạng của view

• Dialogs (android.app) (là trường hợp đặc biệt của Activity)

– AlertDialog (OK/Cancel/Help, v.v)

– ProgressDialog (56 of 100...)

– DatePickerDialog

– TimePickerDialog

• Được tạo ra & hiển thị như một phần của Activity, Dialog không phải là activity

Tạo giao diện trên Android

Có 2 cách để tạo giao diện trên Android

• Sử dụng bộ công cụ tạo bằng tay trên java.

• Sử dụng file layout XML-based

– File layout XML không được gắn với Activity

– Nó chỉ là một nhóm các View đặt trong 1 file XML

– Để hiển thị XML dưới dạng giao diện ta gọi Activity.setContentView()

XML

Layout Resources

• Layout Resources nằm ở thư mục res/layout

– Tên file XML tương ứng với R.layout.{tên-file}

– Phần tử gốc thường là ViewGroup (Layout class)

– android: namespace là bắt buộc

– Ký tự @ trong thuộc tính có ý nghĩa tham chiếu đến các resource đã khai báo

• @drawable/... Tham chiếu đến các file hình

• @android:id/... Tham chiếu đến một id

• @+id/id_name: Khai báo id của View/ViewGroup

Layout Resources

• Layout Resources có thể tuỳ chỉnh

– Các resource, layout có thể thay đổi cách bố trí để phù hợp với kiểu màn hình, thiết bị khác nhau

• screen size: "small", "normal", "large", "xlarge"

• orientation: "port", "land"

• pixel density: "ldpi", "mdpi", "hdpi", "xhdpi", ...

• platform version: "v3", "v4", "v7", ...

– Mặc định app sẽ ở layout dọc(portrait)

– Layout ngang(landscape ) nằm ở /res/layout-land/

Style

• Style là một bộ các attribute/value được khai báo sẵn để áp dụng cho view.

• Thuộc tính kế thừa của style: parent=“android:style/...”

Theme

• Theme là một style mà áp dụng cho toàn bộ activity (hay application)

• Thêm thuộc tính android:theme vào activity trong manifes

• Toàn bộ giá trị khai báo trong theme sẽ ghi đè lên giá trị manual của các view trong activity

Menu

• Activity có thể liên kết với mục trong menubar

– Menu thường được khai báo trong layout(res/menu)

• menu: khai báo 1 menu (chứa các mục)

• item: khai báo một mục nằm trong menu

• group: gom nhóm các mục

Menu

• Ví dụ về menu

<menu xmlns:android="http://schemas.android.com/apk/res/android"> <item android:id="@+id/new_game" android:icon="@drawable/ic_new_game" android:title="@string/new_game" /> <item android:id="@+id/help" android:icon="@drawable/ic_help" android:title="@string/help" /> </menu>

ActionBar

ActionBar (3.0+)

• là một tập hợp menus/menuItems nằm phía trên cùng.

• Chỉ thích hợp cho thiết bị màn hình lớn

• Thư viện tự động tạo action bar:

– http://actionbarsherlock.com/

Xử lý sự kiện

• Hầu hết Views/ViewGroups đều cung cấp hàm xử lý sự kiện

• Nó được gọi là “InputEvents”:

– View.OnClickListeners: có thể khai báo trong XML layout

– Phần lớn các sự kiện được khai báo tại onCreate()

Intent

• Để di chuyển qua lại giữa các Activity thì cần phải thông qua một Intent

Intent next = new Intent(this, NextActivity.class);

startActivity(next);

• Intent cũng dùng để chuyển dữ liệu qua lại giữa các activity.

Tương tác với người dùng

Video hướng dẫn

• Android Design in Action YouTube Playlist: http://www.youtube.com/playlist?list=PLWz5rJ2EKKc8j2B95zGMb8muZvrIy-wcF

• Google I/O 2013 - Android Design: https://www.youtube.com/playlist?list=PLWz5rJ2EKKc-qVhMuAprIFYFbCotdgJKq

Tài liệu tham khảo

• Android website

– https://developer.android.com/design

• Busy Coder’s Guide to Android

Mark Murphy, http://commonsware.com/