apache-flex - Flash 绘图 API 中的边框线是绘制在形状内部还是外部？

Question

当我在 ActionScript 中绘制矩形等时，使用 Flash Player 的绘图 API(即 Graphics 类)，该形状的边界线是绘制在形状的外部还是内部？即，以下哪个图表正确地描绘了在自定义组件中的内容区域边界处绘制的矩形？

我查看了 documentation for the Graphics class并且找不到任何提示。

Answer 1

我写了一个简短的测试，使用一个固定大小的自定义组件，绘制一些线条作为引用，然后在白色背景上绘制一个具有 30 像素宽边框的矩形。这是它的样子，请参见下面的代码:

因此，引用问题中的图片，第二张图(“居中”)正确描述了 Flash Player 的绘制方式。

另请注意内线(45 像素处)如何恰好位于矩形内部，而外线(15 像素处)与矩形的外部边界对齐。

这是测试应用程序的代码:

<?xml version="1.0"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" xmlns:test="*">
    <test:TestCanvas horizontalCenter="0" verticalCenter="0" id="canvas" />
</mx:Application>

这是 TestCanvas 组件:

public class TestCanvas extends UIComponent
{
    public function TestCanvas()
    {
        super();
    }

    override protected function measure():void
    {
        super.measure();
        this.measuredWidth = this.minWidth = 300;
        this.measuredHeight = this.minHeight = 300;
    }

    override protected function updateDisplayList(w:Number, h:Number):void
    {
        super.updateDisplayList(w, h);
        this.graphics.clear();

        this.graphics.lineStyle(undefined);
        this.graphics.beginFill(0xffffff);
        this.graphics.drawRect(0, 0, w, h);
        this.graphics.endFill();

        this.graphics.lineStyle(0, 0xff0000, 0.5);
        this.graphics.moveTo(0, 15);
        this.graphics.lineTo(300, 15);
        this.graphics.moveTo(0, 45);
        this.graphics.lineTo(300, 45);
        this.graphics.moveTo(15, 0);
        this.graphics.lineTo(15, 300);
        this.graphics.moveTo(45, 0);
        this.graphics.lineTo(45, 300);

        this.graphics.lineStyle(0, 0xff0000, 0.75);
        this.graphics.moveTo(0, 30);
        this.graphics.lineTo(300, 30);
        this.graphics.moveTo(30, 0);
        this.graphics.lineTo(30, 300);

        this.graphics.lineStyle(30, 0x0000ff, 0.25, false, "normal", null, JointStyle.MITER);
        this.graphics.drawRect(30, 30, 240, 240);
    }