actionscript-3 - 如何找到给定比例、倾斜和平移值的变换矩阵?

标签 actionscript-3 flash math matrix

变换矩阵是如何定义的?

我有定义缩放、倾斜和平移的值。我想找到它们代表的变换矩阵。

  • x/y 比例可以是任意数字。
  • 平移 x/y 可以是任意数字。
  • x/y 倾斜度以 -180 到 180 度之间为单位。

如何找到这些值的变换矩阵?

我正在使用 Flash 中的值,并且希望矩阵的格式如下,以便我可以导出此矩阵并以另一种语言应用相同的转换:

| a c u |
| b d v |
| 0 0 1 |

我需要能够从参数转到 AS3/JSFL/Flash 之外的矩阵。

(具体来说,我想使用 C#,但我想要一个不依赖于给定语言的答案。)

这个链接讨论了矩阵在 Flash 中的工作原理,我了解其中的大部分内容。然而,据我所知,它没有描述如何从位置/比例/倾斜值到矩阵。 http://www.senocular.com/flash/tutorials/transformmatrix/

我知道 Flash 显示对象有一个 .matrix 属性,但我正在 Flash 之外使用给定值,并且需要找到不使用该属性的解决方案。

Actionscript 的偏差行为不当

考虑到 Cimbali 答案中变换的通常定义,我在从其偏斜参数构建矩阵时仍然遇到问题。

这是一组示例数据:

A) 对象属性(直接从 Flash using JSFLelement.xelement.skewX 等记录)

x: 0
y: 0
scaleX: 1
scaleY: 1.0000152587890625
skewX: 19.9998779296875
skewY: 0

B) 变换矩阵(使用 JSFL 直接从 Flash 记录, element.matrix )

1      | 0      | 0     
-0.342 | 0.94   | 0     
0      | 0      | 1     

这是我尝试过的:

sx = tan(19.9998779296875 * PI / 180) = tan(0.34906372) = 0.36396782164

Scale Matrix        Skew X Matrix       Result Matrix
1 | 0 | 0           1    | 0 | 0        1    | 0 | 0
0 | 1 | 0      x    0.36 | 1 | 0    =   0.36 | 1 | 0
0 | 0 | 1           0    | 0 | 0        0    | 0 | 1

SkewY 为 0,因此没有理由使用 Skew Y 矩阵再次相乘。

那么为什么我的结果矩阵与 Flash 发布的矩阵有如此大的不同?

在此示例中,我的图形最初为 200 x 100 像素。它不会从任何父级继承转换(父级绝对不会以任何方式转换)。但是,当我将图形放置在舞台上并且仅将倾斜 X 值更改为 20° 时,属性面板中的高度从 100 更改为 94 像素,但缩放 Y 保持在 100%。

如果您不熟悉 Flash IDE,当您仅调整倾斜 X 值时,它不会简单地将图形的角向左/右推。它实际上使角沿弧线移动,当您增加倾斜 X 时,平行四边形在垂直方向上会变短。

(我意识到我对一些数字进行了四舍五入,但这只是为了便于在此处显示它们。)

最佳答案

出于某种奇怪的原因,在actionscript 3中应用连续变换被称为“连接矩阵”,正如您的链接所解释的那样,它是通过矩阵相乘来完成的:完全阅读“矩阵乘法”部分:它首先定义矩阵乘法和结尾为A*B -> B.concat(A); .

请注意,应用转换的顺序很重要:B*A 不是 A*B。在两者中A*BB.concat(A); , BA 之前应用。您可以将其视为 A*(B*(x,y,1))由于矩阵乘积的结合性。这也在链接的“串联矩阵”部分中进行了解释,其中子元素先由其矩阵进行变换,然后由其父矩阵进行变换,这相当于 child_matrix.concat(parent_matrix); 的单个变换。

然而,这个难题缺少的一部分是,对于您描述的每个操作,都有一个相应的变换矩阵。它们都是illustrated and explained in adobe's reference on Matrices 。然而偏斜矩阵的图示有一个小错误,你应该引用 to this stackoverflow question instead .

这是来自 the wikipedia page on the topic 的插图,这同样清楚:

formulas/matrices for different kind of plane transformations from wikipedia

请注意,所有反射都可以通过使用具有 -1 值的 W 和/或 H 进行缩放来表示。对于以角度表示的剪切力,只需使用 A = tan(a)在上面的图片中。


但是,Flash 似乎不同意“倾斜”的含义,并且它不是在倾斜另一个坐标的同时保留一个坐标,而是保留了最初沿该坐标的长度。或者,正如您所描述的,如果您沿 X 倾斜一个矩形,它的(某些)顶点不会向左或向右移动,而是沿弧线移动。

看起来,他们倾斜了一个坐标,然后通过缩放另一个坐标来校正图形的伸长。幸运的是,发生这种情况的因素很容易预测,因为我们知道三角学:它是角度的余弦。

所以每当你有一个 skewX 角度 a在 Flash 中,您必须使用以下矩阵乘积(使用上图中的定义表示):matrix(scale with W=1 and H=cos(a)) * matrix(skew along x with A=-tan(a))

在闪存中定义 skewY 会产生合理的编程语言,这是合乎逻辑的 matrix(scale with W=cos(a) and H=1) * matrix(skew along y with B=-tan(a))

关于actionscript-3 - 如何找到给定比例、倾斜和平移值的变换矩阵?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28058445/

相关文章:

performance - Flash 游戏中 child 的内存问题

python - 如何找到小于 x 的最大整数?

javascript - 为什么会这样? - 我的机器上出现奇怪的 keyup keydown 事件

actionscript-3 - flash builder mobile,正确使用 PersistenceManager?

flash - as3 (flash10) 中的 3d 线

javascript - 什么会阻止 actionscript flash 在 IE9 中调用 JS 对象?

flash - 为什么谷歌视频播放器随机给出异常

performance - 除了渲染向量之外,AS3 中的主要性能影响因素是什么?

PHP - 如果数字可以被 3 和 5 整除则回显

用于常微分方程分岔分析的 Python 库或包