Flex Hbox Creation complete not invoked - actionscript-3

I am trying to create an instance of Hbox like
obj = new HBox();
disp.addElement(obj); // disp object is border container but obj is mx component
this is the way I have been using a display object is adding to a parent container .
But it doesn't invoke the creation complete event.
I have been working on this last few days. Please help me.

<?xml version="1.0" encoding="utf-8"?>
<s:WindowedApplication xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx" initialize="windowedapplication1_initializeHandler(event)">
<fx:Script>
<![CDATA[
import flash.sampler.NewObjectSample;
import mx.containers.HBox;
import mx.controls.Alert;
import mx.events.FlexEvent;
protected function windowedapplication1_initializeHandler(event:FlexEvent`enter code here`):void
{
var hbo:HBox=new HBox();
hbo.addEventListener(FlexEvent.CREATION_COMPLETE,ff);
b.addElement(hbo);
}
public function ff(e:FlexEvent):void
{
Alert.show("created")
}
]]>`enter code here`
</fx:Script>
<fx:Declarations>
<!-- Place non-visual elements (e.g., services, value objects) here -->
</fx:Declarations>
<s:Group id="b">
</s:Group>
</s:WindowedApplication>

Related

In flex 4.5 parentDocument did not working as in flex 4.0. How to call parentDocument in flex 4.5?

In flex 4.0 this code works:
<s:WindowedApplication xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx" width="500" height="600">
<fx:Script>
<![CDATA[
import componentCanvas;
import mx.containers.TitleWindow;
import mx.controls.Alert;
public function createChild():void{
var c:componentCanvas = new componentCanvas;
c.x = 20;
c.y=20;
toInclude.addChild(c);
}
]]>
</fx:Script>
<mx:Button click="createChild()"/>
<mx:Canvas id="toInclude"/>
--componentCanvas --
<mx:Canvas xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx" width="400" height="300">
<fx:Script>
<![CDATA[
import componentCanvas;
import mx.containers.TitleWindow;
import mx.controls.Alert;
import mx.managers.PopUpManager;
import popAll;
public function oh():void{
Alert.show("From titleWindow");
}
public function open():void{
var pop:popAll = popAll(PopUpManager.createPopUp(this, popAll, true));
}
]]>
</fx:Script>
<mx:Label text="Canvas" x="100" y="100"/>
<mx:Button click="open()"/>
-- popAll --
<s:TitleWindow xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx" width="400" height="300" x="40" y="40" close="closePopUp()">
<fx:Script>
<![CDATA[
import mx.managers.PopUpManager;
public function closePopUp():void{
super.parentDocument.oh();
PopUpManager.removePopUp(this);
}
]]>
</fx:Script>
<mx:Button click="closePopUp()"/>
When I call parentDocument in titleWindow in flex 4 all is fine.
The same code in 4.5 did not work.
Is there a way to do this in Flex 4.5?
Calling parentDocument and using public functions across all the files is definitely not the best practice! Instead, you should really look into the Event Life Cycle in Flex and how to use it. In my opinion, public methods should really be created when you want to expose a particular functionality of your component to it's users.
Basically, you should dispatch an event from the popAll class and listen to it within it's instance created in componentCanvas. So, to solve this issue, your code should be :
popAll:
<s:TitleWindow xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx" width="400" height="300" x="40" y="40" close="closePopUp()">
<fx:Script>
<![CDATA[
import mx.managers.PopUpManager;
public function closePopUp():void{
this.dispatchEvent(new Event("closePopup"));
PopUpManager.removePopUp(this);
}
]]>
</fx:Script>
<mx:Button click="closePopUp()"/>
</s:TitleWindow>
and componentCanvas:
<mx:Canvas xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx" width="400" height="300">
<fx:Script>
<![CDATA[
import mx.controls.Alert;
import mx.managers.PopUpManager;
private var pop:popAll;
public function oh():void{
Alert.show("From titleWindow");
}
public function open():void{
pop = popAll(PopUpManager.createPopUp(this, popAll, true));
pop.addEventListener("closePopup", onClosePopupRequested);
}
protected function onClosePopupRequested(event:Event):void
{
pop.removeEventListener("closePopup", onClosePopupRequested);
oh();
}
]]>
</fx:Script>
<mx:Label text="Canvas" x="100" y="100"/>
<mx:Button click="open()"/>
</mx:Canvas>
As per the code above, I am dispatching a new Event called as closePopup from the popAll class and listening to it where I am creating it's instance. And then once the event is caught, I am removing the event handler and then calling your oh() method from within the event handler.
I would make a few more recommendations on your code:
Re-consider your naming convention of classes and methods, and please look into camel case naming convention
Avoid using too many public methods, instead use events to communicate between files/components. This would enable you to create loosely coupled components.
If you are moving to Flex 4.5, I would recommend you to use spark components instead of mx components. In my experience, they do have more versatility.
Look into creating constants for literals.
Hope this helps. Cheers.

