在AS3中使用4x4 3DMatrix来扭曲图像

Question

我有一个AS3位图图像，我想像这样倾斜：

我只想扭曲图像的底部，并让顶部单独留下。 基于我迄今为止所做的研究，看起来我想要使用Matrix3D类，但我不太确定如何有效地实现它。

感谢下面的答案，本文是一个很好的资源，可以用3x3矩阵来理解Matrix3D类： http ： //www.senocular.com/flash/tutorials/transformmatrix/然而，就像那个教程一样棒，它没有提供能够扭曲上面的图像。 我正在寻找的是关于如何使用4x4矩阵的类似教程。 我想知道的是将数字放在矩阵中的位置，我应该能够找出其他所有内容。

以下是我所得到的一些示例代码：

var tempLoader:Loader=new Loader();
var tempBitmap:Bitmap;
var fattenTheBottom:Number;
tempLoader.load(new URLRequest("image.png"));
tempLoader.contentLoaderInfo.addEventListener(Event.COMPLETE,castBitmap);
function castBitmap(e:Event):void
{
    tempLoader.contentLoaderInfo.removeEventListener(Event.COMPLETE,castBitmap);
    tempBitmap = Bitmap(tempLoader.content);
    // Make the image into a trapezoid here using fattenTheBottom
    addChild(tempBitmap);
}

任何建议都会非常感激！

Answer 1

如果您想快速使用Matrix3D，以下是您应该使用的值类型的示例：

var m3d:Matrix3D = new Matrix3D(Vector.<Number>([
    1, 0,    0,    0, 
    0, 1.15, 0.25, 0.00005,
    0, 0,    1,    0,
    0, 0,    0,    1
]));
tempBitmap.transform.matrix3D = m3d;

但很快你会注意到这种方法会以你不想要的方式扭曲图像。 例如，它会在一侧水平挤压您的图像（如您所愿），但图像的内容也将垂直拉伸。 很难解释，但是一旦你尝试了上面的方法，你会注意到图像是如何被垂直拉伸的。

使用rotationX结合PerspectiveProjection和scaleY可以获得相同的效果。

如果您想在代码和图像结果中获得更优雅的解决方案，请尝试使用DistortImage 。 那里的方法不直接（使用子图像网格），但效果很好。

Answer 2

我只能建议您阅读我发现的最佳信息：
理解转换矩阵

读到这个，我想，你可以真正理解变换矩阵的一切。 它来自Flash 8（AS2），但它的理论信息也可以使用AS3。