title: Insane Graphics.lineStyle behavior
body: <p>I'd like some help with a little project of mine.</p>
  
  <p>Background:
  i have a little hierarchy of Sprite derived classes (5 levels starting from the one, that is the root application class in Flex Builder). Width and Height properties are overriden so that my class always remembers it's requested size (not just bounding size around content) and also those properties explicitly set scaleX and scaleY to 1, so that no scaling would ever be involved. After storing those values, draw() method is called to redraw content.</p>
  
  <p>Drawing:
  Drawing is very straight forward. Only the deepest object (at 1-indexed level 5) draws something into this.graphics object like this:</p>
  
  <pre><code>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();
  </code></pre>
  
  <p>Further on:
  There is also MouseEvent.MOUSE_WHEEL event attached to the parent of the object that draws. What handler does is simply resizes that drawing object.</p>
  
  <p>Problem:
  <a href="http://img231.imageshack.us/img231/1995/paintproblem.jpg" rel="nofollow noreferrer">Screenshot</a></p>
  
  <p>When resizing sometimes that hairline border line with LineScaleMode.NONE set gains thickness (quite often even >10 px) + it quite often leaves a trail of itself (as seen in the picture above and below blue box (notice that box itself has one px black border)). When i set lineStile thickness to NaN or alpha to 0, that trail is no more happening. </p>
  
  <p>I've been coming back to this problem and dropping it for some other stuff for over a week now.</p>
  
  <p>Any ideas anyone?</p>
  
  <p>P.S. Grey background is that of Flash Player itself, not my own choise.. :D</p>
  
  <p>As requested, a bit more:
  Application is supposed to be a calendar-timeline with a zooming "feature" (project for a course at university). Thus i have these functions that have something to do with resizing:</p>
  
  <pre><code>        public function performZoom():void
          {
              // Calculate new width:
              var newDayWidth:Number = view.width / 7 * this.calModel.zoom;
              if (newDayWidth &lt; 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 &amp;&amp; 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);
              }
          }
  </code></pre>
  
  <p>Yes. I know.. a lot of core, and a lot of properties, but in fact most of the stuff has been disabled at the end and the situation is as described at the top.</p>
  
  <p>this didn't work:</p>
  
  <pre><code>gr.lineStyle(); // Reset line style
  </code></pre>