TÌM HIỂU LẬP TRÌNH ĐỒ HỌA 3D TRONG WINDOWS PRESENTATION FOUNDATION

BỘ GIÁO DỤC VÀ ĐÀO TẠO
TRƯỜNG CAO ĐẲNG CÔNG NGHỆ THÔNG TIN TP.HCM
KHOA CÔNG NGHỆ THÔNG TIN

KHÓA LUẬN TỐT NGHIỆP

TÌM HIỂU LẬP TRÌNH ĐỒ HỌA 3D TRONG
WINDOWS PRESENTATION FOUNDATION

Giảng viên hướng dẫn: ThS.TRẦN MINH THÁI
Sinh viên thực hiện:
TRẦN THỊ DÂN

MSSV: 3.07.01.488

Ngành: Công nghệ phần mềm
Khóa 2007 – 2010

Tp. Hồ Chí Minh, tháng 07 năm 2010


MỞ ĐẦU

Ngày nay, công nghệ thông tin phát triển mạnh mẽ, trong các ứng dụng hiện đại, giao
diện người dùng trực quan chiếm vị trí hết sức quan trọng. Việc trình diễn đúng thông tin, theo
đúng cách và vào đúng thời điểm có thể đem lại những giá trị kinh tế xã hội đáng kể. Với
những ứng dụng thương mại, chẳng hạn một ứng dụng bán hàng trực tuyến, việc cung cấp một
giao diện người dùng mạnh có thể tạo nên sự khác biệt giữa một công ty với các đối thủ cạnh
tranh, góp phần làm tăng tăng doanh số và giá trị thương hiệu của hãng này so với hãng khác.
Để có được một giao diện người dùng như vậy, việc tích hợp đồ họa, media, văn bản và các
thành phần trực quan khác như một thể thống nhất đóng đóng vai trò mấu chốt và WPF đã làm

được điều này.
Điểm nổi bật nhất của WPF là hiển thị hình ảnh bằng đồ họa 3D, WPF giúp cho những ai
đam mê đồ họa 3D mà không thể tiếp cận nó trên công cụ phức tạp OpenGL hay DirectX. WPF
tích hợp sẵn DirectX giúp người lập trình phát triển ứng dụng 3D một cách dễ dàng mà khôn
phải quan tâm đến sự phức tạp của DirectX.
WPF là sản phẩm của Microsoft, một tổ chức nghiên cứu đông đảo và đội ngũ kỹ thuật
cao, WPF đang dần lang rộng khắp thế giới và trong tương lai không xa WPF sẽ trở thành một
trong những công nghệ phổ biến nhất trong thế giới lập trình ứng dụng. Xuất phát từ các lý do
trên em nghiên cứu về công nghệ WPF này nhằm cung cấp cho mọi người một sự hiểu biết nhất
định về công nghệ sẽ phát triển trong một tương lai không xa. Rất mong sự đóng góp ý kiến của
quý thầy cô để em có thêm kinh nghiệm cũng như những ý tưởng hay trong công nghệ mà mình
nghiên cứu.


LỜI CẢM ƠN
Lời đầu tiên em xin bày tỏ lòng biết ơn chân thành nhất đến quý Thầy Cô trong Khoa
Công Nghệ Thông Tin, trường Cao Đẳng Công Nghệ Thông Tin Tp.Hô Chí Minh đã tận tình
giảng dạy, hướng dẫn, giúp đỡ và tạo điều kiện cho em trong suốt thời gian học tập tại trường.
Em xin chân thành cảm ơn thầy Trần Minh Thái – Người đã tận tình hướng dẫn, giúp đỡ
em trong suốt thời gian thực hiện luận văn này.
Và con xin chân thành cảm ơn gia đình đã luôn động viên, ủng hộ vật chất lẫn tin thần
trong suốt thời gian qua.
Em xin cảm ơn sự quan tâm, giúp đỡ và ủng hộ của anh chị, bạn bè trong quá trình thực
hiện khóa luận.
Cuối cùng, em xin chúc quý Thầy Cô trường Cao đẳng công nghệ thông tin Tp.HCM,
Thầy Trần Minh Thái, lời chúc sức khỏe và luôn gặt hái được nhiều thành công trong cuộc
sống.

Tp.Hồ Chí Minh, tháng 07 năm 2010

NHẬN XÉT
CỦA GIÁO VIÊN HƢỚNG DẪN
...........................................................................................................................................................
...........................................................................................................................................................
...........................................................................................................................................................
...........................................................................................................................................................
...........................................................................................................................................................
...........................................................................................................................................................
...........................................................................................................................................................
...........................................................................................................................................................
...........................................................................................................................................................
...........................................................................................................................................................
...........................................................................................................................................................
...........................................................................................................................................................
...........................................................................................................................................................
...........................................................................................................................................................
...........................................................................................................................................................
...........................................................................................................................................................
...........................................................................................................................................................
...........................................................................................................................................................
...........................................................................................................................................................
...........................................................................................................................................................
...........................................................................................................................................................
Ngày … tháng … năm 2010
Ký tên


NHẬN XÉT
CỦA GIÁO VIÊN PHẢN BIỆN

