Flex - creating new Primitives

To start - its best to say im new to Flex / OOP in general. I have been trying to ad开发者_高级运维d a custom class based on StrokedElement in order to implement a simple grid (not like the existing Flex Grids - this would just be for display - not holding elements etc...)

My current class looks like this:

package ui.helpers
{
    import flash.display.Graphics;

    import spark.primitives.supportClasses.StrokedElement;

    public class SGrid extends StrokedElement
    {
        public function SGrid()
        {
            super();
        }

        private var _gridSize:Number;
        [Inspectable(category="General", minValue="1.0")]

        public function get gridSize():Number 
        {
            return _gridSize;
        }

        public function set gridSize(value:Number):void
        {        
            if (value != _gridSize)
            {
                _gridSize = value;
                invalidateSize();
                invalidateDisplayList();
                invalidateParentSizeAndDisplayList();
            }
        }

        override protected function draw(g:Graphics):void {

            for(var x:int; x < width; x+= _gridSize) {
                g.moveTo(x,0);
                g.lineTo(x,height);
            }
            for(var y:int; y < height; y+= _gridSize) {
                g.moveTo(0,y);
                g.lineTo(width,y);
            }

        }

    }
} 

Which is cribbed from the Flex spark.primatives.rect - everything works OK - but when I add it to my application I would expect to do this:

<helpers:SGrid id="gridOne" width="100" height="200" gridSize="10">
        <s:stroke>
            <s:SolidColorStroke color="0xCCCCCC" alpha="0.8" />
        </s:stroke>
    </helpers:SGrid>

but in actual fact this works instead:

<helpers:SGrid id="gridOne" width="100" height="200" gridSize="10">
        <helpers:stroke>
            <s:SolidColorStroke color="0xCCCCCC" alpha="0.8" />
        </helpers:stroke>
    </helpers:SGrid>

If I use the s:stroke then I get errors. Obviously i'm pleased it works - but i'm trying to understand why the difference here?

It's to do with the declared namespace of the class.

SGrid is part of the helpers: namespace, not the s: namespace.

Therefore, when setting it's properties you need to reference the property via the helpers: namespace.

It doesn't matter that the property itself was declared on a baseclass of SGrid (in your case, StrokedElement), it's a property of the instance of SGrid.

It's the same as:

var grid:SGrid = new SGrid();
grid.stroke = new SolidColourStroke(); 

Even though stroke is declared on the base class, you reference it through the SGrid class.