Adobe Flash CS4 cơ bản:

Flash CS4 - Bài 8: Rectangle Tool, tọa độ và kích thước

TTO - Trong bài này, bạn sẽ tìm hiểu về tọa độ và kích thước cũng như làm quen với công cụ Rectangle Tool.

Tọa độ và kích thước

Để định vị chính xác một đối tượng bất kỳ trên Stage, bạn cần thiết lập tọa độ cho đối tượng thông qua giá trị X và Y của đối tượng. Để thiết lập kích thước cho đối tượng, bạn điều chỉnh thông số W và H của đối tượng đó (W viết tắt chữ width: chiều rộng, H viết tắt chữ height: chiều cao).

Hệ thống trục tọa độ của Flash được xác định như sau: Trục X trùng với đường thẳng nằm ngang, Trục Y trùng với đường thẳng đứng. Gốc tọa độ X=0, Y=0 trùng với góc trên bên trái. Càng về bên phải gốc tọa độ, X sẽ có giá trị dương và giá trị này lớn dần khi đối tượng di chuyển sang phải. Càng xuống dưới gốc tọa độ, Y sẽ có giá trị dương và giá trị này lớn dần khi đối tượng di chuyển xuống dưới.

Nếu đối tượng không phải là symbol, góc trên bên trái của đối tượng sẽ được dùng để định vị đối tượng trên Stage. Tọa độ X, Y của đối tượng so với gốc tọa độ được tính theo điểm này.

Nếu đối tượng là symbol, Registration Point sẽ được dùng để định vị đối tượng trên Stage. Tọa độ X, Y của đối tượng so với gốc tọa độ được tính theo điểm Registration Point này. Trong hình minh họa dưới đây, Registration Point chính là điểm có dấu +.

Bạn thiết lập Registration Point bằng cách bấm chuột vào một trong 9 ô vuông bên phải dòng chữ Registration  tronghộp thoại Convert to Symbol.

Để thay đổi giá trị X, Y, W, H bạn bấm chuột vào các ô bên cạnh các chữ X, Y, W, H trên Property Inspector, kế đến bạn gõ giá trị mới vào và bấm phím Enter.

Bạn cũng có thể thay đổi các giá trị nói trên bằng cách kéo chuột như sau: Rê chuột vào ô có giá trị bạn muốn thay đổi, khi nhìn thấy chuột biến thành bàn tay có mũi tên hai chiều trên ngón trỏ xuất hiện, kéo chuột sang phải hoặc sang trái và nhìn thấy kết quả cập nhật ngay trên Stage.

Nếu muốn giữ nguyên tỉ lệ kích thước W và H, bạn bấm vào sợi dây xích để khóa tỉ lệ cố định. Trong trường hợp mở khóa. Giá trị W và H sẽ thay đổi độc lập.

Tìm hiểu về màu

Bạn thiết lập màu viền hoặc màu ruột cho hình chữ nhật bằng cách chọn màu từ bảng màu.

<?xml:namespace prefix = v />

- Bấm chọn vào một mẫu màu trong khu vực chứa màu solid để thiết lập màu đơn sắc (màu thuần).- Bấm chọn vào một mẫu màu trong khu vực chứa màu gradient để thiết lập màu tô chuyển.

Bạn có thể chọn màu bằng cách đưa chuột vào ô có số hex đến khi chuột biến thành bàn tay với mũi tên hai chiều trên ngón trỏ xuất hiện, kéo chuột sang phải hoặc sang trái và nhìn thấy kết quả cập nhật ở ô bên trái số hex. Màu cho web được hiển thị bằng số thập lục phân – số hex, số này được viết bắt đầu bằng dấu #, tiếp theo là sáu số liên tục, 2 số đầu đại diện cho màu đỏ (red), 2 số giữa đại diện cho màu xanh lục (green), 2 số cuối đại diện cho màu xanh lam (blue). Các giá trị này có thể thay đổi từ 00 đến FF, tương đương với từ 0 đến 255 trong hệ thập phân.

