同样缩放边界和非边界Flash图形

时间:2013-12-16 20:52:49

标签: actionscript-3 flash

我有一个包含两个符号的SWF文件,这些符号是“为ActionScript导出的”。这些都是简单的正方形,其填充大小相等,但一个有边框而另一个没有。

  

我想在我的Flash应用程序中并排显示这些图形,我希望它们都可以缩放(放大)到相同的尺寸。我编写了一些相当简单的代码来从SWF加载这些符号并显示它们(见下文),但是边界元素的大小不符合预期:

  

边框会导致图形尺寸减小超过边框放大。


我使用以下代码执行上述测试。

<?xml version='1.0'?>
<s:Application
    xmlns:fx='http://ns.adobe.com/mxml/2009'
    xmlns:s='library://ns.adobe.com/flex/spark'
    xmlns:mx="library://ns.adobe.com/flex/mx"
    initialize='init(drawArea)'
>
<mx:UIComponent id='drawArea' left='0' top='0' width='250' height='250'></mx:UIComponent>
<fx:Script><![CDATA[
import mx.controls.SWFLoader;

static function init(drawArea:UIComponent):void {
    var loader:SWFLoader = new SWFLoader();
    loader.addEventListener(Event.COMPLETE, onSwfLoaded);
    loader.load('./borderings.swf');

    function onSwfLoaded(e:Event):void {
        var getDefinition:Function = e.target.loaderContext.applicationDomain.getDefinition;

        var Bordered:Class = getDefinition('bordered');
        var bordered:MovieClip = new Bordered;

        bordered.x = 100;
        bordered.y = 100;
        bordered.width = 100;
        bordered.height = 100;

        var borderedContents:DisplayObject = bordered.getChildAt(0);
        assert(bordered.numChildren === 1);

        assert(borderedContents.x == 0);
        assert(borderedContents.y == 0);
        assert(borderedContents.width == 14.1);
        assert(borderedContents.height == 14.1);

        drawArea.addChild(bordered);


        var Borderless:Class = getDefinition('borderless');
        var borderless:MovieClip = new Borderless;

        borderless.x = 250;
        borderless.y = 100;
        borderless.width = 100;
        borderless.height = 100;

        var borderlessContents:DisplayObject = borderless.getChildAt(0);
        assert(borderless.numChildren === 1);

        assert(borderlessContents.x == 0);
        assert(borderlessContents.y == 0);
        assert(borderlessContents.width == 13.1);
        assert(borderlessContents.height == 13.1);

        drawArea.addChild(borderless);

        drawArea.graphics.lineStyle(1.0, 0xFF0000, 1.0);
        drawArea.graphics.moveTo(25, 50);
        drawArea.graphics.lineTo(325, 50);
        drawArea.graphics.moveTo(25, 150);
        drawArea.graphics.lineTo(325, 150);
    }
}

static function assert(pass:Boolean, msg:String=null):void {
    if (!pass) throw new Error(msg || 'assertion failed');
}
]]></fx:Script>
</s:Application>

可以找到完整的IntelliJ测试项目in this git repository on BitBucket


Flash编辑器声称这两个符号都具有相同的尺寸:13.10像素x 13.10像素,虽然在视觉上这似乎是排除了边框的外半部分:

  

但是,当我使用ActionScript检查这些图形的实例时,它会报告边框图形较大,为14.10像素×14.10像素。


为什么这些图形的大小以这种奇怪的方式受到边界的影响?如何将此图形的有边界和无边框版本缩放到相同的尺寸?

1 个答案:

答案 0 :(得分:2)

对于缩放问题,您可以查看getRect()的{​​{1}}方法。

来自AS3 Reference for getRect()

  

返回一个矩形,该矩形根据DisplayObject参数定义的坐标系定义显示对象的边界,不包括形状上的任何笔划。 targetCoordinateSpace方法返回的值与getRect()方法返回的值相同或更小。

对于上面的示例,这可用于直接计算将元素设置为特定维度而忽略笔划所需的比例因子,而不是使用通过getBounds()和{{1}设置比例}属性。像这样的函数可以工作:

width

我们会调用:

,而不是设置heightstatic function setDimensionsExcludingStrokes( subject:DisplayObject, width:int=-1, height:int=-1 ):void { var innerDimensions:Rectangle = subject.getRect(subject); if (width >= 0) { subject.scaleX = width / innerDimensions.width; } if (height >= 0) { subject.scaleY = height / innerDimensions.height; } }
bordered.width = 100

这导致正方形在相同的目标尺寸下很好地对齐: