Flash/Flex学习笔记(56):矩阵变换
时间:2022-04-23
本文章向大家介绍Flash/Flex学习笔记(56):矩阵变换,主要内容包括其使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。
先回顾一下Silvelright中的矩阵变换[转]WPF中的MatrixTransform,简单点讲:矩阵变换能改变对象的x,y坐标,x或y方向上的缩放,以及对象在x,y轴上的旋转(扭曲变形)
上面这个是WPF/Silverlight中的3*3变换矩阵,其中X,Y用于改变对象的坐标;M11,M22用于对象在x,y轴上的缩放;而M12,M21用于y轴,x轴上的扭曲。
As3.0中的Matix类跟这个类似:
只不过,这个矩阵旋转了一下(行列互换了),tx,ty仍然是用于坐标的平移;a,d用于x,y方向的缩放(前提是b,c设置为0);b,c用于y,x轴上的扭曲。当然这些元素可以组合起来使用。(更详细的用法,请参阅AS3.0 Matrix )
tx,ty的平移示例:
import fl.events.SliderEvent;
var box:Box = new Box();
var startX:Number = stage.stageWidth/2 ;
var startY:Number = stage.stageHeight/2 ;
box.x = startX;
box.y = startY;
addChild(box);
silder_tx.addEventListener(SliderEvent.CHANGE,slider_tx_ChangeHandler);
silder_ty.addEventListener(SliderEvent.CHANGE,slider_ty_ChangeHandler);
function slider_tx_ChangeHandler(e:SliderEvent):void{
txt_tx.text = e.value.toString();
var tempMatrix:Matrix = box.transform.matrix;
tempMatrix.tx = startX + e.value;
box.transform.matrix = tempMatrix;
}
function slider_ty_ChangeHandler(e:SliderEvent):void{
txt_ty.text = e.value.toString();
var tempMatrix:Matrix = box.transform.matrix;
tempMatrix.ty = startY + e.value;
box.transform.matrix = tempMatrix;
}
a,d缩放示例:
import fl.events.SliderEvent;
var box:Box = new Box();
var startX:Number = stage.stageWidth/2;
var startY:Number = stage.stageHeight/2;
box.x = startX;
box.y = startY;
addChild(box);
silder_scaleX.addEventListener(SliderEvent.CHANGE,silder_scaleX_ChangeHandler);
silder_scaleY.addEventListener(SliderEvent.CHANGE,silder_scaleY_ChangeHandler);
function silder_scaleX_ChangeHandler(e:SliderEvent):void{
txt_tx.text = e.value.toString();
var tempMatrix:Matrix = box.transform.matrix;
tempMatrix.a = e.value;//x轴缩放
box.transform.matrix = tempMatrix;
}
function silder_scaleY_ChangeHandler(e:SliderEvent):void{
txt_ty.text = e.value.toString();
var tempMatrix:Matrix = box.transform.matrix;
tempMatrix.d = e.value; //y轴缩放
box.transform.matrix = tempMatrix;
}
a,b,c,d 旋转示例:
import fl.events.SliderEvent;
var box:Box = new Box(50,100,0x00ff00);
var startX:Number = stage.stageWidth/2 ;
var startY:Number = stage.stageHeight/2 ;
box.x = startX;
box.y = startY;
addChild(box);
var box2:Box = new Box(100,75,0xff6600);
box2.x = startX;
box2.y = startY;
addChild(box2);
silder_Angle.addEventListener(SliderEvent.CHANGE,silder_Angle_ChangeHandler);
function silder_Angle_ChangeHandler(e:SliderEvent):void{
txt_tx.text = e.value.toString();
var angle = e.value * Math.PI /180;
//trace(angle);
var sin = Math.sin(angle);
var cos = Math.cos(angle);
var tempMatrix:Matrix = box.transform.matrix;
tempMatrix.a = cos;
tempMatrix.b = sin;
tempMatrix.c = -sin;
tempMatrix.d = cos;
box.transform.matrix = tempMatrix;
box2.transform.matrix = tempMatrix;
}
b,c 倾斜示例:
import fl.events.SliderEvent;
var box:Box = new Box(50,50);
var startX:Number = stage.stageWidth/2 ;
var startY:Number = stage.stageHeight/2 ;
box.x = startX;
box.y = startY;
addChild(box);
silder_skewX.addEventListener(SliderEvent.CHANGE,silder_skewX_ChangeHandler);
function silder_skewX_ChangeHandler(e:SliderEvent):void{
txt_tx.text = e.value.toString();
var angle = e.value * Math.PI /180;
var tan = Math.tan(angle);
var tempMatrix:Matrix = box.transform.matrix;
tempMatrix.c = tan;
box.transform.matrix = tempMatrix;
}
silder_skewY.addEventListener(SliderEvent.CHANGE,silder_skewY_ChangeHandler);
function silder_skewY_ChangeHandler(e:SliderEvent):void{
txt_ty.text = e.value.toString();
var angle = e.value * Math.PI /180;
var tan = Math.tan(angle);
var tempMatrix:Matrix = box.transform.matrix;
tempMatrix.b = tan;
box.transform.matrix = tempMatrix;
}
- Silverlight体积优化
- 江湖秘笈:说烦了破解、渗透等,不如大家一起聊聊硬盘加密?
- Nodejs学习笔记(十三)— PM2
- 十分钟带你了解服务化框架
- 十分钟带你了解服务化框架
- WCF技术剖析之十七:消息(Message)详解(上篇)
- 微信年底重磅更新,这次小程序才是重头戏!
- 《EnterLib PIAB深入剖析》系列博文汇总
- Nodejs学习笔记(八)--- Node.js + Express 实现上传文件功能(felixge/node-formidable)
- 大牛教你使用7种卷积神经网络进行物体检测!
- Enterprise Library深入解析与灵活应用(3):倘若将Unity、PIAB、Exception Handling引入MVP模式.. .. ..
- 别对我说谎!你的小九九我都知道
- Spring集成RabbitMQ-使用RabbitMQ更方便
- Nodejs学习笔记(三)--- 模块
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法
- Logstash: 如何创建可维护和可重用的 Logstash 管道
- 手把手教你微信好友头像形成指定的文字
- Logstash: 应用实践 - 装载 CSV 文档到 Elasticsearch
- LeetCode 剑指 Offer 28. 对称的二叉树
- Mysql拼接查询结果
- 手把手教你如何重建二叉树(超精彩配图)
- 一文搞定插入排序算法
- LeetCode 107. 二叉树的层次遍历 II
- LeetCode 103. 二叉树的锯齿形层次遍历
- 我是怎么一步一步调试出来二叉树的遍历(超精彩配图),二叉树遍历再也不用愁了
- 重中之重的二分查找
- LeetCode 剑指Offer 面试题27. 二叉树的镜像
- 一文搞定选择排序算法
- 一文搞定冒泡排序算法
- 剑指Offer LeetCode 面试题25. 合并两个排序的链表