Bài giảng Lập trình Windows: Chương 4 - Xử lý đồ họa & văn bản

Chương 4. Xử lý đồ họa & văn bản

 Cơ chế đồ họa trên Windows – Device Context

 Lớp CDC và một số lệnh đơn giản

 Các đối tượng khác: CPen, CBrush, CRgn,…

 Thông điệp WM_PAINT và cửa sổ ảo

 Xử lý văn bản

 Ánh xạ khung nhìn

1

4.1. Giới thiệu ngữ cảnh thiết bị

 Ngữ cảnh thiết bị (Device Context - DC) là một cấu trúc GDI lưu thông tin cho việc hiển thị văn bản và hình ảnh trên thiết bị ra tương thích. Nó chứa đựng các đối tượng đồ họa như nét vẽ, mẫu tô, chế độ đồ họa,...

Kết quả

Vẽ

DC

 Mỗi đối tượng DC có một số hiệu định danh gọi là HDC (Handle Device

Context). Windows sử dụng số hiệu này để xử lý đồ họa.

 HDC là một kiểu dữ liệu lưu số hiệu ngữ cảnh thiết bị.  Mỗi cửa sổ có thể có nhiều đối tượng DC khác nhau tại những thời điểm

xử lý khác nhau.

2

4.2. Lớp CDC, CClientDC

 Thư viện MFC cung cấp một lớp để xử lý đồ họa là CDC (Class Device Context).

Lớp CDC

Chứa các lệnh vẽ

Chứa các tham số đồ họa

GDI

DC

 Xác định DC của một cửa sổ (dùng bên trong lớp cửa sổ)

Lớp này bao gói đối tượng HDC và các hàm API phục vụ đồ họa

 Hệ tọa độ gốc ở góc trái trên, trục X từ trái sang phải, Y từ trên xuống  Một số lệnh cơ bản trên CDC

CDC * CWnd :: GetDC(); hoặc CDC * CWnd :: GetWindowDC(); CClientDC object ( this );

3

MoveTo( x,y ); LineTo( x,y ); Ellipse( x1,y1, x2,y2 ); Rectangle( x1,y1, x2,y2 ); SetROP2( R2_NOT / R2_MASKPEN/... ); AngleArc( x,y, r, start, sweep ); Polyline( LPPOINT , count ); FloodFill( x,y, color );

4.3. Một số đối tượng lớp đồ họa

 Thư viện MFC cung cấp một số lớp hỗ trợ đồ họa gồm CPen : cung cấp màu vẽ, gồm các thành viên cơ bản sau:

CPen( kiểu, độ-dày, màu ); kiểu{PS_SOLID, PS_DOT, PS_DASH,...}

CBrush : cung cấp chế độ tô nền, gồm các thành viên cơ bản sau:

CBrush ( màu ); CBrush ( kiểu, màu );

CRgn : cung cấp vùng giới hạn vẽ, gồm các thành viên cơ bản sau:

 Hộp thoại chọn màu: CColorDialog trong thư viện gồm các

CreateRectRgn( x1,y1, x2,y2 ); CreateElipticRgn( x1,y1, x2,y2 );

hàm sau: CColorDialog( COLORREF màu); int CColorDialog :: DoModal(); { IDOK, IDCANCEL } COLORREF CColorDialog :: GetColor();

 Các đối tượng trên được đặt vào DC bởi lệnh CWnd :: SelectObject().

4

4.3. Một số đối tượng lớp đồ họa...

SelectObject(...)

Tô màu đỏ

DC cửa sổ

Vẽ màu xanh

5

Giới hạn nhìn thấy

4.4. Thông điệp WM_PAINT

 Mọi dữ liệu hiện trên cửa sổ sẽ bị mất nếu có sự thay đổi trên cửa sổ đó.  Thông điệp WM_PAINT được phát sinh khi có yêu cầu cập nhật lại nội

dung trên cửa sổ, do:  Tác động của người dùng như thay đổi kích thước, kích hoạt,...  Gọi hàm CWnd :: Invalidate() hoặc CWnd :: UpdateWindow().

 Để dữ liệu luôn tồn tại trên cửa sổ cần phải thực hiện mọi lệnh hiện và vẽ

chỉ trong hàm xử lý thông điệp này.

Lớp cửa sổ - CS

Phát sinh thông điệp Tác động của USER

WM_PAINT

void OnPaint() {

...

}

6

Hiển thị nội dung

4.4. Thông điệp WM_PAINT...

 Trong hàm xử lý thông điệp WM_PAINT phải sử dụng đối tượng lớp

CPaintDC thay cho lớp CDC thông thường để thực hiện vẽ.

 Mẫu hàm xử lý thông điệp WM_PAINT như sau:

afx_msg void OnPaint() {

CPaintDC dc( this ); ... viết các lệnh xử lý đồ họa ...

 Lớp CPaintDC được kế thừa từ lớp CDC.

}

Hàm OnMouseMove(...)

Hàm OnLButtonDown(...) Lớp CS có ?

Hàm OnLButtonUp(...)

7

Hàm OnPaint(...) Mảng chứa tọa độ các điểm đã vẽ

4.5. Cửa sổ ảo (virtual window)

 Hiện nội dung trên cửa sổ phải thực hiện trong hàm OnPaint() của thông

