ActionScript - 使用 JointStyle.MITER 清除图形错误？答案

【问题标题】：ActionScript - Clearing Graphics With JointStyle.MITER Bug?ActionScript - 使用 JointStyle.MITER 清除图形错误？
【发布时间】：2011-05-07 06:54:51
【问题描述】：

我在清除/重绘图形时遇到了使用 JointStyle.MITER 的不良影响。

我的项目涉及管理具有圆形和锐利边缘的自定义线条图形，这就是我想使用斜接样式的原因。

当线条粗细大大增加时，即使是线条的圆形区域也会受到斜接样式的影响。虽然我觉得这很不幸，但这是可以理解的，而不是我所指的错误。当减小线条粗细并不能完全清除图形时，会发生错误（？），每次粗细变化时代码都会指示这样做，从而在线条曾经所在的位置留下线条图形的伪影。工件也会留下锋利的边缘，而不仅仅是圆角。

我在 Mac OS X Snow Leopard (10.6.4) 上使用 Flash Player 版本 10.1.53.64。

您可以通过运行下面的示例代码来测试这一点。使用左右键盘箭头更改圆形矩形的笔画粗细。

更新：图形伪影是肤浅的。在它们出现后将形状拖动到它们的位置将删除它们。使用拖动功能更新了代码。

package
{
import flash.display.CapsStyle;
import flash.display.JointStyle;
import flash.display.LineScaleMode;
import flash.display.Sprite;
import flash.events.Event;
import flash.events.KeyboardEvent;
import flash.events.MouseEvent;
import flash.ui.Keyboard;

public class StrokeWidth extends Sprite
    {
    private var roundRect:Sprite = new Sprite();
    private var strokeThickness:Number = 6;

    public function StrokeWidth()
        {
        addEventListener(Event.ADDED_TO_STAGE, init);
        }

    private function init(evt:Event):void
        {
        removeEventListener(Event.ADDED_TO_STAGE, init);
        stage.addEventListener(KeyboardEvent.KEY_DOWN, keyDownEventListener);
        roundRect.addEventListener(MouseEvent.MOUSE_DOWN, mouseEventListener);
        roundRect.addEventListener(MouseEvent.MOUSE_UP, mouseEventListener);

        drawRoundRect();
        roundRect.x = roundRect.y = 100;
        addChild(roundRect);
        }

    private function drawRoundRect():void
        {
        roundRect.graphics.clear();
        roundRect.graphics.lineStyle(strokeThickness, 0x000000, 1.0, true, LineScaleMode.NONE, CapsStyle.NONE, JointStyle.MITER);
        roundRect.graphics.beginFill(0xFF0000);
        roundRect.graphics.drawRoundRect(0, 0, 400, 200, 100);
        }

    private function mouseEventListener(evt:MouseEvent):void
        {
        switch  (evt.type)
                {
                case MouseEvent.MOUSE_DOWN: roundRect.startDrag();  break;
                case MouseEvent.MOUSE_UP:   roundRect.stopDrag();   
                }
        }

    private function keyDownEventListener(evt:KeyboardEvent):void
        {
        switch  (evt.keyCode)
                {
                case Keyboard.LEFT:     strokeThickness -= 1;       break;
                case Keyboard.RIGHT:    strokeThickness += 1;
                }

        drawRoundRect();
        }
    }
}

【问题讨论】：

标签： actionscript-3 graphics rounded-corners linestyle miter

【解决方案1】：

重新创建形状怎么样？

【讨论】：

想象补间线条粗细。我相信管理简单地清除图形并重绘而不是从显示列表中删除以前的形状、实例化新形状、绘制形状并将其添加到显示列表中会更快、更容易。我的意思是，这不就是 clear() 函数的全部意义所在吗？
@TheDarkInI1978：也许是屏蔽？
这是一个想法，但此时我更想知道这是否是一个实际的错误。此外，我不确定遮罩是否会起作用，因为这些图形伪影是肤浅的。如果您将形状转换为精灵并使其可拖动，则当在工件上移动时，该形状就像工件的橡皮擦。
我认为重新创建它没有帮助。在执行 graphics.clear() 和重绘线条时，我遇到了同样的错误，只是为了让某些边缘保留在屏幕上。但 LineScaleMode 修复工作完美！

【解决方案2】：

有趣。问题是因为 lineStyle 的缩放模式设置为无：

LineScaleMode.NONE

将其更改为正常可以解决问题：

LineScaleMode.NORMAL

【讨论】：

谢谢！！只是在寻找相同问题的解决方案。解决方案完美！ :-)