...........................................................................................................................................................
...........................................................................................................................................................
...........................................................................................................................................................
...........................................................................................................................................................
...........................................................................................................................................................
...........................................................................................................................................................
...........................................................................................................................................................
...........................................................................................................................................................
...........................................................................................................................................................
...........................................................................................................................................................
...........................................................................................................................................................
...........................................................................................................................................................
...........................................................................................................................................................
...........................................................................................................................................................
...........................................................................................................................................................
...........................................................................................................................................................
...........................................................................................................................................................
...........................................................................................................................................................
...........................................................................................................................................................
...........................................................................................................................................................
...........................................................................................................................................................
Ngày … tháng … năm 2010
Ký tên


MỤC LỤC
MỞ ĐẦU ............................................................................................................................................... 1
PHẦN I: TỔNG QUAN ..................................................................................................................... 4
VỀ WINDOWS PRESENTATION FOUNDATION.................................................................. 4
1. Giới thiệu ....................................................................................................................................... 4

2. Sự ra đời của Windows Presentation Foundation(WPF) ................................................... 4
3. Ứng dụng của WPF ..................................................................................................................... 6
4. Ƣu điểm nổi bật của WPF.......................................................................................................... 8
5. Bộ thƣ viện của WPF ................................................................................................................ 10
PHẦN II: GIỚI THIỆU VỀ 3D ..................................................................................................... 11
CHƢƠNG 1: GIỚI THIỆU GÓC NHÌN, ÁNH SÁNG VÀ MÔ TẢ KHÔNG GIAN TỌA
ĐỘ......................................................................................................................................................... 14
1. Tổng quan .................................................................................................................................... 14
1.1. Tọa độ ba chiều..................................................................................................................... 15
1.2. Điểm trong không gian ........................................................................................................ 16
2. Góc nhìn (Camera) .................................................................................................................... 18
3. Ánh sáng (Light) ........................................................................................................................ 24
3.1. DirectionalLight ................................................................................................................... 25
3.2. PointLight .............................................................................................................................. 26
3.3. SpotLight ............................................................................................................................... 26
3.4. AmbientLight ........................................................................................................................ 27
4. Mô tả không gian tọa độ........................................................................................................... 27
1. Hình ảnh động ............................................................................................................................ 32
2. Phép biến đổi hình ..................................................................................................................... 36
2.1. Phép dịch chuyển (TranslateTranform3D)........................................................................ 38
2.2. Phép biến đổi kích thước (ScaleTransform3D) ................................................................ 42


2.3.
2.4.

Phép xoay (RotateTransform3D) ....................................................................................... 45
Phép biến đổi bằng ma trận (MatrixTransform3)............................................................. 57

CHƢƠNG 3: TÔ MÀU CHO HÌNH 3D ...................................................................................... 64

1. Sử dụng cọ vẽ Gradient ............................................................................................................ 64
2. Sử dụng cọ vẽ Tile...................................................................................................................... 70
2.1. ImageBrush ........................................................................................................................... 71
2.2. DrawingBrush ....................................................................................................................... 77
2.3. VisualBrush........................................................................................................................... 85
CHƢƠNG 4: ỨNG DỤNG .............................................................................................................. 92
1. Giới thiệu ..................................................................................................................................... 92
2. Phân tích ...................................................................................................................................... 92
3. Giao diện ứng dụng ................................................................................................................... 93
4. Các dòng sự kiện chính............................................................................................................. 97
KẾT LUẬN......................................................................................................................................... 98
TÀI LIỆU THAM KHẢO ............................................................................................................... 99


DANH MỤC CÁC HÌNH, BẢNG BIỂU VÀ SƠ ĐỒ

Hình 1: Hình hộp có sử dụng Light. ........................................................................................................13
Hình 2: Hình hộp không sử dụng Light. .................................................................................................13
Hình 1-1: Hình tròn. ..................................................................................................................................14
Hình 1-2: Hình quả bóng. .........................................................................................................................14
Hình 1.1-1: Hệ trục tọa độ. .......................................................................................................................15
Hình 2-1: Camera với góc nhìn 50mm....................................................................................................19
Hình 2-2: Camera với góc nhìn 100mm..................................................................................................19
Hình 2-3: Camera với góc nhìn 25mm....................................................................................................20
Hình 2-4: Camera với góc nhìn 45 độ. ....................................................................................................20
Hình 2-5: Hình hộp sử dụng PerspectiveCamera...................................................................................22
Hình 2-6:Cách xác định OrthographicAerialView. ...............................................................................23
Hình 2-7: Hình hộp sử dụng OrthographicCamera. ..............................................................................24
Hình 3.1-1: Hình minh họa sử dụng DirectionalLight. .........................................................................25
Hình 3.2-1: Hình minh họa sử dụng PoinLight......................................................................................26

