Tài liệu Chương 2: Thiết kế giao diện pdf

Các thuộc tính thông dụngName Tên đặt cho điều khiển BackColor Màu nền của điều khiển Caption Nhãn hiện lên trên điều khiển như tiêu đề Enabled Có được làm việc với điều khiển hay không

1 Biểu mẫu (Form)

• Là một cửa sổ hoặc hộp thoại tạo nên một phần giao diện của ứng dụng

• Trong một đề án có thể có nhiều Form, mỗi Form được lưu thành 1 file độc lập có đuôi mở rộng (*.Frm)

Chương 2: THIẾT KẾ GIAO DIỆN

Các thuộc tính thông dụng

Name Tên đặt cho điều khiển

BackColor Màu nền của điều khiển

Caption Nhãn hiện lên trên điều khiển như tiêu đề

Enabled Có được làm việc với điều khiển hay không

TabIndex Thứ tự của điều khiển khi ấn phím Tab

Visible Có nhìn thấy điều khiển hay không

Text Dùng cho những điều khiển để nhập

dữ liệu từ người sử dụng

2 Các điều khiển thường dùng

• Thiết kế Form thực chất là tạo trên Form các điều khiển Các điều khiển được tạo nhờ các công cụ trong hộp công cụ (Toolbox)

- B1: Chọn điều khiển trong hộp Toolbox

- B2:Chọn vị trí để đặt điều khiển trên Form

- B3: Ấn và kéo để tạo dáng điều khiển

• Ví dụ: Khi click vào nút Close sẽ thoát khỏi chương trình

Private Sub cmdClose_Click() Unload Me

End Sub

lose C

Locked Cho phép người sử dụng nhập dữ liệu hay không

MaxLength Số kí tự tối đa được nhập vào ( 0 là không giới hạn)

MultiLine Khi văn bản quá dài TextBox sẽ tự động xuống dòng

2.3.Nhãn (Label)

• Mục đích: Hiển thị chuỗi kí tự trên biểu mẫu, thường

đi kèm với TextBox vì TextBox không có thuộc tính Caption

• Thông thường chuỗi kí tự thuộc Nhãn là không đổi

• Thường chỉ thao tác với một vài thuộc tính: Font,

BorderStyle

2.4 Ô tuỳ chọn (CheckBox)

• Mục đích: Cho phép user chọn hay không chọn một khả năng nào đó Trong một nhóm có nhiều CheckBox có thể chọn 1, nhiều hoặc tất cả

• Thuộc tính:

 Alignment : Canh lề cho tiêu đề của CheckBox

 Value : 0 –Unchecked : Không chọn

1 – Checked : Chọn

2 – Grayed : Cấm chọn

2.5 Nút tuỳ chọn (OptionButton)

• Mục đích: Trong một nhóm có nhiều nút tuỳ chọn, user chỉ được chọn 1 khả năng Khi đó nút được chọn

có giá trị True, các nút còn lại sẽ có giá trị False

• Thường dùng mảng điều khiển

2.6 Khung (Frame)

• Mục đích: dùng để gộp nhóm các điều khiển khác

• Điều khiển đơn giản, thường không sử dụng đến các

sự kiện của khung, chỉ thay đổi một số thuộc tính như: Name, Caption, Font

2.7.Hộp danh sách (ListBox)

• Mục đích: Liệt kê các phần tử, người sử dụng chỉ được nhìn thấy và chọn 1 hoặc nhiều phần tử trong danh sách

2 – Extended: Đa lựa chọn mở rộng Hỗ trợ cách lựa chọn có ấn phím Shift

Truy cập vào các phần tử trong ListBox:

o ListIndex : số thứ tự trong danh sách của phần tử được chọn Nếu không có phần tử nào được chọn thì ListIndex

= -1 Các phần từ trong ListBox được đánh số thứ tự từ

0

o ListCount : số lượng các phần tử trong danh sách Giá trị của ListCount luôn lớn hơn 1 so với giá trị của ListIndex

o List : Lấy nội dung của phần tử được chỉ định hoặc thêm vào danh sách tại vị trí được chỉ định ( Object.List(index) = [string])

Thêm các phần tử vào ListBox trong lúc design.

o Text : Lấy nội dung của phần tử được chọn

2.8 Danh sách thả xuống (ComboBox)

1- Simple Combo: Luôn hiển thị cả danh sách và cho phép người sử dụng gõ vào hộp văn bản Để nhìn thấy tất cả danh sách phải kéo ComboBox đủ rông

o 2 – Dropdown ListBox: Người sử dụng chỉ

có thể lựa chọn từ danh sách, gõ vào hộp văn

bản thì danh sách sẽ cuộn đến đúng phần tử

cần yêu cầu

- Phương thức: Tương tự như ListBox

- Kích cỡ của ComboBox không thay đổi được

Quy ước đặt tên các điều khiển cơ bản

Đối tượng Qui ước Ví dụ

Căn chỉnh các điều khiển

Bước 1: Tạo dự án mới, trong đó ta có thể sử dụng OLE

Hộp thoại Insert Object hiện ra để ta lựa chon,

ở đây chọn kích hoạt Create New, Object Type là Bitmap Image, đánh dấu chọn Display as Icon

Bước 2: Nhấn OK, Vb sẽ gọi trình ứng dụng Paint và ta vẽ hình lên cửa sổ Paint Sau đó chọn File  Exit &Return trong cửa sổ Form, ta được

THAO TÁC VỚI DRIVELISTBOX,

DIRLISTBOX, FILELISTBOX

• 1 Một Form

• Một điều khiển DriveListBox

• Một điều khiển DirListBox

• Một điều khiển FileListBox

• Một điều khiển ImageBox

Bước 1: Tạo giao diện người dùng Ta chỉ cần nhấp và vẽ đúng vị trí từng điều khiển trên Form

*.ico;*.jpg

4: ImageBox

Tương tự cho DirListBox & FileListBox

Private Sub DirSource_Change()

FilSource.Path = DirSource.Path

End Sub

Private Sub FilSource_Click()

Imgsource.Picture = LoadPicture(FilSource.Path & "\" & FilSource.FileName)

End Sub

Bước 3: Lưu dự án lại vào thư mục, chạy

chương trình nhấn phím F5

1,2: 2 Frame: Caption : Thông tin, Nhập thông tin, Font Vntimeh 3: Label: Caption: Mã Sinh viên, Họ tên, Nơi sinh

46: ListBox : Name: lstma, lstHt, lstNs

Name: cmdNhap, Cmdnhaplai, cmdXoa, CmdClose

Caption: &Nhập, N&hập lại, &Xóa, &Close

Bước 2: Viết mã trao đổi thông tin giưa các đối tượng:

• Trong cửa số thiết kế Form, nhấp đúp vào Nhập, cửa số Code hiện ra xử lý sự kiện sau:

Private Sub cmdnhap_Click()

‘Khi nhập dữ liệu vào ô Nhập thông tin rồi nhấn vào nút

Nhập sẽ được chuyển DL lên Listbox ở Thông tin

Lstma.AddItem txtma.Text lstHt.AddItem txtht.Text lstns.AddItem txtns.Text txtma.Text = ""

txtht.Text = ""

txtns.Text = ""

End Sub

Private Sub cmdnhaplai_Click()

nhấn phím F5