1
TÌM HIỂU KHẢ NĂNG ĐỒ HOẠ CỦA VB.NET
Để tìm hiểu cách sử dụng các hành vi vẽ, không gì tốt hơn là thực hiện một ví dụ nho nhỏ. Bạn
hãy mở VB.NET 2005 và tạo một ứng dụng mới có template là Windows Application. Double-
click vào form trống có sẵn để mở cửa sổ soạn thảo mã lệnh. VB tự động thêm đoạn mã để xử lý
tình huống Load của form. Bạn hãy sửa thành đoạn mã 1.
Đoạn mã 1
Imports System.Drawing
Imports System.Drawing.Drawing2D
Public Class Form1
‘ Khai báo bảng vẽ
Dim gNoiVe As Graphics
Private Sub Form1_Load(ByVal sender As System.Object, _
ByVal e As System.EventArgs) Handles MyBase.Load
‘ Bảng vẽ là Form1
gNoiVe = Me.CreateGraphics
End Sub
End Class
Toàn bộ nội dung đoạn mã 1 dùng để chuẩn bị một bảng vẽ sử dụng bề mặt Form1 làm nơi vẽ
hình. Trên form, bạn vẽ 16 nút lệnh như hình 1. Đặt tên cho chúng lần lượt theo thứ tự từ trái
sang, từ trên xuống như sau: cmdArc, cmdBezier, cmdBeziers, cmdCurve, cmdClosedCurve,
cmdEllipse, cmdIcon, cmdImage, cmdLine, cmdLines, cmdPath, cmdPie, cmdPolygon,
cmdRectangle, cmdRectangles, cmdString. 16 nút lệnh là 16 ví dụ minh họa 19 hành vi vẽ đã
trình bày trong bài trước. Đoạn mã 2 trình bày một phần thủ tục xử lý tình huống Click cho 16
nút lệnh đó.
Hình 1
Lưu ý: Bạn cần chép 2 tập tin .ICO và 1 tập tin .JPG nào đó mà bạn đang có vào thư mục
bin\debug của ứng dụng để thử nghiệm, rồi sửa các dòng lệnh khai báo liên quan đến tên tập tin
trong thủ tục xử lý tình huống cmdIcon_Click và cmdImage_Click cho phù hợp tên tập tin của
bạn. Nhấn phím F5 để thử chương trình. Các hành vi vẽ trong ví dụ vừa nêu cho ta các hình dạng
chỉ có nét vẽ, không có màu tô. Để vẽ hình có màu tô, bạn cần dùng các hành vi tô màu như trình

gNoiVe.DrawBezier(New Pen(Color.Green, 2), 20.0F, 30.0F, 100.0F, _
200.0F, 40.0F, 400.0F, 100.0F, 200.0F)
End Sub
3
Private Sub cmdBeziers_Click(ByVal sender As System.Object, _
ByVal e As System.EventArgs) Handles cmdBeziers.Click
Dim p1 As New PointF(40.0F, 50.0F) ' Các điểm trên đường cong
Dim p2 As New PointF(60.0F, 70.0F)
Dim p3 As New PointF(80.0F, 34.0F)
Dim p4 As New PointF(120.0F, 180.0F)
Dim p5 As New PointF(200.0F, 150.0F)
Dim p6 As New PointF(350.0F, 250.0F)
Dim p7 As New PointF(200.0F, 200.0F)
Dim ptsArray As PointF() = {p1, p2, p3, p4, p5, p6, p7}
gNoiVe.Clear(Me.BackColor)
gNoiVe.DrawBeziers(New Pen(Color.Red, 2), ptsArray)
End Sub
Private Sub cmdCurve_Click(ByVal sender As System.Object, _
ByVal e As System.EventArgs) Handles cmdCurve.Click
Dim bluePen As New Pen(Color.Blue, 1)
Dim pt1 As New PointF(40.0F, 50.0F) ' Dãy các điểm
Dim pt2 As New PointF(50.0F, 75.0F)
Dim pt3 As New PointF(100.0F, 115.0F)
Dim pt4 As New PointF(200.0F, 180.0F)
Dim pt5 As New PointF(200.0F, 90.0F)
Dim ptsArray As PointF() = {pt1, pt2, pt3, pt4, pt5}
Dim offset As Integer = 1 ‘Bước nhảy (số điểm) để tạo 1 đoạn trên đường cong
Dim segments As Integer = 3 ‘Số đoạn trên đường cong (<= số điểm trừ 2)
Dim tension As Single = 0.5F ‘Độ căng của đường cong, càng nhỏ càng thẳng
gNoiVe.Clear(Me.BackColor)