Hình 3.3-1: Hình minh họa sử dụng SpotLight......................................................................................27
Hình 3.4-1: Hình minh họa sử dụng AmbientLight. .............................................................................27
Hình 4-1: Hình ảnh tam giác trên mặt phẳng. ........................................................................................28
Hình 4-2: Cách xác định các đỉnh dựa trên hệ trục tọa độ Oxyz. ........................................................29
Hình 4-3: Mặt trước của hình vuông Hình 4-4: Mặt sau của hình vuông ...........................................30
Bảng 3: Các thuộc tính biến đổi. ..............................................................................................................37
Hình 2.1-1: Cách tham chiếu trên hệ trục tọa độ để vẽ một vật thể. ...................................................38
Hình 2.1-2: Hình ảnh được vẽ bằng cách nói các đoạn thẳng..............................................................39
Hình 2.3.1-1: Vật thể được xoay với một góc 30 độ. ............................................................................47
Hình 2.3.1-2: Vật thể được xoay với một góc -30 độ............................................................................47
Hình 2.3.2-1: Các điểm x, y trên hệ trục tọa độ Oxy. ...........................................................................52
Hình 2.3.2-2: Góc và đường thẳng của điểm x,y trên hệ trục Oxy......................................................52


Hình 2.3.2-3: Cách khác để xác định 2 điểm x,y. .................................................................................53
Hình 2.3.2-4: Số phức trên hệ trục tọa độ số phức. ..............................................................................53
Hình 2.3.2-5: Số phức với góc θ. .............................................................................................................54
Hình 1-1: Tọa độ dùng xác định cọ vẽ. ...................................................................................................66
Hình 1-2: Chuyển đổi cọ vẽ tam giác 2 chiều sang tam giác 3 chiều. ................................................67
Hình 1-3: Vật thể sử dụng cọ vẽ Gradient. .............................................................................................70
Hình 2.1-1: Cọ vẽ sử dụng ImageBrush..................................................................................................74
Hình 2.1-2: Hình ảnh sau khi được thay đổi giá trị TextureCoordinates............................................75
Hình 2.1-3: Hình ảnh khi sử dụng ViewboxUnit. ..................................................................................76
Hình 2.1-4: Hình ảnh sau khi có sử dung thêm thuộc tính TileMode. ................................................77
Hình 2.1-5: Hình ảnh khi sử dụng thuộc tính TileMode với kiểu FlipXY. ........................................77
Hình 2.2-1: Sử dụng DrawingBrush tô theo kiểu hình ellipse lấy từ resource. .................................83
Hình 2.2-2: Sử dụng DrawingBrush tô theo kiểu hình chữ nhật lấy từ resource...............................84
Hình 2.2-3: Sử dụng DrawingBrush tô theo kiểu sọc chéo lấy từ windowns. ...................................84
Hình 2.3-1: Khối lập phương được tô bằng những khối lập phương nhỏ. .........................................91
Hình 3: Giao diện chính. ...........................................................................................................................93

Bảng 1: Thành phần giao diện theo yêu cầu và những công nghệ chuyên biệt cần thiết để tạo
chúng. ......................................................................................................................................................... 10
Bảng 2: Các thuộc tính của Light. .......................................................................................................... 25
Bảng 3: Các thuộc tính biến đổi. ............................................................................................................. 37
Bảng 4: Bảng mô tả các thành phần của giao diện. .............................................................................. 96
Sơ đồ 1: Cấu trúc đơn giản để tạo ra hình hộp 3D................................................................................ 11
Sơ đồ 2: Lớp con trong lớp Media......................................................................................................... 17
Từ gốc

Từ viết tắt

Windows Presentation Foundation

WPF

Extention MakeUp Language

XAML

Đồ họa ba chiều trong Windows Presentation Foundation

WPF 3D

User Interface

UI
Bảng: Danh sách các từ viết tắt.


MỞ ĐẦU

 Công nghệ Windows Presentation Foundation
Khi khoảng cách công nghệ giữa các nhà sản xuất không còn quá xa, khi tính năng giữa các
phần mềm không còn nhiều khác biệt thì là lúc giao diện nổi lên như là một trong những giá trị
cạnh tranh cho mỗi sản phẩm phần mềm. Dù đó là web hay là phần mềm ứng dụng thì một giao
diện hấp dẫn, thân thiện luôn là điểm nhấn cho mỗi sản phẩm đó. Windows Presentation
Foundation (WPF) là một trong những công nghệ mới với những ưu điểm nổi bật cho việc thiết kế
và lập trình giao diện.
Với công nghệ từ trước năm 2006, thì việc biểu diễn hiệu quả tất cả các tính năng hoạt động
như một ứng dụng Window riêng biệt chạy trên desktop, đồng thời có thể truy cập thông tin thông
qua trình duyệt đòi hỏi xây dựng hai phiên bản độc lập sử dụng hai công nghệ khác nhau. Và việc
hợp nhất giữa người thiết kế và người lập trình cũng gặp không ít những khó khăn. Windows
Presentation Foundation ra đời không những giải quyết được các vấn đề trên mà còn có những ưu
điểm về đồ họa, âm thanh, video… Với việc sử dụng ngôn ngữ XAML(Extention MakeUp
Language) giúp cho việc quản lý các tập tin dễ dàng hơn.
Đặc biệt, điểm nổi bật nhất của WPF là đồ họa ba chiều. Khó khăn nhất cho những lập trình
viên khi lập trình với DirectX đó chính là card đồ họa mà nhà cung cấp hỗ trợ DirectX. Và giờ
đây WPF có khả năng thực thi những công việc dựa trên những tính toán phần mềm thay vì những
đặc điểm mà nhà cung cấp phần cứng tạo ra. WPF sẽ xác đính sự hỗ trợ của phần cứng với những
hiệu ứng đồ họa được tạo ra. Và bạn không cần phải bận tâm về điều đó.
 Lịch sử ra đời và tƣơng lai của WPF
 Lịch sử ra đời
