Trở về Mục lục cuốn sách
Tóm Tắt
A.1 Đồ họa Java 2 chiều
Phụ lục này đưa ra các ví dụ và bài tập minh họa cho tính năng đồ họa trong Java. Có một số cách tạo nên đồ họa trong Java; cách đơn giản nhất là dùng java.awt.Graphics. Sau đây là một ví dụ hoàn chỉnh:
import
java.awt.Canvas;import
java.awt.Graphics;import
javax.swing.JFrame;public class
MyCanvasextends
Canvas {public static void
main(String[] args) {// tạo một khung (frame)
JFrame frame =new
JFrame(); frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);// thêm một nền vẽ (canvas)
Canvas canvas =new
MyCanvas(); canvas.setSize(400, 400); frame.getContentPane().add(canvas);// hiển thị khung
frame.pack(); frame.setVisible(true
); }public void
paint(Graphics g) {// vẽ hình tròn
g.fillOval(100, 100, 200, 200); } }
Bạn có thể tải đoạn mã lệnh này về từ http://thinkapjava.com/code/MyCanvas.java.
Những dòng lệnh đầu có nhiệm vụ nhập các lớp mà ta cần từ java.awt và javax.swing.
MyCanvas mở rộng Canvas, nghĩa là một đối tượng MyCanvas là một kiểu Canvas mà cung cấp các phương thức để vẽ những đối tượng đồ họa.
Trong main, ta đã
- Tạo nên một JFrame, vốn là một cửa sổ có thể chứa nền vẽ (canvas), nút bấm (buttons), trình đơn (menu), cùng các thành phần cửa sổ khác;
- Tạo nên MyCanvas, ấn định bề rộng và chiều cao của nó, rồi thêm nó lên khung, sau đó
- Hiển thị khung này lên màn hình.
paint là một phương thức đặc biêt được kích hoạt khi MyCanvas cần được vẽ. Nếu bạn chạy mã lệnh này, bạn sẽ thấy một hình tròn đen trên nền xám.
A.2 Các phương thức Graphics
Để vẽ lên nền Canvas, bạn kích hoạt các phương thức thuộc đối tượng Graphics. Ví dụ trước đây sử dụng fillOval. Các phương thức khác gồm có drawLine, drawRect v.v. Bạn có thể đọc tài liệu của những phương thức này ở http://download.oracle.com/javase/6/docs/api/java/awt/Graphics.html.
Sau đây là nguyên mẫu của fillOval:
public void
fillOval(int
x,int
y,int
width,int
height)
Các tham số quy định một hình bao, vốn là hình chữ nhật bao lấy hình trái xoan được vẽ (xem phía dưới). Bản thân hình bao thì không được vẽ lên.
x và y quy định vị trí góc trái bên trên của hình bao trong hệ tọa độ đồ họa.
A.3 Hệ tọa độ
Có thể bạn đã quen thuộc với tọa độ Đề-các trong không gian hai chiều; trong đó mỗi vị trí được xác định bằng một tọa độ x (khoảng cách dọc trục x) và một tọa độ y. Theo quy ước, các tọa độ Đề-các tăng dần qua bên phải và lên phía trên, như ở hình vẽ sau.
Theo quy ước, hệ thống đồ họa máy tính sử dụng một hệ tọa độ trong đó gốc ở góc trái trên, và hướng dương của trục y chỉ xuống. Java tuân theo quy ước này.
Các tọa độ đều được đo bằng điểm ảnh; mỗi điểm ảnh tương ứng với một chấm trên màn hình. Một màn hình thường có bề rộng khoảng 1000 điểm ảnh. Các tọa độ đều luôn là số nguyên. Nếu muốn dùng một giá trị phẩy động để làm tọa độ, bạn phải làm tròn giá trị này (xem Mục 3.2).
A.4 Màu sắc
Để chọn màu của một hình, bạn hãy kích hoạt setColor lên đối tượng đồ họa:
g.setColor(Color.red);
setColor thay đổi màu hiện hành; mọi thứ được vẽ đều bằng màu hiện hành.
Color.red là một giá trị cho bởi lớp Color; để dùng màu này bạn phải nhập java.awt.Color. Các màu khác gồm có:
black blue cyan darkGray gray lightGray magenta orange pink red white yellow
Bạn có thể tạo nên những màu khác bằng cách chỉ định các thành phần đỏ, lục, lam (RGB). Xem http://download.oracle.com/javase/6/docs/api/java/awt/Color.html.
Bạn có thể điều khiển màu nền của Canvas bằng cách kích hoạt Canvas.setBackground.
A.5 Chuột Mickey
Giả dụ ta muốn vẽ một chú chuột Mickey. Ta có thể dùng hình oval như vừa vẽ làm khuôn mặt, sau đó thêm vào đôi tai. Để làm cho mã lệnh dễ đọc hơn, hãy dùng Rectangle (hình chữ nhật) để biểu diễn các hình bao.
Sau đây là một phương thức nhận vào một Rectangle rồi kích hoạt fillOval.
public void
boxOval(Graphics g, Rectangle bb) { g.fillOval(bb.x, bb.y, bb.width, bb.height); }
Và sau đây là một phương thức để vẽ Mickey:
public void
mickey(Graphics g, Rectangle bb) { boxOval(g, bb);int
dx = bb.width/2;int
dy = bb.height/2; Rectangle half =new
Rectangle(bb.x, bb.y, dx, dy); half.translate(-dx/2, -dy/2); boxOval(g, half); half.translate(dx*2, 0); boxOval(g, half); }
Dòng thứ nhất vẽ khuôn mặt. Ba dòng tiếp theo tạo nên một hình chữ nhật nhỏ hơn làm đôi tai. Ta dịch chuyển hình chữ nhật này lên trên và bên trái để tạo thành tai thứ nhất, sau đó dịch sang phải làm tai thứ hai.
Kết quả trông sẽ như sau:
Bạn có thể tải mã lệnh về từ http://thinkapjava.com/code/Mickey.java.
A.6 Thuật ngữ
- tọa độ:
- Một biến hay giá trị quy định vị trí trong một cửa sổ đồ họa hai chiều.
- điểm ảnh:
- Đơn vị đo tọa độ.
- hình bao:
- Một cách thông thường quy định tọa độ của một vùng chữ nhật.
A.7 Bài tập
Bài tập 1 Vẽ lá cờ Nhật Bản, một hình tròn đỏ trên nền trắng có bề rộng hơn so với chiều cao.
Bài tập 2 Sửa lại Mickey.java để vẽ những đôi tai trên cả đôi tai, rồi tai mới trên tai này, và cứ như vậy đến khi tai nhỏ nhất có bề rộng chỉ 3 điểm ảnh. Kết quả dường như giống Hươu Mickey:
Gợi ý: bạn chỉ được bổ sung hay sửa đổi một vài dòng lệnh.
Bạn có thể tải về một lời giải từ http://thinkapjava.com/code/MickeySoln.java.
Bài tập 3
- Tải về http://thinkapjava.com/code/Moire.java rồi nhập nó vào môi trường phát triển hiện hành.
-
Đọc phương thức
paint và phác thảo công dụng mà bạn phán đoán. Bây giờ chạy phương thức này. Bạn có thấy kết quả như dự đoán không? Một lời giải thích cho điều này có thể xem ở http://en.wikipedia.org/wiki/Moire_pattern.
- Sửa lại chương trình để khoảng cách giữa các đường tròn rộng ra hoặc hẹp lại. Xem có gì trong hình ảnh.
- Sửa lại chương trình để các đường tròn đồng tâm được vẽ từ tâm màn hình, như ở hình dưới, bên trái. Khoảng cách giữa các đường tròn cần phải đủ nhỏ để thấy được sự giao hòa Moiré .
- Hãy viết một phương thức có tên radial để vẽ một loạt các đường thẳng đồng quy như ở hình (phải), nhưng phải đủ sát nhau để tạo nên một dạng mẫu Moiré.
- Gần như mọi loại dạng mẫu đồ họa cũng có thể tạo nên dạng mẫu giao hòa kiểu Moiré. Hãy nghịch chơi và quan sát sản phẩm bạn tạo nên.
Đánh giá:
Share this:
Thích bài này:
Thích
Đang tải…