Giáo trình hướng dẫn tìm hiểu và sử dụng công cụ thuộc tính Rounded Rectangle Radius trong thiết kế Flash phần 5 potx

THIẾT KẾ WEB – TỰ HỌC MACROMEDIA FLASH 5.0 BẰNG HÌNH ẢNH BIÊN SOẠÏN : KS PHẠM QUANG HUY

 Nhấp chọn tiếp vào nút Insert a target path tại góc phải dưới của bảng Object Actions.
Sau đó hộp thoại Insert Target xuất hiện.

 Nhấp chọn vào đoạn phim có tên DOM SANG sau đó nhấp chọn vào nút OK.

 Khi đó các câu lệnh trong bảng Object Actions cho đối tượng nút sẽ là:
on (release) {
tellTarget ("DOM SANG") {
}
}

THẾ GIỚI ĐỒ HỌA – TỦ SÁCH STK GIÁO TRÌNH ĐIỆN TỬ : SỬ DỤNG FLASH 5.0

126
THIẾT KẾ WEB – TỰ HỌC MACROMEDIA FLASH 5.0 BẰNG HÌNH ẢNH BIÊN SOẠÏN : KS PHẠM QUANG HUY


 Bây giờ con trỏ đang ở dòng lệnh tellTarget (“DOM SANG”) { nhấp chuột tiếp vào
lệnh Play trong bảng danh sách lệnh Basic Actions. Khi đó bạn sẽ các câu lệnh như sau:
on (release) {
tellTarget ("DOM SANG") {
play ();
}
}



THẾ GIỚI ĐỒ HỌA – TỦ SÁCH STK GIÁO TRÌNH ĐIỆN TỬ : SỬ DỤNG FLASH 5.0

127
THIẾT KẾ WEB – TỰ HỌC MACROMEDIA FLASH 5.0 BẰNG HÌNH ẢNH BIÊN SOẠÏN : KS PHẠM QUANG HUY



TẠ O FILLING PILL
Trong bài tập thực hành này bạn sẽ tạo ra một đối tượng dạng hình ống và vùng màu sẽ
đổ từ trái sang để làm đầy đối tượng hình ống này. Các bạn sẽ dùng nhiều lần công cụ
Rectangle Tool và pha chế màu Gradient. Vì các đối tượng có dạng hình trụ hoặc hình ống nên
bạn dùng màu tô gradient sẽ trông thực hơn. Các bước tiến hành như sau:

Nhấp chọn vào trìh đơn File > New để tạo mới file nếu bạn chưa có file mới trong vùng
làm việc. Nhấp chuột vào trình đơn Insert > New Symbol để tạo một symbol graphic. Chọn các
thuộc tính như sau vào trong hộp thoại Symbol Properties.

 Nhấp chọn vào công cụ Rectangle Tool và chọn vào vùng công cụ Round Rectangle
Radius. Nhập giá trò 20 points vào trong hộp thoại Rectangle Settings để vẽ hình chữ
nhật có các góc bo thật tròn

 Nhấp chọn màu viền cho đối tượng là màu trắng, nhấp chọn vào vùng màu tô chọn màu
gradient. Bạn nên chọn màu gradient sáng có trong bảng phối màu như sau :
 Nhấp chọn trên trình đơn Window > Panels
> Fill. Nhấp chọn tiếp vào mục Linear
Gradient, tạo các con trượt màu (bạn có thể
xem trong các bài tập trước cách pha màu tô
Gradient) để có được các màu như hình bên.
Con trượt màu bên phải (4) là màu xanh
đen, con trượt kế đó (3) có giá trò màu hex
là #0068D0. con trượt màu (2) màu trắng,
con trượt bên trái (1) giá trò hex là #0060FF.

1 2 3 4
Con trượt màu trắng

THẾ GIỚI ĐỒ HỌA – TỦ SÁCH STK GIÁO TRÌNH ĐIỆN TỬ : SỬ DỤNG FLASH 5.0
86
THIẾT KẾ WEB – TỰ HỌC MACROMEDIA FLASH 5.0 BẰNG HÌNH ẢNH BIÊN SOẠÏN : KS PHẠM QUANG HUY


 Vẽ vào vùng làm việc đối tượng hình chữ nhật thẳng đứng, sau đó dùng công cụ Rotate
của công cụ Arrow Tool để xoay đối tượng cho nó nằm ngang.



Đối tượng sau khi xoay 90
0
 Sau đó dùng công cụ Scale thu nhỏ kích thước
đối tượng này.

 Nhấp chuột trở lại Scene1 và chọn trên trình
đơn Modify > Movie, nhập vào mục
Dimension kích thước 216 x 72 px.

 Nhấp phải chuột vào biểu tượng ảnh graphic Ong nho
trong thư viện và chọn lệnh Duplicate. Nhập vào tên
Khung rong trong hộp thoại Symbol Propeties.


 Nhấp đúp chuột vào cửa sổ thư viện của đối tượng vừa sao chép để hiệu chỉnh, sau đó

nhấp đúp chuột vào đối tượng để chọn cả màu đường viền lẫn màu tô của đối tượng
Khung rong này.

THẾ GIỚI ĐỒ HỌA – TỦ SÁCH STK GIÁO TRÌNH ĐIỆN TỬ : SỬ DỤNG FLASH 5.0
87
THIẾT KẾ WEB – TỰ HỌC MACROMEDIA FLASH 5.0 BẰNG HÌNH ẢNH BIÊN SOẠÏN : KS PHẠM QUANG HUY


 Nhấp chọn tiếp vào trình đơn Window > Panels > Stroke, nhấp chọn vào trong hộp
Stroke height để chọn giá trò là 3. Lúc này bạn hãy chọn màu cho đường viền là màu
xanh đậm.

 Nhấp chuột vào vùng màu tô bên trong màu viền và xoá đối tượng này đi.

 Tạo mới symbol có tên Thanh ong bằng cách nhấn phím Ctrl + F8 trong hộp thoại
Symbol Properties chọn Graphic. Dùng công cụ Rectangle Tool và nhấp chuột vào
công cụ Round Rectangle Radius, trong hộp thoại Rectangle Settings nhập giá trò 0.

 Màu tô trên đối tượng này giống như màu trước đó và xoá màu viền đối tượng sau khi vẽ.
Vẽ hình chữ nhật thẳng đứng sau đó dùng công cụ Rotate để xoay đối tượng theo phương
nằm ngang.



Dùng công cụ Rotate xoay đối tượng nằm ngang
 Bây giờ bạn nhấp chọn lại công cụ Rectangle
Tool và nhấp chọn vào vùng công cụ Round
Rectangle Radius. Sau đó xác đònh giá trò trong
hộp thoại Rectangle Settings là 20.

THẾ GIỚI ĐỒ HỌA – TỦ SÁCH STK GIÁO TRÌNH ĐIỆN TỬ : SỬ DỤNG FLASH 5.0
88
THIẾT KẾ WEB – TỰ HỌC MACROMEDIA FLASH 5.0 BẰNG HÌNH ẢNH BIÊN SOẠÏN : KS PHẠM QUANG HUY


 Lặp lại các bước trên để tạo được hình như sau, màu tô của đối tượng là màu trắng.

 Bây giờ bạn hãy di chuyển đối tượng này đặt chính xác lên trên đối tượng Thanh ong.

Di chuyển đối tượng vào đúng vi trí giữa
 Bạn hãy xác đònh cho đối tượng nằm giữa đối tượng hình chữ nhật, sau đó xoá đối tượng
có lớp màu trắng để hình chữ nhật bây giờ trông giống như sau.

Đối tượng sau khi xoá lớp màu trắng
 Dùng công cụ Scale kéo nhỏ kích thước của đối tượng, nhấp chọn biểu tượng có tên
Khung rong vào trong vùng làm việc và đặt lên đối tượng khung nằm ngang sao cho đối
tượng Khung rong là đường viền bên trong của đối tượng này.

Dùng công cụ Scale kéo kích thước của đối tượng Khung rong sao cho
nó có kích thước bằn
g
với kích thước của đối tượn
g
màu trắn
g
.

 Bây giờ bạn hãy tạo mới graphic có tên Cham tron (nhấn phím Ctrl + F8) và dùng công
cụ Oval Tool vẽ vào vùng tròn có màu tô Gradient như sau, bạn hãy xoá đường màu
viền.

THẾ GIỚI ĐỒ HỌA – TỦ SÁCH STK GIÁO TRÌNH ĐIỆN TỬ : SỬ DỤNG FLASH 5.0
89
THIẾT KẾ WEB – TỰ HỌC MACROMEDIA FLASH 5.0 BẰNG HÌNH ẢNH BIÊN SOẠÏN : KS PHẠM QUANG HUY


 Nhấp chọn trong trình đơn Window > Panels > Fill để hiển thò bảng Fill. Khi bạn chọn
màu tô gradient sẽ có hai con trượt màu hai bên trong bảng Fill.

 Nhấp chọn vào phía bên trái hoặc phải của bất kỳ con trượt nào và kéo sang trái hay phải
để thêm vào một con trượt khác - con trượt thứ ba. Muốn xoá một con trượt màu bạn chỉ
cần kéo con trượt đó xuống bên dùi đáy bảng Fill.

1 2 3
Con trượt bên trái (1) chọn màu trắng, con trượt giữa (2) chọn màu đỏ có giá trò màu hexa
là #F20000 và con trượt bên phải (3) chọn màu đen.
 Sau đó bạn hãy vẽ vào một vòng tròn có kích thước rất nhỏ, dùng công cụ Zoom Tool
phóng lớn vùng làm việc lên đến 900% và vẽ đối tượng như hình bên dưới.

 Bây giờ bạn hãy tạo mới một symbol graphic có tên Tru dung (nhấn phím Ctrl + F8) và
dùng công cụ Rectangle Tool, nhấp chọn vào vùng công cụ Round Rectangle Radius.
Sau đó xác đònh giá trò trong hộp thoại Rectangle Settings là 0.

THẾ GIỚI ĐỒ HỌA – TỦ SÁCH STK GIÁO TRÌNH ĐIỆN TỬ : SỬ DỤNG FLASH 5.0
90
THIẾT KẾ WEB – TỰ HỌC MACROMEDIA FLASH 5.0 BẰNG HÌNH ẢNH BIÊN SOẠÏN : KS PHẠM QUANG HUY



 Vẽ vào vùng làm việc đối tượng hình trụ thẳng đứng có kích
thước nhỏ, dùng công cụ Zoom Tool để phóng lớn vùng làm

việc để vẽ đối tượng như hình bên. Màu viền đối tượng không
có, màu tô giống với màu của các hình trụ trước đó.
 Nhấp chuột vào nút Scene1 để trở về vùng làm việc chính.

 Nhấp chuột vào công cụ Rectangle Tool và vẽ vào
vùng làm việc đối tượng hình vuông có màu đỏ sậm
(giá trò màu hexa là #D00000), không có màu viền.

 Nhấp chuột vào frame 20 và nhấn phím F6, nhấp chuột trở lại keyframe đầu tiên và chọn
trên trình đơn Window > Panels > Frame. Trong mục Tweening chọn chế độ Shape.


 Nhấp chuột vào keyframe 20 và dùng công cụ Scale kéo kích thước của đối tượng hình
vuông dài ra để trở thành hình chữ nhật.

Đối tượng đang ở chế độ phóng lớn
THẾ GIỚI ĐỒ HỌA – TỦ SÁCH STK GIÁO TRÌNH ĐIỆN TỬ : SỬ DỤNG FLASH 5.0
91
THIẾT KẾ WEB – TỰ HỌC MACROMEDIA FLASH 5.0 BẰNG HÌNH ẢNH BIÊN SOẠÏN : KS PHẠM QUANG HUY


 Bây giờ bạn hãy nhấn phím Enter để xem đoạn phim diễn hoạt.
 Tạo mới Layer thứ hai và kéo biểu tượng graphic Ong nho trong cửa sổ thư viện vào
trong vùng làm việc. Dùng công cụ Scale để xác đònh hai đối tượng trong hai lớp Layer
đều bằng nhau, đối tượng trong Layer có thể lớn hơn một chút.

Vò trí bên phải của đối tượng trong hai lớp Layer

Đối tượng tổng thể ở chế độ phóng đại 400%

 Nhấp chuột vào keyframe thứ nhất của Layer2 (đối tượng ống nhỏ dài) và chọn trong
trình đơn Window > Panels > Effect. Nhấp chọn hiệu ứng Alpha trong bảng Effect có
giá trò là 50 để làm mờ chế độ màu của đối tượng. Khi đó bạn sẽ thấy lớp màu đỏ bên
dưới trong lớp Layer1.

Đối tượng mờ dần khi chọn
hiệu ứng Alpha
 Nhấp chọn tạo mới Layer3 và kéo biểu tượng graphic Thanh ong vào trong vùng làm
việc. Thay đổi kích thước của đối tượng sao cho lỗ rỗng của nó lọt vào đúng vò trí của đối
tượng trong lớp Layer2.

 Tạo mới Layer4 và kéo biểu tượng Cham tron vào trong vùng làm việc từ cửa sổ thư
viện. Phóng lớn vùng làm việc và đặt đối tượng nằm bên trái thanh ngang, sao đó copy
THẾ GIỚI ĐỒ HỌA – TỦ SÁCH STK GIÁO TRÌNH ĐIỆN TỬ : SỬ DỤNG FLASH 5.0
92
THIẾT KẾ WEB – TỰ HỌC MACROMEDIA FLASH 5.0 BẰNG HÌNH ẢNH BIÊN SOẠÏN : KS PHẠM QUANG HUY


đối tượng chấm tròn này bằng cách nhấp đối tượng và nhấn phím Ctrl để tạo bản sao của
đối tượng. Đặt đối tượng chấm tròn thứ hai bên trái đối tượng chấm tròn thứ nhất.


 Kéo biểu tượng Tru dung trong cửa sổ thư viện vào vùng làm việc đặt kế bên hai chấm
tròn trước đó. Sao chép đối tượng này để có một bản sao cùng kích thước đặt kế bên như
trong hình sau.


 Lặp lại các bước trên cho góc bên phải của đối tượng thanh nằm ngang.
THẾ GIỚI ĐỒ HỌA – TỦ SÁCH STK GIÁO TRÌNH ĐIỆN TỬ : SỬ DỤNG FLASH 5.0
93