rc? Pĩ&rxiG-iĩ-ASEP r rdulieu.tailieuhoctap.vn/books/cong-nghe-thong-tin/lap-trinh-ung-dung/001xay_dung_ung...Văn Chí Nam - Nguyễn Đức Hoàng Hạ ... Phiên bản cập nhật

Xây dựng ứng dụng dialog-based trên Visual C++ 6.0

x Ắ r p ụ ĩ \ f(? ứ [ \ r(? P Ụ [ \ rc? P ĩ & r x i G - i ĩ - A S E Pr r

Văn Chí Nam - Nguyễn Đức Hoàng Hạ

Khoa Công nghệ Thông tin, Trường ĐH KHTN TP.HCM

('vcnam@,fit.hcmuns.edu.vn. [email protected])

Phiên bản cập nhật ngày 12/10/2004

MỤC ĐÍCH

Bài viết này giúp cho người đọc làm quen và có thể thực hiện được các thao tác cơ bản trên dialog. Bài viết này cũng cung cấp những tham khảo cơ bản dành cho một số lớp đối tượng quen thuộc trên MFC.

GIỚI THIỆU S ơ NÉT

Trong phần giới thiệu này, chúng ta sẽ làm quen với 1 vài lớp đối tượng cơ bản, cơ sở trên MFC.

Lóp CWnd

Đây là một lớp tổng quát và gặp rất nhiều lần trong quá trình làm việc trên dialog nói riêng và trên các ứng dụng MFC nói chung.

Lớp CWnd cung cấp các chức năng cơ bản cho tất cả các lớp cửa sổ1 (các control, mainframe, view, dialog...) trong thư viện MFC.

EnableWindow

BOOL EnableWindow( BOOL bEnable = TRUE );GetFocus

static CWnd* PASCAL GetFocus( );Trả về con trỏ CWnd của control đang được nhận focus.

IsEnableWindow

BOOL IsWindowEnabled( ) const;SetFocus

Đặt focus cho một đối tượng cửa sổ.

CWnd* SetFocus ( );

1 Từ vị tri này, thuật ngữ cửa sổ được hiểu chung cho các đối tượng thuộc nhóm này : dialog, các conứol, view, mainframe...

1

mailto:[email protected]


GetClientRect

Trả về toạ độ của hình chữ nhật bao quanh cửa sổ.

void GetClientRect( LPRECT lpRect ) const;Ví dụ :

CRect rect;pWnd->GetClientRect(&rect) ;MoveWindow

Dịch chuyển, thay đổi kích cỡ một cửa sổ

void MoveWindow(int X , int y, int nWidth,int nHeight, 300L bRepaint = TRUE ) ;

void MoveWindow(LPCRECT lpRect,BOOL bRepaint = TRUE); Ví dụ :

this->MoveWindow(100, 100,400, 400) ;

CRect rect; rect.top = 100; rect.left = 100; rect.right = 500; rect.bottom = 500; this->MoveWindow(Srect);GetDlgltem

Trả về con trỏ CWnd* của một cửa sổ con trên 1 dialog.

CWnd* GetDlgltem(int nID ) const;Ví dụ :

CWnd *pWnd;pWnd = GetDlgltem(IDC_EDIT1);GetDlgCtrUD

Trả về ID của một cửa sổ trên dialog,

int G e tD lg C t r l I D ( ) const;

GetDlgltemlnt

UINT GetDlgltemlnt (int nID, BOOL* lpTrans = NULL, 300L bSigned = TRUE ) const;

2


Trả về giá trị số nguyên của 1 control trên Dialog. (Dùng trong trường hợp không muốn nhận giá trị chuỗi của 1 số nguyên rồi chuyển từ chuổi sang số).

GetDIgltemText

int GetDlgltemText(int nID, LPTSTR lpStr, int nMaxCount) const;

int GetDlgltemText(int nID, CStringS rString) const; Lấy chuỗi nội dung của 1 control.

Ví dụ : Lấy chuỗi nội dung của control có ID là IDC_EDIT1 trên dialog.

cstring str;GetDlgltem(IDC_EDIT1, str) ;.// str sẽ mang nội dung của IDC_EDIT1SetDlgltemText

void SetDlgltemText(int nID, LPCTSTR IpszString);Đặt chuỗi nội dung cho một control trên dialog.

GetWindowT ext

Lấy nội dung cho một đối tượng cửa sổ

Ví dụ : Lấy nội dung cho đối tượng cửa sổ có ID là IDC TEXT

CWnd * pWnd; cstring str;pWnd = GetDlgltem(IDC_TEXT); pWnd->GetWindowText(str) ;SetWindowT ext

Đặt nội dung cho một đối tượng cửa sổ

Ví dụ : Đặt nội dung cho đối tượng cửa sổ có ID là IDC TEXT

CWnd * pWnd; cstring str;pWnd = GetDlgltem(IDC_TEXT); pWnd->SetWindowText("Hi ! Hello");

Lóp CString

Tham khảo tài liệu “Sử dụng các cấu trúc dừ liệu đom giản trên MFC” của thầy Lu Buon Vinh (thelastsamuraitor@,yahoo■ ca).

3


LƯU Ý TRONG THIẾT KỂ GIAO DIỆN

Thứ tự tab của các control (Tab-Order)

Các control trên dialog cần được tổ chức theo một thứ tự nhất định nhằm tạo tiện lợi cho người sử dụng khi dùng bàn phím. Người sử dụng sẽ sử dụng phím Tab ưên bàn phím để dịch chuyển từ một control này đến một control khác trên dialog. Người thiết kế dialog cần chú ý đặc điểm này khi thiết kế. Các control kế tiếp nhau phải có thứ tự tab kế tiếp nhau.

Sử dụng phím tắt Ctrl-D để bật chức năng Tab Order. (Có thể vào menu Layout\Tab Order).

Lần lượt click chọn các control theo thứ tự tăng dần của thứ tự tab. (Đừng quaxi tâm đến các static te x t!).

3 b lie Edit View Insert Project guild Layout Tools PureCoverage Purify Quantify Window Help _ s x j

lỀ l í ữ t ỉ *■ % a | 1 £ 2 - QL ▼ I m i s ' S ' i n j j ^ p H I 6 8 I B ( a »

1 CDemoDIg ▼ 11 (AM class members) z. II * C D e m o D lg z j 3 L ^

a ! Si

- Demo lesouices ■ffi □ Dialog Ố C j Icon + 1 String Tablefr: j Version

J x ]I .J. . . I . . . . I . . . . I . . . . I . . . . I . . . . I . . . . I <

■ 5 Clc m Rej H N # vÂ|Heady IX u

4


3 File Edit ViewA Insert Project Bulid Layout ;Tools PureCoverage Purify Quantify Window Help . - ' S j x j

ả I * 2 - £ 2 ■ T I i n I S ' S 1 _ d w p $ E l ũ £1

I CDemoDIg•

▼ 11 (All class members) ▼ Il g C D e m o D Ig ▼ 1 ▼ C S ' S f f f ï ^ ^ f

ẵS * ! il €

- J Demo resources 'Ẽ D Dialog Ị±i C 3 Icon + £ □ Suing Table + C d Version

■ ; Cb SEI R e | s Fil(j # VaỊ

Ready_____________________________

11 I • • I 11 • ■ 1 1 • I I • 1 1 • • 11 11 • I I • .......... I . .jJ

Dang Nhap

0 n dang nhap

O b khâu

0,0 219x106 EAD

Dùng chức năng hiển thị dialog lúc thiết kế (Ctrl-T) để kiểm tra xem thứ tự tab giữa các control đã phù hợp chưa.

Canh chỉnh control

Chức năng canh chỉnh

Các chức năng canh chỉnh có thể thực hiện:

- Canh chỉnh 2 hay nhiều control cùng kích cỡ (chiều dài, chiều rộng, hoặc cả hai chiều).

- Canh chỉnh 2 hay nhiều control theo cạnh trái / phải / trên / dưới của một c o n t r o l .

- Canh giữa control theo chiều cao, chiều rộng của dialog.

- Canh đều khoảng cách các control theo chiều cao, chiều rộng của dialog.

Nguyên tắc thực hiện

- Chọn lựa các control bằng cách nhấn chọn và giữ phím Cữl hoặc Shift.

- Control được chọn làm chuẩn sẽ được chọn sau cùng.

- Chọn chức năng cần thực hiện trên thanh công cụ sau :

| h iIn«- +□! on 104- -+o| f t ền S E E M X E3 m 03 m n

5


\ Dem o - M ic ro so ft V isual c++ - [Dem o.rc - IDD_DEMO_DIALOG [English (U.S.)] (D ialog EL j n jx jFile Edit View Insert Project Build Layout Tools Window Help

"Z1 IIDC_D0NGY j J I \ j : u i: k ed E H x|

¿J c $ j l *

Mat khau 1

c D ong Yo1' ' "C □ Xhoat

□-------cr-

lot SSI ? ? ềề I Ü E G M X B E ® j j j j j n

Ready

_ An ablL i □ °

|x ®3 Hi BE i

ậ En •0-> à ) i

a Ë

SI E3H j 63.7 ;□ 149 X f j

Jdr

Á

LÀM QUEN VỚI BIÉN ĐẠI DIỆN

Biến đại diện

tìiến đại diện giúp lập trình viên điều khiển, xác định, cập nhật giá trị của một control một cách nhanh chóng, tiện lợi. Có 2 loại biến đại diện : biến đại diện kiểu control và biến đại diện kiểu dữ liệu. Với biến đại diện kiểu control, chúng ta có thể thao tác ứên biến như thao tác trên đối tượng trực tiếp (có nghĩa là có thể dùng mọi phương thức đi kèm với lóp đối tượng). Với biến đại diện kiểu dữ liệu, chúng ta chỉ có thế xác định, cập nhật giá trị thể hiện trên nó. (Cùng 1 control nhưng có thể có các kiểu dữ liệu khác nhau, ví dụ, trên Edit Box, chúng ta có thể tạo biến đại diện kiếu CString, kiểu int, kiểu UINT... theo yêu cầu của bài toán.).

Xác đinh, câp nhât giá tri biến đai diên• 7 • J7 • o • • •

Sử dụng hàm UpdateData đế xác định hay cập nhật giá trị của một biến đạidiện.

Với UpdateData(TRUE), chúng ta có thể đưa giá trị hiện hành của control vào ưong biến đại diện.

Với UpdateData(FALSE), chúng ta sẽ cập nhật giá trị control bằng giá trị hiện hành của biến đại diện.

6


Các bước tạo biến đại diện

Bước 1 : Sử dụng tab Member Varỉables trong ClassWỉzard để tạo biến đại diện cho một control.

Bước 2 : Chọn ID của control cần đặt biến đại diện trong danh sách ControlIDs.

Bước 3 : Nhấn vào Add Variable để bắt đầu tạo.

Bước 4 : Đặt tên biến trong ô Member variable name, chọn loại biến trong danh sách Category, chọn kiếu dừ liệu của biến trong danh sách Variable type.

Bước 5 : Nhấn OK để đồng ý. Nhìn lại kết quả thực hiện được.

MFC C lassW izard -Ll-XjM essage Maps Member Variables | Automation | ActiveX Events | Class Info |

Project:

| Demo

Class name:

I |CDemoDlg

F : \tem p\D emoNDemoDlg. h, F : \temp\D emo\DemoD Ig. cpp

Control IDs: Type Member

IlDC DONGYIDC MATKHAU

Add Class... ^ I

^ QdiiVaS|ÖE

Delete Variable

Update Columns

IDC_TENDANGNHAPIDC_TH0AT Bind All

Description:

OK Cancel

_u*iMember variable name:

|m_strMatK.hatJ

Category:

¡Value

Variable type:

| CStnng ~ 1

Description:

CString with length validation

OK

C ancel

Add M e m b e r V a riab le

7


MFC C lassW izard J ? j x j

M essage Maps Member Variables 1 Automation 1 ActiveX Events 1 Class Info 1

Project: Class name:

|D em o ■’’ I jCDemoDIg dF: \tem p\D emo\D emoD lg. h, F: \temp\D emoSD emoDIg.cpp

Control IDs: Type Memberl i n r nnw rjYỉiiDC MATKHAU estriña m stfMatKhau s

IDC TENDÄNGNHAP------------------------------------------------IDC.THOAT

D escription: cs tfing with length validation

Maximum Characters:

Add Class...

Add Variable...

Delete Variable

Update Columns

Bind All

OK Cancel

VÍ DỤ MINH HOẠ

Mô tả

ủng dụng đơn giản mà chúng ta sẽ xây dựng trong bài viết này là một màn hình đăng nhập trong một chương trình.

Người sử dụng sẽ nhập vào tên đăng nhập và mật khẩu vào ừong 2 hộp thoại tương ửng. Sau khi nhập xong, có thể nhấn vào nút Dong Y để kiểm tra mật khẩu. Nếu mật khẩu và tên đăng nhập hợp lệ, người sử dụng nhận được một thông báo chúc mừng. Ngược lại, người sử dụng phải tiếp tục nhập lại mật khấu, tên đăng nhập.

Màn hình đăng nhập được thế hiện dưới đây :

BTen dang nhap |N guyenV anA

I

XXXXM ■

Dang Nhap

Dong Y Thoat

8


Các bước tạo project mói

Bước 1 : Tạo một project mới sử dụng MFC AppWizard. Đặt tên cho project mới là Demo.

Bước 2 : Chọn loại ứng dụng là Dialog-based.

Bước 3 : Giữ nguyên các giá trị mặc định. (Lưu ý : có thế thay đổi nội dung của thanh tiêu đề (title bar) ở Step 2.

9


MFC AppW izard - Step 2 of 4

C lo s «

A b o a t A p pHçTJ

E d i t in g C o n t r o l : I R e c o r d

fx" C k c c k B o x f î R a d io B iU o k

r R a d io B t U o i

D B

«3 Ap p l i c i l i o iM o ve

W hat features would you like to include?

I* i bout boH r Context-sensitive Help

W 3D controls

W hat other support would you like to include?

I- Automation

R? ActiveX Controls

Would you like to include WOSA support?

I~ Windows Sockets

Please enter a title for your dialog:

^'■'■'’jDemo

< Back Next > Finish Cancel

Bước 4 : Có thể nhấn Finish để kết thúc. Các thông tin tổng hợp về project được hiển thị ở dialog cuối cùng.

New Pro ject Information

AppWizard will create a new skeleton project with the following specifications:

Application type of Demo:Dialog-Based Application targeting:

Win32

Classes to be created:Application: CDemoApp in Demo n and Demo.cpp Dialog: CDemoDIg in DemoDIg.h and DemoDIg.cpp

Features:+ About box on system menu + 3D Controls+ Uses shared DLL implementation (MFC42.DLL)+ ActiveX Controls support enabled + Localizable text in:

English [United States]

Project Directory:

C:\USERS\Demo

OK Cancel

10


Các bước thiết kế giao diện

Chọn tab ResourceView phần Workspace. Chọn dialog mong muốn thiết kế ưên nhánh Dialog.

Kéo thả các control đến các vị trí mong muốn trên dialog. Dialog Đăng nhập như mô tả phía trên cần dùng 2 static text, 2 edit box, và 2 button.

Đặt tên (ID) một số control theo quy ước sau :

STT Control Tên Ghi chú

1 Edit box 1 IDCTENDANGNHAP

2 Edit box 2 IDC_MATKHAU Chọn style Password cho control này

3 Button 1 IDCDONGY

4 Button 2 ID CTH OA T

© General ! Styles || Extended Styles |

Align text:______ P | 7 Password [* Border

| Left I* Auto HScroll F No hide selection F Uppercase

i Multiline r Vertical scroll r OEM convert r Lowercase

r Number r Auto VScroll r W ant return r Read-only

Push Button Properties ®

¡9 ? General I Styles I Extended Styles I

ID: |IDC_D0NGY Caption: |!33WliH

pỹ Visible F Group f Help ID

F Disabled f? Tab stop

Tạo biến đại diện

Chúng ta cần xác định giá trị của 2 hộp Edit Box Tên đăng nhập và Mật khấu. Do đó, chúng ta sẽ đặt 2 biến đại diện tương ứng với 2 control này.

ID Biến Kiểu Ghi chu

IDC_MATKHAU m strM atKhau c String Mật khẩu

IDC_TENDANGNHAP m_sfrT enDangNhap c String Tên đăng nhập

11


MFC C lassW izard J ? j x j

M essage Maps Member Variables 1 Automation 1 ActiveX Events 1 Class Info 1

Project: Class name:

|D em o |CDemoDlg

F : \temp\Demo\DemoD lg. h, F:\temp\D emoSD emoD Ig. cpp

Control IDs: Type Member

IDC DONGYIDCLMATKHAU CStting m stfMatKhau

IIDC TENDANGNHAP estriña m stfTenDanqNhap

Add Class...

Add Variable...

Delete Variable

Update Columns

IDC_TH0AT Bind All

D escription: cs tfing with length validation

Maximum Characters:

OK Cancel

Viet code

Nhấn vào nút Dong Y

Xử lý sự kiện BN_CLICKED trên button Dong Y.

Quan sát các chỗ được Visual c++ 6.0 tự động thêm vào (lập trình viên có thể thêm bằng tay vào các vị trí này khi viết một hàm xử lý sự kiện riêng).

Tập tin DemoDlg.cpp (thêm 2 chồ)void CDemoDlg::OnDongy(){

// TODO: Add your control notification handler code here //Viết code thêm ở chỗ này

}

BEGIN_MESSAGE_MAP(CDemoDlg, CDialog)//{{AFX_M3G_MAP(CDemoDlg)ON_WM_SYSCOMMAND()ON_WM_ PAINT()ON_WM_QUERYDRAGICON()ON_BN_CLICKED(IDC_DONGY, OnDong; )//}}AFX_MSG_MAP

END_MESSAGE_MAP()

Tập tin DemoDlg.h (thêm 1 chỗ)

.// Generated message map functions _____ //{{AFX MSG(CDemoDlg)_________

12


virtual BOOL OnlnitDialog();afx_msg void OnSysCommand(UINT nID, LPARAM lParam);afx_msg void OnPaintO;afx_msg HCURSOR OnQueryDraglcon();afx_msg void OnDongyO;//}}AFX_MSGDE c LARE_ME s sAGE_MAP()

Trong phần xử lý việc nhấn vào nút Dong Y, chúng ta phải cập nhật lại giá trị cho các biến đại diện. Sau đó, chúng ta sẽ kiếm ừa xem Tên đăng nhập (biến m_strTenDangNhap) và mật khẩu (biến m_strMatKhaù) có hợp lệ không. Nấu không thì yêu cầu người sử dụng nhập lại.

UpdatcData(TRUE);if (m_strTenDangNhap != "test" I I m_strMatKhau != "test"){

MessageBox ("Ten dang nhap hoac mat khau khong hop le","Thong bao",MB_OKIMB_ICONEXCLAMATION);

m_strMatKhau =UpdateData(FALSE); return;

}

Nếu muốn con trỏ tự động nhảy vào hộp Mật Khấu nếu người dùng gõ sai mật khẩu thì ta có thể thêm vào đoạn mã sau :

CWnd * pWnd;pWnd = GetDlgltem(IDC_MATKHAU); pWnd->SetFocus();

Tóm lại, hàm xử lý sự kiện nhấn vào button Dong Y như sau :void CDemoDlg::OnDongy(){

// TODO: Add your control notification handler code here UpdateData(TRUE);if (m_strTenDangNhap != "test" I I m_strMatKhau != "test"){

MessageBox ("Ten dang nhap hoac mat khau khong hop le","Thong bao",MB_OKIMB_ICONEXCLAMATION);

mstrMatKhau =UpdateData(FALSE);CWnd * pWnd;pWnd = GetDlgltem(IDC_MATKHAU);pWnd->SetFocus();return;

}MessageBox("Chưc mung ban dang nhap thanh cong","Thong

bao");}

13

Nhấn vào nút Cancel

Trong hàm Cancel chúng ta làm duy nhất một thao tác kết thúc Dialog. Tuy nhiên, có thế thêm vào chức năng hỏi người dùng có muốn kết thúc hay không. Nếu thực sự muốn kết thúc thì sẽ cho phép kết thúc.

Đế thoát khỏi màn hình một dialog, thêm vào một dòng mã sau :

CDialog::OnCancel0;Kiểm tra trả lời từ người dùng :

int Result;Result = MessageBox("Ban CO muon thoat khong ?","Thong

bao",MB_YESNOIMB_ICONQUESTION); if (Result == IDYES){

//Thực hiện công việc ở đây}

Tóm lại, hàm xử lý sự kiện nhấn vào button Thoat như sau :void CDemoDlg::OnThoat(){

// TODO: Add your control notification handler code hereint Result;Result = MessageBox("Ban CO muon thoat khong ?","Thong

bao",MB_YESNOIMB_ICONQUESTION); if (Result == IDYES){

CDialog::OnCancel0;}

}


14

Documents

rc? Pĩ&rxiG-iĩ-ASEP r rdulieu.tailieuhoctap.vn/books/cong-nghe-thong-tin/lap-trinh-ung-dung/001xay_dung_ung...Văn Chí Nam - Nguyễn Đức Hoàng Hạ ... Phiên bản cập nhật