Question

I was using an mxml class but since i need to pass some properties at construction time, to make it easier i will convert it to as3 code.

The class is RectangleShape and it just draws a rectangle.

Original mxml working

<?xml version='1.0' encoding='utf-8'?> <BaseShape name='rectangle'     xmlns='org.edorado.edoboard.view.components.shapes.*'      xmlns:mx='http://www.adobe.com/2006/mxml'      xmlns:degrafa='http://www.degrafa.com/2007'     xmlns:objecthandles='com.roguedevelopment.objecthandles.*'>      <mx:Script>         <![CDATA[              import org.edorado.edoboard.view.components.shapes.IShape;             import mx.events.FlexEvent;              override public function drag(movePt:Point):void {                 this.width = movePt.x - this.x;                  this.height = movePt.y - this.y;              }              override public function updateFillColor(color:int):void {                 solidFill.color = color;             }          ]]>     </mx:Script>      <degrafa:Surface >         <degrafa:GeometryGroup id='geo'>             <degrafa:fills>                 <degrafa:SolidFill id='solidFill' color='white' alpha='0.3'/>             </degrafa:fills>              <degrafa:strokes>                 <degrafa:SolidStroke id='stroke1' color='white'/>             </degrafa:strokes>              <degrafa:RegularRectangle                  id='rect'                  fill = '{solidFill}'                 width='{width}'                  height='{height}'                 stroke='{stroke1}' />         </degrafa:GeometryGroup>             </degrafa:Surface> </BaseShape> 

My attempt to AS3

package org.edorado.edoboard.view.components.shapes { import com.degrafa.geometry.RegularRectangle; import com.degrafa.paint.SolidFill; import com.degrafa.paint.SolidStroke; import com.degrafa.GeometryGroup; import com.degrafa.Surface; import flash.geom.Point;

public class RectangleShape extends BaseShape  {     public var surface:Surface = new Surface();      public var geoGroup:GeometryGroup = new GeometryGroup();     public var solidFill:SolidFill = new SolidFill('white');     public var solidStroke:SolidStroke = new SolidStroke('black');     public var rect:RegularRectangle = new RegularRectangle();       public static const name:String = 'rectangle';      public function RectangleShape() {         addChild(surface);         //surface.addChild(geoGroup);         surface.graphicsCollection.addItem(geoGroup);           solidFill.alpha = 0.3;         rect.fill = solidFill;         rect.stroke = solidStroke;         rect.width = this.width;         rect.height = this.height;         geoGroup.geometry = [rect];         geoGroup.draw(null, null);      }      override public function drag(movePt:Point):void {          this.width = movePt.x - this.x;          this.height = movePt.y - this.y;          trace('dragging ', this.width, this.height);     }      override public function updateFillColor(color:int):void {         solidFill.color = color;     } } 

}

The problem is that the shape is not drawing anymore, the BaseShape container is there and i can see the trace drag working but not the rectangle anymore.

Any obvious stuff i missed ? Thanks

Answer 1

Try setting up the bindings with the BindingUtils class.

For example:

BindingUtils.bindProperty(component, 'height', this, 'height');