Để điều chỉnh độ trong suốt của màu, bạn thay đổi giá trị Alpha trong ô số bên phải chữ Alpha. Giá trị 0 tương ứng với trong suốt hoàn toàn, có thể nhìn xuyên qua đối tượng để thấy những đối tượng nằm dưới. Giá trị 100 tương ứng với mờ đục hoàn toàn, không nhìn thấy những gì nằm phía dưới. Giá trị Alpha có thể gõ trực tiếp vào hoặc kéo sang phải hoặc sang trái giống như kéo giá trị số hex.

Nếu không muốn có màu viền hay màu ruột thì bấm vào ô No color (ô Thiết lập không tô màu trong hình minh họa ở trên).

Nếu muốn chọn màu khác, bạn bấm vào nút màu hình tròn ở góc trên bên phải (ô Mở hộp thoại chọn màu trong hình minh họa ở trên). Hộp thoại Color xuất hiện:

Bạn có thể bấm chọn màu ở khu vực Basic colors hoặc chọn màu ở khu vực màu bên phải hoặc kéo thanh trượt hình tam giác bên phải để chọn hoặc gõ giá trị trực tiếp vào các ô số. Sau đó bấm vào nút Add to Custom Colors và bấm OK để chấp nhận màu đã chọn. Màu đó sẽ được áp dụng cho đối tượng của bạn.

Sử dụng Color Panel

Bạn có thể sử dụng Color panel để thiết lập màu cho đối tượng:

- Bấm chọn ô có cây bút chì để thiết lập màu viền.- Bấm chọn ô có thùng nước sơn để thiết lập màu ruột.- Bấm chọn ô đen trắng để thiết lập màu đen cho viền và màu trắng cho ruột.- Bấm chọn ô không màu để để thiết lập không màu cho viền hoặc ruột.- Bấm chọn ô hoán đổi màu để đổi màu viền thành màu ruột và ngược lại.

Bạn có thể chọn màu bất kỳ từ vùng màu bên trên ô có số hex hoặc kéo thanh trượt hình tam giác bên phải hoặc gõ số trực tiếp vào ô số hex theo quy tắc đã giới thiệu ở phần trên hoặc gõ số vào ô R, G, B và Alpha hoặc kéo thanh trượt bên phải các ô này. Màu mà bạn chọn lựa sẽ được cập nhật ở ô Màu được chọn.

Bấm vào mũi tên bên phải ô Type để chọn loại màu:

- None: thiết lập không màu cho viền hoặc ruột.- Solid: chọn màu thuần.- Linear Gradient: màu tô chuyển tuyến tính, đối tượng sẽ được tô màu chuyển đều từ các màu gốc theo hướng đường thẳng.- Radial Gradient: màu tô chuyển hướng tâm, đối tượng sẽ được tô màu chuyển đều từ các màu gốc theo hướng từ tâm ra.- Bitmap: dùng nội dung bitmap làm màu tô. (Xem ví dụ thực hành trong các bài tiếp theo)

Sử dụng màu Gradient:

Bạn có thể chọn màu gradient để tô màu viền hoặc ruột cho đối tượng.

Để thêm màu gốc cho màu hiện có bạn đưa chuột vào vùng có chứa các nút đại diện cho màu gốc, khi thấy xuất hiện dấu cộng phía dưới chuột thì bấm vào. Muốn xóa bớt màu gốc thì nắm kéo nút đại diện màu gốc ra khỏi khu vực các nút đại diện cho màu gốc. Muốn đổi màu gốc, bạn bấm đúp vào nút đại diện rồi chọn màu từ bảng màu. Bạn có thể bổ sung tối đa 15 màu cho màu gradient. Tuy nhiên, bạn cần lưu ý là màu càng phức tạp sẽ làm tăng kích thước cuối cùng của tác phẩm và có thể làm cho tác phẩm chạy chậm nếu có chọn tween cho đối tượng.

Chọn ô Linear RGB sẽ giúp màu gradient trông mượt hơn sau khi bạn thực hiện thao tác co dãn đối tượng đã được tô màu gradient.

Tùy chọn Overflow giúp bạn thiết lập cách hiển thị màu gradient khi vùng cần fill có kích thước lớn hơn vùng ảnh hưởng của màu gradient. (Xem thêm phần Gradient Transform Tool trong các bài tiếp theo).

GV TRƯƠNG VĂN NĂNG Công ty TNHH Khải Thiên (KTC Co., Ltd)

-------------------------------------------------------------------------------------------