在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结合使用也可获得同样的效果。PerspectiveProjectionscaleY

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