积少成多Flash(6) - ActionScript 3.0 绘图之图形和转换

核心提示： 2、转换在 UI 上放置 3 个 Silder分别名为：sliderScaleX, sliderScaleY, sliderRotate分别用于演示 X 轴方向上的缩放，Y 轴方向上的缩放，积少成多Flash(6) - ActionScript 3.0 绘图之图形和转换(2)，旋转再放置 2 个

2、转换

在 UI 上放置 3 个 Silder

分别名为：sliderScaleX, sliderScaleY, sliderRotate

分别用于演示 X 轴方向上的缩放，Y 轴方向上的缩放，旋转

再放置 2 个 Button

分别名为：btnMatrix, btnClearMatrix

分别用于演示仿射矩阵在图形转换上的应用，还原为对象的初始仿射矩阵转换

Main.as

package　
{
　　　　import　flash.display.MovieClip;
　　　　import　fl.events.ComponentEvent;
　　　　import　fl.events.SliderEvent;
　　　　import　flash.display.Shape;
　　　　import　flash.geom.Matrix;
　　　　import　flash.display.GradientType;
　　　　import　flash.display.SpreadMethod;
　　　　
　　　　public　class　Main　extends　MovieClip
　　　　{
　　　　　　　　var　originalMatrix:Matrix;
　　　　　　　　
　　　　　　　　public　function　Main():void
　　　　　　　　{
　　　　　　　　　　　　sliderScaleX.addEventListener(SliderEvent.THUMB_DRAG,　scaleXHandler);
　　　　　　　　　　　　sliderScaleY.addEventListener(SliderEvent.THUMB_DRAG,　scaleYHandler);
　　　　　　　　　　　　sliderRotate.addEventListener(SliderEvent.THUMB_DRAG,　rotateHandler);
　　　　　　　　　　　　btnMatrix.addEventListener(ComponentEvent.BUTTON_DOWN,　matrixHandler);
　　　　　　　　　　　　btnClearMatrix.addEventListener(ComponentEvent.BUTTON_DOWN,　clearMatrixHandler);
　　　　　　　　　　　　
　　　　　　　　　　　　//　保存　canvas　的初始仿射矩阵转换
　　　　　　　　　　　　originalMatrix　=　canvas.transform.matrix;
　　　　　　　　}
　　　　　　　　
　　　　　　　　
　　　　　　　　//　在　x　轴方向上做缩放
　　　　　　　　function　scaleXHandler(e:SliderEvent):void
　　　　　　　　{
　　　　　　　　　　　　//　scaleX　-　x轴方向上的缩放比例
　　　　　　　　　　　　canvas.scaleX　=　e.value;
　　　　　　　　}
　　　　　　　　
　　　　　　　　//　在　y　轴方向上做缩放
　　　　　　　　function　scaleYHandler(e:SliderEvent):void
　　　　　　　　{
　　　　　　　　　　　　//　scaleY　-　y轴方向上的缩放比例
　　　　　　　　　　　　canvas.scaleY　=　e.value;
　　　　　　　　}
　　　　　　　　
　　　　　　　　//　旋转
　　　　　　　　function　rotateHandler(e:SliderEvent):void
　　　　　　　　{
　　　　　　　　　　　　//　rotation　-　旋转的度数
　　　　　　　　　　　　canvas.rotation　=　e.value;
　　　　　　　　}
　　　　　　　　
　　　　　　　　
　　　　　　　　//　仿射矩阵在图形转换上的应用
　　　　　　　　function　matrixHandler(e:ComponentEvent):void
　　　　　　　　{
　　　　　　　　　　　　var　matrix:Matrix　=　new　Matrix();
　　　　　　　　　　　　//　rotate()　-　旋转的角度
　　　　　　　　　　　　matrix.rotate(10);
　　　　　　　　　　　　
　　　　　　　　　　　　//　translate()　-　平移的距离
　　　　　　　　　　　　matrix.translate(200,　200);
　　　　　　　　　　　　
　　　　　　　　　　　　//　scale()　-　缩放的比例
　　　　　　　　　　　　matrix.scale(1.2,　1.2);
　　　　　　　　　　　　
　　　　　　　　　　　　var　skewMatrix:Matrix　=　new　Matrix();
　　　　　　　　　　　　//　调整　b　属性将矩阵垂直倾斜
　　　　　　　　　　　　//　调整　c　属性将矩阵水平倾斜
　　　　　　　　　　　　skewMatrix.b　=　Math.tan(0.78);　
　　　　　　　　　　　　
　　　　　　　　　　　　//　concat()　-　组合两个仿射矩阵
　　　　　　　　　　　　matrix.concat(skewMatrix);
　　　　　　　　　　　　//　在对象上应用仿射矩阵转换
　　　　　　　　　　　　canvas.transform.matrix　=　matrix;
　　　　　　　　}
　　　　　　　　
　　　　　　　　//　还原为初始的仿射矩阵转换
　　　　　　　　function　clearMatrixHandler(e:ComponentEvent):void
　　　　　　　　{
　　　　　　　　　　　　//　设置　canvas　的仿射矩阵转换为初始的仿射矩阵
　　　　　　　　　　　　canvas.transform.matrix　=　originalMatrix;
　　　　　　　　}
　　　　}
}

OK

本文示例源代码或素材下载