"null object reference" error in ActionScript 3

I used my app's resize handler to resize my component but it is throwing this error :
TypeError: Error #1009: Cannot access a property or method of a null object reference
Here is my code :
<?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" minWidth="955" minHeight="600"
resize="application2_resizeHandler(event)" >
<fx:Declarations>
<!-- Place non-visual elements (e.g., services, value objects) here -->
</fx:Declarations>
<fx:Script>
<![CDATA[
import mx.events.FlexEvent;
import mx.events.ResizeEvent;
private var employeeName:String = 'ravi';
protected function application2_resizeHandler(event:ResizeEvent):void
{
mainGroup.width = stage.width - 10;
mainGroup.x = 5;
}
]]>
</fx:Script>
<s:Group width="100%" height="100%">
<s:VGroup id="mainGroup" >
<s:Label id="employeeNameLabel" text="{employeeName}" />
<s:Label id="departmentLabel" />
</s:VGroup>
<s:Button id="getData" />
</s:Group>
</s:Application>
You got the #1009 error because your resize event is fired before the creation of your objects. So, you should wait for that and that your app is added to the stage to be able to use the stage object.
For that, I think that the best event is the applicationComplete event, then you can add a resize event to resize your component ...
So you can do like this for example :
<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" minWidth="955" minHeight="600"
applicationComplete="application2_applicationCompleteHandler(event)" >
then
protected function application2_applicationCompleteHandler(event:FlexEvent):void
{
// if you want you can resize your component for the 1st time
// by calling the application2_resizeHandler() function
application2_resizeHandler(new ResizeEvent(ResizeEvent.RESIZE));
// add the resize event listener to your app
event.target.addEventListener(ResizeEvent.RESIZE, application2_resizeHandler);
}
Hope that can help.

calling a function in the <fx:Script> tags

I am a bit stumped. I thought it was possible to call a function within the fx:Script tag simply by referencing the function ("display_album()" as in the code below). It would make sense to have that function call outside the curly braces, but when I do, the debugger in FlashBuilder gives me the 1180 error, call to a possibly undefined method.
I can call the function with a button click (which makes sense too), and I get the proper trace in the FlashBuilder debugger.
But I am curious as to how I can call a function in the tag without adding a button. Thanks!
<?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" minWidth="955" minHeight="600">
<fx:Declarations>
<!-- Place non-visual elements (e.g., services, value objects) here -->
</fx:Declarations>
<fx:Script>
<![CDATA[
public function display_album():void
{
var album:String = "The White Album";
trace (album);
}
display_album();
]]>
</fx:Script>
<s:Button x="192" y="259" label="Button" click = "display_album()"/>
</s:Application>
<?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" minWidth="955" minHeight="600"
initialize="init()">
<fx:Declarations>
<!-- Place non-visual elements (e.g., services, value objects) here -->
</fx:Declarations>
<fx:Script>
<![CDATA[
private function init():void
{
display_album();
}
public function display_album():void
{
var album:String = "The White Album";
trace (album);
}
]]>
</fx:Script>
<s:Button x="192" y="259" label="Button" click = "display_album()"/>
I hope this helps.
You can't call an instance function like that, because it runs before the constructor is called. Since the instance itself has not been initialized yet, there is no scope within with this function can be executed. You can only call class functions before the constructor is called.
You can either convert the method into a class method through the static keyword (probably not right in this case), or trigger this method on the creationComplete event.

arraycollection error in flex4.6