WPF là một trong những công nghệ mới nhất trong .NET 2008 (Framework 3.0 hay 3.5) của
Microsoft, là hệ thống API mới hỗ trợ việc xây dựng giao diện đồ hoạ trên nền Windows. WPF
được giới thiệu lần đầu tiên cùng với .NET 3.0 vào ngày 21 tháng 11 năm 2006. Và phát hình
phiên bản chính thức đầu tiên vào ngày 30 tháng 4 năm 2007.
Trang 1


Tiếp sau đó là WPF 2.0, WPF 3.0 được phát hành vào ngày 22 tháng 7 năm 2009, và vừa mới
đây là WPF 4.0(với gói Framework 4.0) được phát hành vào ngày 7 tháng 6 năm 2010.

 Tƣơng lai của WPF
Việc Microsoft chính thức ra mắt bộ công cụ Visual Studio 2010 và nền tảng phát triển
.NET 4.0 và WPF 4.0. Sự kiện này đã và đang mở ra hướng mới trong ngành công nghiệp phần
mềm, với sự linh hoạt và khả năng xây dựng ứng dụng một cách nhanh chóng mà vẫn đáp ứng
được những yêu cầu ngày các khắt khe của người dùng.
 Lý do chọn đề tài
WPF được xem là thế hệ kế tiếp của Windowns, tăng cường khả năng lập trình giao diện của
lập trình viên bằng cách cung cấp API cho phép tận dụng những lợi thế về đa phương tiện hiện
đại, các công nghệ sẵn có khác nhau và lợi thế của card đồ họa. Đặc biệt sử dụng DirectX làm
công nghệ cơ sở để xây dựng nên những hiệu ứng - DirectX là công nghệ đồ họa của Microsoft,
tận dụng được khả năng của phần cứng để tăng tốc chương trình .
Là sản phẩm của Microsoft ( tìm lực tài chính mạnh mẽ, với 95% máy tính cá nhân sử dụng hệ
điều hành windows, đội ngũ kỹ thuật hàng đầu và sự thành công c ủa các sản phẩm trong quá khứ)
nên đủ để bạn tin vào khả năng WPF sẽ trở thành một trong những công nghệ phổ biến nhất trong
thế giới lập trình ứng dụng.
Trên cơ sở đó em quyết định tìm hiểu công nghệ WPF và đi sâu vào nghiên cứu đồ họa 3D với
việc phát triển một ứng dụng mà sử dụng hầu hết các ứng dụng về đồ họa 3 chiều mà WPF đã hỗ trợ
để cung cấp cho mọi người một sự hiểu biết nhất định về đồ họa 3D với một công nghệ WPF mà
được dự đoán là sẽ phát triển trong một tương lai không xa.

Trang 2


 Mục tiêu thực hiện
 Về mặt lý thuyết
+ Nắm được cơ sở lý thuyết chung về công nghệ WPF cũng như việc sử dụng dồ họa
ba chiều trong WPF.
+ Tìm hiểu các ứng dụng về 3D để nắm được cách thức hoạt động và những yêu cầu
cần thiết đối với những ứng dụng.
 Về mặt ứng dụng

+ Xây dụng một mô hình 3D.
+ Sử dụng các hiệu ứng các biến đổi trên mô hình.

Trang 3


Phần I: TỔNG QUAN
VỀ WINDOWS PRESENTATION FOUNDATION

1. Giới thiệu
Windows Presentation Foundation (WPF) còn được gọi dưới tên mã là Avalon, là một hệ
thống thư viện con trong bộ .Net Framework và được liên kết dưới dạng XAML. WPF được tích
hợp trong Windows Vista và Windows 2008, ngoài ra, nó còn hổ trợ đối với Windows XP SP2 và
cả Windows Server 2003. Nó cung cấp kiểu lập trình cho việc xây dựng ứng dụng và hổ trợ
1 cách trong suốt giữa giao diện người dùng và mô hình ứng dụng doanh nghiệp. Một ứng
dụng WPF có thể được triển khai trên desktop hoặc trên 1 thiết bị thông qua trình duyệt web.
Hơn thế nữa, nó còn hổ trợ các nhiều control, thiết kế và phát triển giao diện thân thiện, trực quan
bên ngoài của chương trình windows. Nó hướng đến sự hợp nhất của 1 ứng dụng dịch vụ: giao
diện người dùng, đồ họa 2D và 3D, các văn bản cố định và động, các mô hình đồ họa nâng cao, đồ
họa vector, hình ảnh động, Data Binding, Audio và Video. Mặc dù Windows Form sẽ tiếp
tục được sử dụng rộng rãi, nhưng các công ty phát triển ứng dụng WPF như là các ứng dụng
doanh nghiệp (line-of-bussiness).
Microsoft Sliverlight là một nền tảng web của WPF hoặt động như một dạng Flash và các ứng
dụng mobiles với các mô hình chương trình tương tự như là 1 ứng dụng .NET. Tính năng 3D
không được hổ trợ, tuy nhiên XPS và cơ sở đồ họa vector đã được tích hợp.

