flash - Flex ActionScript Project Error in Object Declaration.(project.mxml file) -

i have flex actionscript application, need draw simple rectangle in stage. using firstapp.mxml , class called book.as;

here complete code have done.

firstapp.mxml

<?xml version="1.0" encoding="utf-8"?> <mx:application      xmlns:mx="http://www.adobe.com/2006/mxml"      layout="absolute">      <mx:script>         <![cdata[             import com.books.book;             import flash.display.*;              var n:book = new book;             //n.var1 = "another string";             addchild(n);         ]]>     </mx:script>  </mx:application> 

book.as

package com.books {     import flash.display.*;      public class book extends sprite     {         public var var1:string = "test var";         public var var2:number = 1000;          public function book()         {              var b = new sprite;             b.graphics.beginfill(0xff0000, 1);             b.graphics.drawrect(0, 0, 500, 200);             b.graphics.endfill();             addchild(b);         }      } } 

i'm new in flex, please me fix this. want show rectangle.

since you're trying add flex component, need wrap book in uicomponent instance:

<?xml version="1.0" encoding="utf-8"?> <mx:application      xmlns:mx="http://www.adobe.com/2006/mxml"      layout="absolute">      <mx:script>         <![cdata[             import com.books.book;             import flash.display.*;              var n:uicomponent = new uicomponent;             n.addchild(new book);             addchild(n);         ]]>     </mx:script>  </mx:application> 

another way of doing instead make book inherit uicomponent, so:

package com.books {     import flash.display.*;      public class book extends uicomponent     {         public var var1:string = "test var";         public var var2:number = 1000;          override protected function updatedisplaylist(unscaledwidth:number, unscaledheight:number):void         {             graphics.beginfill(0xff0000, 1);             graphics.drawrect(0, 0, 500, 200);             graphics.endfill();         }     } } 

then can add book directly application, so:

<?xml version="1.0" encoding="utf-8"?> <mx:application      xmlns:mx="http://www.adobe.com/2006/mxml"      xmlns:books="com.books.*"     layout="absolute">      <books:book />  </mx:application> 

additionally, suggest read on flex component architecture. there's pretty documentation adobe on subject, should aware information specific flex 3 (i noticed you're using flex 3, hence link). while lot of information may still applicable flex 4 (the component lifecycle instance) there differences, in terms of skinning.