Private Sub cmdIcon_Click(ByVal sender As System.Object, _
ByVal e As System.EventArgs) Handles cmdIcon.Click
Dim appPath As String = My.Computer.FileSystem.CurrentDirectory
‘ Chép 2 file icon mà bạn có vào thư mục bin\debug của ứng dụng
Dim icon1 As New Icon(appPath & "\Apple.ico")
Dim icon2 As New Icon(appPath & "\Aero-Soft.ico")
gNoiVe.Clear(Me.BackColor)
gNoiVe.DrawIcon(icon1, 20, 50) ‘Vẽ tại một vị trí, không tính chuyện co dãn
Dim rect As New Rectangle(100, 200, 20, 20)
gNoiVe.DrawIcon(icon2, rect) ‘Co dãn cho khớp với hình chữ nhật cho trước
Dim rectUnstretched As New Rectangle(50, 200, 20, 20)
gNoiVe.DrawIconUnstretched(icon2, rectUnstretched) ‘Không co dãn
End Sub
Private Sub cmdImage_Click(ByVal sender As System.Object, _
ByVal e As System.EventArgs) Handles cmdImage.Click
Dim appPath As String = My.Computer.FileSystem.CurrentDirectory
Dim imageFile As Image = Image.FromFile(appPath & "\LogoBV.jpg")
Dim rect As New Rectangle(50, 50, 60, 60)
Dim rectUnscaled As New Rectangle(150, 50, 50, 50)
Dim rectUnscaledAndClipped As New Rectangle(10, 150, 100, 80)
gNoiVe.Clear(Me.BackColor)
gNoiVe.DrawImage(imageFile, rect) ‘Co dãn cho khớp với hình chữ nhật cho trước
gNoiVe.DrawImageUnscaled(imageFile, rectUnscaled) ‘Không co dãn
‘Không co dãn và cắt bớt cho vừa khung chữ nhật cho trước
gNoiVe.DrawImageUnscaledAndClipped(imageFile,
rectUnscaledAndClipped)
End Sub
Private Sub cmdLine_Click(ByVal sender As System.Object, _
ByVal e As System.EventArgs) Handles cmdLine.Click
gNoiVe.Clear(Me.BackColor)

gNoiVe.Clear(Me.BackColor)
gNoiVe.DrawPie(bluePen, 20, 20, 100, 100, startAngle, sweepAngle)
End Sub
Private Sub cmdPolygon_Click(ByVal sender As System.Object, _
ByVal e As System.EventArgs) Handles cmdPolygon.Click
Dim points(3) As Point
points(0) = New Point(120, 60) ‘Đỉnh phía trên bên trái hình thang
points(1) = New Point(180, 60) ‘Đỉnh phía trên bên phải hình thang
points(2) = New Point(240, 120) ‘Đỉnh phía dưới bên phải hình thang
points(3) = New Point(60, 120) ‘Đỉnh phía dưới bên trái hình thang
gNoiVe.Clear(Me.BackColor)
gNoiVe.DrawPolygon(New Pen(Color.Blue), points)
End Sub
Private Sub cmdRectangle_Click(ByVal sender As System.Object, _
ByVal e As System.EventArgs) Handles cmdRectangle.Click
gNoiVe.Clear(Me.BackColor)
gNoiVe.DrawRectangle(New Pen(Color.Blue, 1), 50, 50, 150, 150)
gNoiVe.DrawRectangle(New Pen(Color.Red, 1), 10, 10, 250, 150)
End Sub
6
Private Sub cmdRectangles_Click(ByVal sender As System.Object, _
ByVal e As System.EventArgs) Handles cmdRectangles.Click
Dim rects(3) As Rectangle ‘Bản dãy 4 hình chữ nhật
rects(0) = New Rectangle(10, 10, 250, 150)
rects(1) = New Rectangle(20, 20, 250, 150)
rects(2) = New Rectangle(30, 30, 250, 150)
rects(3) = New Rectangle(40, 40, 250, 150)
gNoiVe.Clear(Me.BackColor)
gNoiVe.DrawRectangles(New Pen(Color.Blue), rects)
End Sub