2. Sự ra đời của Windows Presentation Foundation(WPF)
Windows Presentation Foundation được phát hành chính thức vào tháng 11 năm 2006.
Vì sao WPF lại ra đời?
Đi đến tương lai bằng cái nhìn từ quá khứ, năm 2001, Microsoft cho ra đời một tập hợp các

công nghệ nền tảng, được gọi với tên chung là .NET. Hầu hết các công nghệ này đều đưa ra các
mô hình lập trình mới, hoàn toàn chưa từng xuất hiện trước đó. Lấy ví dụ:
Trang 4


1. ASP.NET Web Forms đưa mô hình lập trình Windows truyền thống lên thế giới Web, biến
Web từ môi trường state-less (client và server tách biệt hoàn toàn) thành một môi trường thống
nhất: state-full Web.
2. ADO.NET định nghĩa ra các class tổng quát như Connection, Command, DataSet để các
developer thừa kế từ chúng, mở rộng khả năng tiếp cận với nhiều loại RDMS (Relational
Database Management System) khác nhau như SQL Server, Access, Oracle, MySql…, đồng thời
nâng cao khả năng debug khi thao tác với database.
3. Common Language Runtime làm thư viện nền tảng giúp lập trình viên sử dụng nhiều ngôn
ngữ lập trình khác nhau có thể cùng làm việc với nhau trong một project. Có thể kể ra C#, J#, F#,
VB.NET, Delphi.NET, C++.NET, IronRuby, IronPython…
Tuy nhiên công nghệ mà những nhà phát triển trung thành nhất của Microsoft mong muốn
nhìn thấy bước đột phá – Windows Forms – lại chẳng có gì thay đổi. Đã hơn một thập kỷ, kể từ
khi Windows 95 ra đời, người ta vẫn phải tạo giao diện cho ứng dụng desktop bằng cách gọi các
hàm Windows API. Windows Forms tuy khoác bên ngoài giao diện kéo thả nhưng thực chất bên
dưới nó vẫn bị phụ thuộc vào các lời gọi API, nên nó không có gì là đặc sắc.
Trải qua một thời gian tồn tại dài như thế, Windows Forms đã được chuẩn hóa và mang trong
mình đầy đủ các công cụ cho phép xây dựng các chương trình dễ dàng. Tuy nhiên, do sử dụng
Windows API, nên giao diện của các control chuẩn như button, checkbox, textbox bị phụ thuộc
vào phiên bản Windows mà .NET Framework đang chạy, ví dụ 3D button trong Vista Aero khi
đem sang Windows 2000 thì lại biến thành flat button. Nhưng đó chỉ là vấn đề nhỏ, rắc rối lớn
nhất của Windows Forms chính là giao diện của các control chuẩn này lại gần như không thể
được can thiệp và thay đổi theo tư duy sáng tạo của nhà thiết kế, ngoại trừ trường hợp có ai đó
chịu khó đến nỗi ngồi viết cả tấn code bằng mô hình lập trình cấp thấp GDI/GDI+ (Graphical
Device Interface).
Trong các ứng dụng hiện đại, giao diện người dùng trực quan chiếm vị trí hết sức quan trọng.

Việc trình diễn đúng thông tin, theo đúng cách và vào đúng thời điểm có thể đem lại những giá trị
kinh tế xã hội đáng kể. Với những ứng dụng thương mại, chẳng hạn một ứng dụng bán hàng trực
tuyến, việc cung cấp một giao diện người dùng mạnh có thể tạo nên sự khác biệt giữa một công ty
với các đối thủ cạnh tranh, góp phần làm tăng doanh số và giá trị thương hiệu của hãng này so với
Trang 5


hãng khác. Để có được một giao diện người dùng như vậy, việc tích hợp đồ họa, media, văn bản
và các thành phần trực quan khác như một thể thống nhất đóng đóng vai trò mấu chốt.
WPF ra đời chính là để xây dựng một nền tảng chung giải quyết những thách thức đã nêu
trên.

3. Ứng dụng của WPF
WPF được xây dựng nhằm vào ba mục tiêu cơ bản:
1) Cung cấp một nền tảng thống nhất để xây dựng giao diện người dùng.
2) Cho phép người lập trình và người thiết kế giao diện làm việc cùng nhau một cách
dễ dàng.
3) Cung cấp một công nghệ chung để xây dựng giao diện người dùng trên cả Windows
và trình duyệt Web.
WPF là một trong 3 thành phần mới của .NET Framework 3.0 (Windows Presentation
Foundation, Windows Communication Foundation, Windows Workflow Foundation). Có thể xem
sự ra đời của WPF là một cứu cánh cho những nhà phát triển đang phải thực hiện công đoạn code
hết sức tỉ mỉ để tạo giao diện. WPF thay đổi những quan niệm lập trình giao diện cũ, xóa đi những
bất cập còn tồn tại của Windows Forms bằng cách giới thiệu một mô hình hoàn toàn mới lạ.
Trong WPF vẫn tồn tại khái niệm control chuẩn như label, radio button…, tuy nhiên thay vì gọ i
Windows API thì chúng có khả năng tự vẽ ra text, tự vẽ border, tự vẽ background cho chính bản
thân của mình. Tính đột phá là kể từ nay, không bị API cản trở, nhà phát triển có thể toàn quyền
kiểm soát các đối tượng đồ họa. WPF cung cấp các tính năng thật sự mạnh mẽ để hỗ trợ nhà phát
triển can thiệp vào quá trình xuất giao diện (render) của control ra màn hình mà không phải viết
bất kỳ dòng code nào. Một số điểm nhấn thú vị nên được kể ra đầu tiên:

