Bài giảng Lập trình ứng dụng quản lý 1 - Chương 4: Thiết kế giao diện - Ngô Chánh Đức
ĐHQG HCM – TỜNG ĐH KHOA HỌC TỰ NHIÊN
KHOA CÔNG NGHỆ THÔNG TIN
Thiết kế giao diện
Lập trình ứng dụng quản lý 1
ThS. Ngô Chánh Đức
Push Button
Cho phép người dùng thực hiện chức năng
chính của Form
Nhãn và vị trí cho phép người dung hiểu được
chức năng của nó
Chỉ sử dụng cho những hành động thường
xuyên/quan trọng
Hạn chế số lượng Push Button
10/24/2017
Lập trình ứng dụng quản lý 1 - ThS. Ngô Chánh Đức
4
Push Button
Sử dụng các nhãn thông dụng
Nhã n
OK
Ý nghĩa
Thực hiện cá c thay đổi và đóng cửa sổ
Khô ng thực hiện thay đổi và đóng cửa sổ
Cancel
Close
Đóng cửa sổ (khi những thay đổi thực hiện khô ng
thể hủy bỏ)
Reset
Apply
Help
Đặt lại ban đầu cho cá c giá trị của cửa sổ
Thực hiện thay đổi nhưng khô ng đóng cửa sổ
Mở cửa sổ giúp đỡ
Thay đổi tên nhãn (thay vì OK) nếu nút cho phép thực
hiện chức năng cụ thể khác (In, xóa, …)
Sử dụng dấu >> cho biết hộp thoại sẽ được mở rộng
10/24/2017
Lập trình ứng dụng quản lý 1 - ThS. Ngô Chánh Đức
5
Push Button
Nhóm các nút cùng chức năng lại với nhau
Cách bố trí nút:
▪Left-aligned
▪Center-aligned
▪Top-right
Nút có chức năng ít dùng vị trí cần dùng
10/24/2017
Lập trình ứng dụng quản lý 1 - ThS. Ngô Chánh Đức
6
Radio button
Dùng khi muốn chọn 1 lựa chọn duy nhất
Bố trí theo chiều dọc thường được dùng hơn
Giới hạn ít lựa chọn
Sắp xếp theo độ thường dùng, alphabet, hoặc
logic nào đó
Trá nh dùng cho lựa chọn Yes/No
10/24/2017
Lập trình ứng dụng quản lý 1 - ThS. Ngô Chánh Đức
7
Check Box
Cho phép chọn 1 hoặc nhiều lựa chọn
Dùng cho trường hợp Yes/No, On/Off
Nhóm các lựa chọn lại
Bố trí theo chiều dọc
Giới hạn khoảng 10 lựa chọn trở xuống
Sắp xếp giống Radio button
10/24/2017
Lập trình ứng dụng quản lý 1 - ThS. Ngô Chánh Đức
8
List Box
Sử dụng khi quá nhiều lựa chọn
▪Có thể chọn 1 hoặc nhiều
Hoặc khi dữ liệu động
Hiển bị khoảng 3 – 8 lựa chọn
Kết hợp bộ lọc cho dữ liệu lớn
10/24/2017
Lập trình ứng dụng quản lý 1 - ThS. Ngô Chánh Đức
9
Data Field (Trường dữ liệ)
Sử dụng TextBox cho dữ liệu nhập thô ng
thường
Sử dụng Label cho dữ liệu khô ng chỉnh sửa
được
Sử dụng TextBox ở trạng thá i Disable cho dữ
liệu tạm thời khô ng chỉnh sửa
Canh độ dài TextBox theo số lượng ký tự cho
phé p
Canh trá i cá c trường dữ liệu
Nhó m cá c trường dữ liệu nếu cần thiết
10/24/2017
Lập trình ứng dụng quản lý 1 - ThS. Ngô Chánh Đức
10
Data Field Label Nhãn dữ liệ)
Đánh nhã n hết tất cả trường dữ liệu
Đặt bên trá i trường dữ liệu
Canh trá i chữ
10/24/2017
Lập trình ứng dụng quản lý 1 - ThS. Ngô Chánh Đức
11
Hiện thcửa sổ
Bố trí giữa cá c cửa sổ
▪Cascading Windows
• Sử dụng khi người dùng chỉ cần tập trung vào 1 màn
hì nh
▪Tiled Windows
• Sử dụng khi người dung cần quan sá t hết thô ng tin
của cá c màn hì nh khá c
Trá nh việc cuộn ngang trên cửa sổ
10/24/2017
Lập trình ứng dụng quản lý 1 - ThS. Ngô Chánh Đức
12
Hiển thcủa cửa sổ
Modal và Modeless
▪Modal dialog: cá c cửa sổ khá c sẽ khô ng hoạt động
khi cửa sổ Modal chưa được hoàn tất
• Dùng cho việc nhập liệu
• Dùng cho những tá c vụ nhỏ, lẻ
▪Modeless dialog: người dùng vẫn có thể làm việc với
cửa sổ khá c khi cửa số Modeless vẫn cò n hoạt động
• Dùng cho việc thường lặp đi lặp lại
• hoặc để theo dõ i hệ thống
10/24/2017
Lập trình ứng dụng quản lý 1 - ThS. Ngô Chánh Đức
13
Điều hướng cửa sổ
Mỗi cửa sổ/hộp thoại đại diện cho 1 tá c vụ (con)
Nếu tá c vụ quá phức tạp thì ta tá ch làm nhiều
cửa sổ
Cần có nút trở về Màn hì nh chủ
▪Màn hì nh chủ khô ng nên chỉ là màn hì nh trống với
menu
▪Màn hì nh chủ nên gợi ý giúp người dùng sẽ thực hiện
những cô ng việc gì , hoặc cung cấp thô ng tin hữu í ch
khá c
10/24/2017
Lập trình ứng dụng quản lý 1 - ThS. Ngô Chánh Đức
14
Màn hình giới
Tổng quá t về hệ thống
cá c màn hì nh và việc di
chuyển điều khiển giữa
chúng
thiệu
Màn hình chính
Màn hình kết thúc
Màn hình
Công việc thứ 1
Màn hình
Công việc thứ 2
Màn hình
Công việc thứ n
Màn hình
Công việc trung gian 1
Màn hình
Công việc trung gian n
16
10/24/2017
Phân loại màn hình giao diện
Màn hì nh chí nh
Màn hình nhập liệu lưu trữ
Màn hình nhập liệu xử lý
Màn hình kết quả
Màn hì nh thô ng bá o
Màn hình tra cứu
10/24/2017
Lập trình ứng dụng quản lý 1 - ThS. Ngô Chánh Đức
18
Màn hình chính
Nội dung: danh sá ch cá c cô ng việc
Hì nh thức trì nh bày:
▪Phí m nó ng
▪Thực đơn
▪Biểu tượng
▪Sơ đồ
▪Tí ch hợp: kết hợp nhiều hì nh thức
Thao tá c người dùng: chọn cô ng việc
10/24/2017
Lập trình ứng dụng quản lý 1 - ThS. Ngô Chánh Đức
19
Thiếkế màn hình chính dùng thựđơn
Thực đơn hướng chức năng
Thực đơn hướng đối tượng
Thực đơn hướng quy trì nh
10/24/2017
Lập trình ứng dụng quản lý 1 - ThS. Ngô Chánh Đức
20
Tải về để xem bản đầy đủ
Bạn đang xem 20 trang mẫu của tài liệu "Bài giảng Lập trình ứng dụng quản lý 1 - Chương 4: Thiết kế giao diện - Ngô Chánh Đức", để tải tài liệu gốc về máy hãy click vào nút Download ở trên
File đính kèm:
bai_giang_lap_trinh_ung_dung_quan_ly_1_chuong_4_thiet_ke_gia.pdf

