Adobe Flex: Accessing Result Event From Main Application In Component MXML - apache-flex

In my main application I have a result event and an XMLList, which is filled with my results. The XMLList is defined outside of a function like so:
public var testList:XMLList = new XMLList();
But within my result handler it is populated with data from the result and it works fine. I need to create an external component MXML file that will contain a List, but from within that component file I can't access testList from the main application.
I have included xmlns:local="*" in each file and my component file also has the following imports:
import mx.collections.XMLListCollection;
import mx.controls.Alert;
import mx.core.Application;
import mx.events.FlexEvent;
import mx.rpc.events.ResultEvent;
I don't understand what I'm doing wrong.

You need to pass the testList as a property of your component.
Main - you have the testList from your result event and your custom component. Pass the testList to a property you've defined in the component, such as data:
<?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:local="*">
<fx:Script>
<![CDATA[
[Bindable]
public var testList:XMLList = new XMLList();
]]>
</fx:Script>
<local:CustomComponent data="{testList}" />
</s:Application>
CustomComponent - from the component you created, access the testList from a property, such as data in this example:
<?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">
<fx:Script>
<![CDATA[
[Bindable]
public var data:XMLList;
]]>
</fx:Script>
<s:List dataProvider="{new XMLListCollection(data)}" />
</s:Group>

Related

Display image with absolute path in Flex Air

I have very simple Flex Air application where I'd like to load image from documents directory:
<?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" creationComplete="init(event)">
<fx:Script>
<![CDATA[
import mx.events.FlexEvent;
protected function init(event:FlexEvent):void {
image.source = File.documentsDirectory.resolvePath('image.jpg').nativePath;
}
]]>
</fx:Script>
<s:BitmapImage id="image"/>
</s:WindowedApplication>
The problem is that Flex Air doesn't know how to handle native (absolute) path.
Looks very easy, but I don't know how to solve it...
You need a URL (or a ByteArray) to load an non-embedded image, so use the File's url property instead of its nativePath.
image.source = File.documentsDirectory.resolvePath('image.jpg').url;

flex 4 air app open modules in a new modal window

I am new to flex and I am trying to open modules in a new window modal.
I have managed to load and add a module in a container ( vbox ) but what I really need is to open them in separate windows.
All posts that I could find are samples on how to load modules but nothing on how to show them.
I found a post here
Modules and Panels issue
and it looks by the screenshot exactly what I am looking for.
Thanks for your help.
I found a way of doing this.
Thanks for all the pointers
here is how I did it for all of you to see and maybe use. If you have suggestions to make it better, do not hesitate to comment.
I am using a component : collapsabletitlewindow
mainapp.mxml
<?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"
xmlns:components="de.aggro.components.*">
<fx:Script>
<![CDATA[
import de.aggro.components.*;
private function createWindow():void{
var w:window = new window;
w.title = "Window " + container.numChildren;
container.addChild(w);
}
]]>
</fx:Script>
<components:CollapsableTitleWindowContainer id="container" width="100%" height="100%" >
</components:CollapsableTitleWindowContainer>
<s:Button buttonDown="createWindow()" label="Create Window" />
<fx:Declarations>
<!-- Place non-visual elements (e.g., services, value objects) here -->
</fx:Declarations>
</s:WindowedApplication>
window.mxml
<?xml version="1.0" encoding="utf-8"?>
<components:CollapsableTitleWindow 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:components="de.aggro.components.*" layout="absolute" width="400" height="300"
creationComplete="initApp()" >
<fx:Script>
<![CDATA[
import mx.events.ModuleEvent;
import mx.modules.ModuleManager;
import mx.modules.IModuleInfo;
import mx.core.IVisualElement;
public var info:IModuleInfo;
private function initApp():void {
info = ModuleManager.getModule("mod.swf");
info.addEventListener(ModuleEvent.READY, modEventHandler);
/* Load the module into memory. Calling load() makes the
IFlexModuleFactory available. You can then get an
instance of the class using the factory's create()
method. */
info.load(null, null, null, moduleFactory);
}
/* Add an instance of the module's class to the display list. */
private function modEventHandler(e:ModuleEvent):void {
this.addElement(info.factory.create() as IVisualElement);
}
]]>
</fx:Script>
<fx:Declarations>
<!-- Place non-visual elements (e.g., services, value objects) here -->
</fx:Declarations>
</components:CollapsableTitleWindow>
mod.mxml
<?xml version="1.0" encoding="utf-8"?>
<s:Module 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:Declarations>
<!-- Place non-visual elements (e.g., services, value objects) here -->
</fx:Declarations>
<mx:LinkButton x="131" y="124" label="Module link"/>
</s:Module>

Access Component Properties From Extending Component