1. Sử dụng đối tượng Transformation để xoay tròn, kéo dãn, thu nhỏ hay xoay nghiêng bất cứ
thứ gì thuộc về giao diện.
2. Tạo hình ảnh động (Animation) để các control trở lên lung linh chuyển động ngay trước mắt
người sử dụng.
3. Xây dựng Form có các hình thù khác lạ, hỗ trợ control có màu trong suốt để tạo vẻ mới mẻ
và chuyên nghiệp
Trang 6


WPF sử dụng DirectX làm công nghệ cơ sở để xây dựng nên những hiệu ứng thú vị như trên.
DirectX là công nghệ đồ họa của Microsoft, tận dụng được khả năng của phần cứng để tăng tốc
chương trình. Lấy ví dụ, một vấn đề đơn giản là vẽ một đoạn thẳng từ điểm (0, 0) đến điểm (10,
10).
· Trong GDI/GDI+ của Windows Forms, .NET sẽ tạo ra một danh sách các điểm nằm giữa (0,
0) và (10, 10), tức là các điểm (1, 1), (2, 2), … , (9, 9) rồi vẽ ra từng điểm này. Do vẽ nhiều điểm
kề nhau nên cuối cùng các điểm này tạo ra cảm giác là vẽ được một đoạn thẳng. Nói một cách
khác, phương pháp của Windows Forms là sử dụng phần mềm để vẽ ra một tập hợp điểm
· Đối với DirectX, nó gọi trực tiếp hàm DrawLine của card đồ họa, và card đồ họa sẽ vẽ ngay
ra một đường thẳng không cần phải tính toán đến các điểm trung gian. Đây là phương pháp sử
dụng phần cứng để vẽ ra một ảnh Vector. Nhờ DirectX mà tốc độ render được cải thiện đáng kể vì
phần cứng thì chạy nhanh hơn rất nhiều so với phần mềm cùng một chức năng.
Với WPF, nhà phát triển không còn phải đau đầu với bài toán xử lí tốc độ, nhất là đối với các
phần mềm game hiện đại ngày nay, đòi hỏi đồ họa 3D sinh động mà GDI/GDI+ khó lòng có thể
đáp ứng được. Với WPF, nhà phát triển có thể tự do sáng tạo về giao diện, tạo nên các hiệu ứng
bắt mắt mà trước đây không thể nào thực hiện được với Windows Forms.
Mặc dù người ta biết đến WPF với khả năng đồ họa tuyệt vời, với hình ảnh động, với các tính
năng 3D độc đáo, nhưng WPF vẫn có thể được dùng để xây dựng nên các ứng dụng Windows
truyền thống, sử dụng các control chuẩn như trong Windows Forms. Sự thật là khi chọn lựa kiểu
giao diện truyền thống này, thì các thao tác đối với control không khác bao nhiêu so với Windows
Forms, và nhà phát triển có thể dễ dàng làm quen ngay với môi trường mới mà không mất quá

nhiều công sức.
Có một vài cải tiến trong WPF không thuộc về phần giao diện, nhưng chúng đáng được lưu ý
khi nhà phát triển muốn phát triển một ứng dụng chuyên nghiệp và bài bản hơn. Có thể kể ra đó
là:
· Mô hình Data-Binding mới được cải thiện nhiều so với Windows Forms.
· Các class dùng để phục vụ cho việc in tài liệu và sắp xếp trình tự in ấn.
· Hệ thống tài liệu có thể hiển thị một số lượng rất lớn các văn bản được định dạng như Word,
Excel, PDF…
Trang 7


· Xây dựng ứng dụng page-based như website, có thể chạy trên Internet Explorer và môi
trường World Wide Web, không bị các cảnh báo về bảo mật và không cần thực hiện quá trình cài
đặt (Portable Applications).

4. Ƣu điểm nổi bật của WPF
Có một số các tính năng mới trong WPF mà bạn có thể tận dụng khi bạn phát triển các ứng
dụng WPF của bạn. Trước tiên, để sử dụng sức mạnh phần cứng đồ họa WPF mới thì thực hiện
một mô hình đồ họa véc tơ, dựa vào các Direct3D. Điều này cho phép công nghệ đồ họa tùy ý thu
nhỏ độ phân giải màn hình mà không mất đi chất lượng hình ảnh, cũng không thể sửa kích thước
đồ họa.
Ngoài ra, để hình dung dễ dàng giao diện người dùng (UI), WPF giới thiệu ngôn ngữ mới dựa
trên XML, được gọi là XAML. XAML cho phép các ứng dụng tự động phân tích c ú pháp và thao
tác giao diện người dùng ở một trong hai yếu tố thời gian thiết kế hoặc thời gian khởi động. Nó
dùng mô hình code-behind, lập trình tương tự như ASP.NET, cho phép người thiết kế và người
phát triển làm việc song song và liền mạch công việc của mình. Tất nhiên, WPF cũng cung cấp
cho bạn những lựa chọn để không sử dụng các tập tin XAML khi bạn phát triển các ứng dụng
WPF, có nghĩa là bạn vẫn có thể phát triển các ứng dụng của bạn hoàn toàn bằng code như C#,
C/C++, hoặc Visual Basic.
Một trong những điều gây đau đầu cho những lập trình viên khi lập trình với DirectX đó là các

