O'Reilly logo

Learning ActionScript 3.0 by Zevan Rosser, Rich Shupe

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

9-Slice Scaling

Scaling vectors is usually a pleasure because the crispness of the vector art is not lost when it is resized the way bitmaps become pixilated when enlarged significantly. This is because the vectors are recalculated every time an object is scaled. However, one of the downsides of this default behavior is that certain visual characteristics, such as stroke weight and rounded corners, can become distorted during scaling. This phenomenon can be seen in Figure 8-11.

9-Slice scaling reduces distortion during scaling

Figure 8-11. 9-Slice scaling reduces distortion during scaling

To reduce distortion caused by scaling in many types of display objects, you can use a feature called 9-slice scaling. This feature virtually slices a display object into nine pieces and controls scaling of these pieces independently. A typical grid of nine slices can be seen in Figure 8-11. The four corners are not scaled. The top and bottom slices between the corners are scaled only horizontally, the left and right slices between the corners are scaled only vertically, and the center slice is scaled in both directions.

To enable this feature using ActionScript, you must set the corresponding scale9grid property to a rectangle that, in essence, defines the object's center slice. ActionScript then extrapolates the corners and perimeter slices by extending the sides of the rectangle. The illustration in Figure 8-11 marked "9-slice scaling enabled" shows ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required