Solved

What are the methods we need to override while working with Custom Component in ActionScript?

Posted on 2011-02-22
7
966 Views
Last Modified: 2012-05-11
What are the methods we need to override while working with Custom Component in ActionScript?

Give me some sample snippet such that it should cover all the UIComponent methods to be implemented.

Also provide me the flow of the program execution.

Regards,
Naveen.
0
Comment
Question by:naveenm_006
  • 3
  • 2
  • 2
7 Comments
 
LVL 17

Expert Comment

by:deepanjandas
ID: 34949347
The methods that needs to be implemented in a Custom Component that extends UIComponent depends on your requirements.
The most common methods that needs to be overridden are
createChildren();
updateDisplayList(unscaledWidth:Number, unscaledHeight:Number);

Some available good tutorials for understanding UIComponent flow are here:
http://jwopitz.wordpress.com/2008/08/22/life-of-a-uicomponent/
http://danorlando.com/?p=122
http://www.adobe.com/devnet/flex/articles/itemrenderers_pt5.html
http://www.adobepress.com/articles/article.asp?p=778932&seqNum=2
http://livedocs.adobe.com/flex/3/html/help.html?content=components_04.html
http://www.scribd.com/doc/136930/Creating-and-Extending-Flex-Components
http://www.dremsus.com/index.php/tag/uicomponent/
http://jwopitz.wordpress.com/2008/08/22/life-of-a-uicomponent/#comment-5298

Warm Regards
Deepanjan Das
0
 

Author Comment

by:naveenm_006
ID: 34950003
Can you provide sample custom component.

Regards,
Naveen.
0
 

Accepted Solution

by:
jayasainaths earned 250 total points
ID: 34963801
Hi Naveen,

Firstly, create a actionScript Class file that extends the component you want to build.

Then you need to override some protected methods like
1. createChildren();
2.measure()
3.commitProperties()
4.updateDisplayList(unscaledWidth:Number, unscaledHeight:Number)


then, include this file in your main application...

Hmmm, bored right???


Here is the sample code...

//CODE FOR SuperPanel.as

package
{
      import flash.events.MouseEvent;
      
      import mx.containers.Panel;
      import mx.controls.Button;
      
      public class SuperPanel extends Panel
      {
            public function SuperPanel()
            {
                  super();
            }
            
            public var btn:Button;
            public var btn2:Button;
            
            override protected function createChildren():void
            {
                  super.createChildren();
                  
                  btn = new Button();
                  btn.width = 50;
                  btn.height = 15;
                  btn.x = this.width - 110;
                  btn.y = this. height - 290;
                  btn.label = 'min';
                  btn.addEventListener(MouseEvent.CLICK, onbtnClick);
                  
                  btn2 = new Button();
                  btn2.width = 50;
                  btn2.height = 15;
                  btn2.x = this.width - 60;
                  btn2.y = this. height - 290;
                  btn2.label = 'max';
                  btn2.addEventListener(MouseEvent.CLICK, onbtn2Click);
                  
                  
                  this.rawChildren.addChild(btn);
                  this.rawChildren.addChild(btn2);
            }
            override protected function measure():void
            {
                  super.measure();
            }
            override protected function commitProperties():void
            {
                  super.commitProperties();
            }
            override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void
            {
                  super.updateDisplayList(unscaledWidth, unscaledHeight);
            }
            
            
            protected function onbtnClick(e:MouseEvent):void
            {
                  this.height = 30;
            }
            protected function onbtn2Click(e:MouseEvent):void
            {
                  this.height = 300;
            }
            
      }
}




//CODE for the main application


<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" minWidth="955" minHeight="600" xmlns:local="*">
      
      <local:SuperPanel width="300" height="300" x="150" y="150"/>
</mx:Application>




Please Comment...

0
Enterprise Mobility and BYOD For Dummies

Like “For Dummies” books, you can read this in whatever order you choose and learn about mobility and BYOD; and how to put a competitive mobile infrastructure in place. Developed for SMBs and large enterprises alike, you will find helpful use cases, planning, and implementation.

 

Author Comment

by:naveenm_006
ID: 34967092
Can u briefly explain me abt these methods.ie., when to override etc., also tell me your code flow.

Regards,
Naveen.
0
 

Author Comment

by:naveenm_006
ID: 34967349
What is this two lines tells about:

 this.rawChildren.addChild(btn);
 this.rawChildren.addChild(btn2);
0
 

Expert Comment

by:jayasainaths
ID: 34968888
To create a custom component, that has a button (min) on the top of a panel, it is to be created just when the panel creates itself.

For instance, Panel gets created when the method createChildren() is called from its base class, UIComponent.

So, to add a button to the panel, it should be created along with the panel and when both of the components are still in their raw state, they are to be added to the display list.

Regarding the flow, as compiler uses the sequence that is similar to the one I have used in the above example.

Hope your doubt is clarified, if not, please drop a mail at jayasainaths@gmail.com

Dont forget to reward me... :)
0
 
LVL 17

Expert Comment

by:deepanjandas
ID: 34968962
This link will give you complete flow/life-cycle of UIComponent:
http://jwopitz.wordpress.com/2008/08/22/life-of-a-uicomponent/

Warm Regards
Deepanjan Das
0

Featured Post

Optimizing Cloud Backup for Low Bandwidth

With cloud storage prices going down a growing number of SMBs start to use it for backup storage. Unfortunately, business data volume rarely fits the average Internet speed. This article provides an overview of main Internet speed challenges and reveals backup best practices.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
Button and button function on separate pages. Possible? 16 414
flash develop problem when trying to build a package 1 277
learning partner 1 222
doubt future Flex 4 434
First things first - Preparation We need all the part for this install and it's much nicer to have them all on hand when you need them so here's what's required. Download Eclipse 3.5 32 bit (I like the Classic flavour) from here. (http://www.e…
Giving access to ESXi shell console is always an issue for IT departments to other Teams, or Projects. We need to find a way so that teams can use ESXTOP for their POCs, or tests without giving them the access to ESXi host shell console with a root …

856 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question