đặc điểm mà nhà sản xuất card đồ họa cung cấp hỗ trợ DirectX. Tuy vậy với WPF điều đó không
đáng lo ngại, bởi nó có khả năng thực thi những công việc dựa trên những tính to án phần mềm
thay vì những đặc điểm mà nhà cung cấp phần cứng tạo ra. WPF đủ thông minh để xác đính sự hỗ
trợ của phần cứng với những hiệu ứng đồ họa được tạo ra. Và bạn không cần phải bận tâm về điều
đó. Tất nhiên với những hiệu ứng animation phức tạp, như ng được thực thi trên một nền tảng
phần cứng đã cũ thì cũng sẽ có những ảnh hưởng nhất định đối với quá trình thực thi.
Những đặc điểm đó đủ tạo ra những cải tiến hấp dẫn cho WPF, nhưng nó còn cung cấp những
thay đổi mạnh mẽ khác cho công nghệ lập trình giao diện. Và dưới đây sẽ là một loạt những hỗ
trợ mà công nghệ WPF mang lại cho người lập trình viên:
 Mô hình giao diện Web (Web-like layout model): không chỉ cho phép xây dựng
những giao diện với những đối tượng cố định , WPF còn cung cấp những layout linh hoạt
Trang 8


để hiện thị, cho phép xây dựng những giao diện động theo nội dung, với những ngôn ngữ
khác nhau.
 Đồ họa phong phú: Thay vì làm việc với những điểm ảnh, bạn được có thể làm việc
trực tiếp với những đối tượng hình học cơ bản: hình chữ nhật, hình eclipse. Bạn cũng có
những đặc điểm mới như điều khiển độ trong, độ mờ, cùng các hiệu ứng 3D.
 Hiển thị văn bản linh hoạt: WPF có khả năng cung cấp những khả năng để hiện thị
văn bản một cách phong phú ở bất cứ đâu. Bạn có thể kết hợp văn bản với các đối tượng
khác. Hay có thể sử dụng các đặc điểm mới để hiện thị một lượng lớn văn bản một cách dễ
đọc nhất.
 Các hiệu ứng Animation: Bạn có thể sử dụng bộ tính thời gian timer để vẽ lại hình.
Nhưng trong WPF với đặc điểm đã được tích hợp thành một phần của Framework. Từ đó
bạn có thể định nghĩa những hiệu ứng chuyện động cho các đối tượng đồ họa khác nhau.
 Hỗ trợ video, audio file: Không giống như các công nghệ trước đó như Winform có
sự hạn chế trong việc hỗ trợ để chạy các file Audio và Video. WPF hỗ trợ chạy tất các file
mà Window Meida Player có thể đọc được, và cho phép bạn có thể chạy đồng thời một
hoặc nhiều file. Đặc biệt WPF cung cấp các tool cho phép bạn tích hợp các các nội dung

video vào giao diện, và cả các hiệu ứng 3D (ví dụ hiện thị video trên các mặt của hình hộp
3D).
Còn rất nhiều đặc điểm mạnh mẽ khác mà WPF cung cấp để hỗ trợ quá trình thiết kế và lập
trình như : Stypes and Template, Command, Pages Base Application….WPF được coi như là
công nghệ để tạo ra giao diện cho những ứng dụng Window của thế hệ tiếp theo.Độ phân giải độc
lập: cũng là một trong những đặc điểm khác tạo ra sự khác biệt cho công nghệ WPF. Nếu như các
giao diện được thiết kế bằng các công nghệ trước như Winform vốn dựa trên GDI/GDI+ sẽ gặp
nhiều phiền phức khi làm việc với những màn hình có độ phân giải khác nhau. Hình vẽ sẽ lớn hơn
với các màn hình có độ phân giải thập, hay nhỏ đi với khi độ phân giải màn hình cao. Nhưng
trong WPF điều đó không còn là vấn đề quan ngại với những người thiết kế. Bởi WPF cho phép
hiện thị các đối tượng với đúng kích cỡ khi thiết kế dưới các độ phân giải khác nhau của màn
hình.

Trang 9


Hiển thị ảnh Vector thay vì ảnh BitMap mang lại cho công nghệ WPF khả năng hiện thị linh
hoạt với nhiều kích thước khác nhau mà không lo làm “vỡ” hình ảnh những đối tượng đồ họa.Sự
độc lập giữa thiết kế và lập trình là một trong những bước tiến mà WPF mang lại. Các đối tượng
đồ họa trong WPF được thể hiện thông qua một loại mã đơn giản là XAML (Extention MakeUp
Language). Đó là một loại mã đơn giản gần giống như HTML dùng để t ạo và tinh chỉnh các đối
tượng đồ họa. Đó là một bước tiến lớn trong quá trình thiết kế và lập trình giao diện.
XAML cho phép người thiết kế có thể tạo ra các giao diện độc lập trên các công cụ thiết kế
chuyên biệt như Microsoft Expression Interactive Designer. Sau đó các giao diện đó được xuất ra
dưới dạng mã XAML và người lập trình chỉ cần import vào các tool như Visual Studio để tạo ra
giao diện cho chương trình của mình. Điều nãy rõ ràng làm giảm đi rất nhiều công sức và độ phức
tạp trong quá trình thiết kế phần mềm. Nó cho phép hai người với vai trò khác nhau có thể tiến
hành song song công việc của mình.

