scale9Grid和Bitmaps - 它们是否一起工作？

Question

我还没有习惯Flash IDE环境，所以我在FlashDevelop中编写纯代码。我得到了各种图形资产的精灵，其中一个用于与那个非常有用的scale9Grid功能一起使用......它没有用。因为我在生命中第一次这样做，我以为我搞砸了一些东西，但后来我尝试了drawRoundRect和beginFill（而不是beginBitmapFill）并且它按预期工作。我的逻辑思路是它不适用于位图（尽管在Adobe Livedocs示例中他们使用orangoutang的图片来演示scale9Grid功能）。

之后我读了各种各样的意见，首先是“它工作得很好”，最后是“它不起作用，搞砸了Adobe”。所以我现在很好奇，它有用还是没有？

我已经找到了如何在Embed语句中指定scale9Grid参数，但我的嵌入图像是精灵。我想无论如何它都无法使用，对吧？

Answer 1

在深入了解[Embed]标签并分析它的方法之后，我想出了如何在每次调整大小时不使用一堆Bitmaps或重新绘制图形的情况下进行scale9Grid。

scale9Grid仅影响绘图API图形（或图形对象） - 而不是直接影响位图。因此，您必须将位图绘制到Shape或Sprite的图形对象：

shape.graphics.beginBitmapFill(bitmapData);

诀窍是为每个切片单独填充，但仅限第一次：

var rect:Rectangle = new Rectangle(20, 20, 60, 10);
var gridX:Array = [rect.left, rect.right, bitmapData.width];
var gridY:Array = [rect.top, rect.bottom, bitmapData.height];

shape.graphics.clear();

var left:Number = 0;
for (var i:int = 0; i < 3; i++) {
    var top:Number = 0;
    for (var j:int = 0; j < 3; j++) {
        shape.graphics.beginBitmapFill(bitmapData);
        shape.graphics.drawRect(left, top, gridX[i] - left, gridY[j] - top);
        shape.graphics.endFill();
        top = gridY[j];
    }
    left = gridX[i];
}
shape.scale9Grid = rect;

记得做一个endFill（）或它不会起作用。在准备好形状之后，你只需要添加你的scale9Grid矩形就可以了 - 完美的位图缩放，无需额外的显示对象或不断重绘。

Answer 2

在发现article之前，我一直撞到刻度网格。缩放网格有很多限制，如果它们不符合则不适用。如果你无法解决它们，这里是9位图方法：ScaleObject。

Answer 3

除非您将位图拆分，否则位图将无法与scale9Grid一起使用。您还可以使用自定义类来完成为您分割位图的工作。

http://www.dreaminginflash.com/2007/12/03/9-slice-and-bitmap/

更新：

关于理解缩放。看看这张图片。如果需要，红色部分将进行缩放。

Answer 4

尼斯片段， Tyler Wright ！

一些优化：

static public function drawAndScale9Grid(s : Shape, bitmapData : BitmapData, rect : Rectangle) : void {
    const gridX : Vector.<Number> = Vector.<Number>([rect.left, rect.right, bitmapData.width]);
    const gridY : Vector.<Number> = Vector.<Number>([rect.top, rect.bottom, bitmapData.height]);

    const g : Graphics = s.graphics;
        g.clear();

    var left : Number = 0;
    var i : int, j : int;
    const n : uint = gridX.length, m : uint = gridY.length;
    while(i < n) {  
        j = 0; // reset j
        var top : Number = 0;
        while(j < m) {
            // draw shape with special coords of bitmapdata
            g.beginBitmapFill(bitmapData);
            g.drawRect(left, top, gridX[i] - left, gridY[j] - top);
            g.endFill();

            top = gridY[j];

            j++;
        }
        left = gridX[i];

        i++;
    }
    s.scale9Grid = rect;
}