Function in a custom component

My question is, if I have a function (example: restore( )) that for example change the background color and I created 2 or more
of the custom component.
is there a way that if I call the function restore( ), can it change the background color of all the custom components in the application?
if so, how can this be done?
Thank you.

yes of course, if your component supports backgroundColor
you should declare your function public, and change backgroundColor inside it.
public function restore():void
     this.opaqueBackground = 0xFFFFFF;
     //or
     this.setStyle("backgroundColor","#FFFFFF");

Similar Messages

Calling a function from a custom component

I got source files from another company that did a flex project for us before I started working here. They have custom compenents (mxml files) that they are currently calling public functions in, but when I add a new public function to the mxml component, it won't allow me to call that function. It tells me it can't access a property of a method of a null object reference... but it still calls the function that was there before I started working with the file..
I cleaned the project, and did a "build all" but can't figure out why it won't allow me to create new public functions to call.... can anyone tell me why?

I have the partsLocator_panel in the mxml
not sure what "new" is with that... first time working with custom components, but it looks like your just working with custom classes in AS3...
<mx:Panel
width="100%" height="100%" layout="absolute" styleName="DashboardPanel" title="PARTS LOCATER" backgroundAlpha=".6" id="partsLocater_panel">
<mx:Image x="10" y="38" source="assets/icons/gear.png"/>
<mx:Image x="10" y="63" source="assets/icons/gear.png"/>
<mx:Image x="10" y="89" source="assets/icons/gear.png"/>
<mx:Label x="40" y="39" text="Block 30" width="227" styleName="DashboardText" click="openParts()"/>
<mx:Label x="40" y="63" text="Block 40" width="227" styleName="DashboardText" color="#9D9D9D"/>
<mx:Label x="40" y="88" text="Block 50" width="227" styleName="DashboardText" color="#9D9D9D"/>
</mx:Panel>

Passing function to a custom component

Hey so I have button that is in a custom component, say:
<mx:HBox width="200" height="72" xmlns:mx="http://www.adobe.com/2006/mxml">
    <mx:Button width="72" height="72" styleName="{buttonStyleName}"/>
    <mx:Text text="{description}" width="100%" height="100%" textAlign="justify"/>
</mx:HBox>
And on another file i use it simply like this:
<local:LabelComponent buttonStyleName="componentRssButton" />
However, I want the button on my custom component draggable, so I would like to pass a mouseMove handler but i could not find a way to do that. Of course that easiest way is to have my whole custom component draggable like so:
<local:LabelComponent mouseMove="componentRssButton" />
but i want the button in the custom component the only one draggable.
Thanks.

it's wired to pass a function.
EventListener should be the way to go.
give your button an id, say btn1
<mx:Button id='btn1' width="72" height="72" styleName="{buttonStyleName}"/>
and in your code
<local:LabelComponent id='myComp' creationComplete='makeButtonDraggable()' buttonStyleName="componentRssButton" />
<script>
function makeButtonDraggable():vd
     myComp.btn1.addEventListener(mouseMove, componentRssButton);

Custom component calling function from main.mxml

