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

• Author:
• Email:

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=" />/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:
–
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:
/>J2EKKc8j2B95zGMb8muZvrIy-wcF
• Google I/O 2013 - Android Design:
/>rJ2EKKc-qVhMuAprIFYFbCotdgJKq
Tài liệu tham khảo
• Android website
–
• Busy Coder’s Guide to Android
Mark Murphy,