Private Sub cmdFillEllipse_Click(ByVal sender As System.Object, _
ByVal e As System.EventArgs) Handles cmdFillEllipse.Click
Dim mySolidBrush As New SolidBrush(Color.DarkRed)
gNoiVe.Clear(Me.BackColor)
7
gNoiVe.FillEllipse(mySolidBrush, 100, 120, 250, 150)
gNoiVe.FillEllipse(mySolidBrush, 10, 10, 150, 150)
End Sub
8
Private Sub cmdFillPath_Click(ByVal sender As System.Object, _
ByVal e As System.EventArgs) Handles cmdFillPath.Click
Dim points(5) As Point, bytes(5) As Byte, colors(5) As Color
points(0) = New Point(40, 140) 'Tọa độ điểm bắt đầu của path
points(1) = New Point(275, 200)
points(2) = New Point(105, 225)
points(3) = New Point(190, 300)
points(4) = New Point(50, 350)
points(5) = New Point(20, 180)
bytes(0) = CByte(PathPointType.Start) 'Điểm bắt đầu của path
bytes(1) = CByte(PathPointType.Bezier)
bytes(2) = CByte(PathPointType.Bezier)
bytes(3) = CByte(PathPointType.Bezier)
bytes(4) = CByte(PathPointType.Line)
bytes(5) = CByte(PathPointType.Line)
colors(0) = Color.Green
colors(1) = Color.Yellow
colors(2) = Color.Red
colors(3) = Color.Blue
colors(4) = Color.Orange
colors(5) = Color.Black

End Sub
Private Sub cmdFillRectangle_Click(ByVal sender As System.Object,
_
ByVal e As System.EventArgs) Handles cmdFillRectangle.Click
gNoiVe.Clear(Me.BackColor)
gNoiVe.FillRectangle(New SolidBrush(Color.Red), 50, 50, 150,
150)
gNoiVe.FillRectangle(New SolidBrush(Color.Blue), 10, 10, 50,
150)
End Sub
Private Sub cmdFillRectangles_Click(ByVal sender As
System.Object, _
ByVal e As System.EventArgs) Handles
cmdFillRectangles.Click
Dim rects(3) As Rectangle
rects(0) = New Rectangle(10, 10, 50, 150)
rects(1) = New Rectangle(70, 70, 250, 50)
rects(2) = New Rectangle(340, 80, 10, 150)
rects(3) = New Rectangle(90, 150, 50, 20)
gNoiVe.Clear(Me.BackColor)
gNoiVe.FillRectangles(New SolidBrush(Color.Blue), rects)
End Sub
Private Sub cmdLinearGradient_Click(ByVal sender As
System.Object, _
ByVal e As System.EventArgs) Handles cmdLinearGradient.Click
Dim rect As New Rectangle(50, 30, 100, 100)
Dim lBrush As New LinearGradientBrush(rect, Color.Red,
Color.Yellow, _
LinearGradientMode.BackwardDiagonal)
gNoiVe.Clear(Me.BackColor)

