Scratch: Vẽ các hình cơ bản với bút vẽ (Pen)

Chuyên đề này gồm 2 phần: ôn lại lý thuyết phần mở rộng Bút vẽ (Pen), sau đó thực hành vẽ 12 hình cơ bản thường gặp - từ đoạn thẳng, hình tròn đến các đa giác đều. Mỗi bài đều có hình minh hoạ, đề bài và lời giải chi tiết.

Chú ý

Để thực sự hiểu cách tính các góc/cạnh, các thầy cô và các bạn học sinh vui lòng đọc kỹ hướng dẫn giải và tìm thêm các tài liệu liên quan về hình học. Các bài giải không đi sâu giải thích các công thức tính toán.

Phần 1 - Lý thuyết: Bút vẽ (Pen)

Phần mở rộng (Extension) là các nhóm khối lệnh không có sẵn từ đầu, cần thêm thủ công vào dự án. Bấm biểu tượng mảnh ghép 🧩 ở góc dưới bên trái bảng khối lệnh để mở thư viện phần mở rộng, sau đó chọn phần mở rộng cần dùng.

Bút vẽ (Pen) là phần mở rộng phổ biến nhất - cho phép sprite để lại vệt vẽ khi di chuyển, giống như một cây bút vẽ theo sau nhân vật.

Đặt bút / nhấc bút

đặt bút
nhấc bút

đặt bút (pen down) bắt đầu vẽ - mọi chuyển động sau đó để lại vệt trên sân khấu. nhấc bút (pen up) ngừng vẽ - di chuyển bình thường, không để lại vệt.

Xoá nét vẽ

Xóa tất cả

Xoá sạch mọi nét vẽ hiện có trên sân khấu - nên đặt ở đầu kịch bản (khi bấm vào lá cờ màu xanh) để mỗi lần chạy lại không bị chồng lên hình cũ.

Màu, độ đậm, kích thước bút

