Set the default / global gap of a Flex Group / Layout to zero - css

Question

I have a few different views & screens which all use a few variants of Group, VGroup or HGroup and to have them laid out correctly, I find myself having to write and rewrite again with either
gap="0"
or with TileLayout
horizontalGap="0" verticalGap="0"
to get them all to layout correctly, and how I want. Currently the only option I see of being able to set them to zero globally is to set up a heavy global listener, ie.
protected function globalListener():void
{
addEventListener(Event.ADDED_TO_STAGE, onAddedToStage, true);
}
protected function onAddedToStage(event:Event):void
{
var g:Group = event.target as Group;
if(g)
{
if( g.layout.hasOwnProperty('gap') )
{
g.layout['gap'] = 0;
}
else
{
var l:TileLayout = g.layout as TileLayout;
if(l)
{
l.verticalGap = l.horizontalGap = 0;
}
}
}
}
or creating a new package with these layouts, and adding gap=0 to them,
package overrides.gapless
{
import spark.components.HGroup;
public class HGroup extends spark.components.HGroup
{
public function HGroup()
{
gap = 0;
}
}
}
and
package overrides.gapless
{
import spark.layouts.TileLayout;
public class TileLayout extends spark.layouts.TileLayout
{
public function TileLayout()
{
horizontalGap = 0;
verticalGap = 0;
}
}
}
and the like. I've checked the source code of the relevant files (mainly VerticalLayout, HorizontalLayout and TileLayout) and can see the values hardcoded in, but still can't fully believe there's no other way to do it.
I've only recently started delving into Flex, and am loving it's skinning options, but am a bit mystified about this one.
Thanks for any and all help as to how to do this.