5. Bộ thƣ viện của WPF

Giờ đây WPF hỗ trợ nhiều tính năng lập trình giao diện trong cùng một công nghệ đơn nhất.
Điều này giúp cho quá trình t ạo giao diện người dùng trở nên dễ dàng hơn đáng kể.
Windows
Forms
Giao diện đồ
họa (form và
các control)
On-screen văn
bản
Fixed-format
văn bản
Hình ảnh
Video và âm
thanh
Đồ họa 2 chiều
Đồ họa 3 chiều

PDF

Windows
Forms/
GDI+

Windows
Direct3D
Media Player

WPF

x

x

x

x
x

x
x

x
x

x
x
x

x
x

Bảng 1: Thành phần giao diện theo yêu cầu và những công nghệ chuyên biệt cần thiết để tạo
chúng.
Nguồn từ: />
Trang 10


Phần II: GIỚI THIỆU VỀ 3D
Microsoft Windows Vista là phiên bản đầu tiên của Windows có tích hợp sẵn đồ họa 3D, và
giờ đây 3D được tích hợp với Microsoft Windows Presentation Foudation(WPF), giao diện lập

trình ứng dụng client(API) được giới thiệu trong năm 2006 như một phần của Microsoft NET
Framework. 3.0 mặc dù NET 3.0 được tích hợp trong Windows Vista, bạn cũng có thể cài đặt nó
dưới Microsoft Windows XP với Service Pack 2 hoặc Windows Server 2003 với Service Pack 1 .
Kể từ lần đầu xuất hiện(năm 1995), DirectX đã nhanh chóng phát triển cùng với sự phát triển
mạnh mẽ của game đồ họa. Giờ DirectX đã được tích hợp vào một phần của Windows. Tuy vậy
lập trình với DirectX không đơn giản và thực sự chúng khá phức tạp. Chính vì vậy nó chưa bao
giờ được sử dụng để tạo ra những giao diện đồ họa cho các phần mềm ứng dụng.
WPF ra đời và thay đổi tất cả điều đó. WPF không dựa trên nền tảng truyền thống là
GDI/GDI+. Điểm đặc biệt chính là DirectX làm nền tảng cho bất cứ giao diện nào được tạo ra. Dù
đó là hình ảnh 3D phức tạp hay đơn giản cho là một button, hiển thị text thì nó cũng thông qua
DirectX. Điều đó đồng nghĩa với việc những ứng dụng thông thường cũng có thể c ó những hiệu
ứng đồ họa phức tạp, ví dụ như những hiệu ứng trong suốt, bóng đổ. Và cũng nhờ thế mà có thể
tăng tốc xử lý đồ họa thông qua sự tương tác giữa DirectX và c ard đồ họa.
Cấu trúc đơn giản để tạo một hình ảnh 3D
Hình Hộp 3D

MeshGeometry3D

Light

Material

Camera

Sơ đồ 1: Cấu trúc đơn giản để tạo ra hình hộp 3D
Để tạo ra được hình hộp 3D thì điều đầu tiên bạn phải làm là định nghĩa một đối tượng, một
vật thể trong không gian thông qua một đối tượng đó là MeshGeometry3D , đối tượng này bao
gồm Positions chứa các đỉnh của hình và TriangleIndices mô tả cách kết nối những đỉnh
để tạo thành một vật thể mà ta muốn định nghĩa.
Trang 11

Thứ hai là chúng ta sẽ định nghĩa màu cho đối tượng với Material hoặc có thể dùng thêm
đối tượng BackMaterial để tô màu ở mặt sau của vật thể.
Và một yếu tố mà tạo nên bề mặt nổi cho vật thể mà khi nhìn vào chúng ta có cảm giác như
một hình ảnh 3D đó là Light , nếu như không có đối tượng này thì bạn không thể thấy được hình
ảnh 3D mà thay vào đó là một hình phẳng.
Nhưng một yếu tố không kém phần quan trọng đó là Camera. Camera dùng để khai báo góc
độ nhìn cho vật thể, nếu không có đối tượng này thì bạn không thể nhìn thấy được vật thể.
Ví dụ như ta tạo một vật thể là một hình hộp:
xmlns=" />xmlns:x=" />Title="MainWindow" Height="300" Width="500">
<Grid>
<Viewport3D >
<!—Camera--!>
<Viewport3D.Camera>
UpDirection=" 0,1,0" NearPlaneDistance="1"/>
</Viewport3D.Camera>
<ModelVisual3D>
<ModelVisual3D.Content>
<Model3DGroup>
<!-—Light--!>
<DirectionalLight Color="White" Direction="2 -3 -1" />
<GeometryModel3D>
<!-—MeshGeomeTry--!>
<GeometryModel3D.Geometry>