Bài giảng Lập trình trên thiết bị di động: Chương 3 (Phần 2) - ThS. Phan Nguyệt Minh

Chia sẻ: Kiếp Này Bình Yên | Ngày: | Loại File: PDF | Số trang:83

Thêm vào BST

Báo xấu

113
lượt xem 15
download

Download Vui lòng tải xuống để xem tài liệu đầy đủ

Trong chương 3 (Phần 3) này, chúng ta sẽ xem xét các thành phần giao diện người dùng khác nhau của màn hình Android. Chương này cũng bao gồm các hướng dẫn để làm cho một thiết kế giao diện tốt hơn và cũng giải thích làm thế nào để thiết kế một giao diện người dùng. Mời các bạn cùng tham khảo để nắm bắt các nội dung chi tiết.

Chủ đề:

Bình luận(0) Đăng nhập để gửi bình luận!

Lưu

Nội dung Text: Bài giảng Lập trình trên thiết bị di động: Chương 3 (Phần 2) - ThS. Phan Nguyệt Minh

GOOGLE ANDROID GV: ThS. Phan Nguyệt Minh minhpn@uit.edu.vn ltdd.up@gmail.com Site môn học http://sites.google.com/site/laptrinhtrenthietbididong
Thiết kế giao diện trên Android
Tổng quan  Trong Android, dùng Activity để hiển thị màn hình.  Mỗi activity sẽ chứa các View theo dạng cấu trúc cây, nghĩa là một Layout gốc chứa các view/layout con bên trong hoặc chỉ có 1 view duy nhất. (Layout cũng là một view)  Có thể thiết kế giao diện trong code java hoặc trong file xml trong thư mục layout. Lập trình trên thiết bị di động 3
Tree view Lập trình trên thiết bị di động 4
Layout mẫu của helloworld
Một số thuộc tính cơ bản • Layout_width, layout_height: chiều rộng của view (fill_parent là to bằng kích thước của layout chứa view này, wrap_content là vừa đủ nội dung cần hiển thị của view) • Orientation: với LinearLayout, việc sắp xếp các view là nằm kề nhau theo hàng ngang hoặc hàng dọc, ta khai báo orientation để chọn sắp theo kiểu nào (horizontal/vertical) Lập trình trên thiết bị di động 6
Một số thuộc tính cơ bản  Gravity: thuộc tính này qui định các view nằm bên trong layout sẽ đặt theo vị trí nào so với layout (trung tâm, trái , phải, trên dưới…)  Weight: để các view phân chia tỉ lệ diện tích hiển thị trên màn hình (tỉ lệ tính theo weight của từng view trên tổng số weight, các view không khai báo weight thì sẽ xem qua width và height) Lập trình trên thiết bị di động 7
Giao diện với LinearLayout  Giả sử cần thiết kế một màn hình như sau: Lập trình trên thiết bị di động 8
Giao diện với LinearLayout  Xem cây: Lập trình trên thiết bị di động 9
Một số loại layout khác • FrameLayout: các view bên trong được qui định vị trí bằng khoảng cách so với biên trái và trên so với layout, các view có thể đè lên nhau. • RelativeLayout: các view được thiết kế dựa trên quan hệ giữa chúng với nhau và với layout chứa chúng. • AbsoluteLayout: cho phép định vị tọa độ của các View mà nó chứa. Lập trình trên thiết bị di động 10
Lưu ý khi thiết kế giao diện  Hạn chế độ sâu của cây  Với các Layout phức tạp, không nên dùng RelativeLayout  Nên chèn vào dữ liệu tạm để xem trước layout hiển thị ra sao bên tab graphical layout (trong eclipse) Lập trình trên thiết bị di động 11
List  Rất hay dùng trong Android. Đặc biệt các ứng dụng cần lưu trữ và hiển thị nhiều dữ liệu.  List là một danh sách các view thông thường có cùng dạng layout đặt liền nhau. Lập trình trên thiết bị di động 12
Các thành phần giao diện View EditText ViewGroup CheckBox Button ImageButton MenuOptions ImageView ContextMenu ListView Quick Search Box TextView Lập trình trên thiết bị di động 13
View Là đối tượng xây dựng giao diện người dùng. Có nhiều kiểu View và ViewGroup, và đều gọi là Widget. Mọi Widget đều có chung các thuộc tính cơ bản: cách trình bày vị trí, background, kích thước, lề,… Trong Android Platform, các screen luôn được bố trí theo một kiểu cấu trúc phân cấp. Một screen là một tập hợp các Layout và Widget được bố trí có thứ tự. Hàm thể hiện một screen: setContentView(R.layout.main) Lập trình trên thiết bị di động 14
Thành phần giao diện ViewGroup ViewGroup View View View View View Cấu trúc phân cấp một giao diện ứng dụng Android Lập trình trên thiết bị di động 15
ViewGroup Là các Widget Layout được dùng để bố trí các đối tượng khác trong một screen. Có một số loại ViewGroup như sau: LinearLayout FrameLayout AbsoluteLayout RelativeLayout TableLayout Lập trình trên thiết bị di động 16
Các thuộc tính cơ bản  Layout_width: Chiều rộng của View.  Layout_height: Chiều cao của View.  Layout_marginTop: Khoảng cách với biên trên của View.  Layout_marginBottom: Khoảng cách với biên dưới cùng của View.  Layout_left: Khoảng cách với biên trái của View.  Layout_right: Khoảng cách với biên phải của View.  Layout_gravity: Xác định vị trí của View.  Layout_weight: Phân chia tỉ lệ hiển thị diện tích trên màn hình (tỉ lệ tính theo weight của từng view trên tổng số weight, các view không khai báo weight thì sẽ xem qua width và height).  Layout_x: Tọa độ x của View.  Layout_y: Tọa độ y của View. Lập trình trên thiết bị di động 17
Layout  Layout được sử dụng nhằm mục đích thiết kế giao diện cho nhiều độ phân giải. Thường khi lập trình nên kết hợp nhiều layout với nhau để tạo ra giao diện mong muốn. Lập trình trên thiết bị di động 18
Layout LinearLayout Bố trí các thành phần giao diện theo chiều ngang, chiều dọc nhưng trên một line duy nhất mà không xuống dòng. Không phụ thuộc vào kích thước màn hình. Lập trình trên thiết bị di động 19
Layout FrameLayout Bố trí các đối tượng theo kiểu những đối tượng thuộc Layer bên dưới sẽ bị che khuất bởi các đối tượng thuộc Layer nằm trên. ImageView Learn – TextView Android.co m Lập trình trên thiết bị di động 20