Tuesday, August 23, 2005

More on line strokes in Flash Player 8

Scott Fegette has a great overview of the enhancements we made to line stroke support in this version. As usual I have a little more insight I can give since I originally suggested and implemented these changes in Flash Player 8 (God, why haven't I done in this release? ;-)

I remember vividly the constant wining of customers about the fact that strokes are so limited in the Flash Player and that in many cases you had to revert to use fills to get the effect you wanted. This even affected the UI components, all of the outlines are drawn using fills instead of strokes. So with this baggage in my back me we started to finally bring strokes up to speed in Flash Player 8. It wasn't easy, let me tell you...

First I can talk a little about how time we spent on details. If you have read Scotts introduction you probably know what miter joints are by now. One of the more obscure but very important settings is the miter limit. The SVG specifications defines this property as such:

When two line segments meet at a sharp angle and miter joins have been specified for 'stroke-linejoin', it is possible for the miter to extend far beyond the thickness of the line stroking the path. The 'stroke-miterlimit' imposes a limit on the ratio of the miter length to the 'stroke-width'. When the limit is exceeded, the join is converted from a miter to a bevel.

So it will essentially avoid that a miter covers your whole stage in extreme cases. And this exactly how I implemented it originally. Until an old friend of mine with whom I had spent working on another vector drawing tool quite a few years back (it's still sold btw) complained about this part: When the limit is exceeded, the join is converted from a miter to a bevel. He had a point. When a miter is animated f.ex. in a skeleton object it means that the miter will suddenly 'snap' to a bevel joint which looks quite ugly. Obviously I did not know that the better solution was a pain to implement. But I did it. So now if you reach the miter limit the miter will simply be 'cut off' instead of reverting to a bevel joint. Once you start doing really fine animation you'll hopefully appreciate this little detail.

This brings me to a bug we fixed in Flash Player 8. Flash 8 will now support stroke sizes larger than 10 in the UI. No need anymore to scale up objects to get large strokes. While this is a great change it suddenly exposed an ugly rendering artifact. My first reaction to that artifact was: "Well, this is how Flash works!" During these times I really appreciate that Macromedia does not allow us to bring various instruments of pain into the office (clubs, baseball bats etc.) because from the look of our QA people I really got the message that they would have liked to use them on me in this moment. :-) So what is the problem? Here is a picture:

See the ugliness around the left side of the stroke? So this made large strokes essentially useless in Flash according to our QA people. Alright, the fix was actually fairly simple if you know it: We were using an approximation for computing square roots in the Flash Player to obtain some of the coordinates. Switching to a floating point using the standard C library square root fixed this. Puh, I am happy I was able to avoid the wrath of QA on this :-)

Now to something totally different and hopefully funny: Like most serious companies we use source control to develop on the Flash Player. One of things you always need to add is a check-in note with detailed descriptions of the changes to the source code. We are really strict about this. At the beginning of this release we were sending a copy of our check-in notes to each other through email using subject like this: "check-in for bug XXXXX" since we had no automatic system. It's really important to keep other developers in the loop. Being geeks we are the word 'check-in' in the email subject quickly morphed to 'checkin, 'chickin' and eventually simply 'chicken'. Something like "Important filter changes chicken, please read!" f.ex. Until one day I made changes to some of the stroke code and my email subject just proudly said: "Stroke chicken". Laughter ensued. Ah, the small things...


Blogger John said...

Can you comment on whether or not the Flash player bug has been fixed when using 1pt strokes on rounded-corner rectangles? The anti-aliased 1pt stroked line on the curve looks like it falls apart. I sure hope this has been resolved. Currently, if I need a 1 pt stroke on a curve, I end up converting the stroke to a fill.

Wednesday, August 24, 2005 12:50:00 AM  
Anonymous Anonymous said...

This relates to Flash Pro 8 and not the player, but I was searching on the internet and came across your site when trying to find a solution. When I create a vector shape in Flash or in Illustrator and am using it to animate with, I have noticed that Flash does an automatic point reduction on the object. Say I create a rectangle, it obviously has four points, one on each corner. However, if I want this to bend the way I want I add 2 more points to it, one on each side of the rectangle in between the corner points. However, as soon as I move the corner points in line with the midpoint it removes the midpoint from the shape. Is Flash trying to figure out what would be best for me? Because honestly, us artists really hate that. I would like to have the points that I create stay in tact for animation purposes.

Friday, March 10, 2006 11:51:00 AM  

Post a Comment

<< Home