I have a main.mxml that has the following function in it:
public function SubChooseField(evt:Event):void{
Alert.show( "Sub has been chosen" );
main.mxml also places the following custom component:
<?xml version="1.0" encoding="utf-8"?>
<mx:ComboBox xmlns:mx="
http://www.adobe.com/2006/mxml"
width="180" close="parent.SubChooseField(event)">
<mx:dataProvider>
<mx:Object data="1" label="choice 1 />
<mx:Object data="2" label="choice 2" />
<mx:Object data="3" label="choice 3" />
</mx:dataProvider>
</mx:ComboBox>
I want it so that when you chose one of the options in the
comboBox, it will call the function SubChooseField in the
main.mxml. But when I compile this, no matter what i try, i get the
error:
Error: Call to a possibly undefined method SubChooseField
through a reference with static type my_custom_opponent.
OR if i change the codeand remove the 'parent' to say:
close="SubChooseField(event)"> i get error:
Error: Call to a possibly undefined method SubChooseField.
any help much appreciated.

Rather than trying to use parent, using events might help
here. In your main mxml file, just listen for the change event that
is dispatched from your custom component. Since it is a ComboBox
component, it automatically dispatches this event. If your
component was more complex, you would need to dispatch a custom
event.
If your custom component was named CustomCombo, then the mxml
in your main file would look something like this:
<ns1:CustomCombo id="cb" x="70" y="39" width="160"
change="SubChooseField(event)"/>
Vygo

Decode function not called for a custom component

I know this problem happened in the past - in the EA2, EA4 and I believe the beta version as well, but does anyone know if it has been solved for the release ?
In short - I'm working with the release, created a menuBar component and the decode method in the renderer is not called after I submit the page. In the past, there were rumors that this happened due to relative paths in the JSP (for js files, images, etc.).
Does anyone else have this problem ? or better , know how to solve it ?
Thanx,
Netta.

It's not that simple - The component is getting rendered, all the encode methods are called and the decode is called also , but only the first time the form is submitted.
I added this custom component to the guessNumber application, and I have a menuBar in the greeting.jsp that leads to the response.jsp and vice versa. it looks like this in the greeting.jsp page -

<t:MenuBar id="bar1" styleClass="myClass" >
<t:Menu id="menu1" name="menu1">
<t:Menu id="menu2" name="menu2">
<t:MenuItem id="item2_1" name="item2_1" action="/mytest/guess/response.jsp"/>
<t:MenuItem id="item2_2" name="item2_2" action="http://www.msn.com"/>
<t:Menu id="menu3" name="menu3">
<t:MenuItem id="item3_1" name="item3_1x" action="http://www.msn.com"/>
</t:Menu>
</t:Menu>
</t:Menu>
<t:MenuItem id="item3" name="item3" action="http://www.cnn.com"/>
</t:MenuBar>

In the response it looks like this -

<t:MenuBar id="bar2" styleClass="myClass" >
<t:MenuItem id="item3" name="item3" action="/mytest/guess/greeting.jsp"/>
</t:MenuBar>

and every time a menuItem is clicked on, the JS calls submit form.
Since the menus are rendered, I assume there's nothing wrong with the rendererType and any other renderer problem. Since the decode is called only once, I assume the right form is being submitted.
So, what can cause it to stop calling the decode ???
Could it be that becase I go directly to the page and not through the navigation rules ( I call window.open directly from the JS), it creates a problem ??
Please help, I've been wasting so much time on this !
Netta.

How to use a flex custom component in an AS3 Class?

Our software team has been developing flash applications using AS3 (via the FlashDevelop IDE and the free Flex SDK). Recently, some members of the team started exploring FlexBuilder and Flex (wow... why did we wait so long?). The problem is that some folks continue to develop using pure Action Script 3 (FlashDevelop) while others are creating custom components in FlexBuilder.
How do the AS3 developers use the Flex Custom components built in FlexBuilder in their AS3 Applications?

SwapnilVJ,
Your suggestions enabled me to make progress, but I'm still having a problem. Based on you suggestion, I learned how to make a swc using Flex Builder. I successfully added the swc to the lib resource in my AS3 project (FlashDevelop). I was able to instantiate one of my new components (code hinting even picked it up from the lib).
When I run my app, my component is not visible. I can trace properties of it and the values are correct. Any thought why I might not be seeing my custom component?
package trainer.games.board.MatchThree {
import flash.display.Sprite;
public class Test extends Sprite{
private var cp:MatchingGameControlPanel; // <<< this is my swc custom component created in Flex
public function Test() {
   cp = new MatchingGameControlPanel();
   cp.visible = true;
   addChild(cp);
   trace("width: ",cp.width); // <<< works and displays valid data for the component.

Dynamic attribute in a custom component

has anybody tried generating an attribute dynamically in a custom component
e.g
<cx:inputText value="" foo="footest"/>
where foo is not defined in the custom inputtexttag.java
can we have a hashmap which stores all the unknown attributes into the hashmap upon loading and then handle it in the setproperties

can we have a hashmap which stores all the unknown
attributes into the hashmap upon loading and then
handle it in the setpropertiesJSF's UIComponent has a function of generic attributes.
Use <f:attribute>.
<cx:inputText value="" foo="footest"/> Anyway, if you want to use the syntax like this, you should provide a custom
tag handler which has a setFoo() method and whose setProperties() method
copys the value to the corresponding (generic) attribute of the component.

Custom Validator for a Custom Component

I am having troubling passing values from my custom component
to my custom validator (via a model). For some reason when the
validate() function is called for the validator the value parameter
passed to the validator is not showing the value from my custom
component.
I have attached some example code to illustrate.
Here is my model:
<mx:Model id="myModel">
<root>
<mod>
<name>{myTextInput.text}</name>
<date>{myDateField.selectedDate.getTime()}</date>
<length>{myComp.getLength()}</length>
</mod>
</root>
</mx:Model>
When I update the value of myTextInput or myDateField the
model (as sent to the validator) shows the correct value. When I
change the value of myComp the change is not reflected.
Is there a particular event (or something) being dispatched
in the other components to cause the model to get the new value
that I need to include in my custom component? I am pretty stuck
and would appreciate any help.
Many thanks

Does myComp extend EventDispatcher (or any class which does)?
You need to flag the getLength() function as bindable and to
dispatch an event:
[Bindable('getLengthChange")]
public function getLength() : Number
// does whatever it does
When you update myComp have it dispatchEvent( new
Event("getLengthChange") ) and I think it will work.

Using Predicate filters in a Custom component

Hello,
I have a cusom datagrid component, which gets it's data from a XMLListCollection object. The xmlList is a simple <employess><employe1><fname/><lname/></emloye1></employees>
I have a text input as a part of this custom component. I am creating a change event on the control to trigger a filter function filterGrid(). I want the frid to dynamically change data as the user types the characters. Currently i have hardcoded my predicate filter to filter the grid whenever the first char matches J. How can i change this to read the chars from the text input.
            private function filterGrid(event:Event):void {
                if(text1.text!="") {
                    myXMLCollection.filterFunction = filterEmp;
                }else {
                    myXMLCollection.filterFunction = null;
                myXMLCollection.refresh();
            private function filterEmp(item:XML):Boolean {
                var searchResult:XMLList;
                searchResult = item.(/^J/.test( fname ) );//Help need here
                trace(searchResult);
                if(searchResult.length()>0) {
                    return true;
                return false;
Thanks,

I got this to work
var pattern2:RegExp = new RegExp(text1.text, "i");\
searchResult = item.(pattern2.test( fname ) || pattern2.test(lname) );
But have another problem, the regex matches any charater and not the first chars as i type them for example
IF i have
John Macey
Tracy Jordon
and if i type 'c' in the textnpt i get both John Macey and Tracy Jordon.
Will dig further,

Multiple output-parameters in a custom component

Is it possible to develop a custom component that returns multiple outputs?
I know that I can define multiple tag <output-parameter> in component.xml, but I don't know how the method of my class can return multiple Objects...
Thanks,
Fabio

You can have multiple getters and setters function that will set or return multiple parameters. Each output parameter can be set to a specific function.
Jasmin

FocusOut in a custom component

Hi.
I made a custom component using a Canvas with a TextInput and a Button inside.
I need to make a focusOut event to be called when the focus go out of my custom component, but not be called when the focus change beetween the inputtext and the button inside the canvas.
How can I do that?
Tanks.

Hi this is simple.Please try this sample.
<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
               xmlns:s="library://ns.adobe.com/flex/spark"
               xmlns:mx="library://ns.adobe.com/flex/mx" xmlns:Cn="*" creationComplete="Init()">
    <fx:Script>
        <![CDATA[
        import flash.events.Event;
        import mx.controls.Alert;
        private function Init():void
            objTemp.addEventListener("FocusOut", FocusOutHandler);
        private function FocusOutHandler(event:Event):void
            trace("CanCom's focus out");
        ]]>
    </fx:Script>
    <fx:Declarations>
        
    </fx:Declarations>
<s:HGroup>
    <s:TextInput></s:TextInput>
    <Cn:CanCom id="objTemp"></Cn:CanCom>
    <s:TextInput></s:TextInput>
</s:HGroup>
</s:Application>
_____________________________________ CanCom.mxml ______________________________________
<?xml version="1.0" encoding="utf-8"?>
<s:HGroup xmlns:fx="http://ns.adobe.com/mxml/2009"
               xmlns:s="library://ns.adobe.com/flex/spark"
               xmlns:mx="library://ns.adobe.com/flex/halo">
    <fx:Script>
        <![CDATA[
        import flash.events.Event;
        private function FocusOutHandler(event:Event):void
            try{
            if (this.getFocus() == btnTemp || this.getFocus().parent.parent == txtTemp)
                return;
            }catch (err:Error) { }
            dispatchEvent(new Event("FocusOut"));
        ]]>
    </fx:Script>
    <s:TextInput id="txtTemp" focusOut="FocusOutHandler(event)"></s:TextInput>
    <s:Button id="btnTemp" focusOut="FocusOutHandler(event)"></s:Button>
</s:HGroup>

Component property declaration in a Custom Component

Hello everyone,
I have a question related to a custom component. I will define a use case and how I want to define a property.
e.g.: I develop a custom component using Flex Library Project, with all manifest.xml, design.xml, locale etc. My component name is CustomList, now in this component, I define a property with following getter/setter.
// defaultState
private var _defaultState:CustomState;
[Bindable( "defaultStateChange" )]
//I have tried defining type property as CustomState, doesn't works
[Inspectable( category="General", name="Default State" )]
public function get defaultState():CustomState
     return _defaultState
public function set defaultState( v:CustomState ):void
     if ( _defaultState!= v)
          _defaultState = v
          dispatchEvent(new Event("defaultStateChange"))
Here, CustomState extends MXMLObjectAdapter and defines a id property and few other property. and In mxml I can define it like this,
<CustomList ....>
     <defaultState>
          <CustomState label="" icon="" />
     </defaultState>
</CustomList>
Now, what I want to achieve is, I want to define property something like this:
<CustomList ....>
     <defaultState label="" icon=""/>
</CustomList>
Can someone tell me how to achieve this and point me to some description about it.
Thanks in advance.
Chetan Sachdev

@Ryan:
Thanks for your reply. For type property in Inspectable metadata tag: http://livedocs.adobe.com/flex/gumbo/html/WS2db454920e96a9e51e63e3d11c0bf680e1-7ffe.html#W S2db454920e96a9e51e63e3d11c0bf69084-7a21
It can have values like Boolean, Array, String etc. I am trying to have a custom one. But I notice that I have to close the property tag, even if it is a string or html for e.g. text property in TextInput, I have to write something like this:
<mx:TextInput>
        <mx:htmlText>
            <![CDATA[
            ]]>
        </mx:htmlText>
    </mx:TextInput>
and
<mx:TextInput>
        <mx:text>something</mx:text>
    </mx:TextInput>
But I still think, it should be there. Not sure
Chetan

Flex Print Job not working with custom component

Hi All,
I have to print pages with header, body and footer. So the thought process was to create a custom component fro header, footer and body. Header component is based on Box, Body is a renderer (which will have fix value of items - and will decide the number of possible pages) and footer is again based on Box.
But when i created a simple Custom component like this for header
<?xml version="1.0" encoding="utf-8"?>
<mx:VBox xmlns:fx=http://ns.adobe.com/mxml/2009
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx">
<fx:Declarations>

</fx:Declarations>
<mx:HBox>      <mx:Label id="testLabel" text="Test Container"/>
</mx:HBox>
</mx:VBox>
Then when i try to add this to FlexPrintJob, and save it as 'xps' to see the print output, i get error message that this file is in use or damaged.
    var myPrintJob:FlexPrintJob = new FlexPrintJob();
if(!myPrintJob.start()){
      return;
var header:Header = new Header();
header.width = myPrintJob.pageWidth;
header.visible = false;
FlexGlobals.topLevelApplication.addChild(panierPrintHeader);
myPrintJob.addObject(header);
myPrintJob.send();
FlexGlobals.topLevelApplication.removeChild(panierPrintHeader);
But this does not work and i get the above mentioned exception. Now when i not use the custom component and just have a label or HBox or anything on stage before the print functionality is invoked, it works fine. And this too haapens only if you have a mxml component, i tried by creating a new Label component using actionscript and then provide the same to the printJob, which did not work either. I need help on this, else i will have to take print functionality to server side(Java) which has some business implications, the reason why i am spending time on flex for printing.
Thanks and Regards,
Jigar
Looks like custom component print is not working fine with flex or i am doing something terribly wrong.
Looking forward for help.

Is there nobody in flex community who can help on this....
Looks like a toothless class that adobe actionscript team has provided, which is not liked across much

Custom component property value handling at run time

I would like to develop simple custom component which has three properties PROP1, PROP2 & RESULT . These parameters are bound to excel sheet cells as follows..
cell A1 connected to PROP1
cell A2 connected to PROP2 and
cell A3 connected to RESULT.
In excel A1 cell has excel formula set as =IF(A2<5,10,0).
Custom component would be simple button display at runtime and on click of the same, I would like to perform following actions in sequence with N number of times.
1. First push any random number to PROP2. (which is simple task, I believe)
2. Pick new value of PROP1 which is changed due to existance of excel formula (+ using dispatchevent I could able to pass value to excel cell A2. But not able to read new value of PROP1+)
3. check new PROP1 value equal to 10. If it is 10 then count it otherwise again push new random value to PROP2.
4. Continue step 1 to 3 till N number of times. and finally
4. Push number of counts for PROP1 value 10 to RESULT parameter.
All the parameters are bindable (getter/setter with [Bindable]) in Flex component application and flex propertysheet application use binding ID to bind with cell address. with binding direction BOTH and SINGLETON
Here is flex function code which triggered at button click.
public function test002():void {
while ( N < 100)
this.PROP2 = Math.round(Math.random()*1000);
dispatchEvent(new PropertyChangeEvent(PropertyChangeEvent.PROPERTY_CHANGE, false, false, PropertyChangeEventKind.UPDATE, "PROP2", null, PROP2, this));
     if (this.PROP1 == 10)
      cnt++;
   this.RESULT = cnt;
My observations are as follows.
- new push of value to PROP2 get reflected to excel A2 when button click event is over, not at the time of while loop process execution.
- Also I observed PROP1 value never changes and it is the value which is recorded just before button click event of component at run time and remain the same till button click event is over.
- Further to this I notice as click event is over, new value of PROP2 reflected in cell A2 and change value (if it passes IF formula of excel ) in A1 as well. Next button click action takes these new A1 and A2 values in consideration and process the function "test002".
I would like to understand possibility of custom component event execution process, which can able to pass as well as read value from component parameters to underlying excel with changes due to excel formula existance. If it is not limitations (If so) what is the set of commands which can be helpful to achieve this. I appreciate if anybody explain typical event execution required in such scenarios with some actionscript code directions.
Thanks
Sandesh
Edited by: Sandesh Darne on Feb 8, 2010 11:48 AM
Edited by: Sandesh Darne on Feb 10, 2010 5:23 AM

Marton,
I have tried your solution. It works well immediately after xcelsius dashboard get displayed or preview. It does not wait click event to happen. So I modified further by adding one switch ( "switch001" in code piece shown below) to control iteration by click event. That stops running of iteration immediate after dashboard display.
In order to see iteration I have to click twice on button. First click does send "frm" parameter value to excel and excel formula operates. The excel formula result send back to component via SETTER of "frmResult" . But it stops over there. If I click second time the iteration starts for 100 times.
Also I try to export this to PDF. PDF file get generated. If I try to open PDF file it raise error.
My code is attached here.
"frm" is the parameter that sends random number to excel.
"frmResult" parameter receives excel formula output and send it back to component.
"test()" function operate on button click event and set switch001 and then calls "Calc" function for iterations.
MXML code..........
<mx:VBox>
       <mx:TextInput id="frmResultLabel" width="100" />
       <mx:Button label="test..." click="test()"/>
</mx:VBox>
Actionscript code
public var cnt:int;
          public var N:int = 0;
          public var sum:int = 0;
          public var switch001:Boolean = false;
         public function test():void {
               N = 0;
               sum = 0;
               switch001 = true;
          public function Calc():void {
          if (switch001 == true)
            if (N < 100)
                this.frm = Math.round(Math.random() * 1000);
            else if (N == 100) // return the result
                 this.frmResult = sum;
                 // Label component use to display frm and frmResult values at runtime
                 frmResultLabel.text = sum.toString() + ">" + this.frm + ">" + this.frmResult;
             N++;
          [Bindable]
          private var _frm:int;
          private var _frmChanged:Boolean = true;
          [Bindable]
          public function get frm():int
               return _frm;
          public function set frm(value:int):void
               //if (value == null) value = 0;
               if (_frm != value)
                    _frm = value;
                    _frmChanged = true;
                    invalidateProperties();
          override protected function commitProperties():void
             super.commitProperties();
             if (_frmResultChanged == true)
                    // start the cycle again by generating a new random number,
                    // or write out the result
                    Calc();

Reset custom component

Hello!
I have an app with some states.
Each state shows a different custom component.
My problem is that if someone types somthing in one of the states then changes state and then comes back the text will still be there.
Is there a way to reintitialize the custom component on each state chage or do I have to create functions to reset everything myself?
Thank you!

Ok, thank you.
Were they only Form fileds it would have been nice and easy.
I have some AMF calls etc.
I could probably remove the component with removeChild and add it when it's accessed again I guess, but that doesn't seem too elegant.

Function in a custom component

Similar Messages

Maybe you are looking for