điệp WM_PAINT, dù chỉ một thay đổi rất nhỏ cũng phải hiện lại toàn bộ nội dung, chiếm khá nhiều thời gian trên máy.

 Windows cung cấp một cơ chế cửa sổ ảo cho phép lưu toàn bộ nội dung cửa sổ thật thành một bức ảnh, sau đó chép lên màn hình khi cần thiết.

 Minh họa như sau:

Vẽ lên cửa sổ thật và lưu vào cửa sổ ảo Bộ nhớ RAM

8

Lưu ảnh

Hiện lại nội dung

4.5. Cửa sổ ảo (virtual window)...

 Các bước tạo cửa sổ ảo:

B1) Khai báo các biến cho cửa sổ ảo

CDC memDC; CBitmap memBM; CBrush memBR;

B2) Tạo DC cửa sổ ảo lưu ảnh bitmap cho cửa sổ thật

memDC . CreateCompatibleDC( DC-cửa-sổ-thật ); memBM . CreateCompatibleBitmap( DC-thật, width, height ); memDC . SelectObject( &memBM );

B3) Tạo nền cửa sổ ảo

memBR . CreateSolidBrush( màu-nền-cửa-sổ-ảo ); memDC . SelectObject( &memBR ); memDC . PatBlt( 0,0, width, height, PATCOPY );

B4) Mọi quá trình vẽ đều thực hiện trên cửa sổ ảo qua memDC, sau đó sẽ chép ảnh từ cửa sổ ảo lên cửa sổ thật màn hình (thường trong hàm OnPaint) bằng lệnh sau:

9

DC-thật . BitBlt( x,y, width,height, memDC, Xsrc, Ysrc, chế-độ );

4.6. Xử lý văn bản

 Lớp CDC cung cấp một số lệnh xử lý văn bản gồm:

SetTextColor( COLORREF màu-chữ); và GetTextColor(); SetBkColor(màu); GetBkColor(); SetBkMode(

TRANSPARENT/OPAQUE);

TextOut( x,y, vb, len ); DrawText( LPCTSTR vb, int len, LPRECT rect, UINT format ); format={DT_LEFT/..., DT_VCENTER, DT_SINGLELINE, DT_CALCRECT,...}

CSize GetTextExtent( xâu, độ-dài );

 Cấu trúc mô tả TEXTMETRIC, kiểu LOGFONT:

 lfHeight(cao); lfWidth(rộng);  lfOrientation; lfWeight; lfItalic; lfUnderline; lfStrikeOut; lfEscapement; lfCharSet; lfOutPrecision; lfClipPrecision; lfQuality; lfPitchAndFamily; (set 0 to all)

 lfFaceName(tên phông chữ);

10

4.6. Xử lý văn bản...

 Để xử lý với phông chữ chúng ta sử dụng lớp CFont, chứa cấu trúc chữ,

kiểu chữ để hiển thị trên cửa sổ, gồm các hàm sau:

 Hộp thoại phông chữ được bao gói bởi lớp CFontDialog gồm:

CFont :: CreateFont( ... ) CFont :: CreateFontIndirect( LOGFONT *lf );

 Đối tượng ảnh bitmap được nạp từ tài nguyên qua lớp CBitmap sau

CFontDialog :: CFontDialog( LPLOGFONT lf=NULL ); int CFontDialog :: DoModal(); { IDOK, IDCANCEL } CFontDialog :: GetCurrentFont( LPLOGFONT lf );  Con trỏ văn bản (caret) được xử lý bởi các lệnh sau: CWnd :: ShowCaret(); và CWnd :: HideCaret(); CWnd :: SetCaretPos( POINT p ); và CPoint CWnd :: GetCaretPos(); CWnd :: CreateCaret( CBitmap *bmp );

11

CBitmap :: LoadBitmap( ID_bitmap );

4.7. Chế độ ánh xạ & khung nhìn

 Đơn vị vẽ trên cửa sổ là đơn vị lôgíc, thiết bị tính theo đơn vị vật lý (point),

chúng ta có thể thiết lập ánh xạ giữa hai đơn vị này bằng lệnh sau:

int CDC :: SetMapMode( mode ); các chế độ ánh xạ mode gồm

 Với chế độ ánh xạ người dùng (không là MM_TEXT) thì tọa độ vẽ giống

tọa độ đề các, gốc ở góc trái trên (chiều Y tăng từ dưới lên).

MM_TEXT – chế độ ánh xạ 1lôgíc=1point, MM_HIENGLISH – 1lôgíc=0.001point, MM_HIMETRIC – 1lôgíc=0.01mili, MM_LOENGLISH – 1lôgíc=0.01inc, MM_LOMETRIC – 1lôgíc=0.1mili,...

+Y

MoveTo(0,0)

+X

Độ dài 50 mili

LineTo(4000,-3000)

-Y

12

4.7. Chế độ ánh xạ & khung nhìn...

 Chế độ ánh xạ MM_ISOTROPIC cho phép quy định lại khung nhìn, gốc tọa

độ trên cửa sổ: CDC :: SetViewportExt( cx, cy );

 Hàm chuyển đổi giữa đơn vị lôgíc và vật lý:

CDC :: SetViewportOrg( x,y ); (tọa độ, kích thước là đơn vị vật lý - device point)

Điểm vẽ lôgíc

Độ cao vật lý theo chế độ ánh xạ

Gốc tọa độ mới

13

CDC :: DPtoLP( LPPOINT , count ); CDC :: LPtoDP( LPPOINT , count );