I know a lot of people have moved on to Flex 2 and Flash CS3 but there are many people that are still forced to use Flash 8 and earlier due to a variety of circumstances. I am one such individual.

In developing an app for a client I found an issue with V2 List and Tree that I had seen before but never really bothered with. Previously this issue was simply an annoyance. But in this current app the lnf needs to have a solid 1 pixel border around instances of the List and the Tree components.

The issue is a 1 pixel “extra” space between the left border and list items. No matter what you set the borderStyle to be the extra pixel is always there. This becomes very obvious when setting the borderStyle to none or solid and hovering over an item.

I started digging through the RectBorder class thinking there must be an issue there. When I created my own class based on the docs, I found that I had to set the offset to -1 to get rid of the extra pixel.

So I dug and found the culprit: mx.controls.listclasses.SelectableRow.

There is a method called drawRowFill. In that method there is a call to drawRect (a UIObject method) that offsets the movieclip by 1 pixel (line 242):

mc.drawRect(1, 0, __width, __height);

So, you can get rid of this by editing the SelectableRow.as file and either recompiling all of the components that depend on that class (not fun), or include an empty movieclip in your project called SelectableRow that has an identifier of SelectableRow and points to the AS2 class: mx.controls.listclasses.SelectableRow.

Edited code:

mc.drawRect(0, 0, __width, __height);

I really don’t know why the extra space is there. Often when there is something that seems unusual in a V2 class you’ll find a comment about it from the developer. Nothing in this case, though. If anyone knows why this was done or why altering it could cause an issue, please comment below.

I searched on Google before writing this but didn’t find anything after a few pages. I doubt I’m the first to run into this, but because I couldn’t find a solution by searching hopefully this will get indexed for others (and myself for future projects ).

…

Slight shift here. As I was proving out my code I noticed something spectacularly dumb: you need to change the borderStyle in frame 1 (or in the first frame that the component appears) otherwise the border metrics are wrong afterwards. What I mean is if you set the borderStyle to solid in frame 1 all is good. If you set it after frame 1, the border looks to be solid, but there is actually still a 2 pixel border (the default for Halo in this case). The outer border is the colour you specify (if you specified borderColor) but the inner border is white (from some other default).

This has nothing to do with the change I mentioned above since if you remove the change you still get an extra, extra space on the lefthand side.

If you do specify the borderStyle after frame 1 make sure to issue a call to setSize (just specify the instance’s current width and height). That will cause the component to get the metrics again and properly set the content within the border.