chọn bút màu (#4cbf56)
đặt [màu sắc v] bút bằng (50)
thay đổi [màu sắc v] bút một lượng (10)
đặt kích thước bút vẽ bằng (5)
thay đổi độ dày của nét bút (1)

chọn bút màu mở bảng chọn màu trực quan. Khối đặt ... bút bằng / thay đổi ... bút một lượng cho phép điều khiển từng thuộc tính màu (màu sắc, độ bão hoà, độ sáng, độ trong suốt) bằng số.

Hai cách vẽ: di chuyển theo hướng, hoặc đi thẳng tới toạ độ

Có 2 kỹ thuật cơ bản để vẽ bằng bút vẽ, và toàn bộ phần thực hành bên dưới chỉ xoay quanh 2 kỹ thuật này:

• Di chuyển + xoay: đặt hướng bằng, di chuyển ... bước, xoay ... độ - đi theo hướng hiện tại, muốn đổi hướng thì xoay một góc. Đây là cách duy nhất để vẽ được các hình có nhiều cạnh nối tiếp nhau (đa giác, tam giác…).
• Đi tới toạ độ: đi tới điểm x: ... y: ... - nếu bút đang đặt xuống, sprite sẽ vẽ luôn một đường thẳng nối vị trí cũ và vị trí mới, bất kể đang hướng về phía nào. Cách này nhanh gọn khi đã biết chính xác toạ độ 2 đầu mút cần nối.

Quy tắc góc quay khi vẽ hình khép kín

Đây là kiến thức quan trọng nhất để vẽ được mọi đa giác, không chỉ hình vuông:

Khi đi hết một vòng quanh một hình khép kín (đi theo từng cạnh, tại mỗi đỉnh xoay một góc để hướng sang cạnh tiếp theo), tổng tất cả các góc đã xoay luôn bằng 360° - dù hình đó có đều hay không.

Với đa giác đều (các cạnh và các góc bằng nhau) có n cạnh, góc xoay ở mỗi đỉnh bằng nhau và bằng:

góc xoay mỗi đỉnh = 360° ÷ n

Ví dụ hình vuông (n = 4): 360 ÷ 4 = 90°, đúng như đã biết. Tam giác đều (n = 3): 360 ÷ 3 = 120°. Lục giác đều (n = 6): 360 ÷ 6 = 60°.

Với hình không đều (tam giác cân, tam giác vuông, hình thang, hình thoi…), mỗi đỉnh có một góc xoay khác nhau tuỳ hình dạng cụ thể - chỉ cần cộng lại đúng 360° là hình sẽ tự khép kín, không cần các cạnh hay góc bằng nhau.

In hình (Stamp)

in hình

Thay vì vẽ một đường liên tục, in hình (stamp) in ngay hình dạng hiện tại của sprite lên sân khấu tại vị trí đó - như đóng dấu. Hữu ích để vẽ hàng loạt bản sao tĩnh của một hình mà không cần tạo clone.

Phần 2 - Thực hành: vẽ các hình cơ bản

Mỗi bài dưới đây giả sử sprite là mũi tên (hướng mặc định của Scratch), sân khấu có kích thước 480 × 360 (toạ độ x từ -240 đến 240, y từ -180 đến 180). Bấm “Xem lời giải” để đối chiếu sau khi đã tự làm thử.

Bài 1: Đường thẳng

Vẽ một đường thẳng nằm ngang, dài 400 bước, đi ngang qua chính giữa sân khấu.

Xem lời giải

Dùng kỹ thuật di chuyển + xoay: đưa sprite tới điểm bắt đầu, đặt hướng sang phải (90°), đặt bút xuống rồi di chuyển thẳng 400 bước.

khi bấm vào @greenFlag
Xóa tất cả
đặt kích thước bút vẽ bằng (3)
đi tới điểm x: (-200) y: (0)
đặt hướng bằng (90)
đặt bút
di chuyển (400) bước
nhấc bút

Bài 2: Đoạn thẳng nối hai điểm cho trước

Vẽ đoạn thẳng nối điểm A(-100, -50) và điểm B(120, 80).

Xem lời giải

Khi đã biết chính xác toạ độ 2 đầu mút, dùng kỹ thuật đi tới toạ độ sẽ nhanh hơn nhiều so với việc tự tính hướng và khoảng cách: đưa sprite tới điểm A, đặt bút xuống, rồi đi thẳng tới điểm B - Scratch tự vẽ một đường thẳng nối 2 điểm.

khi bấm vào @greenFlag
Xóa tất cả
đặt kích thước bút vẽ bằng (3)
đi tới điểm x: (-100) y: (-50)
đặt bút
đi tới điểm x: (120) y: (80)
nhấc bút

Bài 3: Hình tròn

Vẽ một hình tròn bán kính 80.

Xem lời giải

Scratch không có khối “vẽ hình tròn” có sẵn, nhưng có thể vẽ hình tròn bằng 36 đoạn thẳng rất ngắn, mỗi đoạn xoay 360 ÷ 36 = 10°. Độ dài mỗi đoạn tính theo công thức chu vi: (2 × 3.14 × bán kính) ÷ 36 = (2 × 3.14 × 80) ÷ 36 ≈ 13.96.

khi bấm vào @greenFlag
Xóa tất cả
đặt kích thước bút vẽ bằng (3)
đi tới điểm x: (-80) y: (0)
đặt hướng bằng (0)
đặt bút
lặp lại (36)
di chuyển (13.96) bước
xoay @turnRight (10) độ
end
nhấc bút

Càng chia nhiều đoạn (72, 144…) hình càng mượt nhưng chạy chậm hơn.

Bài 4: Hình vuông

Vẽ một hình vuông cạnh 120.

Xem lời giải

Đa giác đều 4 cạnh: góc xoay mỗi đỉnh = 360 ÷ 4 = 90°.

khi bấm vào @greenFlag
Xóa tất cả
đặt kích thước bút vẽ bằng (3)
đi tới điểm x: (-60) y: (60)
đặt hướng bằng (90)
đặt bút
lặp lại (4)
di chuyển (120) bước
xoay @turnRight (90) độ
end
nhấc bút

Bài 5: Hình chữ nhật

Vẽ một hình chữ nhật rộng 160, cao 80.

Xem lời giải

Hình chữ nhật cũng có 4 góc vuông (góc xoay mỗi đỉnh vẫn là 90°) nhưng 2 cặp cạnh đối diện có độ dài khác nhau - lặp lại 2 lần cặp “cạnh dài, xoay, cạnh ngắn, xoay”.

khi bấm vào @greenFlag
Xóa tất cả
đặt kích thước bút vẽ bằng (3)
đi tới điểm x: (-80) y: (40)
đặt hướng bằng (90)
đặt bút
lặp lại (2)
di chuyển (160) bước
xoay @turnRight (90) độ
di chuyển (80) bước
xoay @turnRight (90) độ
end
nhấc bút

Bài 6: Tam giác cân

Vẽ tam giác cân với 2 cạnh bên dài 100, góc ở đáy 70°, góc ở đỉnh 40°.

Xem lời giải

Tam giác không đều nên không dùng chung một góc xoay cho mọi đỉnh - mỗi đỉnh dùng góc xoay riêng, miễn tổng cộng đủ 360°: góc xoay ở đỉnh (đối diện đáy) = 180° - 40° = 140°, góc xoay ở mỗi đỉnh đáy = 180° - 70° = 110° (140 + 110 + 110 = 360). Cạnh đáy tính được xấp xỉ 68 (theo định lý sin, ứng với 2 cạnh bên 100 và góc ở đỉnh 40°).

Để 2 góc cân nằm dưới đáy và đỉnh nằm trên cho dễ nhìn, xuất phát từ đỉnh đáy bên trái, hướng đi lên đỉnh lệch khỏi trục thẳng đứng đúng nửa góc ở đỉnh (40° ÷ 2 = 20°) - nhờ tam giác cân đối xứng qua trục đó.

khi bấm vào @greenFlag
Xóa tất cả
đặt kích thước bút vẽ bằng (3)
đi tới điểm x: (-34) y: (-47)
đặt hướng bằng (20)
đặt bút
di chuyển (100) bước
xoay @turnRight (140) độ
di chuyển (100) bước
xoay @turnRight (110) độ
di chuyển (68) bước
xoay @turnRight (110) độ
nhấc bút

Bài 7: Tam giác đều

Vẽ tam giác đều cạnh 120.

Xem lời giải

Đa giác đều 3 cạnh: góc xoay mỗi đỉnh = 360 ÷ 3 = 120°.

khi bấm vào @greenFlag
Xóa tất cả
đặt kích thước bút vẽ bằng (3)
đi tới điểm x: (-60) y: (52)
đặt hướng bằng (90)
đặt bút
lặp lại (3)
di chuyển (120) bước
xoay @turnRight (120) độ
end
nhấc bút

Bài 8: Tam giác vuông

Vẽ tam giác vuông có góc 90°, 60°, 30°, với các cạnh tương ứng dài 86.6, 100 (cạnh huyền) và 50.

Xem lời giải

Xuất phát từ đỉnh góc vuông, đi lần lượt qua 3 cạnh. Góc xoay ở mỗi đỉnh = 180° - góc trong tại đỉnh đó: đỉnh 60° → xoay 120°, đỉnh 30° → xoay 150°, đỉnh 90° → xoay 90° (120 + 150 + 90 = 360). Tỉ lệ độ dài 3 cạnh 50 : 86.6 : 100 tương ứng với tam giác 30° - 60° - 90° (theo định lý sin). Để góc vuông nằm ở dưới bên trái cho dễ nhìn, xuất phát hướng thẳng lên (0°) rồi mới đi qua cạnh huyền và cạnh đáy.

khi bấm vào @greenFlag
Xóa tất cả
đặt kích thước bút vẽ bằng (3)
đi tới điểm x: (-43.3) y: (-25)
đặt hướng bằng (0)
đặt bút
di chuyển (50) bước
xoay @turnRight (120) độ
di chuyển (100) bước
xoay @turnRight (150) độ
di chuyển (86.6) bước
xoay @turnRight (90) độ
nhấc bút

Bài 9: Hình thang cân

Vẽ hình thang cân: đáy lớn 120, đáy nhỏ 60, 2 cạnh bên dài 60 (góc ở đáy lớn 60°, góc ở đáy nhỏ 120°).

Xem lời giải

4 đỉnh có 2 loại góc trong khác nhau (60° và 120°), nên có 2 loại góc xoay tương ứng: tại 2 đỉnh đáy lớn xoay 180° - 60° = 120°, tại 2 đỉnh đáy nhỏ xoay 180° - 120° = 60° (120 + 60 + 60 + 120 = 360).

khi bấm vào @greenFlag
Xóa tất cả
đặt kích thước bút vẽ bằng (3)
đi tới điểm x: (-60) y: (26)
đặt hướng bằng (90)
đặt bút
di chuyển (120) bước
xoay @turnRight (120) độ
di chuyển (60) bước
xoay @turnRight (60) độ
di chuyển (60) bước
xoay @turnRight (60) độ
di chuyển (60) bước
xoay @turnRight (120) độ
nhấc bút

Bài 10: Hình thoi

Vẽ hình thoi cạnh 100, các góc xen kẽ 60° và 120°.

Xem lời giải

4 cạnh bằng nhau nhưng góc trong xen kẽ 60°/120°, nên góc xoay cũng xen kẽ: 180° - 60° = 120°, rồi 180° - 120° = 60°, lặp lại 2 lần (120 + 60 + 120 + 60 = 360).

khi bấm vào @greenFlag
Xóa tất cả
đặt kích thước bút vẽ bằng (3)
đi tới điểm x: (-25) y: (43)
đặt hướng bằng (90)
đặt bút
lặp lại (2)
di chuyển (100) bước
xoay @turnRight (120) độ
di chuyển (100) bước
xoay @turnRight (60) độ
end
nhấc bút

Bài 11: Ngũ giác đều

Vẽ ngũ giác đều cạnh 80.

Xem lời giải

Đa giác đều 5 cạnh: góc xoay mỗi đỉnh = 360 ÷ 5 = 72°.

khi bấm vào @greenFlag
Xóa tất cả
đặt kích thước bút vẽ bằng (3)
đi tới điểm x: (-40) y: (62)
đặt hướng bằng (90)
đặt bút
lặp lại (5)
di chuyển (80) bước
xoay @turnRight (72) độ
end
nhấc bút

Bài 12: Lục giác đều

Vẽ lục giác đều cạnh 70.

Xem lời giải

Đa giác đều 6 cạnh: góc xoay mỗi đỉnh = 360 ÷ 6 = 60°.

khi bấm vào @greenFlag
Xóa tất cả
đặt kích thước bút vẽ bằng (3)
đi tới điểm x: (-35) y: (61)
đặt hướng bằng (90)
đặt bút
lặp lại (6)
di chuyển (70) bước
xoay @turnRight (60) độ
end
nhấc bút

Mở rộng thêm

• Gói mỗi hình thành một khối tự tạo nhận tham số (ví dụ vẽ đa giác đều (số cạnh) (độ dài cạnh)) để dùng lại nhiều lần mà không cần chép lại code.
• Đổi màu bút giữa các cạnh hoặc giữa các hình để tạo hoạ tiết nhiều màu.
• Kết hợp nhiều đa giác đồng tâm với kích thước tăng dần, xoay lệch một góc nhỏ mỗi vòng, để tạo hoa văn.
• Xem thêm 2 dự án thực hành mở rộng: vẽ hình tròn với bán kính bất kỳ bằng khối tự tạo và vẽ hình chữ nhật.