疯狂的 Graphics.lineStyle 行为答案

【问题标题】：Insane Graphics.lineStyle behavior疯狂的 Graphics.lineStyle 行为
【发布时间】：2010-05-21 20:20:25
【问题描述】：

我的一个小项目需要一些帮助。

背景：我有一点 Sprite 派生类的层次结构（从一个开始 5 个级别，即 Flex Builder 中的根应用程序类）。 Width 和 Height 属性被覆盖，以便我的类始终记住它的请求大小（不仅仅是围绕内容的边界大小），并且这些属性明确地将 scaleX 和 scaleY 设置为 1，因此不会涉及缩放。存储这些值后，调用 draw() 方法重绘内容。

绘图：绘图非常简单。只有最深的对象（在 1-indexed 级别 5）会像这样在 this.graphics 对象中绘制一些东西：

var gr:Graphics = this.graphics;
gr.clear();

gr.lineStyle(0, this.borderColor, 1, true, LineScaleMode.NONE);
gr.beginFill(0x0000CC);
gr.drawRoundRectComplex(0, 0, this.width, this.height, 10, 10, 0, 0);
gr.endFill();

进一步：还有 MouseEvent.MOUSE_WHEEL 事件附加到绘制对象的父级。处理程序所做的只是调整该绘图对象的大小。

问题： Screenshot

有时，当使用 LineScaleMode.NONE 设置调整细线边界线的大小时，会增加粗细（通常甚至 >10 px）+ 它经常会留下自己的痕迹（如蓝色框上方和下方的图片所示（请注意该框本身有一个 px 黑色边框））。当我将 lineStile 厚度设置为 NaN 或将 alpha 设置为 0 时，该轨迹不再发生。

一个多星期以来，我一直在回过头来解决这个问题并放弃它来解决其他问题。

有什么想法吗？

附：灰色背景是 Flash Player 本身的，不是我自己的选择.. :D

根据要求，多一点：应用程序应该是具有缩放“功能”的日历时间线（大学课程项目）。因此，我有这些与调整大小有关的功能：

        public function performZoom():void
        {
            // Calculate new width:
            var newDayWidth:Number = view.width / 7 * this.calModel.zoom;
            if (newDayWidth < 1)
            {
                newDayWidth = 1;
            }
            var newWidth:int = int(newDayWidth * timeline.totalDays);

            // Calculate day element Height/Width ratio:
            var headerHeight:Number = this.timeline.headerAllDay;
            var proportion:Number = 0;
            if (this.view.width != 0 && this.view.height != 0)
            {
                proportion = 1 / (this.view.width / 7) * (this.view.height - this.timeline.headerAllDay); 
            }

            // Calculate new height:
            var newHeight:int = int(newDayWidth * proportion + this.timeline.headerAllDay);

            // Calculate mouse position scale on X axis:
            var xScale:Number = 0;
            if (this.timeline.width != 0)
            {
                xScale = newWidth / this.timeline.width; 
            }

            // Calculate mouse position scale on Y axis:
            var yScale:Number = 0;
            if (this.timeline.height - this.timeline.headerAllDay != 0)
            {
                yScale = (newHeight - this.timeline.headerAllDay) / (this.timeline.height - this.timeline.headerAllDay);
            }

            this.timeline.beginUpdate();

            // Resize the timeline
            this.timeline.resizeElement(newWidth, newHeight);
            this.timeline.endUpdate();

            // Move timeline:
            this.centerElement(xScale, yScale);

            // Reset timeline local mouse position:
            this.centerMouse();
        }

        public function resizeElement(widthValue:Number, heightValue:Number):void
        {
            var prevWidth:Number = this.myWidth;
            var prevHeight:Number = this.myHeight;

            if (widthValue != prevWidth || heightValue != prevHeight)
            {
                super.width = widthValue;
                super.height = heightValue;
                this.scaleX = 1.0;
                this.scaleY = 1.0;

                this.myHeight = heightValue;
                this.myWidth = widthValue;

                if (!this.docking)
                {
                    this.origHeight = heightValue;
                    this.origWidth = widthValue;
                }

                this.updateAnchorMargins();

                onResizeInternal(prevWidth, prevHeight, widthValue, heightValue);
            }
        }

是的。我知道..很多核心，很多属性，但实际上大部分东西最后都被禁用了，情况如顶部所述。

这不起作用：

gr.lineStyle(); // Reset line style

【问题讨论】：

我刚刚注意到的另一件事......这个问题似乎只有在我将窗口大小调整为大于默认大小（独立播放器）时才会出现......当我调整窗口大小时更宽/更高，这个问题就会出现。如果然后我将尺寸减小到大约原始尺寸，那么这个问题就不再存在了。至少在屏幕上不可见。

标签： actionscript-3 drawing flexbuilder

【解决方案1】：

我们可以查看您的调整大小代码吗？

还可以尝试清除线条样式和填充：

gr.lineStyle(0, this.borderColor, 1, true, LineScaleMode.NONE);
gr.beginFill(0x0000CC);
gr.drawRoundRectComplex(0, 0, this.width, this.height, 10, 10, 0, 0);
gr.endFill();
gr.lineStyle();//<---- add this line

【讨论】：

【解决方案2】：

不知道是flash bug还是什么，总算找到了解决办法。

问题是，在我的情况下，简而言之，当你调整大小时，你会得到这样的结果：

this.width = this.stage.stageWidth / 7 * 365;

当我切换到最大化窗口时，this.width 的值会增加 86k+。当我添加这段代码来绘制水平线时，它会自行修复：

        var recWidth:Number = this.width;
        var i:int;
        var newEnd:Number = 0;
        for (i = 1; newEnd < recWidth; i++)
        {
            newEnd = 100 * i;
            if (newEnd > recWidth)
            {
                newEnd = recWidth;
            }
            gr.lineTo(newEnd, 0);
        }

我不知道怎么回事..这很不方便...

【讨论】：