How to include an actionscript function from an external file in flex4/MXML/Spark? - actionscript-3

It turns out that’s it’s impossible to declare a class inside a embedded <fx:Script><![CDATA[ so it turns I need to put and include the actionscript code inside an external Sourcefile. The error is commented out
<?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="1955" minHeight="1600">
<fx:Script source="URLRequest.as" />
<s:layout>
<s:BasicLayout />
</s:layout>
<s:Panel x="0" y="0" width="955" height="600" title="Bypass">
<s:layout>
<s:BasicLayout />
</s:layout>
<s:Label x="1" y="1" text="Please enter the ɢɪᴛ repository ʜᴛᴛᴘ ᴜʀʟ :"/>
<s:TextInput x="224" y="1" width="726" id="txtName" text="http://ytrezq.sdfeu.org/flashredirect/?http"/>
<s:Button x="1" y="12" label="ɢɪᴛ push !" click="send()"/> <!-- Undefined Method method error -->
</s:Panel>
<fx:Declarations>
</fx:Declarations>
</s:Application>
and in URLRequest.as :
final public class MyClass {
// some stuff
}
public function send():void {
var request:Myclass=new Myclass(txtName.text);
// Some stuff with
}
So the question is simple but I couldn’t found the answer anywhere. At least not with for mxml with Spark.
send() doesn’t need to be in a class and as you can see is outside a class. But it needs to use a custom class.
So how can I call send() from URLRequest.as ?

Now that I finally understand what you want to do, I've another idea - which is a little more complicated.
Create a file called Dummy.as and fill it with this:
package
{
public class Dummy
{
public static function send(url:String):void
{
var request:Myclass=new Myclass(url);
}
}
}
class Myclass
{
public function Myclass(inp:String)
{
trace(inp);
}
}
Again, get rid of
<fx:Script source="URLRequest.as" />
and replace it by
<fx:Script>
<![CDATA[
import Dummy;
]]>
</fx:Script>
and finally replace
<s:Button x="1" y="12" label="ɢɪᴛ push !" click="send()"/>
with
<s:Button x="1" y="12" label="ɢɪᴛ push !" click="Dummy.send(txtName.text)"/>
The trick here is that we're importing the Dummy class that just has a static function which we can call without instantiating.
Furthermore - as long as we define it outside of the package, we can add more class definitions, which are visible to the Dummy class.

I'm also not too sure what you're trying to do but here's a possible way:
Create an empty file called Myclass.as in the same folder as your .mxml file and insert these lines
package
{
public class Myclass
{
public function Myclass(inp:String)
{
trace(inp);
}
}
}
Now get rid of
<fx:Script source="URLRequest.as" />
and replace it by
<fx:Script>
<![CDATA[
public var request:Myclass;
public function send():void {
request=new Myclass(txtName.text);
}
]]>
</fx:Script>

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.

Dynamically generated MXML data doesn't get rendered

So I have a requirement to display dynamically generated data in the view.
For this, my idea was to create a mxml file and then use it as an object. Fill the data in the ibject and then use addChild to display it. But even after adding all the data. The dynamically generated mxml file doesn't gets displayed.
Code
BuyTogetherGrid.MXML
<?xml version="1.0" encoding="utf-8"?>
<mx:Box xmlns:mx="http://www.adobe.com/2006/mxml" width="80" height="60" xmlns:image="org.commodity.detail.image.*">
<mx:HBox>
<image:ImageBox id="buyTogetherImg"></image:ImageBox>
<mx:VBox id="textInfo">
<mx:Box id="commonNameBox">
<mx:Label id="commonName">
</mx:Label>
</mx:Box>
<mx:Box id="commonPriceBox">
<mx:Label id="commonPrice">
</mx:Label>
</mx:Box>
</mx:VBox>
</mx:HBox>
<mx:Script>
<![CDATA[
public function createGrid():void{
this.buyTogetherImg = new ImageBox();
this.commonName = new Label();
this.commonPrice = new Label();
}
]]>
</mx:Script>
</mx:Box>
This is my MXMl File. My idea was to create an object of this mxml object. Add data to buyTogetherImg, CommonName, CommonPrice and then use addChild
Part where I set the data
<mx:HBox id="buyTogetherBox" width="100%" borderColor="black">
</mx:HBox>
The upper HBox is the container where I will keep all my generated object
var buyTogetherBox : BuyTogetherGrid = new BuyTogetherGrid();
buyTogetherBox.createGrid();
for each(var item:cmListItem in commod.items){
if(item.dataFormat == 2){
buyTogetherBox.buyTogetherImg.imgData = item.value as ImageData;
} else if(item.dataFormat == 0){
buyTogetherBox.commonName.text = item.value.toString();
} else if(item.dataFormat == 3){
buyTogetherBox.commonPrice.text = StringUtil.numToStrPrice(item.value as Number);
}
}
this.buyTogetherBox.addChild(buyTogetherBox);
}
The code check some conditions and add the data. However the buyTogetherBox is not visible. But if I try something like
this.buyTogetherBox.addChild(buyTogetherBox.buyTogetherImg);
then i can see the image in the H:Box.
I am pretty new to Flex. so may be I would have missed something
You are leaving the statically created instances of the label and image control unused and creating new instances instead. Basically, the entire createGrid() function is unnecessary. You already have the controls created in MXML. Just use them with creating new instances.
var grid:BuyTogetherGrid = new BuyTogetherGrid();
grid.addEventListener(FlexEvent.CREATION_COMPLETE, this.grid_creationCompleteHandler);
Elsewhere in the same class...
private function grid_creationCompleteHandler(event:FlexEvent):void
{
// Set your properties here
}
As Pranav said it takes some time to create MXML components and if you try to assess them immediately you will get a null pointer exception because they don't exist yet. A quick and dirty solution is to make public variables in your BuyTogetherGrid.MXML and then bind the text properties to these variables, like
<?xml version="1.0" encoding="utf-8"?>
<mx:Box xmlns:mx="http://www.adobe.com/2006/mxml" width="80" height="60" xmlns:image="org.commodity.detail.image.*">
<fx:Script>
<![CDATA[
[Bindable] public var imageData:ImageData;
[Bindable] public var name:String;
[Bindable] public var price:String;
]]>
</fx:Script>
<mx:HBox>
<image:ImageBox id="buyTogetherImg" imgData={imageData}/>
<mx:VBox id="textInfo">
<mx:Box id="commonNameBox">
<mx:Label id="commonName" text="{name}">
</mx:Label>
</mx:Box>
<mx:Box id="commonPriceBox">
<mx:Label id="commonPrice" text="{price}">
</mx:Label>
</mx:Box>
</mx:VBox>
and then you do
buyTogetherBox.imageData = yourImageData;
buyTogetherBox.name = "Your Name";
buyTogetherBox.imageData = "Your price";
and yes, remove the unnecessary createGrid() method

flex4 moduls data passing from one module to another module

I have a Flex 4 application that loads a two module. first module is user login module and second one is user balance. when user application start login screen is displayed. when user login this module pass to java and process some validations and return to the flex. in flex if user is valid pass that user name to the second module. in that module using that name again pass user name to java and get balance of that user.
but my code is not working?
am tring this code:-
modules.mxml
<?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:views="views.*">
<fx:Declarations>
<!-- Place non-visual elements (e.g., services, value objects) here -->
</fx:Declarations>
<views:module2/>
<views:module1>
</views:module1>
</s:Application>
module1.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:Script>
<![CDATA[
import mx.controls.Alert;
import mx.rpc.events.ResultEvent;
protected function login_resultHandler(event:ResultEvent):void
{
if(har.text=="valid"){
var username:String = "module2.swf?" + "username=" +user.text;
bordercontainerlogin.visible=false;
}else if(har.text=="not-valid")
{
validation.text="! make sure user name & password correct";
}
else
validation.text=har.text
}
protected function user_focusInHandler(event:FocusEvent):void
{
if((user.text=="User name")||(user.text==""))
{
user.text="";
}
}
protected function user_focusOutHandler(event:FocusEvent):void
{
if((user.text=="User name")||(user.text==""))
{
user.text="User name";
}
}
protected function pass_focusInHandler(event:FocusEvent):void
{
pass.displayAsPassword=true;
if((pass.text=="Password")||(pass.text==""))
{
pass.text="";
}
}
protected function pass_focusOutHandler(event:FocusEvent):void
{
if((pass.text=="Password")||(pass.text==""))
{
pass.displayAsPassword=false;
pass.text="Password";
}
}
protected function button1_clickHandler(event:MouseEvent):void
{
if(((user.text=="User name")||(user.text=="")) || ((pass.text=="Password")||(pass.text=="")))
{
if((user.text=="User name")||(user.text==""))
{
//validation.text="! Make sure user name shouidn't be empty";
Alert.show(user.text); }
else if((pass.text=="Password")||(pass.text==""))
{
validation.text="! Make sure Password shouidn't be empty";
}
}
else
{
login.cancel();
login.send();
}
}
protected function button1_mouseOutHandler(event:MouseEvent):void
{
Mouse.cursor=MouseCursor.ARROW;
}
protected function button1_mouseOverHandler(event:MouseEvent):void
{
Mouse.cursor=MouseCursor.BUTTON;
}
]]>
</fx:Script>
<fx:Declarations>
<s:HTTPService id="login" url="http://192.168.1.4:8400/myapp/login" method="POST" result="login_resultHandler(event)">
<s:request xmlns="">
<myname>{user.text}</myname>
<passwd>{pass.text}</passwd>
</s:request>
</s:HTTPService>
</fx:Declarations>
<s:BorderContainer x="0" y="-1" width="100%" height="100%" id="bordercontainerlogin" backgroundColor="#fa0000" backgroundAlpha=".2">
<s:ModuleLoader id="modulerload"/>
<s:Panel width="257" height="205" fontWeight="bold" horizontalCenter="-44" verticalCenter="-56" id="loginpanel" visible="true" title="User Login">
<s:TextInput id="user" y="61" horizontalCenter="-3" text="User name" focusIn="user_focusInHandler(event)" focusOut="user_focusOutHandler(event)"/>
<s:TextInput id="pass" y="99" focusIn="pass_focusInHandler(event)"
focusOut="pass_focusOutHandler(event)" horizontalCenter="-3" text="Password"/>
<s:Button y="137" label="LOGIN" click="button1_clickHandler(event)" horizontalCenter="-4"
mouseOut="button1_mouseOutHandler(event)"
mouseOver="button1_mouseOverHandler(event)"/>
<s:Label id="validation" x="4" y="167" color="#D90D0D"/>
</s:Panel>
<!--<s:ComboBox id="resultData" dataProvider="{reg.lastResult.status}" visible="true" selectedIndex="0"/>-->
<s:TextInput id="har" x="43" y="149" text="{login.lastResult.status}" visible="false" />
</s:BorderContainer>
</s:Module>
module2.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" creationComplete="module1_creationCompleteHandler(event)">
<fx:Script>
<![CDATA[
import mx.events.FlexEvent;
import mx.rpc.events.ResultEvent;
var username:String;
protected function getbalance_resultHandler(event:ResultEvent):void
{
username= this.loaderInfo.url.toString();
getbalance.cancel();
getbalance.send();
}
protected function module1_creationCompleteHandler(event:FlexEvent):void
{
// TODO Auto-generated method stub
}
]]>
</fx:Script>
<fx:Declarations>
<s:HTTPService id="getbalance" url="http://192.168.1.4:8400/myapp/getbalance" method="POST" result="getbalance_resultHandler(event)">
<s:request xmlns="">
<myname>{username}</myname>
</s:request>
</s:HTTPService>
</fx:Declarations>
<s:Label text="welcome {username}" id="welcomelabel" />
<s:TextInput text="{getbalance.lastResult.status}" id="balance"/>
</s:Module>
Because module2 is creationComplete in this time,So,you can Because module2 is creationComplete in this time,So,you can be in when login_resultHandler load module2

ActionScript 3 and mxml

My problem is this:
I want to use mxml for visual element... i want to graphically set components and in an as class to program because it easy to me... How to do this??? I have two classes: one as and one mxml...This is my code:
public class chat extends Application{
private var nc:NetConnection = null;
public var connect:Button;
public var status:Text;
public function VideoChat(){
addEventListener(FlexEvent.APPLICATION_COMPLETE, mainInit);
}
private function mainInit(event:FlexEvent):void{
status.text = "Status quo";
connect.addEventListener(MouseEvent.CLICK, doConnect);
}
and mxml:
<?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" backgroundColor="#FBF8F8"
preloaderChromeColor="#CC3535"
>
<mx:Button x="77" y="547" height="19" label="Connect" id="connect"/>
<mx:UIComponent id="videoReceiveContainer" x="77" y="52" width="500" height="400"/>
<mx:Button x="507" y="547" label="Play" id="play"/>
<mx:Text id="status" x="77" y="460" width="501" height="58"/>
<mx:Button x="297" y="547" label="Publish" id="publish"/>
</s:Application>
First of all, your AS3 code is a liiiittle bit funky.
public class VideoChat extends Application{
private var nc:NetConnection = null;
public var connect:Button;
public var status:Text;
public function VideoChat(){
addEventListener(FlexEvent.APPLICATION_COMPLETE, mainInit);
}
private function mainInit(event:FlexEvent):void{
status.text = "Status quo";
connect.addEventListener(MouseEvent.CLICK, doConnect);
}
}
The name of the class has to match the name of the constructor.
Second, the MXML:
<?xml version="1.0" encoding="utf-8"?>
<local:VideoChat 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="*"
minWidth="955" minHeight="600" backgroundColor="#FBF8F8"
preloaderChromeColor="#CC3535"
>
<mx:Button x="77" y="547" height="19" label="Connect" id="connect"/>
<mx:UIComponent id="videoReceiveContainer" x="77" y="52" width="500" height="400"/>
<mx:Button x="507" y="547" label="Play" id="play"/>
<mx:Text id="status" x="77" y="460" width="501" height="58"/>
<mx:Button x="297" y="547" label="Publish" id="publish"/>
</local:VideoChat>
If you notice, I defined the XML namespace 'local' xmlns:local="*". And the s:Application tag has been replaced with local:VideoChat.
Lastly, you asked in a comment what the path was to load the page. It should be ...bin-debug/name.html. This HTML file is a wrapper that displays the compiled SWF of your project.

pass data from popup to parent

I have a parent w/ a popup child. When parent loads, I have to call a function within the popup without showing the popup (thus, I load "pupLove" but don't include it in layout)....I then pass this data to the parent. When the user manually clicks another button to open the popup, the same function is called & data passed to the parent. However, I am not able to pass dg.length to the parent. I believe the root problem is that I am loading "pupLove" & thus the parents are getting confused.....I'm guessing if I get rid of "pupLove" I can pass the data correctly but will need to call the child's function at creationComplete of the parent....how do I do that?
Here's my parent:
<?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"
backgroundColor="green" width="50%" height="100%"
xmlns:local="*"
>
<fx:Script>
<![CDATA[
import pup;
import mx.managers.PopUpManager;
public function showPup(evt:MouseEvent):void {
var ttlWndw:pup = PopUpManager.createPopUp(this, pup, true) as pup;
PopUpManager.centerPopUp(ttlWndw);
}
]]>
</fx:Script>
<mx:VBox>
<local:pup id="pupLove" visible="false" includeInLayout="false" />
<s:Button click="showPup(event);" label="launch Pup" />
<mx:Text id="Ptest" color="black" text="from Parent:{pupLove.dg.length}" />
</mx:VBox>
</s:Application>
And a popup child called 'pup.mxml':
<?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="400" height="300">
<fx:Script>
<![CDATA[
public function init():void{
// send php call
}
import mx.events.CloseEvent;
import mx.managers.PopUpManager;
private function removePup(evt:Event):void {
PopUpManager.removePopUp(this);
}
]]>
</fx:Script>
<fx:Declarations>
<s:ArrayCollection id="dg">
</s:ArrayCollection>
</fx:Declarations>
<s:TitleWindow width="100%" height="100%" close="removePup(event)">
<mx:VBox>
<mx:Text id="test" color="red" text="from Child:{dg.length}" />
<s:Button label="add Items" click="dg.addItem({id:'cat'})" />
</mx:VBox>
</s:TitleWindow>
</s:Group>
UPDATE: I guess my question can be more easily stated as: "is there a way to call a child's function from the parent without actually loading the child?"
Well, if in your child's function, you don't need to access any of its UI component, then you could instanciate the child in the parent view and call the method.
When you need to display the popup afterwhile, use the PopupManager addPopup method with this existing instance instead of using createPopup