Creating Filled Shapes Dynamically

Chia sẻ: Qweqwdasd Qweqdasda | Ngày: | Loại File: PDF | Số trang:4

Thêm vào BST

Báo xấu

66
lượt xem 4
download

Download Vui lòng tải xuống để xem tài liệu đầy đủ

Tạo động các Shapes điền Mặc dù chúng tôi sẽ không cống hiến một bài tập cho chủ đề này, bản vẽ đầy hình dạng vẫn còn giá trị thảo luận. Bằng cách xây dựng trên cú pháp bạn đã sử dụng vậy, đến nay trong bài học này, bạn có thể sử dụng các phương pháp vẽ để tạo ra một hình dạng và sau đó điền nó với một màu duy nhất (một điền phẳng) hoặc một gradient (một điền gradient). ...

Chủ đề:

Bình luận(0) Đăng nhập để gửi bình luận!

Lưu

Nội dung Text: Creating Filled Shapes Dynamically

< Day Day Up > Creating Filled Shapes Dynamically Even though we're not going to devote an exercise to the topic, drawing filled shapes is still worth discussing. By building on the syntax you've used thus far in this lesson, you can use the drawing methods to create a shape and then fill it with a single color (a flat fill) or a gradient (a gradient fill). To create a flat fill, you must let Flash know that the shape you're about to draw will be filled. You do this by employing the following method: path.beginFill(color,alpha) The path points to the timeline where the lines will exist. The color parameter accepts a hex color value. The alpha parameter accepts a number between 0 and 100 to set the alpha level of the fill. To let Flash know when you're finished drawing a shape, use the following method: path.endFill() The following example shows how this method is used: _root.createEmptyMovieClip("box_mc",1); with (_root.box_mc) { lineStyle(0,0x000000,100); beginFill(0x990000,100); moveTo(0,0); lineTo(100,0);
lineTo(100,100); lineTo(0,100); lineTo(0,0); endFill(); } This ActionScript does the following: 1. Creates an empty movie clip instance. 2. Sets the line style. 3. Initiates the fill. 4. Draws a shape. 5. Ends the fill. It's important to note that when creating a filled shape, the starting point of the shape, as defined by moveTo(), must also be the ending point of the shape, as defined by the last lineTo(). Creating a gradient fill is a little more difficult than creating a flat fill. You must first tell Flash that the shape you're about to draw is to be filled with a gradient. The syntax is as follows: path.beginGradientFill(type, colors, alphas, ratios, matrix)
• The type parameter accepts the string linear or radial. • The colors parameter is an array of hex color values that you want to use in your gradient. This array can contain two or more elements. • The alphas parameter is an array of alpha values to be applied to each respective color. This array should have the same number of elements as the colors array. • The ratios parameter is an array of elements that contain values between 0 and 255. These values determine the color distribution. • The matrix parameter of the beginGradientFill() method contains values that are used to move, skew, and rotate the gradient. There are two ways to configure the matrix object, the more common of which contains the following properties: • matrixType is a variable with a value of "box". You must set it so that Flash knows which type of matrix you're using. • x is the x position at which to start the gradient. Flash uses the upper-left corner of the overall gradient to place this gradient. • y is the y position at which to start the gradient. Flash uses the upper-left corner of the overall gradient to place this gradient. • w is the width of the gradient. • h is the height of the gradient. • r is the rotation of the gradient (in radians).
Following is an example of the syntax used to create a gradient-filled shape: _root.createEmptyMovieClip("holder_mc", 1); with (_root.holder_mc) { lineStyle(0, 0x000000, 0); rotation = 90 * (Math.PI/180); colors = [ 0x6666FF, 0xFF6600 ]; alphas = [ 100, 100 ]; ratios = [ 0, 255 ]; matrix = {matrixType:"box", x:0, y:150, w:200, h:100, r:rotation }; beginGradientFill( "linear", colors, alphas, ratios, matrix ); moveTo(0,0); lineTo(550,0); lineTo(550,300); lineTo(0,300); lineTo(0,0); endFill(); } This example creates a square and fills it with a gradient. The lines of the square have an alpha of 0 so you can't see them. You'll probably need to test beginGradientFill() a few times to feel comfortable using it. < Day Day Up >