Flash 绘图 API 中的边框线是在形状内部还是外部绘制？答案

【问题标题】：Are border lines in the Flash drawing API drawn inside or outside a shape?Flash 绘图 API 中的边框线是在形状内部还是外部绘制？
【发布时间】：2011-02-15 01:15:23
【问题描述】：

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

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

【问题讨论】：

标签： apache-flex flash graphics css

【解决方案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);
    }

【讨论】：