Đường biểu diễn đồ thị có màu xanh dương, đường kẻ màu đỏ là đường biểu diễn trục hoành trên
12
mặt phẳng tọa độ (chia hình chữ nhật làm 2 phần bằng nhau). Đồ thị là một đường cong đi qua
nhiều điểm (ngay cả nét thẳng đứng trong đồ thị của hàm Tangent cũng là một đường cong đi qua
các điểm xếp thẳng hàng với nhau mà thôi).
Ý tưởng của ví dụ này là: sử dụng hành vi DrawCurve để vẽ đường cong đi qua 360 điểm (tương
ứng với 360 độ) trên mặt phẳng tọa độ. Tọa độ Y của mỗi điểm được tính nhờ các phép tính kết
hợp với hành vi Sin, Cos và Tan có sẵn thuộc lớp Math (tương ứng với các hàm lượng giác trong
VB6).
Bạn hãy nạp VB.NET 2005 và tạo một ứng dụng mới có template là Windows Application. Trên
form trống có sẵn, vẽ một Panel control làm nơi vẽ đồ thị, đặt tên là pnlNoiVeDuongBieuDien.
Kích thước của control này không ảnh hưởng đến kết quả vẽ. Vẽ tiếp 3 Button control lần lượt có
tên là cmdSine, cmdCosine và cmdTangent.
Gõ đoạn mã sau đây vào form:
Imports System.Drawing.Drawing2D
Imports System.Math
Public Class VeDuongBieuDienHamLuongGiac
Dim CacDiemTrenDoThi(359) As PointF, BienDem As Integer
Dim KhoangChiaDo As Double, ViTriTrucHoanh As Double
Dim gNoiVe As Graphics
Dim pDuongBieuDien As Pen = New Pen(Color.Blue, 2)
Dim pTrucHoanh As Pen = New Pen(Color.Red, 1)
Private Sub VeDuongBieuDienHamLuongGiac_Load(ByVal sender As _
System.Object, ByVal e As System.EventArgs) _
Handles MyBase.Load
KhoangChiaDo = pnlNoiVeDuongBieuDien.Width / 360
ViTriTrucHoanh = CInt(pnlNoiVeDuongBieuDien.Height / 2 - 1)
pTrucHoanh.DashStyle = DashStyle.Dash ‘Nét ngắt quãng
gNoiVe = pnlNoiVeDuongBieuDien.CreateGraphics
gNoiVe.SmoothingMode = SmoothingMode.HighQuality ‘Nét vẽ mượt mà

Point(Round(BienDem * KhoangChiaDo), _
ViTriTrucHoanh - myTan)
Catch
If Tan(PI * BienDem / 180) * 4 > ViTriTrucHoanh Then
CacDiemTrenDoThi(BienDem) = New _
Point(Round(BienDem * KhoangChiaDo), _
pnlNoiVeDuongBieuDien.Height)
Else
CacDiemTrenDoThi(BienDem) = New _
Point(Round(BienDem * KhoangChiaDo), 0)
End If
End Try
Next
Call VeDuongBieuDien("Tangent")
End Sub
Sub VeDuongBieuDien(ByVal sTenHam As String)
With gNoiVe
.Clear(pnlNoiVeDuongBieuDien.BackColor)
.DrawString(sTenHam, New Font("Times New Roman", 14), _
New SolidBrush(Color.Green), 120, 20)
.DrawLine(pTrucHoanh, 0, CInt(ViTriTrucHoanh), _
pnlNoiVeDuongBieuDien.Width, CInt(ViTriTrucHoanh))
.DrawCurve(pDuongBieuDien, CacDiemTrenDoThi)
End With
End Sub
End Class
Nhận xét:
• Với GDI+, hệ thống tọa độ có gốc là góc trên bên trái của Panel control, nên tọa độ Y có trị số
càng lớn nếu điểm càng thấp. Do ta sử dụng trục hoành là đường kẻ màu đỏ (vẽ tại
14