Dành cho U16: Làm quen với C# và .NET
“Bay” cùng Harry Potter!

Anh SI SÁP

- Tí Cận ơi, em có nhà không?
- Dạ có, anh chờ em một chút.
- Ủa? Em làm gì mà ăn mặc ngộ quá vậy! Mắt đeo kính kiểu Harry Potter, tay cầm chổi, đồ đạc vứt lung tung, bàn ghế ngã chỏng chơ!
- Dạ... em đang... tập bay như Harry Potter.
- Hừm... Thế này nhé, anh sẽ chỉ cho em một "kỹ xảo" để bay an toàn trên... máy vi tính. Chịu hông?
- Thiệt hả anh? Anh chỉ cho em ngay đi!

Chuẩn bị chút, nghen!

Trước hết, cần đưa vào máy một tấm hình em đang cưỡi chổi ở tư thế như thể em đang bay trên trời vậy. Em hãy tưởng tượng mình dịch chuyển hình ấy trên màn hình, nếu "lót" hình bầu trời (hoặc lâu đài ma quái) phía sau hình của em thì lập tức em trở thành... Harry Potter! Tạm thời, em có thể lấy hình của Harry Potter trên Web cũng được. Nếu tìm được hình GIF có nền trong suốt (transparent) thì rất tốt! Trong trường hợp chỉ tìm được hình có nền không trong suốt, em dùng công cụ Paint trong Windows để xóa trắng nền rồi quy định màu trong suốt là màu trắng. Sau đó, em lưu hình ở dạng GIF. Em cũng cần tìm thêm hình bầu trời để làm nền nữa nhe.

Nào, mình cùng "chíp"...

Bây giờ, em tạo một dự án ứng dụng Windows như có lần anh đã chỉ cho em. Sau đó, trong cửa sổ thuộc tính (Properties) của biểu mẫu chính (Form1), em bấm cái nút nhỏ xíu có dấu 3 chấm ở cột bên phải của thuộc tính BackgroundImage. Trên màn hình sẽ hiện lên hộp thoại để em chọn tập tin dùng làm hình nền cho biểu mẫu. Chọn xong, em bấm nút Open, hình nền đã chọn lập tức xuất hiện trên biểu mẫu.

Em chọn PictureBox (khung ảnh) trong bộ đồ nghề ToolBox và đặt tên cho PictureBox này là picHarry. Trong cửa sổ Properties của picHarry, khi em bấm chọn thuộc tính BackColor, ở cột bên trái tương ứng xuất hiện một dấu mũi tên xuống. Bấm vào mũi tên đó, em thấy xuất hiện một hộp thoại nhỏ để chọn màu nền cho khung ảnh. Ở đây mình muốn khung ảnh trong suốt để nhìn thấy nền “mây trời” phía sau nên em hãy chọn thẻ (tab) Web và chọn mục Transparent nằm trên cùng.

- A! khung ảnh bây giờ không còn màu xám như lúc đầu nữa mà trở nên trong suốt nên em thấy được hình bầu trời ở phía sau. Hay thiệt!

Trong cửa sổ Properties của khung hình, em nên đổi tên (thuộc tính Name) của khung hình từ pictureBox1 thành picHarry. Ở thuộc tính Image, bấm vào nút có dấu 3 chấm, chọn tập tin hình Harry (hay hình của em!) đang cưỡi chổi bay trong hộp thoại và bấm Open. Hình Harry hiện ra ngay trong khung hình. Em nhớ thay đổi kích thước của khung cho vừa với hình.

Tiếp theo, em chọn Timer từ ToolBox, đặt vào Form1. Cái Timer này tự động lấy tên là timer1.

- Timer là gì vậy anh?

 À, Timer tương tự như đồng hồ bấm giây trong thể thao. Trong ví dụ của mình, Timer được dùng để “phát lệnh” dịch chuyển khung hình. Theo mặc định, cứ sau 100 ms, bộ Timer sẽ “gõ” một nhịp thông qua tình huống Tick (giống như tiếng tíc tắc của đồng hồ sau mỗi giây). Em hãy chọn timer1, bấm vào biểu tượng Events (hình tia chớp) trong cửa sổ Properties của timer1 rồi bấm kép vào tình huống Tick, em sẽ thấy hàm đáp ứng tình huống Tick (timer1_Tick). Trong hàm này, em điều khiển cho khung hình dịch chuyển như vầy nè (đoạn mã 1).

Đoạn mã 1
private void timer1_Tick(
object sender, System.EventArgs e)
{
// Cho Harry bay về bên phải
// Khi bay qua biên phải thì
// cho Harry trở lại từ đầu
if(picHarry.Left +
picHarry.Width < this.Width)
picHarry.Left += 5;
else
picHarry.Left = 0;
}

- Vậy là xong hả anh? Để em cho biên dịch rồi chạy thử, hén?... Ủa, sao “nó” hổng chịu “bay”!

Em hấp tấp quá! Bộ Timer chưa được kích hoạt thì hàm đáp ứng tình huống Tick đâu có chạy. Em tìm hàm tạo dựng Form1() trong Form1.cs rồi thêm dòng lệnh timer1.Start() vào cuối hàm (đoạn mã 2).

- À, kích hoạt bộ Timer bằng hàm Start(), vậy chắc phải có hàm Stop() để dừng nó lại, đúng không anh?

Em "nhạy" ghê! Ta cần cho Timer dừng lại khi kết thúc chương trình, nghĩa là phải gọi hàm timer1.Stop() trong hàm Dispose() của Form1 (đoạn mã 2). Xong rồi đó, em biên dịch và cho chạy thử xem.

Đoạn mã 2
public Form1()
{
InitializeComponent();
timer1.Start();
}
...
protected override void Dispose(
bool disposing )
{
timer1.Stop();
if( disposing )
{
if (components != null)
{
components.Dispose();
}
}
base.Dispose( disposing );
}

- A, hay quá! Harry bay rồi kìa! Ủa mà sao Harry chỉ bay ngang chứ không “cất cánh, hạ cánh”? Rồi làm sao để điều khiển Harry theo ý mình?

Hẹn em kỳ sau nhe. Tới giờ anh phải đi đón bé Ti rồi. Chúc em “bay” an toàn!