I'm having difficulty passing json to a datagrid.
I get the following error:
TypeError: Error #1034: Type Coercion failed: cannot convert mx.collections::ArrayCollection#bc292a9 to Array.
at Function/<anonymous>()[C:\Users\Birger\Dropbox\Rich Media Applications\P006_Project\src\FULLTEST.mxml:10]
at Function/http://adobe.com/AS3/2006/builtin::apply()
at mx.binding::Binding/wrapFunctionCall()[E:\dev\4.y\frameworks\projects\framework\src\mx\binding\Binding.as:395]
at mx.binding::Binding/innerExecute()[E:\dev\4.y\frameworks\projects\framework\src\mx\binding\Binding.as:469]
at Function/http://adobe.com/AS3/2006/builtin::apply()
at mx.binding::Binding/wrapFunctionCall()[E:\dev\4.y\frameworks\projects\framework\src\mx\binding\Binding.as:395]
at mx.binding::Binding/execute()[E:\dev\4.y\frameworks\projects\framework\src\mx\binding\Binding.as:333]
at mx.binding::BindingManager$/executeBindings()[E:\dev\4.y\frameworks\projects\framework\src\mx\binding\BindingManager.as:153]
at FULLTEST/_FULLTEST_ArrayCollection1_i()[C:\Users\Birger\Dropbox\Rich Media Applications\P006_Project\src\FULLTEST.mxml:4]
at FULLTEST()[C:\Users\Birger\Dropbox\Rich Media Applications\P006_Project\src\FULLTEST.mxml:4]
my code is:
<?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" minWidth="955" minHeight="600" xmlns:components="components.*" initialize="getData.send();">
<fx:Declarations>
<!-- Place non-visual elements (e.g., services, value objects) here -->
<mx:HTTPService id="getData" url="http://localhost/P006_Project/Query.php"
useProxy="false" method="POST" resultFormat="text" result="getPHPData(event)">
</mx:HTTPService>
<s:ArrayCollection id="acItems" source="{dataArray}" />
</fx:Declarations>
<fx:Script>
<![CDATA[
import mx.collections.ArrayCollection;
import mx.events.FlexEvent;
import mx.rpc.events.ResultEvent;
[Bindable]private var dataArray:ArrayCollection = new ArrayCollection();
private function initDataGrid():void
{
getData.send();
}
private function getPHPData(event:ResultEvent):void
{
var rawArray:Array;
var rawData:String = String(event.result);
rawArray = JSON.parse(rawData) as Array;
dataArray = new ArrayCollection(rawArray);
}
]]>
</fx:Script>
<mx:Accordion id="accItems" creationPolicy="auto">
<s:NavigatorContent label="Frisdranken">
<components:FULLTESTCOMP acItems="{acItems}" creationComplete="{initDataGrid()}"/>
</s:NavigatorContent>
</mx:Accordion>
</s:Application>
so I'm trying to fill my datagrid with content from my database by converting it into JSON. I'm using a custom component (just an ordinary datagrid in this one).
Here is the problem:
<s:ArrayCollection id="acItems" source="{dataArray}" />
source needs to be of type "Array" but you're assigning the source to an ArrayCollection object.
You should do:
<s:ArrayCollection id="acItems" source="{dataArray.source}" />
Hope this helps.

pass variable from a component to TitleWindow in Flex4

I am trying to access a variable defined in an mxml component from a TitleWindow but I cannot get it. I also declared a variable in my titleWindow which references to the component. And I also tried using parentDocument to access the variable but in vain.
Any precious help on this. Thanks.
See my codes below:
This is my component (Comp.xml) where I have declared the variable testVar.
<?xml version="1.0" encoding="utf-8"?>
<s:Group xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
width="100%" height="100%">
<fx:Script>
<![CDATA[
public var testVar:String = "Testing";
]]>
</fx:Script>
</s:Group>
This is my titleWindow code:
<?xml version="1.0" encoding="utf-8"?>
<s:TitleWindow xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx" left="10"
creationComplete="titlewindow1_initializeHandler(event)"
width="100%" height="100%"
>
<fx:Script>
<![CDATA[
import mx.controls.Alert;
import com.Comp;
public var varComp:Comp;
public function titlewindow1_initializeHandler(event:FlexEvent):void
{
//Alert.show(new String(Application));
Alert.show(new String(varComp.testVar));
}
]]>
</fx:Script>
</s:TitleWindow>