 |
|
Hiển thị một phần
của hình ảnh |
|
Để tạo hiệu ứng chuyển hình “bắt mắt” cho chương
trình Slide Show, ta có thể hiển thị dần dần từng
phần của hình ảnh. Đây là một "kỹ thuật nấu ăn" mang
tên clipping. |
|
Kỹ thuật clipping cho phép hiển thị một phần tùy ý
của hình ảnh. Chẳng hạn, với ảnh có dạng hình chữ
nhật, ta có thể cho nó lộ ra qua một hình tròn ở
giữa hình chữ nhật mà thôi. Thay đổi bán kính của
hình tròn này, ta sẽ được hiệu ứng ảnh dần dần mở ra
hoặc dần dần thu lại (tùy theo bán kính hình tròn
tăng hay giảm). |
|
Các bước cần thiết để hiển thị một phần của hình ảnh
là: |
1. Tạo đường viền của phần hình ảnh sẽ được hiển thị
(ví dụ, đường tròn).
2. Lấy đường viền làm thuộc tính clip của đối tượng
Graphics2D.
3. Hiển thị hình ảnh. Bạn sẽ thấy chỉ có phần hình
ảnh nằm trong đường viền hiện ra. |
|
Tạo đường viền |
|
Ta có thể dùng đối tượng Shape bất kỳ để xây dựng
đường viền (clipping path). Câu lệnh như sau tạo
đường viền hình elip: |
|
Ellipse2D clip = new
Ellipse2D.Float(); |
|
Ellipse2D là lớp trừu tượng (abstract class) nên ta
phải dùng lớp con trực tiếp của nó là
Ellipse2D.Double hay Ellipse2D.Float tùy bạn cần độ
chính xác đôi hay đơn. Ellipse2D.Float là đủ cho nhu
cầu của chương trình Slide Show. |
|
Sau khi có đối tượng elip, ta xác định biên của nó
bằng phương thức setFrame. Phương thức này nhận vào
các tham số là tọa độ góc trên, bên trái và chiều
rộng, chiều cao của hình chữ nhật ngoại tiếp với
elip. Ví dụ, để có elip với chiều rộng và chiều cao
lần lượt bằng nửa chiều rộng và chiều cao của ảnh
cần hiển thị, có tâm trùng với tâm của ảnh (H1), ta
dùng câu lệnh: |
clip.setFrame(palImage.getWidth()/4,palImage.getHeight()/4,
palImage.getWidth()/2,palImage.getHeight()/2); |
|
Trong đó, palImage là đối tượng JPanel dùng để hiển
thị hình ảnh. |
|
Hình 1 - Các tham số xác định đường viền elip |
|
Đặt thuộc tính clip cho
Graphics2D |
|
Ta dùng đường viền vừa tạo ra để thiết lập thuộc
tính clip cho đối tượng Graphics2D có được từ
JPanel. Có hai cách để làm điều này. |
|
Cách 1: Dùng câu lệnh |
|
gr2D.setClip(clip); |
|
Trong đó, gr2D là đối tượng Graphics2D và clip là
đối tượng Shape đã tạo ở bước 1. Phương thức này lấy
đối tượng clip đã cho làm đường viền của vùng vẽ. |
|
Cách 2: Dùng câu lệnh |
|
gr2D.clip(clip); |
|
Phương thức này thiết lập vùng vẽ là vùng giao của
đối tượng clip đã cho và vùng vẽ đã thiết lập từ
trước. Dùng cách này, bạn có thể tạo được vùng vẽ
rất phức tạp. |
|
Hiển thị hình ảnh |
|
Sau khi thiết lập vùng vẽ, ta chỉ cần vẽ ảnh ra như
thông thường: |
|
gr2D.drawImage(img,0,0,null); |
|
Trong đó, img là đối tượng Image có được từ việc đọc
tập tin hình ảnh. Bạn sẽ thấy hình ảnh chỉ hiển thị
trong vùng vẽ. |
|
Hình 2 minh họa trường hợp vẽ ảnh không có thiết lập
vùng vẽ và hình 3 là trường hợp có thiết lập vùng
vẽ. |
|
Hình 2 – Vẽ ảnh không có clipping path |
|
Hình 3 – Vẽ ảnh có clipping path |
|
Để làm biến mất dần dần một hình, chỉ việc thu nhỏ
dần dần vùng vẽ. Tương tự, để hiển thị dần dần một
hình, chỉ việc tăng kích thước vùng vẽ cho đến khi
nó phủ toàn bộ bề mặt của ảnh cần hiển thị. Trong
bài viết này, tôi dùng hình elip, tuy nhiên các bạn
có thể dùng bất cứ hình nào các bạn có thể nghĩ ra
để có kết quả "ấn tượng" hơn. Chúc các bạn có một
bữa ăn ngon! |
Đặng Trần Trí
NIIT Faculty |
|
Tham khảo thông tin về cuộc thi “Đầu Bếp Quán Lập
Trình” trong chuyên mục Quán lập trình trên Website
e-CHÍP (www.echip.com.vn)
hay trên các số e-CHÍP ra ngày thứ Ba và thứ Sáu
hàng tuần. |
|
Đầu
trang |