›
›

Bài giảng Đồ hoạ máy tính - Nguyễn Văn Đồng

doc 27 trang phuongnguyen 3800
Download
Bạn đang xem 20 trang mẫu của tài liệu "Bài giảng Đồ hoạ máy tính - Nguyễn Văn Đồng", để tải tài liệu gốc về máy bạn click vào nút DOWNLOAD ở trên

Tài liệu đính kèm:

  • docbai_giang_do_hoa_may_tinh_nguyen_van_dong.doc

Nội dung text: Bài giảng Đồ hoạ máy tính - Nguyễn Văn Đồng

  1. Bài giảng Đồ hoạ máy tính - Nguyễn Văn Đồng - Trường TCNghề số 15 BÀI 1. GIỚI THIỆU I. Giới thiệu về đồ họa máy tính: 1. Ngành Đồ hoạ Máy tính Đồ hoạ máy tính (Computer Graphics) là một nhánh của khoa học máy tính, nghiên cứu các phương pháp, kỹ thuật và công cụ xử lý đồ hoạ (lưu trữ, thể hiện, biến đổi, tăng chất lượng ). Những ứng dụng chính của đồ hoạ máy tính: Giao diện người dùng đồ hoạ (GUI) Xử lý ảnh (Photoshop) Thiết kế kỹ thuật (các hệ thống CAD như AutoCAD) Dựng hoạt hình (Flash MX, Director) Mô phỏng và dựng hình 3D (Maya, 3D Studio Max) Video game (trò chơi điện tử) 2. Môn học Đồ hoạ Máy tính Môn học Đồ hoạ Máy tính dành cho hệ đào tạo tại chức có thời lượng 45 tiết, nhằm hai mục tiêu chính: - Cung cấp những khái niệm, kỹ thuật và phương pháp cơ bản của ngành Đồ hoạ Máy tính. - Tạo cơ hội cho sinh viên được thực hành lập trình đồ hoạ trên một môi trường đồ hoạ. Chúng tôi chọn môi trường đồ hoạ BGI của Turbo Pascal 7.0 vì tính đơn giản, dễ sử dụng và ngôn ngữ Pascal quen thuộc với người học nhất. Thời lượng môn học được chia thành 30 tiết lý thuyết và 15 tiết thực hành. II. MỘT SỐ KHÁI NIỆM 1. Chế độ hiển thị Chế độ hiển thị là khái niệm về cách thức máy tính hiển thị kết quả của quá trình xử lý thông tin và quá trình tương tác giữa người và máy trên thiết bị ra. Có hai chế độ hiển thị: Chế độ ký tự (text mode) là chế độ hiển thị mà phần tử hiển thị cơ bản là kí tự. Màn hình được chia thành các hàng và các cột xác định (80x25), giao điểm của các hàng và các cột tạo thành các ô. Mỗi ô hiển thị được 1 kí tự. Do đó phần tử bé nhất có thể hiển thị được trên màn hình là kí tự. Chế độ kí tự có các ưu điểm là tốn ít bộ nhớ, xử lí và hiển thị rất đơn giản và nhanh. Nhược điểm của chế độ này là chỉ hiển thị được các kí tự, không hiển thị được hình ảnh và các đối tượng có độ chi tiết cao, phổ màu rộng, các kí tự chỉ có một dạng font duy nhất. Chế độ đồ hoạ (graphic mode) là chế độ hiển thị mà phần tử hiển thị cơ bản là điểm ảnh. Màn hình cũng được chia thành các hàng và các cột, giao điểm của các hàng và các cột tạo thành các ô, mỗi ô hiển thị được 1 điểm ảnh. So với chế độ kí tự thì số dòng và số cột trong chế độ đồ hoạ lớn hơn rất nhiều (ví dụ 800 x 600), do đó 1 điểm ảnh rất nhỏ so với 1 kí tự. Ưu điểm của chế độ đồ hoạ là: hiển thị được hình ảnh và các đối tượng có độ chi tiết cao, phổ màu rộng, cho phép hiển thị các kí tự có dạng font khác nhau Ngược lại nhược điểm của chế độ đồ hoạ là đòi hỏi nhiều bộ nhớ và năng lực xử lí. 2. Đồ hoạ bitmap và đồ hoạ vector Trang 1
  2. Bài giảng Đồ hoạ máy tính - Nguyễn Văn Đồng - Trường TCNghề số 15 Đồ hoạ bitmap là phương pháp biểu diễn dữ liệu đồ hoạ trong đó các đối tượng đồ hoạ được mô tả dưới dạng ma trận các điểm ảnh. Đồ hoạ bitmap phù hợp với các đối tượng có độ chi tiết cao, màu sắc phong phú. Nhược điểm của đồ hoạ bitmap là không giữ được độ nét khi co giãn ảnh và rất tốn bộ nhớ. Thường dùng với ảnh số, video số Đồ hoạ vector là phương pháp biểu diễn dữ liệu đồ hoạ trong đó các đối tượng đồ hoạ từ phần tử cơ bản là đoạn thẳng và những đối tượng xây dựng từ đoạn thẳng như đa giác, đường gấp khúc, đường cong Đồ hoạ vector tốn ít bộ nhớ, giữ được độ nét khi co giãn nhưng không phù hợp để mô tả các đối tượng phức tạp hoặc phổ màu rộng, thường dùng cho hình vẽ, logo 3. Điểm ảnh và độ phân giải Điểm ảnh là phần tử nhỏ nhất hiển thị được trên thiết bị hiển thị hoặc cũng là phần tử bé nhất dùng để mô tả đối tượng đồ hoạ. Tuỳ theo kiểu đồ hoạ hoặc thiết bị đồ hoạ mà ta có các thuật ngữ khác nhau mô tả điểm ảnh pixel (picture element) là thuật ngữ mô tả điểm ảnh trong đồ hoạ bitmap. point là thuật ngữ mô tả điểm ảnh trong đồ hoạ vector. dot là đơn vị nhỏ nhất mà thiết bị hiển thị (màn hình, máy in, ) hiển thị được. Độ phân giải biểu thị khả năng hiển thị và độ nét của chế độ đồ hoạ, hoặc đối tượng hoặc thiết bị đồ hoạ. Độ phân giải càng cao thì khả năng hiển thị càng lớn hoặc độ nét càng lớn. Có nhiều cách mô tả độ phân giải: Số cột x số dòng: mô tả màn hình đồ hoạ được chia thành bao nhiêu cột và bao nhiêu dòng (từ đó suy ra số pixel và kích thước của mỗi pixel). Thường dùng mô tả kích thước ảnh số, độ phân giải màn hình. Ví dụ nói độ phân giải màn hình là 800x600 có nghĩa là màn hình được chia thành 800 cột, 600 dòng và có 800 x 600 = 480.000 điểm ảnh. Số pixel tối đa mà thiết bị đồ hoạ có thể lưu trữ, thường dùng mô tả độ phân giải của máy ảnh số. Chẳng hạn máy ảnh số 3 mega pixel, 5 mega pixel Từ số điểm ảnh tối đa ta có thể ước lượng được kích thước tối đa của ảnh. Chẳng hạn máy ảnh 3MP có thể chụp được ảnh có độ phân giải 2000x1500 (trong khi đó độ phân giải thông thường của màn hình là 800x600). dpi (dot per inch): số dot tạo được trên mỗi inch (thường dùng cho máy in hoặc máy quét ảnh). Độ nét của trang in hoặc ảnh quét phụ thuộc vào dpi. Các thông số thường dùng cho máy in laser là 300 dpi hoặc 600 dpi. Từ tham số dpi ta cũng có thể suy ra được kích thước ảnh. Chẳng hạn nếu ta quét 1 tấm ảnh tức là 5x4 inch với độ phân giải 300 dpi thì kích thước ảnh ta có là 1500x1200 điểm ảnh. 4. Hệ toạ độ và phép chiếu Hệ toạ độ dùng để xác định vị trí các đối tượng hoặc điểm ảnh, nhờ đó ta thực hiện được các thao tác đồ hoạ (chẳng hạn để vẽ một đoạn thẳng ta cần chỉ ra toạ độ của 2 điểm đầu mút của đoạn thẳng đó). Có 3 loại hệ toạ độ khác nhau: Hệ toạ độ hiển thị là hệ tọa độ xác định vị trí các điểm ảnh trên thiết bị hiển thị. Do hạn chế bởi độ phân giải và do đặc điểm của đồ hoạ bitmap, hệ toạ độ hiển thị sử dụng số nguyên, có trục y hướng xuống dưới và chỉ sử dụng các giá trị toạ độ hữu hạn. Ví dụ nếu độ phân giải là 800x600 thì tất cả các điểm ảnh đều có giá trị toạ độ x là số nguyên từ 0 đến 799, toạ độ y từ 0 đến 599. Hệ toạ độ thế giới là hệ toạ độ xác định vị trí các đối tượng đồ hoạ khác nhau trong một thế giới (mặt phẳng, không gian) chung. Hệ toạ độ thế giới sử dụng số thực, các Trang 2
  3. Bài giảng Đồ hoạ máy tính - Nguyễn Văn Đồng - Trường TCNghề số 15 giá trị toạ độ không bị giới hạn và trục y hướng lên trên như hệ toạ độ trong toán học. Hệ toạ độ thế giới có thể có 2 chiều (2D) hoặc 3 chiều (3D). Hệ toạ độ đối tượng là hệ toạ độ dùng mô tả kích thước của đối tượng đồ hoạ và vị trí tương đối của các thành phần tạo nên đối tượng đó. Khi muốn hiển thị đối tượng đồ hoạ lên thiết bị đồ họa ta cần thực hiện ánh xạ giữa toạ độ đối tượng, toạ độ thế giới và toạ độ hiển thị. Quá trình ánh xạ đó gọi là phép chiếu. III. BIỂU DIỄN MÀU 1. Các chế độ màu sắc Đồ hoạ máy tính xử lý 3 chế độ màu sắc khác nhau: Đơn sắc: chỉ có 2 màu là màu nền và màu nổi (có thể là đen và trắng, xanh và trắng ). Được dùng phổ biến để mô tả ảnh nhị phân, ma trận kí tự Đa mức xám (grayscale): dùng các màu xám đậm nhạt khác nhau (trải từ đen đến trắng) để mô tả sắc độ (giống như ảnh chụp đen trắng). Dùng phổ biến cho kết xuất trên máy in Màu (color): dùng các màu sắc tự nhiên (đen, trắng, xanh, đỏ, tím, vàng ). Số lượng màu sử dụng dao động từ 16 màu đến 16 triệu màu hoặc hơn. Trong đồ hoạ máy tính mỗi điểm ảnh sẽ mang một màu duy nhất. 2. Phân tích và tổng hợp màu Màu sắc của ánh sáng phụ thuộc vào bước sóng của ánh sáng. Mỗi màu trong tự nhiên đều có thể phân tích và tổng hợp từ một số màu cơ bản. Thường trong đồ hoạ người ta sử dụng 3 màu cơ bản là đỏ (Red), xanh lá cây (Green) và xanh da trời (Blue). Phân tích một màu là xác định màu đó được tạo thành từ 3 màu cơ bản với các thành phần bao nhiêu. Để xác định thành phần màu đỏ trong một màu nào đó, ta chiếu ánh sáng màu đó qua một kính lọc màu đỏ rồi đo cường độ ánh sáng sau khi đi qua kính lọc. Làm tương tự như thế để xác định thành phần 2 màu còn lại. Ngược lại, ta tổng hợp một màu bằng cách chiếu các nguồn sáng đơn sắc với cường độ thích hợp (tương ứng với thành phần chúng ta phân tích được) để tạo nên màu đó. 3. Số hoá màu Trong máy tính, tất cả các dữ liệu đều phải số hoá để xử lý. Màu sắc trong đồ hoạ máy tính cũng được số hoá thành các con số nhị phân. Độ sâu màu là số bit của số nhị phân biểu diễn màu. Nếu độ sâu màu là d thì số màu khác nhau có thể biểu diễn được là 2d. Ví dụ nếu ta dùng 24 bit để biểu diễn màu cho một điểm ảnh thì ta có 224 (hơn 16 triệu) màu khác nhau. Có hai phương pháp số hoá màu: số hoá trực tiếp và số hoá theo chỉ số. Số hoá màu trực tiếp ta số hoá mỗi màu bằng cách mô tả sắc độ của từng thành phần R,G,B tương ứng với màu đó. Chẳng hạn trong chế độ màu 24 bit, ta dùng 8 bit cho mỗi màu cơ bản, như vậy có 256 mức độ khác nhau mô tả cường độ của từng màu cơ bản đó. Trong trường hợp độ sâu màu không lớn, người ta dùng phương pháp biểu diễn màu theo chỉ số. Chẳng hạn với độ sâu màu 8 bit (tương ứng với 2 8 = 256 màu), người ta sẽ có một bảng màu (palette) gồm 256 mục, mỗi mục mô tả thành phần RGB của một màu và giá trị màu của mỗi điểm ảnh sẽ là chỉ số của mục mô tả màu tương ứng. 4. Các hệ màu Trang 3
  4. Bài giảng Đồ hoạ máy tính - Nguyễn Văn Đồng - Trường TCNghề số 15 Ngoài hệ màu RGB, trong đồ hoạ máy tính còn sử dụng một số hệ màu khác như HSV, CMYK. 5. Vùng đệm ảnh (frame buffer) và bộ nhớ đồ hoạ Bộ nhớ đồ hoạ (Video RAM) là nơi chứa các thông tin mô tả từng pixel của màn hình đồ hoạ, thường là nằm trên card video. Nếu độ phân giải của màn hình là M cột x N dòng và độ sâu màu là d bit thì bộ nhớ đồ hoạ có kích thước ít nhất là M x N x d (bit). Vùng đệm ảnh là vùng nhớ lưu trữ tạm thời dữ liệu đồ hoạ bitmap trong quá trình xử lý. Vùng đệm ảnh thường được chia thành nhiều khung ảnh, mỗi khung mô tả một ảnh bitmap. Đôi khi người ta cũng gọi bộ nhớ đồ hoạ (nơi chứa dữ liệu đồ hoạ bitmap được hiển thị trên màn hình) là vùng đệm ảnh. IV. PHẦN CỨNG ĐỒ HOẠ 1. Thiết bị ra Thiết bị ra thực hiện nhiệm vụ hiển thị hình ảnh hoặc kết xuất đối tượng đồ hoạ. Người ta chia thiết bị ra thành 2 loại là: kết xuất cứng (hard copy) và kết xuất mềm (soft copy). Thiết bị ra kết xuất cứng là các thiết bị ra mà kết quả hiển thị không thể sửa chữa được như máy in (printer), mắy vẽ (plotter), máy cắt Có nhiều công nghệ máy in đang phổ biến như máy in laser, máy in phun, máy in kim. Ngược lại, thiết bị ra kết xuất mềm cho phép cập nhật kết quả hiển thị một cách nhanh chóng và không hạn chế. Thiết bị ra kiểu này phổ biến nhất là màn hình. Hiện tại có 2 công nghệ màn hình đang được sử dụng rộng rãi: Màn hình CRT: thực hiện việc hiển thị hình ảnh bằng cách phóng tia âm cực lên màn hình huỳnh quang, tạo ra các điểm sáng (như nguyên tắc của TV). Để vẽ toàn bộ màn hình, máy sẽ vẽ từng điểm, từng dòng (scan line). Sau khi vẽ xong toàn bộ màn hình, kích thích huỳnh quang ngừng thì điểm sáng tương ứng không còn sáng nữa, máy lại vẽ lại. Số lần máy vẽ lại toàn bộ màn hình trong một giây gọi là tần số làm tươi (refresh rate). Tần số này càng cao thì hình ảnh càng nét và màn hình không có hiện tượng rung. Màn hình LCD: mỗi điểm ảnh là một phần tử hiển thị tinh thể lỏng. Mỗi tinh thể này được một mạch điện riêng điều khiển. Do đó máy có thể trực tiếp bật sáng hay tắt một điểm ảnh bất kì. Ngoài màn hình còn có các thiết bị ra kết xuất mềm khác như máy chiếu (projector) 2. Thiết bị vào Thiết bị vào cung cấp thông tin đồ hoạ từ thế giới bên ngoài vào. Ta có thể chia thiết bị vào thành 2 loại: Thiết bị vào cung cấp thông tin điều khiển: bàn phím, con chuột, bút vẽ, màn hình cảm ứng Thiết bị vào cung cấp thông tin hình ảnh: máy ảnh số, máy quét, webcam, máy quay kĩ thuật số 3. Thiết bị lưu trữ Nhiệm vụ của thiết bị lưu trữ là lưu giữ lâu dài các dữ liệu đồ hoạ (ảnh, phim, hoạt hoạ ). Các công nghệ chế tạo thiết bị lưu trữ rất đa dạng với dung lượng ngày càng tăng. Thiết bị lưu trữ có dung lượng và tốt độ cao nhất là đĩa cứng. Các đĩa cứng hiện tại đã có dung lượng đến 250 – 300 GB. Điểm yếu của đĩa cứng là phải lắp cố định trong máy tính, Trang 4
  5. Bài giảng Đồ hoạ máy tính - Nguyễn Văn Đồng - Trường TCNghề số 15 không tiện cho việc di chuyển dữ liệu. Để giải quyết vấn đề này người ta có thể truyền dữ liệu qua hệ thống mạng hoặc sử dụng các thiết bị lưu trữ cơ động hơn như đĩa quang hay đĩa Flash USB, thẻ nhớ. Các loại đĩa quang phổ biến là CD và DVD. Ưu điểm của đĩa quang là gọn nhẹ, rất cơ động và có các thiết bị đọc rất phổ biến. Dung lượng của các đĩa CD từ 650 MB đến 700 MB, dung lượng của DVD có thể lên đến 4.7 GB. Nhược điểm của đĩa quang là chỉ đọc (không ghi xoá được). Cũng có những loại đĩa quang có thể ghi-xoá được nhưng không phổ biến và cần các thiết bị đọc-ghi đắt tiền. Ngoài ra đĩa quang cũng dễ bị hỏng do va đập, trầy xước Đĩa Flash USB hiện đang được dùng ngày một phổ biến do sự gọn nhẹ, tính cơ động và khả năng ghi xoá tuỳ ý. Dung lượng của đĩa Flash USB ngày một tăng (128MB, 256MB, 512MB ). Thẻ nhớ cũng là một loại thiết bị lưu trữ đang dần phổ biến, chủ yếu sử dụng cho các thiết bị nhỏ gọn như máy ảnh kĩ thuật số, điện thoại di động Với máy tính thì thẻ nhớ ít được sử dụng hơn do đòi hỏi phải có những thiết bị đọc chuyên dụng. 4. Bộ điều khiển đồ hoạ Bộ điều khiển đồ hoạ (video controller) phụ trách việc hiển thị hình ảnh trên màn hình, thực hiện các thao tác đồ hoạ như vẽ hoặc xoá màn hình, thay đổi màu sắc Bộ điều khiển đồ hoạ có thể nằm trên một card video rời hoặc được chế tạo sẵn trên mainboard (thường gọi là onboard). Để lưu trữ thông tin hình ảnh cần hiển thị trên màn hình, bộ điều khiển đồ hoạ làm việc trực tiếp với phần bộ nhớ chuyên biệt là bộ nhớ đồ hoạ (Video RAM). Nếu bộ điều khiển đồ hoạ nằm trên card rời thì trên card cũng lắp sẵn VRAM (và thường có tốc độ nhanh hơn RAM hệ thống rất nhiều). Ngược lại, nếu bộ điều khiển đồ hoạ là onboard thì sẽ sử dụng một phần của RAM hệ thống làm VRAM (do đó khả năng và tốc độ sẽ thấp hơn so với card rời). Bộ điều khiển đồ hoạ thực hiện các thao tác đồ hoạ bằng các thay đổi các thông tin trong VRAM. Nội dung của VRAM sẽ được các bộ chuyển đổi biến thành tín hiệu chuyển tới màn hình để thực hiện việc hiển thị. Các bộ điều khiển đồ hoạ hiện đại còn có thêm các chức năng xử lí 3D như tính toán phép chiếu, tạo bóng, phủ vân bề mặt 5. Các thiết bị xử lí khác Bộ xử lí (CPU) là thiết bị thực hiện tất cả các thao tác xử lí dữ liệu đồ hoạ (video controller cơ bản chỉ thực hiện các thao tác liên quan đến hiển thị). Các CPU hiện đại cũng có những tập lệnh chuyên dành cho xử lí 3D (tập lệnh MMX, tập lệnh 3D Now!). Bộ nhớ chính (RAM) là nơi lưu trữ các dữ liệu đồ hoạ cần thiết trong quá trình xử lí. CPU không đọc dữ liệu đồ hoạ trực tiếp từ thiết bị lưu trữ (đĩa cứng, đĩa CD ) mà chúng được đưa vào RAM trước đó Trang 5
  6. Bài giảng Đồ hoạ máy tính - Nguyễn Văn Đồng - Trường TCNghề số 15 BÀI 2. ĐỒ HOẠ TRONG TURBO PASCAL 7.0 I, GIỚI THIỆU VỀ MÔI TRƯỜNG 1. Các file và thư viện cần thiết để lập trình đồ hoạ trên môi trường Turbo Pascal 7.0 Để lập trình và thực thi các chương trình đồ hoạ trong TP, ta phải có đầy đủ các tập tin sau: . TURBO.EXE và TURBO.TPL: là các file tối thiểu để chạy môi trường lập trình của Turbo Pascal. Nếu file TURBO.TPL chưa được sửa lỗi (gây ra lỗi 200 khi sử dụng unit CRT) ta cần cập nhật file TURBO.TPL đã sửa lỗi để sử dụng được đồ hoạ. . GRAPH.TPU: file chứa unit Graph, là thư viện đồ hoạ, chứa các lệnh, các hàm và các định nghĩa khác cho lập trình đồ hoạ trong TP. Để sử dụng thư viện Graph, ta phải có khai báo uses Graph ở đầu chương trình. . Các tập tin *BGI chứa các trình điều khiển của card màn hình. Thường các card màn hình hiện nay đều hỗ trợ chuẩn VGA, do đó ta chỉ cần file EGAVGA.BGI. Ngoài ra nếu muốn trình bày hình ảnh đồ hoạ đẹp hơn, ta cần thêm các tập tin *.CHR chứa các font chữ vector (GOTH.CHR là font chữ Gothic, LITT.CHR là font chữ Small, SANS.CHR là font chữ Sans-Serif, TRIP.CHR là font chữ Triplex). Nếu TP được cài đặt theo tham số chuẩn thì 2 file TURBO.EXE và TURBO.TPL nằm trong thư mục C:\TP\BIN, file GRAPH.TPU trong thư mục C:\TP\UNITS, các file *.BGI và *.CHR nằm trong thư mục C:\TP\BGI. Do đó trong các chương trình đồ hoạ, người ta thường dùng đường dẫn chuẩn đến trình điều khiển đồ hoạ là C:\TP\BGI. 2. Khởi tạo môi trường đồ hoạ Mặc định môi trường Turbo Pascal hoạt động ở chế độ văn bản, các chương trình được viết trên Turbo Pascal cũng có giao diện mặc định ở chế độ văn bản. Muốn viết chương trình đồ hoạ trên môi trường Pascal thì ta phải khởi tạo chế độ đồ hoạ cho màn hình. Lệnh khởi tạo chế độ đồ hoạ trong Turbo Pascal là: InitGraph(Gd,Gm:Integer;Path:String); Trong đó: Gd: Biến kiểu integer chỉ định card màn hình. Do các card màn hình thông dụng hiện nay đều hỗ trợ chế độ VGA nên ta chỉ cần đặt Gd :=Detect để máy tính tự chọn chế độ thích hợp. Gm: Biến kiểu integer chỉ mode màn hình, thực chất là xác định độ phân giải và độ sâu màu. Tuy nhiên ta đặt Gd là Detect nên không cần thiết phải khai báo Gm, máy tính sẽ tự xác định loại card cho màn hình và thiết lập mode màn hình có độ phân giải và độ sâu màu lớn nhất tương ứng với loại card màn hình đó. Path: Biến kiểu string chỉ định đường dẫn vào thư mục chứa các tập tin *.BGI. Nếu tập tin nằm trong thư mục hiện hành thì có thể khai báo Path là ' '. Ta cũng thường dùng đường dẫn mặc định là C:\TP\BGI. Trong một số trường hợp việc khởi tạo đồ họa có thể không thành công (không tìm thấy driver, driver không tương thích card màn hình, không đủ bộ nhớ ) Để kiểm tra việc khởi tạo đồ hoạ có thành công không, ta có thể dùng hàm GraphResult. Nếu GraphResult = GrOK thì quá trình khởi tạo đồ hoạ là thành công. Muốn ngắt chế độ đồ hoạ để trở lại chế độ văn bản, ta dùng lệnh CloseGraph. Tuy nhiên nếu ta không dùng lệnh đó thì khi kết thúc chương trình, Turbo Pascal cũng tự động chuyển về chế độ văn bản. Trang 6
  7. Bài giảng Đồ hoạ máy tính - Nguyễn Văn Đồng - Trường TCNghề số 15 Chương trình ví dụ sau khởi tạo chế độ đồ hoạ, nếu khởi tạo thành công thì sẽ vẽ một đoạn thẳng chéo màn hình, ngược lại sẽ có một thông báo lỗi. uses crt,graph; var gd, gm, i : integer; BEGIN gd := detect; initgraph(gd,gm,'C:\TP\BGI'); if GraphResult <> GrOk then begin writeln('Loi do hoa, khong khoi tao duoc!!'); halt; end; Line(0,0,GetMaxX,GetMaxY); readkey; CloseGraph; END. II. CÁC THÀNH PHẦN CỦA HỆ ĐỒ HOẠ TP 7.0 1. Hệ toạ độ Turbo Pascal hỗ trợ nhiều chế độ đồ hoạ khác nhau nhưng chế độ thông dụng nhất hiện nay là VGA 640x480x16 màu (nếu ta khởi tạo đồ hoạ bằng tham số Detect thì hầu như luôn khởi tạo được chế độ VGA). Hệ toạ độ của Turbo Pascal là hệ toạ độ màn hình dùng mô tả vị trí các điểm ảnh (toạ độ nguyên, hữu hạn). Sau khi khởi tạo, gốc toạ độ có toạ độ (0,0) là điểm trái trên của màn hình. Khung nhìn Để thay đổi gốc toạ độ ta có thể sử dụng lệnh thiết lập khung nhìn. Khung nhìn là một hình chữ nhật có các cạnh song song với các trục toạ độ nơi ta giới hạn vị trí kết xuất. Khung nhìn được dùng vào 2 mục đích: Giới hạn các thao tác đồ hoạ trong một khu vực xác định của màn hình đồ hoạ chứ không phải trên toàn bộ màn hình. Việc này nhằm mục đích bảo vệ hình ảnh của những vùng khác hoặc tăng tốc độ các lệnh tô màu hoặc xoá màu. Trang 7
  8. Bài giảng Đồ hoạ máy tính - Nguyễn Văn Đồng - Trường TCNghề số 15 Tạo một hệ toạ độ tạm thời giúp cho việc xử lí các tham số toạ độ đơn giản hơn (chẳng hạn xác định gốc mới cho phép ta vẽ các đối tượng theo toạ độ tương đối với 1 điểm nào đó chứ không cần xác định toạ độ tuyệt đối trên màn hình). Lệnh thiết lập khung nhìn: SetViewPort(x1,y1,x2,y2: integer; clip: boolean) Trong đó (x1,y1), (x2,y2) lần lượt là toạ độ của đỉnh trên trái và dưới phải của hình chữ nhật ta muốn thiết lập làm khung nhìn. Các giá trị của x1,y1,x2,y2 phải là số nguyên nằm trong độ phân giải màn hình (ví dụ, nếu độ phân giải là 640x480 thì ta phải chọn 0 x1 x2 639, 0 y1 y2 479). Tham số clip mô tả thao tác cắt xén với khung nhìn: nếu clip là true thì ta chỉ được vẽ trong hình chữ nhật được thiết lập làm khung nhìn, các đối tượng vẽ đều bị cắt xén bởi các cạnh hình chữ nhật. Nếu clip là false thì ta có thể vẽ trên toàn bộ màn hình và các đối tượng không bị cắt xén. Như vậy, nếu ta dùng khung nhìn với mục đích tạo hệ toạ độ tạm thời cho dễ thao tác vẽ thì nên đặt tham số clip là false, ngược lại nếu muốn giới hạn vùng màn hình cần vẽ thì nên đặt clip là true. Ví dụ, để chuyển gốc toạ độ ra giữa màn hình, ta có thể dùng lệnh: SetViewPort(320, 240, 600, 400, false); Chú ý là sau khi thiết lập khung nhìn, gốc toạ độ sẽ là điểm (x1,y1) và các thao tác vẽ tiếp theo đều sử dụng toạ độ theo gốc mới đó (ngoại trừ lệnh SetViewPort luôn sử dụng toạ độ tuyệt đối). Ví dụ, sau khi thiết lập khung nhìn bằng lệnh SetViewPort trên, lệnh vẽ tại điểm (0,0) sẽ là thực hiện tại điểm (320,240) theo toạ độ màn hình. Con trỏ đồ hoạ Trong chế độ văn bản có một vị trí gọi là con trỏ (cursor) hay điểm nhắc được biểu thị bằng một điểm sáng nhấp nháy, là vị trí là nơi thực hiện các thao tác xử lí, chẳng hạn các kí tự được nhập từ bàn phím sẽ được hiện ra ở vị trí điểm nhắc. Tương tự như vậy, trong chế độ đồ hoạ cũng có một vị trí gọi là con trỏ đồ hoạ, là vị trí sẽ diễn ra các thao tác đồ hoạ nếu không mô tả rõ toạ độ. Chẳng hạn nếu ta dùng lệnh OutText để viết ra một chuỗi kí tự mà không mô tả toạ độ thì xâu kí tự đó sẽ hiện ra ở con trỏ đồ hoạ. Chỉ khác là con trỏ đồ hoạ không nhấp nháy cũng không hiển thị bằng một điểm sáng nhấp nháy như con trỏ trong chế độ văn bản. * Các thao tác với con trỏ đồ hoạ: Để di chuyển con trỏ đồ hoạ đến một vị trí trên màn hình đồ hoạ, ta dùng lệnh MoveTo. Toạ độ của vị trí đó phụ thuộc vào khung nhìn (là toạ độ tính tương đối theo khung nhìn). Trang 8
  9. Bài giảng Đồ hoạ máy tính - Nguyễn Văn Đồng - Trường TCNghề số 15 MoveTo(x,y: integer) Để xác định vị trí hiện tại của con trỏ đồ hoạ, ta có 2 hàm GetX và GetY, mỗi hàm trả lại giá trị hoành độ và tung độ tương ứng của con trỏ đồ hoạ. 2. Màu sắc Màu sắc trong hệ đồ hoạ của TP phụ thuộc vào card màn hình và trình điều khiển. Vào thời gian TP 7.0 được xây dựng (1990-1992) thì công nghệ phần cứng còn chưa phát triển. Do đó chế độ đồ hoạ cao nhất mà TP7.0 có trình điều khiển làm việc được là chế độ VGA chuẩn 640x480x16 màu. Chế độ này có độ sâu màu là 4 bit nên cần bộ nhớ đồ hoạ tối thiểu là 640x480x4bit = 156300B = 156 KB. Màu sắc trong TP là màu được mô tả bằng chỉ số, tức là mỗi màu trong 16 màu là một số nguyên nằm trong miền từ 0 đến 15. Bảng sau mô tả chỉ số và tên màu trong TP: Tên hằng Mã Mầu Black 0 Màu đen Blue 1 Màu xanh lơ Green 2 Màu xanh lá cây Cyan 3 Màu thiên thanh Red 4 Màu đỏ Magenta 5 Màu đỏ tươi Brown 6 Màu nâu LightGray 7 Màu xám sáng DarkGray 8 Màu xám tối LightBlue 9 Màu xanh sáng LightGreen 10 Màu xanh lá cây sáng LightCyan 11 Màu thiên thanh sáng LightRed 12 Màu đỏ sáng LightMagenta 13 Màu đỏ tươi sáng Yellow 14 Màu vàng White 15 Màu trắng Các thao tác để xử lý màu sắc trong TP: * Thiết lập màu vẽ: SetColor(c : word) Tham số c là tham số mô tả màu cần thiết lập, có thể nhận giá trị từ 0 đến 15 hoặc các tên hằng số màu mô tả trong bảng trên. Lệnh SetColor thiết lập màu để vẽ các đối tượng là đường nét (đoạn thẳng, đường tròn, cung ) hoặc chữ. Sau khi dùng lệnh SetColor với màu c, tất cả các lệnh vẽ đường hoặc vẽ chữ sau đó đều dùng màu c cho các đối tượng được vẽ cho đến khi có một lệnh SetColor tiếp theo thiết lập một màu vẽ khác. Sau khi khởi tạo đồ hoạ màu vẽ mặc định là màu trắng (white 15). * Thiết lập màu nền: Trang 9
  10. Bài giảng Đồ hoạ máy tính - Nguyễn Văn Đồng - Trường TCNghề số 15 SetBkColor(c : word) Màu nền trong TP tương ứng với màu 0 (mặc định là màu đen – black). Khi thực hiện các thao tác xoá màn hình (ClearDevice) hoặc xoá khung nhìn (ClearViewPort) thì toàn bộ vùng bị xoá sẽ được tô màu là màu nền. * Thiết lập màu tô: Lệnh SetColor chỉ thiết lập màu cho các đối tượng là đường nét hoặc chữ. Với các đối tượng đặc như hình chữ nhật, một vùng kín, để tô màu ta cần dùng lệnh sau để thiết lập: SetFillStyle(t: word;c : word) Trong đó tham số c là màu cần thiết lập để tô, t là tham số mô tả mẫu tô (pattern). Có thêm tham số mẫu tô là vì không phải lúc nào cũng tô đối tượng theo kiểu màu đặc mà có thể muốn tô đối tượng theo các mẫu khác như: gạch ngang, gạch chéo, chấm chấm Các mẫu khác nhau mà TP hỗ trợ khi tô màu như sau: 3. Các lệnh vẽ điểm Điểm ảnh (pixel) là đối tượng nhỏ nhất được hiển thị trên màn hình đồ hoạ. Từ các điểm ảnh ta có thể xây dựng các hình đồ hoạ phức tạp hơn. Mô tả một điểm ảnh ta cần thông tin về vị trí (toạ độ) và màu sắc. * Vẽ điểm ảnh Lệnh PutPixel dùng để vẽ một điểm ảnh lên màn hình đồ hoạ. PutPixel(x,y: integer; color: word) Tham số x,y mô tả toạ độ của điểm ảnh, tham số color mô tả màu sắc của điểm ảnh. * Đọc màu một điểm ảnh Hàm GetPixel dùng xác định màu của một điểm ảnh. GetPixel(x,y:integer): word Hàm này cho ta kết quả là màu của điểm ảnh tại toạ độ x,y. 4. Các lệnh vẽ đường thẳng Có hai cách vẽ đường thẳng trong hệ đồ hoạ của TP: vẽ theo toạ độ tuyệt đối và toạ độ tương đối. Để vẽ đoạn thẳng theo toạ độ tuyệt đối, ta cần mô tả toạ độ 2 điểm đầu và cuối của đoạn thẳng. Lệnh vẽ đoạn thẳng theo toạ độ tuyệt đối là lệnh Line: Line(x1,y1,x2,y2:integer) Trong đó (x1,y1) là toạ độ một điểm, (x2,y2) là toạ độ điểm còn lại. Khi vẽ theo toạ độ tương đối, ta chỉ cần mô tả toạ độ một điểm, điểm còn lại chính là vị trí của con trỏ đồ hoạ. Sau khi thực hiện thao tác xong, TP sẽ chuyển con trỏ đồ hoạ đến điểm còn lại. Lệnh LineTo(x,y) dùng để vẽ một đoạn thẳng từ vị trí con trỏ đồ hoạ hiện tại đến điểm (x,y), sau khi vẽ xong thì chuyển con trỏ đồ hoạ đến điểm (x,y). LineTo(x,y:integer); Lệnh LineRel(dx,dy) dùng để vẽ một đoạn thẳng từ vị trí con trỏ đồ hoạ hiện tại đến có toạ độ tương đối với con trỏ đồ hoạ theo vector (dx,dy), tức là đến điểm có toạ độ tuyệt đối (getx + dx, gety + dy). Sau khi vẽ xong, con trỏ đồ hoạ cũng được chuyển đến vị trí của điểm mới. LineRel(dx,dy:integer); Trang 10
  11. Bài giảng Đồ hoạ máy tính - Nguyễn Văn Đồng - Trường TCNghề số 15 Chọn kiểu nét vẽ Màu sắc của lệnh vẽ đoạn thẳng được chọn bằng lệnh SetColor. Ta cũng có thể chọn các tham số khác để vẽ đoạn thẳng: kiểu nét vẽ (liên tục, chấm, gạch ), độ dày nét vẽ bằng lệnh SetLineStyle. SetLineStyle(Ls,Pt,Tk: Word); Trong đó ý nghĩa của các tham số như sau: Ls xác định kiểu đường bằng các hằng đã định nghĩa trong thư viện UnitGraph như sau: SolidLn=0: Đường nét liền DottedLn=1: Đường nét đứt quãng CenterLn=2: Đường nét chỉ vẽ ở tâm DashedLn=3: Đường nét sọc UserBitLn=4: Đường nét do người dùng định nghĩa Pt xác định mẫu vẽ. Nếu ta chọn Ls=4 thì Pt là một số nguyên kiểu word chỉ mẫu nét vẽ do chúng ta định nghĩa. Trong đó bit 1 của Pt tương ứng với pixel sẽ được vẽ, bit 0 tương ứng với pixel không được vẽ. Tk: Xác định độ dày của đường nét, có thể chọn Tk bằng các hằng đã định nghĩa trong thư viện đồ hoạ: NormWidth=1 ThickWidth=3 5. Các lệnh vẽ hình chữ nhật Có 2 kiểu vẽ hình chữ nhật trong TP: vẽ hình chữ nhật chỉ có đường viền và vẽ hình chữ nhật có tô màu bên trong. Để vẽ hình chữ nhật chỉ có khung, ta dùng lệnh Rectangle. Màu sắc của đường viền do lệnh SetColor đặt. Các tham số của lệnh Rectangle mô tả toạ độ của 2 đỉnh chéo nhau của hình chữ nhật. Rectangle(x1,y1,x2,y2:Integer); Để vẽ hình chữ nhật có tô màu ta dùng lệnh Bar. Màu sắc của đường viền do lệnh SetColor thiết lập, kiểu tô và màu tô của hình chữ nhật do lệnh SetFillStyle thiết lập. Các tham số cũng xác định 2 đỉnh chéo nhau của hình chữ nhật. Bar(x1,y1,x2,y2:Integer); Ngoài ra ta có thể dùng lệnh Bar3D vẽ khối hình hộp chữ nhật. Bar3D(x1,y1,x2,y2, dep:Integer; nap : boolean); Trong đó tham số depth mô tả bề dày của hình hộp và tham số nap là true thì sẽ vẽ hình hộp có nắp, là false thì là hình hộp hở. 6. Vẽ đa giác Tương tự như vẽ hình chữ nhật: có 2 lệnh vẽ đa giác trong TP, một lệnh là DrawPoly để vẽ đa giác không tô màu và lệnh FillPoply để vẽ đa giác có tô màu. DrawPoly(Np: Word; Var P); FillPoly(Np: Word; Var P); Trong đó: Trang 11
  12. Bài giảng Đồ hoạ máy tính - Nguyễn Văn Đồng - Trường TCNghề số 15 Np là số nguyên kiểu Word chỉ số đỉnh của đa giác. Với lệnh DrawPoly để vẽ được đa giác khép kín ta phải thêm đỉnh cuối là đỉnh giả có toạ độ trùng với đỉnh đầu tiên nên Np phải là số đỉnh đa giác + 1. Ví dụ như muốn vẽ tam giác thì Np phải bằng 4. Lệnh FillPoly thì không cần. P là một mảng có Np phần tử kiểu PointType (đã được định nghĩa trong UnitGraph) mô tả toạ độ các đỉnh của đa giác. 7. Vẽ cung tròn và đường tròn, cung ellipse Lệnh vẽ cung tròn: Arc(x,y:Integer; g1,g2,R: Word); Lệnh này dùng để vẽ một cung tròn có toạ độ tâm là (x,y), bán kính R, góc bắt đầu là g1, góc kết thúc là g2. Góc tính theo chiều lượng giác (ngược chiều kim đồng hồ) dùng đơn vị là độ. Lệnh vẽ cung tròn có tô màu: PieSlice(x,y:Integer; g1,g2,R: Word); Tương tự lệnh Arc, lệnh này dùng để vẽ một cung tròn có tô màu (theo thiết lập màu vẽ và màu tô hiện tại) có toạ độ tâm là (x,y), bán kính R, góc bắt đầu là g1, góc kết thúc là g2. Lệnh vẽ đường tròn tâm (x,y) và bán kính là R. Circle(x,y:Integer; R: Word); Lệnh vẽ cung ellipse: Ellipse(x,y:Integer;g1,g2,Rx,Ry: Word); Lệnh này vẽ một cung ellipse có tâm (x,y), bán kính Rx theo chiều ngang, bán kính Ry theo chiều dọc, góc bắt đầu là g1, góc kết thúc là g2. Góc được tính theo chiều lượng giác có đơn vị là độ. Nếu g2 = g1 + 360 thì ta được một đường ellipse khép kín. Lệnh vẽ hình ellipse có tô màu: FillEllipse(x,y:Integer;Rx,Ry: Word); Lệnh này vẽ một hình ellipse có tô màu theo thiết lập màu tô hiện hành, tâm ellipse ở điểm (x,y), và Rx là bán kính theo chiều ngang, Ry là bán kính theo chiều dọc. 8. Hiển thị chữ Để hiển thị một xâu chữ ra màn hình tại vị trí hiện tại của con trỏ đồ hoạ ta dùng lệnh OutText: OutText(St:String); Trong đó st là xâu chữ cần hiển thị. Nếu muốn hiển thị chữ ở vị trí bất kì ta có thể dùng lệnh OutTextXY: OutTextXY(x,y: integer; St:String); Trong đó x,y là điểm sẽ hiển thị xâu chữ st. Muốn có các kiểu chữ khác nhau (font chữ, hướng, kích cỡ), ta có thể dùng lệnh sau để thiết lập (phải thiết lập trước khi gọi các lệnh OutText, OutTextXY): SetTextStyle(Ft,Dr,Sz: Word); Thủ tục này dùng để chọn kiểu chữ, trong đó: Ft là kiểu chữ, Ft có các giá trị từ 0 đến 9. Trong đó 0 là font bitmap 8x8 mặc định. Trang 12
  13. Bài giảng Đồ hoạ máy tính - Nguyễn Văn Đồng - Trường TCNghề số 15 Dr là hướng chữ, Dr=0 thì chữ được hiển thị theo chiều ngang từ trái sang phải, Dr=1 chữ sẽ được hiển thị theo chiều dọc từ trên xuống dưới. Sz là kích thước của chữ, có giá trị từ 1 đến 10. Ta cũng có thể thiết lập vị trí căn chữ, tức là căn chỉnh vùng sẽ hiển thị chữ so với điểm mô tả vị trí hiển thị (điểm (x,y) trong lệnh OutTextXY, vị trí con trỏ đồ hoạ trong lệnh OutText). SetTextJustify(ngang, doc: word) Trong đó các giá trị hợp lệ cho các tham số ngang và doc như sau: Hằng số (cho hướng ngang) Giá trị Ý nghĩa LeftText 0 Chữ sẽ hiển thị từ trái sang phải, bắt đầu từ điểm mô tả hiển thị (căn trái). CenterText 1 Chữ được hiển thị sao cho điểm mô tả hiển thị nằm ở giữa vùng chữ (căn giữa). RightText 2 Chữ sẽ hiển thị từ trái sang phải, kết thúc ở điểm mô tả hiển thị (căn phải). Hằng số (cho hướng dọc) Giá trị Ý nghĩa TopText 0 Chữ sẽ hiển thị từ trên xuống dưới, ở phía dưới điểm mô tả hiển thị. CenterText 1 Chữ được hiển thị sao cho điểm mô tả hiển thị nằm ở giữa vùng chữ (căn giữa). BottomText 2 Chữ sẽ hiển thị từ trên xuống dưới, ở phía trên điểm mô tả hiển thị. Mặc định căn chữ được thiết lập là LeftText, TopText, tức là chữ được hiển thị từ điểm mô tả sang phải và xuống dưới. Đôi khi ta có thể thiết lập căn chữ là CenterText, CenterText để hiển thị chữ sao cho điểm mô tả hiển thị là tâm của vùng hiển thị chữ. 9. Tô loang màu Ta đã có những lệnh tô màu cho các hình hình học đơn giản (hình chữ nhật, hình tròn ). Có những lúc ta cần tô màu 1 vùng bất kì (ví dụ tam giác, hình trăng khuyết ). Một vùng như thế có thể xác định bằng một đường biên khép kín. TP có lệnh FloodFill để tô màu một vùng như thế. Chỉ cần xác định được màu của đường biên và một điểm nằm trong vùng cần tô. FloodFill(x,y:Integer,Color: Word); Tham số (x,y) mô tả một điểm nằm trong vùng cần tô, tham số color mô tả màu của đường biên. Nếu đường biên không khép kín thì quá trình tô sẽ loang màu ra toàn màn hình. Chú ý lệnh FloodFill tiện dùng nhưng tốc độ không cao. 10. Lưu trữ ảnh Đôi khi ta có nhu cầu phải lưu một vùng màn hình vào bộ nhớ bên ngoài và đưa vùng đã lưu trở lại màn hình, chẳng hạn khi vẽ mô phỏng chuyển động, khi lát nền màn hình TP cung cấp cho chúng ta một số công cụ để thực hiện các công việc đó. Để xác định dung lượng bộ nhớ cần thiết để lưu trữ một vùng nào đó của màn hình (bắt buộc phải là hình chữ nhật), ta dùng hàm ImageSize. ImageSize(x1,y1,x2,y2:integer): word; Trang 13
  14. Bài giảng Đồ hoạ máy tính - Nguyễn Văn Đồng - Trường TCNghề số 15 Hàm ImageSize cho kết quả là số byte cần thiết để lưu trữ vùng hình chữ nhật có toạ độ cho bởi 2 điểm (x1,y1) và (x2,y2). Giá trị của hàm này được dùng để cấp phát bộ nhớ động dùng cho việc sao chép vùng màn hình tương ứng bằng lệnh GetMem: GetMem(var P:Pointer; sz: word); Lệnh trên thực hiện việc cấp phát một vùng nhớ động có kích thước sz byte, do biến P trỏ đến. Vùng nhớ đó sẽ được truy cập bằng kí hiệu p^ và được dùng lưu trữ vùng màn hình tương ứng bằng lệnh GetImage GetImage(x1,y1,x2,y2: Integer; var buf); Lệnh thực hiên lưu vùng màn hình trong hình chữ nhật (x1,y1), (x2,y2) vào vùng nhớ buf. Thường thì vùng nhớ đó là vùng nhớ động do biến con trỏ p trỏ đến nên ta sẽ viết lệnh là GetImage(x1,y1,x2,y2,p^). Sau khi đã lưu trữ vùng màn hình tương ứng, ta có thể sao chép dữ liệu đồ hoạ đã lưu trữ lên màn hình ở một vị trí bất kì bằng lệnh PutImage PutImage(x,y: integer;var buf; BitBlt: word); Lệnh thực hiện sao chép ảnh đã lưu trong vùng nhớ buf ra màn hình tại điểm (x,y) với phép toán bit BitBlt. Điểm (x,y) là điểm trái trên của hình chữ nhật lưu ảnh. Buf là vùng nhớ chứa ảnh, thường thì đó là vùng nhớ động trỏ bởi con trỏ p nên ta viết là p^. Tham số phép toán BitBlt có ý nghĩa như sau: khi tiến hành sao chép ảnh, máy không chỉ thực hiện việc ghi đè các pixel của ảnh lên điểm ảnh tương ứng trên màn hình và còn cho phép thực hiện một phép toán nào đó giữa pixel của ảnh và pixel tương ứng trên màn hình. Vì các giá trị màu là các con số nên phép toán đó là một phép toán nhị phân. Chẳng hạn nếu ta chọn phép toán BitBlt là XorPut thì máy sẽ tiến hành phép toán xor giữ pixel ảnh và pixel tương ứng trên màn hình, được kết quả là bao nhiêu thì vẽ điểm ảnh có màu tương ứng với kết quả đó. Các phép toán BitBlt được TP cung cấp: Tên phép toán Giá trị Ý nghĩa NormalPut (CopyPut) 0 Sao chép pixel ảnh đè lên pixel tương ứng, không thực hiện phép toán nhị phân nào cả. XorPut 1 Thực hiện phép toán xor giữa pixel nguồn và pixel đích. Đặc điểm của phép toán xor là pixel kết quả có màu không giống cả pixel nguồn và pixel đích, đồng thời nếu copy ảnh 2 lần bằng phép toán XorPut thì sẽ trở lại màn hình ban đầu. Phép toán XorPut do đó được sử dụng trong vẽ mô phỏng chuyển động để bảo vệ nền. OrPut 2 Thực hiện phép toán or giữa pixel nguồn và pixel đích. AndPut 3 Thực hiện phép toán or giữa pixel nguồn và pixel đích. NotPut 4 Đảo màu (thực hiện phép toán not) pixel của ảnh trước khi ghi lên màn hình. Dùng phép toán này ta được ảnh âm bản. Sau khi sử dụng sau vùng nhớ động, ta có thể giải phóng vùng nhớ đã cấp phát bằng lệnh FreeMem: Trang 14
  15. Bài giảng Đồ hoạ máy tính - Nguyễn Văn Đồng - Trường TCNghề số 15 FreeMem(Var P: Pointer; Size: Integer); 11. Sử dụng nhiều trang màn hình Bộ nhớ trong các loại card màn hình EGA, VGA có kích thước rất lớn cỡ khoảng từ 512Kb đến 2Mb nên có đủ bộ nhớ để chứa nhiều hơn một trang màn hình. Một trang màn hình là một vùng nhớ trên card màn hình đủ để lưu trữ tất cả các điểm ảnh trên màn hình. Đối với loại card màn hình có kích thước bộ nhớ lớn chúng ta có thể cho hiện nhiều trang ra màn hình. Nếu các trang có hình ảnh gần giống nhau, việc hiển thị lần lượt các trang làm cho ta có cảm tưởng như hình ảnh đang chuyển động. Trong chế độ đồ hoạ thì màn hình có thể được quản lí theo các trang khác nhau tuỳ theo Mode. Trên màn hình chỉ hiện lên một trong các trang của nó,mặc định là trang 0. Để tạo ra hình chuyển động ta có thể đặt chế độ màn hình đồ hoạ nhiều trang, sau đó trên mỗi trang màn hình vẽ một hình rồi cho lần lượt từng trang màn hình hiện lên theo một thứ tự nào đó. Nếu sử dụng phương pháp này để tạo cho hình chuyển động thì ta không nên để Mode ở Detect, khi đó máy tính sẽ tự động chọn chế độ Mode có độ phân giải cao nhất thường thì chỉ có một trang màn hình nên không dùng được cho phương pháp này. Ta sử dụng các thủ tục sau đây: SetActivePage(Page:Integer) Đặt trang Page để vẽ lên trang này. Thứ tự các trang được đánh số từ 0, sau thủ tục này thì tất cả đều vẽ lên một trang cho đến khi đặt lại trang màn hình khác. Muốn cho một trang màn hình nào đó hiện lên màn hình thì ta sử dụng thủ tục sau: SetVisualPage(Page: Integer); Trang 15
  16. Bài giảng Đồ hoạ máy tính - Nguyễn Văn Đồng - Trường TCNghề số 15 BÀI 3. MÔ PHỎNG CHUYỂN ĐỘNG Mô phỏng chuyển động là một ứng dụng rất hữu ích của đồ hoạ máy tính. Mô phỏng chuyển động là phần thiết yếu của computer games, hoạt hoạ flash, mô phỏng 3D I. NGUYÊN TẮC 1. Ảo giác về sự chuyển động Sự chuyển động ta quan sát được trên thiết bị hiển thị đồ hoạ thực chất là một ảo giác do hiện tượng lưu ảnh của mắt. Khi mắt quan sát một nguồn sáng, các tế bào thị giác sẽ bị kích thích. Sau khi nguồn sáng kích thích tắt đi, sự kích thích đó vẫn kéo dài một thời gian ngắn (khoảng 40ms). Nếu trong khoảng thời gian đó ta phát lại nguồn sáng ở vị trí mới thì mắt sẽ không phát hiện được thực tế nguồn sáng đã bị tắt đi rồi bật lại, mắt chỉ cảm nhận được là nguồn sáng phát sáng liên tục và đã chuyển sang vị trí mới. Từ đó tạo ra ảo giác về sự chuyển động. 2. Nguyên tắc vẽ mô phỏng chuyển động Có hai phương pháp khác nhau để mô phỏng chuyển động bằng đồ hoạ máy tính. Phương pháp thứ nhất giống như trong điện ảnh: xây dựng một dãy hình ảnh mô tả các trạng thái chuyển động khác nhau của đối tượng và chiếu liên tục các hình ảnh đó trong khoảng thời gian thích hợp. Phương pháp thứ hai là vẽ rồi xoá đối tượng ở những vị trí khác nhau một cách liên tục. Do Turbo Pascal không mạnh về mặt xử lý ảnh nên chúng ta chủ yếu dùng phương pháp thứ hai để vẽ mô phỏng chuyển động. Vòng lặp vẽ mô phỏng chuyển động sẽ có dạng như sau: Repeat Draw; // vẽ đối tượng Delay; // ngưng màn hình một khoảng thời gian ngắn để quan sát Clear; // xoá đối tượng, phục hồi màn hình nền cũ Update; // cập nhật toạ độ đối tượng. Until finish; II. MỘT SỐ KỸ THUẬT VẼ MÔ PHỎNG CHUYỂN ĐỘNG Để vẽ, xoá và cập nhật đối tượng trong quá trình mô phỏng chuyển động, chúng ta cần mô tả các thông tin toạ độ và vận tốc của chúng. Tuỳ thuộc vào dạng của chuyển động và đối tượng mà ta mô tả các thông tin đó theo các cách khác nhau. 1. Chuyển động thẳng, chuyển động tịnh tiến và chuyển động kiểu phản xạ Với các chuyển động dạng này, chúng ta mô tả toạ độ của đối tượng theo tọa độ vuông góc (x,y) và vận tốc dưới dạng một vector (dx,dy), mô tả sự thay đổi về toạ độ của đối tượng theo thời gian. Ví dụ: mô phỏng chuyển động của một quả bóng. 2. Chuyển động quay Với chuyển động quay, ta mô tả toạ độ của đối tượng dạng toạ độ cực, gồm bán kính quay và góc quay. Vận tốc của chuyển động cũng mô tả dạng một gia số góc. Ví dụ: mô phỏng chuyển động của kim giây đồng hồ. 3. Chuyển động tịnh tiến đồng thời với chuyển động quay Trang 16
  17. Bài giảng Đồ hoạ máy tính - Nguyễn Văn Đồng - Trường TCNghề số 15 Ta mô tả đồng thời hai dạng toạ độ là vị trí và góc và cả hai dạng vận tốc. Ví dụ: mô phỏng bánh xe đạp chuyển động tịnh tiến và quay. 4. Nhiều đối tượng cùng chuyển động Khi mô phỏng nhiều đối tượng cùng chuyển động, ta lưu trữ thông tin toạ độ, vận tốc và hình ảnh của các đối tượng đó độc lập với nhau. Nhưng khi vẽ, xoá và cập nhật thông tin thì chúng ta lại thực hiện đồng thời với tất cả các đối tượng đó. 5. Xử lý va chạm Khi mô phỏng nhiều đối tượng cùng chuyển động, chúng ta cần xem xét trường hợp chúng va chạm với nhau để điều chỉnh toạ độ và vận tốc thích hợp. III. HOẠT HOẠ 1. Kỹ thuật hoạt hoạ dạng sprite 2. Kỹ thuật hoạt hoạ trên vùng đệm ảnh và vùng đệm đôi 3. Kỹ thuật hoạt hoạ dựa trên biến đổi nội suy Trang 17
  18. Bài giảng Đồ hoạ máy tính - Nguyễn Văn Đồng - Trường TCNghề số 15 BÀI 4. ĐỒ HOẠ RÙA Với hệ đồ họa sẵn có của Turbo Pascal để vẽ một số dạng hình như đa giác đều, ngôi sao ta phải sử dụng những công thức lượng giác khá phức tạp. Nguyên nhân là vì hệ đồ hoạ đó thiếu những thao tác liên quan đến khoảng cách và góc (chỉ chủ yêu tập trung đến toạ độ). Hệ đồ hoạ rùa cung cấp cho chúng ta những công cụ đơn giản hơn để vẽ trong các trường hợp này. I. CÁC CÔNG CỤ CỦA HỆ ĐỒ HOẠ RÙA 1. Tham số của hệ đồ hoạ Hệ đồ hoạ rùa có hai tham số: Vị trí hiện tại của bút vẽ. Tham số này có thể mô tả bằng cặp biến (rx,ry) Hướng hiện tại của bút (góc nghiêng so với phương ngang của trục Ox). Mô tả bằng biến ra. 2. Các thao tác của hệ đồ hoạ Hệ đồ họa rùa có tối thiểu các thao tác sau: RMoveTo(x,y): di chuyển bút vẽ đến điểm (x,y). RLineTo(x,y): vẽ đoạn thẳng từ vị trí hiện tại đến điểm (x,y), sau đó di chuyển vị trí bút đến điểm (x,y). RMove(d): di chuyển đến điểm cách vị trí hiện tại một khoảng d theo hướng hiện tại của bút. RLine(d): vẽ đoạn thẳng từ điểm hiện tại (CP) theo hướng của bút vẽ đến điểm cách CP một đoạn d, sau đó di chuyển bút vẽ đến điểm đó. Right(a): quay hướng hiện tại sang phải góc a. Nếu muốn quay sang trái thì chỉ lấy góc đối của góc a. RAngle(a): đặt hướng của bút vẽ tạo với phương ngang (tia Ox) góc a. II. MỘT SỐ ỨNG DỤNG 1. Vẽ các hình hình học đơn giản a. Vẽ hình chữ nhật Vẽ hình chữ nhật có 1 đỉnh là (x,y), chiều dài là d, chiều rộng là r bằng các thao tác: - Di chuyển đến điểm (x,y). - Vẽ một đoạn dài d. Quay 90 độ. - Vẽ một đoạn dài r. Quay 90 độ. - Vẽ một đoạn dài d. Quay 90 độ. - Vẽ về điểm (x,y). b. Vẽ tam giác c. Vẽ đa giác đều d. Vẽ hình ngôi sao Vẽ ngôi sao 5 cánh có 1 đỉnh là (x,y), chiều dài cánh là d. - Di chuyển đến điểm (x,y). - Thực hiện 5 lần vẽ một đoạn dài d và quay 144 độ. 2. Đường xoắn ốc (polysprial) Trang 18
  19. Bài giảng Đồ hoạ máy tính - Nguyễn Văn Đồng - Trường TCNghề số 15 Polysprial (đường xoắn ốc) được xây dựng theo quy tắc sau: xuất phát từ một điểm, vẽ đến một điểm cách đó một khoảng d, sau đó quay phải một góc a và tăng d một khoảng dd. Quá trình này thực hiện n lần để vẽ xoắn ốc có n đoạn thẳng. Procedure Polyspiral(d, a, dd, n); begin for i := 1 to n do begin RLineto(d); Right(a); d := d + dd; end; end; Trang 19
  20. Bài giảng Đồ hoạ máy tính - Nguyễn Văn Đồng - Trường TCNghề số 15 BÀI 5. ĐỒ HOẠ VECTOR 2D Hệ đồ hoạ sẵn có sử dụng toạ độ nguyên, bị giới hạn bởi độ phân giải nên không tiện để mô tả và hiển thị trực tiếp những đối tượng có vị trí, kích thước là số thực (chẳng hạn: đồ thị hàm số, các đường cong, các hình hình học, bản thiết kế ). Hệ đồ hoạ vector 2D được xây dựng để giải quyết vấn đề này. I. CÁC CÔNG CỤ CỦA HỆ ĐỒ HOẠ VECTOR 2D 1. Đặc điểm Hệ đồ hoạ vector 2D có hệ toạ độ vuông góc 2 chiều, sử dụng các giá trị toạ độ là số thực và không giới hạn độ lớn. Trục Oy của hệ toạ độ hướng lên, giống như hệ toạ độ Đê-các trong toán học. Do đồ hoạ 2D sử dụng số thực nên không thể chọn điểm làm phần tử cơ sở. Vì nếu dùng điểm để mô tả các phần tử khác, chẳng hạn 1 đường cong thì ta cần vô hạn điểm. Nếu chỉ dùng hữu hạn điểm thì đối tượng được mô tả sẽ không liên tục. Hệ đồ hoạ 2D chọn phần tử đồ hoạ cơ bản là đoạn thẳng, vì đoạn thẳng có thể dùng xấp xỉ một đường cong liên tục bất kỳ (số lượng đoạn thẳng cần dùng là hữu hạn, và số lượng càng lớn thì đường cong càng mịn). Và một điểm cũng có thể mô tả bằng 1 đoạn thẳng (2 điểm đầu trùng nhau). Các phần tử khác của hệ đồ hoạ như đường tròn, đường cong, đa giác sẽ được xây dựng xấp xỉ bằng một số hữu hạn các đoạn thẳng. Số đoạn thẳng cần dùng tuỳ theo yêu cầu về độ mịn và độ chính xác. 2. Cửa sổ và khung nhìn Mặc phẳng toạ độ của hệ đồ hoạ 2D là vô hạn, tuy nhiên màn hình hiển thị vẫn là hữu hạn. Hơn nữa ta thường chỉ muốn vẽ lên 1 khu vực nhất định của màn hình chứ không phải toàn bộ của màn hình. Để thực hiện điều này ta sử dụng công cụ cửa sổ và khung nhìn. Cửa sổ (window) là một phần giới hạn của mặt phẳng 2D được chọn để hiển thị lên màn hình đồ hoạ. Thông thường cửa sổ được chọn là một hình chữ nhật có các cạnh song song với trục toạ độ. Để thay đổi vùng quan sát ta sẽ thay đổi vị trí và kích thước của cửa sổ. Như vậy cửa sổ cho phép chúng ta thể hiện mặt phẳng 2D vô hạn trên màn hình đồ hoạ hữu hạn bằng cách tại mỗi thời điểm chỉ chọn một vùng nhất định để hiển thị và cho phép thay đổi vị trí và kích thước vùng đó. Tham số mô tả cửa sổ gồm có: (xw,yw) là toạ độ đỉnh trên trái, dw là chiều rộng và hw là chiều cao của cửa sổ. Khung nhìn (viewport) là một phần giới hạn của màn hình dùng để hiển thị. Toàn bộ các đối tượng xuất hiện trong cửa sổ sẽ được hiển thị lên khung nhìn. Do đó khung nhìn cũng là một hình chữ nhật có các cạnh song song với các trục của hệ toạ độ màn hình. Ta cũng có thể thay đổi vị trí và kích thước khung nhìn tuỳ theo yêu cầu. Tham số mô tả khung nhìn gồm có: (xv,yv) là toạ độ đỉnh trên trái, dv là chiều rộng và hv là chiều cao của cửa sổ. 3. Công thức đổi toạ độ (phép chiếu 2D) Cửa sổ là 1 vùng của mặt phẳng 2D nên các đối tượng trong cửa sổ có thông tin toạ độ thuộc hệ toạ độ thế giới. Ngược lại các điểm ảnh trong khung nhìn có toạ độ thuộc hệ toạ độ màn hình. Hai hệ toạ độ này không giống nhau (chẳng hạn một hệ dùng toạ độ thực, một hệ dùng Trang 20
  21. Bài giảng Đồ hoạ máy tính - Nguyễn Văn Đồng - Trường TCNghề số 15 toạ độ nguyên), do đó ta cần có công thức chuyển đổi giữa toạ độ một điểm trong cửa sổ về toạ độ trong hệ toạ độ hiển thị. Công thức đó được xác định như sau: Ta sẽ chuyển đổi toạ độ điểm (x,y) trên mặt phẳng 2D thành toạ độ điểm (x*,y*) trên màn hình hiển thị theo công thức sau với mục đích đảm bảo tỉ lệ giữa cửa sổ và khung nhìn. xtl = dv/dw; ttl = hv/hw x* = xo + xtl * (x – xw) y* = yo + ytl * (yw – y) Quá trình chuyển đổi sẽ được thực hiện trong Pascal bằng 2 hàm sau: function Cx(x : real): integer; begin Cx := xo + round((x-xw)*xtl); end; function Cy(y : real): integer; begin Cy := yo + round((yw-y)*ytl); end; 4. Bài toán cắt xén (clipping) và thuật toán cắt xén Cohen-Sutherland Trong nhiều trường hợp ta không được phép hiển thị các hình hoặc các phần của hình nằm ngoài cửa sổ, phải cắt xén các phần đoạn thẳng nằm ngoài để chỉ có phần nằm trong cửa sổ được hiển thị. Vì đoạn thẳng là phần tử cơ bản của hệ đồ hoạ 2D nên quá trình cắt xén phải tiến hành ngay ngay khi vẽ đoạn thẳng và yêu cầu tốc độ cắt xén đoạn thẳng phải nhanh. Bài toán cắt xén cho ta 2 điểm đầu của 1 đoạn thẳng, cửa sổ và yêu cầu ta phải xác định được 2 điểm đầu của phần đoạn thẳng nằm trong của sổ. Nếu đoạn thẳng nằm ngoài của sổ thì ta sẽ không vẽ gì hết. Ngược lại thì sẽ vẽ đoạn thẳng nối 2 điểm đầu ta tìm được. Thuật toán cắt xén Cohen-Sutherland: Lập mã nhị phân để mô tả vị trí của các điểm so với cửa sổ (1 là nằm ngoài, bit 0 là nằm trong). Nếu mã 2 điểm đều là 0000 thì chúng đều nằm trong => đoạn thẳng nằm trong, không cần xén. Nếu mã 2 điểm AND nhau khác 0000 thì chúng hoàn toàn nằm ngoài, không cần vẽ. Ngược lại thì chúng có đoạn nằm trong và đoạn nằm ngoài. Ta sẽ thực hiện cắt xén với từng cạnh của cửa sổ cho đến khi được 2 điểm hoàn toàn là 0000. Chú ý: Turbo Pascal cho phép thiết lập cắt xén tự động khi đặt khung nhìn. Do đó ta có thể không cần trực tiếp cài đặt thuật toán trên mà chỉ cần thiết lập tham số cắt xén và khung nhìn thích hợp. 4. Vẽ đoạn thẳng, đa giác và đường tròn Vẽ đoạn thẳng là thủ tục cơ bản của hệ đồ hoạ 2D. Trong Pascal ta có thể viết như sau: procedure Line2D(x1,y1,x2,y2: real); begin Line(Cx(x1),Cy(y1),Cx(x2),Cy(y2)); end; Đa giác được vẽ bằng cách nối tuần tự các đỉnh theo thứ tự bằng các đoạn thẳng. Thủ tục vẽ đa giác có thể cài đặt như sau: Trang 21
  22. Bài giảng Đồ hoạ máy tính - Nguyễn Văn Đồng - Trường TCNghề số 15 type mangreal = array[1 100] of real; procedure dagiac(n : integer; x,y : mangreal); var i : integer; begin Moveto(Cx(x[n]), Cy(y[n])); for i := 1 to n do Lineto(Cx(x[i]), Cy(y[i])); end; Đường tròn có thể xấp xỉ bằng một đa giác đều nhiều cạnh (72-360 cạnh). procedure duongtron(xo,yo,r : real); var x,y,goc : real; n,i : integer; begin goc := 0; n := 360; x := r * cos(goc); y := r * sin(goc); Moveto(Cx(xo+x), Cy(yo+y)); PutPixel(Cx(xo), Cy(yo),15); for i := 1 to n do begin goc := goc + 2*pi/n; x := r * cos(goc); y := r * sin(goc); Lineto(Cx(xo+x), Cy(yo+y)); end; end; Người đọc có thể đặt câu hỏi: tại sao ta có thể dùng lệnh line của Pascal để vẽ đoạn thẳng mà không dùng lệnh Circle, Drawpoly có sẵn để vẽ đường tròn và đa giác. Nguyên nhân là do vấn đề tỉ lệ. Nếu ta chọn tỉ lệ giữa trục x và trục y không giống nhau thì đường tròn cần được hiển thị là ellipse, nhưng nếu dùng lệnh Circle thì ta chỉ vẽ được hình tròn. Hơn nữa nếu có thêm yêu cầu cắt xén thì lệnh Circle không thực hiện được. 6. Vẽ đường cong Ta chỉ xét các đường cong liên tục (nếu đường cong không liên tục ta cần chia nó thành hữu hạn các đường cong liên tục). Nguyên tắc để vẽ các đường cong liên tục trong hệ đồ hoạ 2D: Chia đường cong thành những đoạn đủ nhỏ, được xấp xỉ bằng một đoạn thẳng. Cho tham số chạy với các đoạn tăng đó và nối hai điểm tương ứng bằng một đoạn thẳng. II. MỘT SỐ ỨNG DỤNG 1. Vẽ các đường cong Các đường cong trong mặt phẳng đồ hoạ có thể chia thành 3 loại theo phương trình mô tả đường cong đó. a. Đường cong hàm số Đường cong hàm số mô tả bởi phương trình y=f(x) với các giá trị x [a,b]. Đoạn chương trình sau minh hoạ các thao tác vẽ đường cong đó: dx := (b-a)/n; Trang 22
  23. Bài giảng Đồ hoạ máy tính - Nguyễn Văn Đồng - Trường TCNghề số 15 x := a; y := f(a); MoveTo(Cx(x), Cy(y)); for i:=1 to n do begin x := x + dx; y := f(x); LineTo(Cx(x), Cy(y)); end; b. Đường cong tham số Đường cong tham số có phương trình dạng x=fx(t), y=fy(t), t [a,b] dt := (b-a)/n; t := a; x := fx(t); y := fy(t); MoveTo(Cx(x), Cy(y)); for i:=1 to n do begin t := t + dt; x := fx(t); y := fy(t); LineTo(Cx(x), Cy(y)); end; c. Đường cong trong toạ độ cực Đường cong r=fr( ), [a,b] Ta có công thức chuyển đổi từ hệ toạ độ cực sang hệ toạ độ vuông góc như sau: x = r* cos( ) y = r* sin( ) dp := (b-a)/n; p := a; r := fr(p); x := r * cos(p); y := r * sin(p); MoveTo(Cx(x), Cy(y)); for i:=1 to n do begin p := p + dp; r := fr(p); x := r * cos(p); y := r * sin(p); LineTo(Cx(x), Cy(y)); end; 2. Vẽ mô phỏng chuyển động toạ độ thực Trang 23
  24. Bài giảng Đồ hoạ máy tính - Nguyễn Văn Đồng - Trường TCNghề số 15 BÀI 6. CÁC PHÉP BIẾN ĐỔI 2D I. CÁC PHÉP BIẾN ĐỔI 2D 1. Phép tịnh tiến Phép biến đổi tịnh tiến là phép biến đổi 2D chỉ làm thay đổi vị trí của đối tượng đồ hoạ, không làm thay đổi hướng và kích thước. 2. Phép quay 3. Phép co giãn II. BIỂU DIỄN PHÉP BIẾN ĐỔI BẰNG MA TRẬN 1. Vì sao nên dùng ma trận biểu diễn phép biến đổi 2. Hệ toạ độ thuần nhất Trang 24
  25. Bài giảng Đồ hoạ máy tính - Nguyễn Văn Đồng - Trường TCNghề số 15 BÀI 7. MỘT SỐ KĨ THUẬT ĐỒ HOẠ THƯỜNG DÙNG 1. Kĩ thuật lát nền Lát nền và việc cần phủ một bề mặt bằng một số hoạ tiết (texture) hoặc đối tượng đồ hoạ nào đó. Phương pháp: . Chia miền cần lát thành những ô đều nhau và lát từng ô. . Nếu lát bằng hoạ tiết bitmap thì phải lựa chọn mẫu lát cơ sở sao cho đảm bảo khít giữa các ô. . Nếu lát bằng cách vẽ các đối tượng thì cần phối hợp sử dụng viewport và tính toán toạ độ một cách thích hợp. 2. Kĩ thuật băng cao su (rubber band) Kĩ thuật này nhằm mục đích: mô tả kết quả sản phẩm vẽ (đường thẳng, đường tròn) thay đổi theo vị trí con trỏ. Phương pháp: Dùng write mode dạng xor để vẽ và xoá. 1. Đặt write mode là xor mode. 2. Hiển thị hình (đường thẳng, đường tròn ) 3. Lưu lại toạ độ hiện thời. 4. Cập nhật toạ độ mới (kiểm tra con trỏ di chuyển). 5. Hiển thị hình với toạ độ đã lưu ở bước 3, quay lại bước 2. Khi vẽ đối tượng lần thứ nhất thì đối tượng được hiển thị trên nền, khi vẽ lần thứ hai thì do tác dụng của write mode dạng xor, nền sẽ được hiển thị. *Write mode Khi ghi 1 pixel lên nền, write mode mô tả pixel kết quả được xác định dựa trên pixel nền và pixel ghi như thế nào: pixel kết quả = pixel cần ghi pixel nền Trong đó là write mode, về bản chất đó là phép toán logic thực hiện giữa 2 giá trị nhị phân. Các write mode thường dùng . copy: ghi đè màu mới lên nền: pixel kết quả = pixel ghi . xor: thực hiện xor màu nền và màu ghi thành 1 màu thứ 3 và hiển thị màu thứ 3 đó. Chú ý: xor 2 lần sẽ trở về màu nền ban đầu. . or: có tác dụng “cộng thêm màu”, không phá huỷ màu nền. Nếu pixel ghi là màu đen thì không tác dụng gì. . and: có tác dụng “phá huỷ màu”. Nếu pixel ghi là màu trắng thì không ảnh hưởng gì. 3. Kĩ thuật nền trong suốt Mục đích: đặt ảnh 1 (nguồn) lên trên ảnh 2 (nền) mà vùng nền của ảnh 1 không che ảnh 2. Kĩ thuật này rất quan trọng trong xây dựng các game hoặc các hình ảnh có nhiều lớp (layer). Trang 25
  26. Bài giảng Đồ hoạ máy tính - Nguyễn Văn Đồng - Trường TCNghề số 15 Phương pháp: . Phương pháp 1: vẽ từng pixel của ảnh 1, không vẽ các pixel nền của ảnh 1. . Phương pháp 2: đặt key color (còn gọi là transparent color) là màu nền của ảnh 1. . Phương pháp 3: hiển thị ảnh bằng mặt nạ (mask) và thủ tục BitBLT (bit block transfer). BitBLT (bit block transfer) BitBLT là thủ tục copy một vùng của ảnh này sang ảnh kia: BitBLT(source, target, area, pos, writemode) source: ảnh nguồn. target: ảnh đích area:toạ độ vùng cần copy của nguồn, thường là hình chữ nhật. pos: vị trí copy lên đích. writemode: xác định các pixel tương ứng của kết quả từ pixel của nguồn và đích. Mặt nạ (mask) Mặt nạ là một ảnh bằng ảnh nguồn, trong đó vùng tương ứng với nền có màu trắng, vùng tương ứng với hình có màu đen (ảnh đen trắng). Phương pháp hiển thị ảnh bằng mặt nạ và thủ tục BitBLT. 1. BitBLT kiểu XOR ảnh nguồn lên đích. 2. BitBLT kiểu AND mặt nạ lên đích. 3. BitBLT kiểu XOR ảnh nguồn lên đích (lần 2) 5. Kĩ thuật hoạt hoạ (sprite) Mục đích: hiển thị đối tượng hoạt động, chuyển động với độ chân thực, thẩm mĩ và tốc độ hiệu quả hơn. Phương pháp: . Vẽ một chuỗi ảnh (sprite), mỗi ảnh (frame) mô tả một thời điểm của quá trình vận động và hiển thị theo trình tự thời gian. . Để mô tả đối tượng di chuyển: kết hợp thêm toạ độ của đối tượng thay đổi theo thời gian. Toạ độ đó dùng làm vị trí để hiển thị frame hiện thời. . Khi hiển thị sprite cần chú ý đến vấn đề vùng trong suốt đối với nền. . Nếu hiển thị nhiều sprite thì chú ý đến tính xa gần, trên dưới của các sprite (dùng z-order để xác định sprite nào vẽ trước, sprite nào vẽ sau). 6. Kĩ thuật nền chuyển động Mục đích: tạo cảm giác chuyển động bằng việc thay đổi nền theo sự di chuyển của đối tượng (thay vì đối tượng di chuyển, nền tĩnh, thì đối tượng vận động tại chỗ, nền di chuyển). Phương pháp: Dùng kĩ thuật double buffer. Coi màn hình hiển thị là một cửa sổ quan sát trên một ảnh nền rộng hơn (dùng một buffer để lưu trữ ảnh nền đó, một buffer để lưu trữ nội dung cửa sổ). Mỗi khi đối tượng di chuyển thì chỉ ta thay đổi toạ độ của cửa sổ tương ứng và cập nhật nội dung cửa sổ. 7. Kĩ thuật vẽ chuyển động cao cấp Trang 26
  27. Bài giảng Đồ hoạ máy tính - Nguyễn Văn Đồng - Trường TCNghề số 15 Mục đích: hiển thị chuyển động nhiều đối tượng không giật (smooth, non flickering). Nguyên nhân của việc màn hình bị giật là do tốc độ vẽ và xoá không đủ nhanh (nhất là khi vẽ nhiều đối tượng hoặc vẽ các đối tượng phức tạp). Phương pháp: Phương pháp 1: bộ đệm đôi (double buffer) Phương pháp 2: lưu trữ ngoài màn hình (off-screen store) a) Phương pháp bộ đệm đôi Ý tưởng: không vẽ trực tiếp lên màn hình đang hiển thị mà vẽ ra một màn hình ảo và hiển thị màn hình ảo khi cần thiết. Khi đó quá trình vẽ không hiển thị trên màn hình chính, người dùng sẽ không cảm nhận được màn hình giật. Vấn đề chính là làm thế nào để chuyển nội dung từ màn hình ảo sang màn hình chính một cách nhanh nhất. . Tách biệt vùng nhớ hiển thị (display buffer) và vùng nhớ hoạt động (active buffer). . Các thao tác vẽ, ghi, xoá ảnh thực hiện trên màn vùng nhớ hoạt động. . Đến chu kì cập nhật hình ảnh thì thì copy dữ liệu từ vùng nhớ hoạt động sang vùng nhớ hiển thị. . Dùng các phương pháp tối ưu để tăng tốc độ copy (cài đặt BitBLT bằng phần cứng đồ hoạ, bằng assembly, không copy byte-byte mà là word-word). b) Phương pháp lưu trữ ngoài màn hình Ý tưởng: Khi cần phục hồi nền khi một đối tượng chuyển động thì ta không vẽ lại toàn bộ màn hình, mà lưu trữ những vùng có thay đổi, sau đó copy lại những cùng đó để phục hồi màn hình trở lại tình trạng trước khi thay đổi. Nên dùng trong trường hợp: các vùng thay đổi là nhỏ so với toàn bộ màn hình. Dùng các phương pháp tối ưu để tăng tốc độ copy. Trang 27