Scratch là một môi trường lập trình trực quan, thân thiện với người mới bắt đầu, đặc biệt là trẻ em và những người chưa có nền tảng lập trình. Một trong những kỹ năng cơ bản nhưng vô cùng quan trọng trong Scratch chính là cách vẽ các hình dạng, trong đó hình tròn là một trong những hình cơ bản và thường xuyên được sử dụng. Việc nắm vững cách vẽ hình tròn không chỉ giúp bạn tạo ra các đồ họa đẹp mắt mà còn mở ra cánh cửa cho những dự án phức tạp hơn như trò chơi, hoạt hình và các mô phỏng khoa học.
Trong bài viết này, chúng ta sẽ đi sâu vào cách vẽ hình tròn Scratch từ những bước cơ bản nhất, tới các kỹ thuật nâng cao, tối ưu hoá mã lệnh, và một số mẹo hay để tránh những lỗi thường gặp. Bài viết sẽ cung cấp:
Kiến thức nền tảng về Scratch và công cụ vẽ.
Các phương pháp vẽ hình tròn truyền thống (dùng vòng lặp “repeat”).
Cách vẽ hình tròn mượt mà bằng lệnh “pen down” và “pen up”.
Sử dụng biến và công thức toán học để vẽ các vòng tròn có bán kính thay đổi.
Tạo hiệu ứng động cho hình tròn (điều chỉnh màu, độ dày, tốc độ quay).
Kỹ thuật tối ưu để giảm độ trễ và tăng hiệu suất.
Ứng dụng thực tế: vẽ bánh xe, đồng hồ, biểu đồ, và hoạt ảnh.
Một dự án mẫu hoàn chỉnh: “Clock Analog” (đồng hồ analog) sử dụng hình tròn.
Những lỗi phổ biến và cách khắc phục.
Tài nguyên học tập thêm và cộng đồng Scratch.
Hãy cùng bắt đầu hành trình khám phá cách vẽ hình tròn Scratch một cách chi tiết và đầy đủ nhất!
1. Kiến thức nền tảng về Scratch và công cụ vẽ
1.1. Scratch là gì?
Scratch là một môi trường lập trình khối (block-based) được phát triển bởi MIT Media Lab. Thay vì viết mã bằng ngôn ngữ văn bản, người dùng sẽ kéo và thả các khối lệnh để tạo chương trình. Điều này giúp giảm bớt rào cản ngôn ngữ và tập trung vào tư duy logic, sáng tạo.
1.2. Thành phần chính của giao diện Scratch
Stage (Sân khấu): Nơi hiển thị kết quả của chương trình.
Sprites (Nhân vật): Các đối tượng di chuyển, thay đổi hình dạng.
Blocks (Khối lệnh): Các mệnh đề lập trình được chia thành các danh mục như Motion, Looks, Sound, Events, Control, Sensing, Operators, Variables, My Blocks.
Pen Extension (Tiện ích bút vẽ): Cho phép vẽ trực tiếp lên Stage bằng các lệnh “pen down”, “pen up”, “set pen color”, “change pen size”…
1.3. Tại sao dùng Pen Extension để vẽ hình tròn?
Pen Extension cung cấp một công cụ vẽ mạnh mẽ, cho phép bạn tạo ra các đường thẳng, vòng tròn, hoặc bất kỳ hình dạng nào bằng cách di chuyển sprite và để lại dấu vết. Khi vẽ hình tròn, chúng ta sẽ:
Di chuyển sprite theo một vòng tròn bằng cách điều chỉnh góc quay và bước di chuyển.
Cuối cùng pen up (bút lên) để ngừng vẽ.
2. Phương pháp vẽ hình tròn truyền thống (dùng vòng lặp “repeat”)
2.1. Nguyên lý cơ bản
Một vòng tròn có thể được mô phỏng bằng cách di chuyển sprite một khoảng cách ngắn, sau đó quay một góc nhỏ, lặp lại quá trình này nhiều lần cho tới khi hoàn thành một vòng 360 độ. Công thức đơn giản:
Bước di chuyển (step) = 2 × π × r / n Góc quay (angle) = 360 / n
Trong đó:
– r = bán kính của vòng tròn.
– n = số đoạn (số lần lặp) – càng lớn thì vòng tròn càng mượt.
2.2. Bước thực hiện trong Scratch
Thêm Pen Extension: Vào mục “Extensions” → chọn “Pen”.
Tạo sprite mới (có thể là một sprite trống hoặc một hình bất kỳ).
Thiết lập vị trí ban đầu: Đặt sprite ở vị trí trung tâm hoặc vị trí mong muốn.
Sử dụng khối lệnh:
when green flag clicked
clear
go to x: (0) y: (0) // Đặt sprite ở trung tâm
pen down
set pen size to (3) // Độ dày bút
repeat (360) // Hoặc (n) tùy ý move (1) steps // Bước di chuyển tùy bán kính turn cw (1) degrees
end
pen up
Giải thích:
move (1) steps: Mỗi bước di chuyển tương đương với một phần của chu vi. Bạn có thể tính giá trị cụ thể dựa trên bán kính muốn vẽ.
turn cw (1) degrees: Quay theo chiều kim đồng hồ 1 độ. Nếu muốn quay ngược chiều kim đồng hồ, dùng “turn ccw”.
2.3. Tính toán bước di chuyển dựa trên bán kính
Giả sử bạn muốn vẽ một vòng tròn bán kính r = 50 pixel và muốn dùng n = 120 đoạn (đủ mượt). Ta tính:
Chu vi = 2 × π × r ≈ 2 × 3.1416 × 50 ≈ 314.16 pixel.
Bước di chuyển = chu vi / n ≈ 314.16 / 120 ≈ 2.62 pixel.
Góc quay = 360 / n = 3°.
Trong Scratch, không thể di chuyển 2.62 pixel một cách chính xác, nhưng bạn có thể làm tròn thành 3 pixel và tăng n lên để bù lại.
when green flag clicked
clear
go to x: (0) y: (0)
pen down
set pen size to (3)
repeat (120) move (3) steps turn cw (3) degrees
end
pen up
Kết quả sẽ là một vòng tròn khá mượt.
3. Vẽ hình tròn mượt mà bằng lệnh “pen down” và “pen up”
3.1. Tối ưu hoá số đoạn (n)
Số đoạn càng lớn, hình tròn càng mượt, nhưng đồng thời thời gian vẽ cũng tăng. Đối với hầu hết các dự án giáo dục, n = 60 ~ 120 là đủ. Nếu muốn vẽ hình tròn cực kỳ mượt (độ chính xác cao), bạn có thể lên tới n = 360 (quay 1 độ mỗi lần).
3.2. Đặt độ dày và màu bút
Bạn có thể thay đổi màu và độ dày của bút để tạo hiệu ứng khác nhau:
set pen color to #ff0000 // Đỏ
set pen size to (5)
Hoặc dùng biến để thay đổi màu động:
set pen color to (pick random (0) to (200))
3.3. Vẽ vòng tròn có viền và tô màu
Scratch không hỗ trợ tô màu trực tiếp cho hình vẽ bằng Pen. Tuy nhiên, bạn có thể mô phỏng bằng cách:
Vẽ vòng tròn đầu tiên với độ dày lớn (để tạo viền).
Vẽ lại vòng tròn sau với độ dày nhỏ hơn và màu nền (để tạo phần trong).
// Vẽ viền
set pen color to (black)
set pen size to (8)
repeat (120) ... // Vòng tròn // Vẽ phần trong
set pen color to (yellow)
set pen size to (4)
repeat (120) ... // Vòng tròn
Kết quả là một vòng tròn có viền đen và phần trong màu vàng.
4. Sử dụng biến và công thức toán học để vẽ các vòng tròn có bán kính thay đổi
when green flag clicked
clear
set radius v to (80) // Bán kính mong muốn
set n v to (120) // Số đoạn
set step v to ((2 pi radius) / n) // Chu vi / n
set angle v to (360 / n) go to x: (0) y: (0)
pen down
set pen size to (3)
repeat (n) move (step) steps turn cw (angle) degrees
end
pen up
Lưu ý: Scratch không có hằng số pi sẵn, nhưng bạn có thể tạo một biến pi và đặt giá trị 3.1416.
4.3. Vòng tròn dần dần thay đổi bán kính (hiệu ứng “concentric circles”)
when green flag clicked
clear
set maxRadius v to (150)
set minRadius v to (30)
set stepRadius v to (10) repeat ((maxRadius - minRadius) / stepRadius + 1) set radius v to (minRadius + (stepRadius (repeat count - 1))) // Tính step và angle dựa trên radius set n v to (120) set step v to ((2 pi radius) / n) set angle v to (360 / n) go to x: (0) y: (0) pen down repeat (n) move (step) steps turn cw (angle) degrees end pen up
end
Kết quả là một loạt vòng tròn đồng tâm, mỗi vòng có bán kính tăng dần.
5. Tạo hiệu ứng động cho hình tròn
5.1. Quay vòng tròn (động)
Bạn có thể làm cho sprite quay liên tục trong khi vẽ, tạo ra hiệu ứng vòng tròn xoay:
when green flag clicked
clear
go to x: (0) y: (0)
pen down
set pen size to (2) forever repeat (120) move (3) steps turn cw (3) degrees end // Quay lại vị trí ban đầu go to x: (0) y: (0)
end
5.2. Thay đổi màu theo thời gian
when green flag clicked
clear
go to x: (0) y: (0)
pen down
set pen size to (3) repeat (120) set pen color to (pick random (0) to (200)) move (3) steps turn cw (3) degrees
end
pen up
Mỗi đoạn sẽ có màu ngẫu nhiên, tạo ra vòng tròn “rainbow”.
5.3. Hiệu ứng “pulse” (điểm nhấn)
Bạn có thể thay đổi độ dày bút trong quá trình vẽ để tạo cảm giác nhịp tim:
when green flag clicked
clear
go to x: (0) y: (0)
pen down repeat (120) set pen size to (pick random (1) to (6)) move (3) steps turn cw (3) degrees
end
pen up
6. Kỹ thuật tối ưu để giảm độ trễ và tăng hiệu suất
Giảm số lần lặp: Nếu không cần quá mượt, dùng n = 60 (quay 6 độ mỗi lần) sẽ nhanh hơn.
Tắt hiển thị sprite khi vẽ: Nếu sprite không cần hiển thị, ẩn nó (hide) để giảm tải.
Sử dụng “clear” một lần: Đặt clear ở đầu chương trình, tránh gọi nhiều lần trong vòng lặp.
Tránh thay đổi màu, độ dày quá thường xuyên: Mỗi lần thay đổi thuộc tính bút sẽ tốn thời gian, nên nhóm lại.
Sử dụng biến để lưu giá trị tính toán: Tránh tính lại công thức trong mỗi vòng lặp.
7. Ứng dụng thực tế: Vẽ bánh xe, đồng hồ, biểu đồ và hoạt ảnh
Cách Vẽ Hình Tròn Scratch
Có thể bạn quan tâm: Cách Vẽ Hình Quả Táo Đẹp Và Chi Tiết: Hướng Dẫn Từ Cơ Bản Đến Nâng Cao
7.1. Vẽ bánh xe
Vòng tròn lớn (đế bánh xe).
Vòng tròn nhỏ (trục).
Đường kính (spokes) bằng cách vẽ các đường thẳng từ trung tâm ra ngoài.
when green flag clicked
clear
go to x: (0) y: (0)
pen down
set pen size to (4)
repeat (120) // Vòng tròn lớn move (4) steps turn cw (3) degrees
end // Vẽ trục
pen up
go to x: (0) y: (0)
pen down
repeat (8) // 8 spokes move (80) steps pen up go to x: (0) y: (0) pen down turn cw (45) degrees
end pen up
7.2. Đồng hồ analog
Vòng tròn nền.
Các chỉ giờ, phút, giây (được vẽ bằng các sprite khác hoặc bằng Pen).
Cập nhật vị trí chỉ theo thời gian thực.
Bước 1: Vẽ vòng tròn nền (theo phần 2).
Bước 2: Tạo ba sprite cho kim giờ, phút, giây, mỗi sprite có hình dạng mảnh dài.
Bước 3: Sử dụng khối “when green flag clicked” để tính góc:
set hourAngle v to ((hour 30) + (minute / 2)) // 360/12 = 30 độ mỗi giờ
set minuteAngle v to (minute 6) // 360/60 = 6 độ mỗi phút
set secondAngle v to (second 6) point in direction (90) // Đặt hướng mặc định
turn cw (hourAngle) degrees // Kim giờ
Lặp lại mỗi giây để cập nhật.
7.3. Biểu đồ tròn (pie chart)
Chia vòng tròn thành các phần theo tỉ lệ phần trăm.
Sử dụng “pen” để vẽ từng cung và tô màu.
when green flag clicked
clear
go to x: (0) y: (0)
pen down
set pen size to (0) // Không cần viền
set total v to (100) // Tổng phần trăm
set values v to (list 30 20 25 25) // Các phần
set colors v to (list red green blue yellow) repeat (length of values v) set value v to (item (repeat count) of values v) set angle v to ((value / total) 360) set pen color to (item (repeat count) of colors v) // Vẽ cung repeat (angle) move (1) steps turn cw (1) degrees end // Quay lại trung tâm pen up go to x: (0) y: (0) pen down
end
pen up
7.4. Hoạt ảnh “bong bóng” (bubble animation)
Tạo sprite hình tròn (hoặc vẽ bằng Pen).
Thay đổi kích thước (scale) và độ trong suốt (ghost) theo thời gian để tạo hiệu ứng phồng lên và tan biến.
when green flag clicked
forever create clone of myBubble v wait (0.5) seconds
end when I start as a clone go to x: (pick random (-200) to (200)) y: (pick random (-150) to (150)) set size to (10) % repeat (20) change size by (5) % change ghost effect by (-5) // giảm độ trong suốt wait (0.05) seconds end delete this clone
8. Dự án mẫu: Đồng hồ analog hoàn chỉnh
8.1. Thành phần dự án
Sprite 1: “ClockFace” – Vẽ vòng tròn nền và các số.
Sprite 2: “HourHand” – Kim giờ.
Sprite 3: “MinuteHand” – Kim phút.
Sprite 4: “SecondHand” – Kim giây.
8.2. Các bước thực hiện
Bước 1: Vẽ nền đồng hồ
when green flag clicked
clear
go to x: (0) y: (0)
pen down
set pen size to (6)
set pen color to (black)
repeat (120) move (5) steps turn cw (3) degrees
end
pen up // Vẽ các số
repeat (12) go to x: (0) y: (0) move (80) steps pen down write (join (repeat count) ) pen up turn cw (30) degrees
end
Bước 2: Đặt kim giờ
when green flag clicked
forever set hour v to (current hour) // Scratch không có hàm giờ, dùng extension thời gian hoặc biến set minute v to (current minute) set second v to (current second) // Tính góc set hourAngle v to ((hour mod 12) 30 + (minute / 2)) set minuteAngle v to (minute 6) set secondAngle v to (second 6) // Cập nhật kim point in direction (90) // Đặt hướng mặc định turn cw (hourAngle) degrees // Đặt độ dài và độ dày của sprite (hoặc dùng pen) // Tương tự cho kim phút và giây wait (1) seconds
end
Lưu ý: Để lấy thời gian thực, bạn có thể dùng “Timer” kết hợp với các khối “ask” hoặc “Extensions → Text to Speech” để cập nhật thời gian.
Cách Vẽ Hình Tròn Scratch
Bước 3: Kiểm tra và tinh chỉnh
Đảm bảo kim giờ không bị che phủ bởi kim phút.
Thêm “ghost effect” cho kim giây để tạo hiệu ứng mờ.
Thêm âm thanh “tick” mỗi khi kim giây di chuyển.
8.3. Kết quả
Bạn sẽ có một đồng hồ analog hoạt động liên tục, với vòng tròn nền và các kim quay chính xác. Đây là một ví dụ thực tế cho thấy cách vẽ hình tròn Scratch không chỉ là vẽ đồ họa tĩnh mà còn có thể tích hợp vào các hệ thống thời gian thực và hoạt ảnh phức tạp.
9. Những lỗi phổ biến và cách khắc phục
Lỗi
Mô tả
Cách khắc phục
Vòng tròn bị mảnh, không mượt
Số đoạn (n) quá ít, góc quay quá lớn.
Tăng n (ví dụ 120 hoặc 360) hoặc giảm góc quay.
Vòng tròn không đóng kín
Tổng góc quay không đủ 360 độ (do làm tròn).
Đảm bảo angle = 360 / n. Nếu dùng vòng lặp repeat (n), tính góc dựa trên n.
Bản vẽ lệch vị trí
Sprite không quay quanh trung tâm đúng.
Đặt sprite ở trung tâm trước khi bắt đầu vẽ (go to x: (0) y: (0)).
Màu bút không thay đổi
Không đặt pen down trước khi thay đổi màu.
Đặt pen down rồi mới set pen color.
Độ trễ khi vẽ nhiều vòng tròn
Vòng lặp quá lớn, không tối ưu.
Giảm n, ẩn sprite (hide), hoặc vẽ ít vòng tròn hơn.
Không có Pen Extension
Quên thêm extension.
Vào “Extensions” → chọn “Pen”.
Vòng tròn bị “bám” vào rìa Stage
Bán kính quá lớn, vượt ra ngoài Stage.
Giảm bán kính hoặc thay đổi vị trí trung tâm.
10. Tài nguyên học tập thêm và cộng đồng Scratch
Scratch Wiki – Thông tin chi tiết về các khối lệnh và Pen Extension: https://en.scratch-wiki.info/
ScratchEDU – Các khóa học miễn phí, bao gồm dự án vẽ hình.
YouTube Channels: “Griffpatch”, “Coding with Scratch”, “Scratch Team” – có nhiều video hướng dẫn vẽ hình tròn và các dự án nâng cao.
Cộng đồng Scratch – Tham gia các “studios” như “Geometry with Scratch” để chia sẻ và học hỏi.
Sách: “Scratch Programming Playground” (by Al Sweigart) – chương 3 tập trung vào đồ họa và Pen.
Extensions: “Timer”, “Music”, “Video Sensing” – có thể kết hợp với vẽ hình tròn để tạo dự án đa phương tiện.
Kết luận
Việc vẽ hình tròn trong Scratch không chỉ là một bài tập lập trình cơ bản mà còn là nền tảng để xây dựng các dự án sáng tạo, từ đồ họa tĩnh đến hoạt ảnh động phức tạp. Bằng cách hiểu rõ nguyên lý vòng tròn (chu vi, góc quay), sử dụng Pen Extension một cách thông minh, và áp dụng các kỹ thuật tối ưu hoá, bạn có thể:
Tạo ra những vòng tròn mượt mà, có màu sắc và độ dày linh hoạt.
Vẽ các hình dạng phức tạp như bánh xe, đồng hồ, biểu đồ.
Kết hợp với các sprite và biến để xây dựng các ứng dụng thực tế như đồng hồ analog, trò chơi, hoặc biểu đồ dữ liệu.
Khắc phục các lỗi thường gặp và cải thiện hiệu suất.
Hãy thực hành ngay bằng cách tạo một dự án Scratch mới, thêm Pen Extension, và thử các đoạn mã trên. Khi đã thành thạo, bạn sẽ cảm thấy tự tin hơn khi mở rộng sang các hình dạng khác như elip, đa giác, và thậm chí là các hình 3D mô phỏng. Chúc bạn sáng tạo và thành công trong hành trình lập trình Scratch!