I have a component with a public variable declared
[Bindable]
public var mnuSource:String;
When I extend this component, I can reference mnuSource (it compiles) but Runtime complains about the property not being accessible (error 1056).
How do you modify / declare component properties so they are actually available to other components?
Thanks
Same as The_asMan but in MXML
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:local="*"
>
<local:SomeExtendedComponent />
</s:Application>
Some Base Component
<?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">
<fx:Script>
<![CDATA[
[Bindable]
public var mnuSource:String;
]]>
</fx:Script>
<fx:Declarations>
<!-- Place non-visual elements (e.g., services, value objects) here -->
</fx:Declarations>
</s:Group>
Extended Component
<?xml version="1.0" encoding="utf-8"?>
<local:SomeBaseComponent 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:local="*"
creationComplete="cc(event)">
<fx:Script>
<![CDATA[
import mx.controls.Alert;
import mx.events.FlexEvent;
protected function cc(event:FlexEvent):void
{
mnuSource = "Hi there!";
Alert.show(mnuSource);
}
]]>
</fx:Script>
<fx:Declarations>
<!-- Place non-visual elements (e.g., services, value objects) here -->
</fx:Declarations>
<s:Label text="{mnuSource}" />
</local:SomeBaseComponent>
This is untested code but should work and give you a good idea how to extend a class.
MyBaseClass.as
package{
public class MyBaseClass{
public var someVar:String;
public function MyBaseClass( )::void{
this.someVar = 'set from MyBaseClass';
}
}
}
MyBaseclassExtended.as
package{
public class MyBaseclassExtended extends MyBaseClass{
public MyBaseclassExtended( ){
this.someVar = 'Set from MyBaseclassExtended';
}
}
}
call it like so
var asdf:MyBaseclassExtended = new MyBaseclassExtended();
trace( asdf.someVar ) // Set from MyBaseclassExtended

Alert gives PopUpManager error when used with SWFLoader

I am using SWFLoader to load a swf file. The code is below:
<?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>
<mx:SWFLoader source="alerttesting.swf"/>
</s:Application>
And the alerttesing.swf code is given blow:
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
width="100%" height="100%" fontFamily="Arial" fontSize="12"
xmlns:ilog="http://www.ilog.com/2007/ilog/flex"
xmlns:local="c7.views.apps.calendar.*"
backgroundColor="#FFFFFF">
<mx:Script>
<![CDATA[
import mx.controls.Alert
public function testingalerta():void{
Alert.show("sa;lfks;aljfa;sljf");
}
]]>
</mx:Script>
<mx:Canvas>
<mx:VBox>
<mx:Button click="testingalerta()"/>
<mx:Button label="aslkdfjasj" click="{Alert.show('sdfslfjlsjf;asjfa;sj');}"/>
</mx:VBox>
</mx:Canvas>
</mx:Application>
Every time I click the button I get the following error:
TypeError: Error #1009: Cannot access a property or method of a null object reference.
at mx.managers::PopUpManagerImpl/http://www.adobe.com/2006/flex/mx/internal::createModalWindow()[E:\dev\4.x\frameworks\projects\framework\src\mx\managers\PopUpManagerImpl.as:686]
at mx.managers::PopUpManagerImpl/addPopUp()[E:\dev\4.x\frameworks\projects\framework\src\mx\managers\PopUpManagerImpl.as:401]
at mx.managers::PopUpManager$/addPopUp()[E:\dev\4.x\frameworks\projects\framework\src\mx\managers\PopUpManager.as:193]
at mx.controls::Alert$/show()[E:\dev\4.x\frameworks\projects\framework\src\mx\controls\Alert.as:618]
at alerttesting/abcd()[C:\Users\zee\Adobe Flash Builder 4.5\calendar\src\alerttesting.mxml:12]
at alerttesting/___alerttesting_Button1_click()[C:\Users\zee\Adobe Flash Builder 4.5\calendar\src\alerttesting.mxml:16]
Can you explain how can I fix this issue.
Regards
Zeeshan
Jason was close. Not only do you have to import the PopUpManager but you also have to use it.
<fx:Script>
<![CDATA[
import mx.managers.PopUpManager;
private var manager:PopUpManager;
]]>
</fx:Script>
I found the answer here.
I think you just need to import the mx PopUpManager.
Try adding an import to your app:
<fx:Script>
<![CDATA[
import mx.managers.PopUpManager;
]]>
</fx:Script>

Flex 4: Event Listener created, but not being called?

I'm trying to call an event I've created in another component. I've added trace() into my methods so I can see what's being called. Everything except for the event listener (myEvent) is being called. Can anyone tell me why this is please?
Any help would be greatly appreciated. Thanks in advance.
// TestApp.mxml (application)
<?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"
xmlns:com="com.*"
creationComplete="initApp()">
<fx:Script>
<![CDATA[
import com.MyPopUp;
import mx.managers.PopUpManager;
protected function initApp():void
{
var popUp:MyPopUp = new MyPopUp();
PopUpManager.addPopUp(popUp, this);
}
]]>
</fx:Script>
<com:MyComp/>
</s:WindowedApplication>
// MyComp.mxml (component)
<?xml version="1.0" encoding="utf-8"?>
<s:VGroup 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%"
creationComplete="initComp()">
<fx:Script>
<![CDATA[
import mx.controls.Alert;
import mx.events.DynamicEvent;
protected function initComp():void
{
trace('init MyComp()');
this.addEventListener('myEvent', myEvent);
}
private function myEvent(event:DynamicEvent):void
{
trace('myEvent()');
Alert.show('Event Called!', 'Success');
}
]]>
</fx:Script>
</s:VGroup>
// MyPopUp.mxml (component)
<?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[
import mx.events.DynamicEvent;
import mx.managers.PopUpManager;
private function call(event:MouseEvent):void
{
trace('call()');
PopUpManager.removePopUp(this);
var evt:DynamicEvent = new DynamicEvent('myEvent');
evt.value1 = '1234';
dispatchEvent(evt);
}
]]>
</fx:Script>
<s:Button click="call(event)" label="Call Event"/>
</s:Group>
MyComp and MyPopup aren't in the same display list hierarchy, so the bubbling event isn't being seen.
If you are wanting to send messages across components in this way consider using some sort of global event dispatcher, using using a shared model between the two components in order to see data changes.

Resources