Our AIR app consists from multiple modules. Each module extends MovieClip class. But when I am adding AmChart component to one of these modules, it is not rendering. Here the sample (PieChart.mxml):
<?xml version="1.0" encoding="utf-8"?>
<s:SkinnableContainer 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:amcharts="http://www.amcharts.com/com_internal"
width="100%" height="100%">
<fx:Declarations>
<!-- Place non-visual elements (e.g., services, value objects) here -->
</fx:Declarations>
<fx:Script>
<![CDATA[
import mx.collections.ArrayCollection;
[Bindable]
private var chartData:ArrayCollection = new ArrayCollection([
{country:"Czech Republic",litres:156.90},
{country:"Ireland",litres:131.10},
{country:"Germany",litres:115.80},
{country:"Australia",litres:109.90},
{country:"Austria",litres:108.30},
{country:"UK",litres:99.00},
{country:"Belgium",litres:93.00}]);
]]>
</fx:Script>
<amcharts:AmPieChart width="100%" height="100%" dataProvider="{chartData}" titleField="country" valueField="litres"/>
</s:SkinnableContainer>
And this is a sample usage:
var chart:PieChart = new PieChart();
cContainer.addChild(chart);
cContainer - is instance of MovieClip.
Can you suggest why this is not rendering? Maybe this seems a silly question, but I am a quite newbie to Flex. Please, help.
You may want to try using the dataset syntax used here http://blog.amcharts.com/2010/11/amstock-flex-tutorial-part-1-basics.html, and also try using a number for width and height until you get it working, rather than a percentage. If neither of those works, you may want to try asking the people who wrote this.
HTH;
Amy
Related
I'm very new to the Flex Programming.
I was writing a sample program.
<?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:String id="message">Hello, World</mx:String>
<mx:Label text="{message}"/>
</s:Application>
But getting an error "could not resolve to a component implementation"
I have the following queries.
What does , tags refers to.
why i'm getting the above error.Please help
This code should work:
<?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:String id="message">Hello, World</fx:String>
</fx:Declarations>
<mx:Label text="{message}"/>
</s:Application>
What I did was:
Changed your string to <fx:String>
Moved it into the <fx:Declarations> tag.
Reason:
It looks a little like you trying to compile with the Flex 4 SDK and are mixing a little of Flex 3 and Flex 4. Anything starting with the namespace "s" is a Flex 4 Spark components. Anything with the namespace "mx" is from Flex 3.
In Flex 3 you could declare variables in the code, right next to any visual component and they were all declared with the "mx" namespace. With Flex 4, they changed it so that declaring things that are not visual components (like variables) need to be placed in the <fx:Declarations> tag, which is why there is the comment "Place non-visual elements (e.g., services, value objects) here". They also changed the namespace of those non-visual elements to "fx".
There is some explaination in Flex 3 equivalent of ''?
I have a Home.mxml file with home_src.as included in a fx:Script tag. Now suppose that I want to retrieve the value of a <mx:TextInput.../> tag located in Home.mxml, from another .as file (for example login_src.as).
I tried mx.core.Application.application.[file.mxml].[property] but doesn't work (I obtain an error like this: property not found on ).
I don't know if it is possible without including the .as file who wants access to the .mxml property, but I want to find out because I have a canvas.mxml page (with some text and combo tag) that contains a tabNavigator with two other .mxml pages; in the actionscript of these two tabs I need the value of canvas.mxml input and combo tag.
Is there a way to do this without including tab1 or tab2.as into my canvas.mxml?
A button click opens a popup for data insertion:
home.as
..
var insertPop:InsertPopUp = InsertPopUp(PopUpManager.createPopUp((this.parentApplication as DisplayObject), InsertPopUp, true));
PopUpManager.centerPopUp(insertPop);
..
InsertPopUp.mxml
<?xml version="1.0" encoding="utf-8"?>
<mx:TitleWindow xmlns:mx="http://www.adobe.com/2006/mxml" initialize="init()" close="close()">
<mx:Script source="InsertPopUp_src.as"/>
<mx:Label id="lblage" text="Age:"/>
<mx:TextInput id="txtAge" editable="true"/> // I want this data
<mx:TabNavigator id="insertTab" width="100%" height="85%">
<mx:VBox id="vbx1" width="100%" height="100%" label="Car Data">
<mx:ModuleLoader id="mdlCatData" url="modules/Cat.swf" height="100%" width="100%" />
</mx:VBox>
<mx:VBox id="vbx2" width="100%" height="100%" label="Van Data">
<mx:ModuleLoader id="mdlDogData" url="modules/Dog.swf" height="100%" width="100%"/>
</mx:VBox>
</mx:TabNavigator>
</mx:TitleWindow>
Then I have:
Cat.mxml
<?xml version="1.0" encoding="utf-8"?>
<mx:Module xmlns:mx="http://www.adobe.com/2006/mxml" initialize="init();">
<mx:Script source="CatData_src.as" />
// other forms..
</mx:Module>
and:
Dog.mxml
<mx:Module xmlns:mx="http://www.adobe.com/2006/mxml" initialize="init();">
<mx:Script source="DogData_src.as" />
// other forms..
</mx:Module>
I want to retrieve data of the txtAge textInput and use it in both CatData_src.as and DogData_src.as; how can I get that data without resorting to a script include?
I made this "graphic configuration" because some data are common to Cat and Dog.. (obviously is just an example).
mxml is not anything special in the world of AS3, it seems different but it's really not as it is compiled later into AS3 code. Any object declared in mxml tag with an id is just a property of the as3 class that will be generated (using the same name as the mxml file).
If that mxml class is supposed to be unique (not 2 instances of it) you can access your property using static methods.
Example:
mxml main class named: MyMain.mxml
declare static variable (in fx:script) of type MyMain: static public var instance:MyMain;
in addedToStage listener (or similar) set your variable: instance = this
from anywhere access your instance and property: MyMain.instance.mytextimput
If working with multiple instances of mxml class then get reference of the instance and use it just like any other AS3 object.
I am pretty new to flex and was trying to understand how the entire Flex works
Scenario :
I started with creating a single MXML file where there will be a textbox and a button. If the button is clicked a popup will be displayed with the value of the textbox(this worked perfectly). The second thing that came to my mind is how to show the same data in some other page. SO, if i click on the button. It should load another page and display the data that was written in the textbox
My Code till now is this :
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="horizontal">
<mx:Script>
<![CDATA[
import mx.controls.Alert;
public function open(event:MouseEvent):void{
Alert.show("I am opening a page");
Alert.show(txt_inp.text + " is written here");
}
]]>
</mx:Script>
<mx:TextInput id="txt_inp" />
<mx:Button id="openBttn" label="Click Me" click="open(event)" />
</mx:Application>
And Name.xml(The Second page is )
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" creationComplete="setYelp()">
<mx:Script>
<![CDATA[
public var helloYou:HelloYou;
public function yelpHandler():void{
yelp.text = "Ayush"
}
public function setYelp():void {
helloYou.openBttn.addEventListener(MouseEvent.CLICK,yelpHandler);
}
]]>
</mx:Script>
<mx:Label id="yelp" text="yelp">
</mx:Label>
</mx:Application>
I referred to some of the previously asked questions like this and tried following it, but couldn't really understand.
Also, in my flex builder I had two more options of MXML > MXML Module and MXML Component. Should I use them here, if not, when should I use it?
Why are you using multiple page? usually a Flex application is a single application with multiple views and sharing data is way easier in this situation.
If you want to pass information between different pages you can use cookies (see for example Accessing browser cookies from Flex)
Another flex solution is this http://custardbelly.com/blog/blog-posts/2010/11/15/flex-hero-persistant-data-in-mobileapplication/
The last thing that I can think about is using the javascript bridge to access the localstorage (o sqlite) of your browser and store information there.
But again why save information between requests and not simply create a single application that changes its views ?
1st solution
Use ViewStack component to integrate your 1st mxml and 2nd mxml.
This is what #wezzy said "single application with multiple views".
This is the most easily way to share values, if you can integrate to one mxml.
like this
<mx:ViewStack id="viewstack" width="100%" height="100%" selectedIndex="0" >
<!-- Input Page is here -->
<mx:Canvas id="view1" width="100%" height="100%">
<mx:TextInput id="txtName" width="150" maxChars="40" />
<mx:Button label="Go to NextPage" click="viewstack.selectedChild=view2;"/>
</mx:Canvas>
<!-- Result Page -->
<mx:Canvas id="view2" width="100%" height="100%">
<mx:TextInput text="{txtName.text}" width="150" editable="false" />
<mx:Button label="Back to PrevPage" click="viewstack.selectedChild=view1;"/>
</mx:Canvas>
</mx:ViewStack>
2nd solution
Use SharedObject(or DB) to save and load values.
3rd solution
Use singleton variables to share the values between classes.
Please see this answer of mine.
Flex - Problems in accessing static variable on another mxml page
I have a spark List and using ArrayCollection as dataprovider for list. Initially when the list is populated sorting is done , but i need to add items to list quite frequently as they update on server. After i add item i have to re-sort the list. After applying sort and calling refresh() scrollbar resets itself to top.
I am looking for a way so that i can add items to list and keep sorting the list without resetting the scrollbar to top position.
I have read similar question earlier but in that question most users have said to store the VerticalScrollPostion in a variable and apply that VerticalScrollPosition back after the sorting is done. The problem with this is there is a jerk in scrollbar , as it goes to top after refresh and then scrolls back to position as applied. So this solution is not possible as items are added very frequently as it will make the scrollbar going up and down very frequently and annoying the users. Also does't look nice n professional
I need a way so that scrollbar stays in it place even after sorting is done.
Also i want to keep using useVirtualLayout=true for the List.
I was also trying to extent ArrayCollection but could't find a way to solve my problem.
Below is simple example(extracted from my main application) to illustrate the problem. Just Scroll to bottom of list and then press the Sort button(which will sort the list) and the scrollbar will jump to top position. I want scrollbar to stay at its position even after pressing Sort button:
<?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" creationComplete="application1_creationCompleteHandler(event)">
<fx:Declarations>
<!-- Place non-visual elements (e.g., services, value objects) here -->
</fx:Declarations>
<fx:Script>
<![CDATA[
import mx.collections.ArrayCollection;
import mx.collections.SortField;
import spark.collections.Sort;
[Bindable] protected var ar_c:ArrayCollection;
protected var dgArray:Array=new Array();
protected function application1_creationCompleteHandler(event:FlexEvent):void
{
for(var i:int=0;i<20;i++)
dgArray.splice(-1,0,{label:"h"+i});
ar_c= new ArrayCollection(dgArray);
}
protected function sort_list():void{
var sort:spark.collections.Sort=new Sort();
sort.fields=[new SortField("label",false,true)];
ar_c.sort=sort;
ar_c.refresh();
}
]]>
</fx:Script>
<s:List x="42" y="41" id="mylist" width="199" height="253" dataProvider="{ar_c}" useVirtualLayout="true"></s:List>
<s:Button x="295" y="40" label="Sort" click="sort_list();"/>
</s:Application>
I think a sort is applied once and then everything added to the ArrayCollection later on is sorted on. You only have to add the sort once, and then call refresh once to apply the sort.
I am looking into an issue in a Flex application where on OS X text is shifted up a couple pixels compared to windows. Every text field is not vertically aligned to the middle it is more towards the top.
Found a thread here but no real solution http://forums.adobe.com/message/2189821
Anyone know how to solve this problem in a way that applies to both systems.
My approach would be to conditionally adjust component positioning when OS X is detected.
<?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"
preinitialize="onPreinitialize()"
>
<fx:Script>
<![CDATA[
import mx.controls.Alert;
private function onPreinitialize():void
{
Alert.show((-1 != Capabilities.os.search(new RegExp('mac', 'i'))) ? 'Replace this Alert with code which adjusts text positioning in order for it to appear the same as when it runs on Windows.' : 'No need to adjust text', Capabilities.os);
}
]]>
</fx:Script>
</s:Application>