Question

这是我的问题，我需要将图像缩放并剪裁成方形大小的图块以放入图块列表中。以下是我希望它的工作方式：

我希望我的所有瓷砖都是300px x 300px。
对于每张图片，我想使用“letterbox”scaleMode缩放较短的一面（宽度或高度）以适应图块（以便保持纵横比）。
然后我想将图像放在中间位置并剪掉两边或顶部和底部留下的任何东西。

这是一个帮助澄清的例子：

我的图像宽度= 600px，高度= 1200px。首先，我想将图像缩放到width = 300px和height = 600px（注意保持纵横比），然后垂直居中并将图像剪裁为300 x 300。

这可能吗？这实际上是在许多基于照片的网站中显示方形缩略图的一种非常标准的方式，但我找不到一种方法使其在flex中工作。

任何帮助将不胜感激，谢谢！

2012年6月更新：

万一现在有人找到此主题，此问题已在最新版本的Flex SDK中得到解决。在spark图像对象上有一个新的scaleMode“zoom”，它正是我在这里所要求的。

Answer 1

拍摄大图并在BitmapData上使用比例尺重新定位：

const zoom:Number = Math.max(THUMB_WIDTH/image.width, THUMB_HEIGHT/image.height);
const x:int = (THUMB_WIDTH - image.width*zoom)/2;
const y:int = (THUMB_HEIGHT - image.height*zoom)/2;
var matrix:Matrix = new Matrix;
matrix.scale(zoom, zoom);
matrix.translate(x, y);

var _thumbBitmap:BitmapData = new BitmapData(THUMB_WIDTH, THUMB_HEIGHT, false, 0xFFFFFF);
_thumbBitmap.draw(image, matrix, null, null, null, true);

然后将结果BitmapData分配给BitmapImage的来源。

更多：http://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/flash/display/BitmapData.html#draw%28%29 http://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/spark/primitives/BitmapImage.html#source

如何在Flex 4.5中缩放和剪辑BitmapImage

1 个答案: