DataGrid.selectedIndex memory leak - actionscript-3

I have noticed a memory leak in a DataGrid, in case I do not select an item, I am able to GC my dataGrid, if there was anything selected then dataGrid cause memory leak...
here is the simpliest example:
<?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:Script>
<![CDATA[
import mx.collections.ArrayCollection;
import mx.collections.ArrayList;
import spark.components.gridClasses.GridColumn;
[Bindable]
private var columns:ArrayList = new ArrayList;
[Bindable]
private var dataProvider:ArrayCollection = new ArrayCollection;
private function onCreationComplete():void
{
dataProvider.addItem({id:1});
var column:GridColumn = new GridColumn;
column.dataField = id;
columns.addItem(column);
container.selectedIndex = 0;
}
private function gotoOne():void
{
currentState = one;
}
private function gotoTwo():void
{
columns = null;
currentState = two;
}
]]>
</fx:Script>
<s:states>
<s:State name="one"/>
<s:State name="two"/>
</s:states>
<s:Button click="gotoOne()" label="one"/>
<s:Button click="gotoTwo()" label="two" left="150"/>
<s:DataGrid id="container" top="30" includeIn="one" itemDestructionPolicy="auto"
creationComplete="onCreationComplete()" columns="{columns}"
dataProvider="{dataProvider}"/>
</s:Application>
if you comment out line "container.selectedIndex = 0;" DataGrid gets GCed nicely.
Any ideas how to GC DataGrid with selected item?
I am using flex 4.6.0

It isn't a memory leak, it is cycle of a live item.
onCreationComplete is called when you finish render and display datagrid on the scene, you must add the item on click of the grid( selectedItem event).

Related

Adding images dynamically to scroller

i am new to flex.i am trying add images dynamically in flex using file referencei need to add images in scroller.i use this below code but adding image was not visible.can anyone help me regarding this issue pls.Thanks in advance
<?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:net="flash.net.*">
<fx:Script>
<![CDATA[
import mx.controls.Alert;
import mx.controls.Image;
import mx.utils.ObjectUtil;
private var myImage:Image;
private function OnbuttonClick(evt:MouseEvent):void {
var arr:Array = [];
arr.push(new FileFilter("Images", ".gif;*.jpeg;*.jpg;*.png"));
fileReference.browse(arr);
}
private function FileRefSelect(evt:Event):void {
fileReference.load();
}
private function FileRefComplete(evt:Event):void {
Alert.show(ObjectUtil.toString(fileReference));
myImage = new Image();
//img.source = fileReference.data;
myImage.maxWidth = 100;
myImage.maxHeight = 100;
myImage.source = fileReference.data;
vg.addChild(myImage);
}
]]>
</fx:Script>
<fx:Declarations>
<net:FileReference id="fileReference"
select="FileRefSelect(event);"
complete="FileRefComplete(event);" />
</fx:Declarations>
<mx:ControlBar>
<mx:Button id="btn" label="Browse Your Image" click="OnbuttonClick(event);" />
</mx:ControlBar>
<s:Scroller id="scrllr" x="50" y="100" width="100" height="280" focusEnabled="false"
hasFocusableChildren="true">
<s:VGroup id="vg">
</s:VGroup>
</s:Scroller>
</s:Application>
You need to use vg.addElement(myImage); instead of vg.addChild(myImage);. I am assuming you would also have got an exception mentioning the same.

Simple flex popup with dispatch event in child and listener in parent not working

Parent.mxml
This file is calling the popup class below when the button is clicked.
<?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:Script>
<![CDATA[
import mx.controls.Alert;
import mx.managers.PopUpManager;
var popup:pop = null ;
protected function clickHandler(event:MouseEvent):void
{
popup = PopUpManager.createPopUp(this,pop,true) as pop;
popup.ok.addEventListener(MouseEvent.CLICK, captureComments);
popup.close();
}
var str:String="";
private function captureComments():void{
Alert.show("Invoked Event Listener", "Alert");
str=popup.comments;
}
]]>
</fx:Script>
<mx:Button id="id1" label="Click" click="clickHandler(event)"/>
<s:Label id="lbl" height="18" width="282" text={str} />
</s:Application>
Child.mxml
This file is the popup reference, creating popup.
I have configured the close action and cancel buttons to work as needed, but unable to propagate the text entered in comment are back to the parent.
<?xml version="1.0" encoding="utf-8"?>
<mx: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"
layout="vertical" width="524" height="322"
showCloseButton="true"
close="close()" chromeColor="#CCCCCC"
horizontalAlign="center" verticalAlign="middle" color="#000000">
<fx:Script>
<![CDATA[
import mx.controls.Alert;
import mx.managers.PopUpManager;
import mx.rpc.events.ResultEvent;
[Bindable]public var comments:String;
public function close(): void{
PopUpManager.removePopUp(this);
}
private function save(): void{
if(comments == null){
comments = "";
}
dispatchEvent(new ResultEvent(comments));
}
]]>
</fx:Script>
<mx:HBox width="100%" height="70%">
<mx:VBox width="100%" height="100%">
<mx:TextArea id="comment" text="{comments}" width="100%" height="80%" change="comments = event.target.text">
</mx:TextArea>
<mx:HBox horizontalAlign="center" width="100%" height="20%">
<s:Button id="ok" label="OK" chromeColor="#CCCCCC" click="save()" fontWeight="bold"/>
<s:Button id="cancel" label="Cancel" chromeColor="#CCCCCC" click="close()" fontWeight="bold"/>
</mx:HBox>
</mx:VBox>
</mx:HBox>
</mx:TitleWindow>
You are dispatching a ResultEvent, like this:
dispatchEvent(new ResultEvent(comments));
However, the event type is the user entered input. Check out the ResultEvent constructor. The first argument is the event type. I have no idea how you'll be able to consistently listen for an event type that is unknown at compile time.
I think you are trying to pass your custom data back to your parent class. My preference would be to use a custom event for this; but if you wanted to use a ResultEvent you could pass your comments in the result property:
dispatchEvent(new ResultEvent(ResultEvent.RESULT,false,true,comments));
In your parent file, add an event listener like this:
popup.addEventListener(ResultEvent.RESULT, processResult);
You should be able to get at your comments value as a property on the event:
protected function processResult(event:ResultEvent):void{
str=event.result
}
Another thing I've done as well is in the Child Container Create a public variable to pass the function from the parent ie:
in parent:
protected function captureComments(comments:String):void{
str=comments;
}
in child :
declare a public var and add the function to the save() function
public var parentFunction:Function;
private function save(): void{
if(comments == null){
comments = "";
}
parentFunction(comments);
Then when Creating your popup container in the parent:
protected function clickHandler(event:MouseEvent):void
{
popup = PopUpManager.createPopUp(this,pop,true) as pop;
popup.parentFunction = captureComments;
popup.close();
}

UI component form Flex to Air

In Flex application I have found a way to save target object to "string";
<?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:Script>
<![CDATA[
import mx.collections.ArrayCollection;
import mx.controls.Alert;
import mx.events.FlexEvent;
import mx.rpc.xml.SimpleXMLEncoder;
import mx.utils.ObjectUtil;
import mx.utils.XMLUtil;
protected function button1_clickHandler(event:MouseEvent):void
{
var fr:FileReference = new FileReference();
var ba:ByteArray = new ByteArray();
ba.writeObject(container);
fr.save(ba);
}
]]>
</fx:Script>
<s:BorderContainer id="container" x="68" y="64" width="341" height="257">
<s:Label x="69" y="83" width="257" height="124" text="Label"/>
</s:BorderContainer>
<s:Button x="68" y="329" label="SAVE" click="button1_clickHandler(event)"/>
Is there a way to read that file and show it as UIComponent in AIR?
This is my try:
<?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">
<fx:Script>
<![CDATA[
import flash.events.Event;
import flash.events.IOErrorEvent;
import flash.net.FileFilter;
import flash.net.FileReference;
import flash.utils.ByteArray;
import spark.components.BorderContainer;
private var fr:FileReference;
private function onLoadFileClick():void
{
fr = new FileReference();
fr.addEventListener(Event.SELECT, onFileSelect);
fr.addEventListener(Event.CANCEL,onCancel);
fr.browse();
}
private function onFileSelect(e:Event):void
{
fr.addEventListener(Event.COMPLETE, onLoadComplete);
fr.addEventListener(IOErrorEvent.IO_ERROR, onLoadError);
fr.load();
}
private function onCancel(e:Event):void
{
trace("File Browse Canceled");
fr = null;
}
private function onLoadComplete(e:Event):void
{
var data:ByteArray = fr.data;
//read the bytes of the file as a string and put it in the
//textarea
//outputField.text = data.readUTFBytes(data.bytesAvailable);
//var obj:BorderContainer = data.;
cc = data.readObject();
//clean up the FileReference instance
fr = null;
}
//called if an error occurs while loading the file contents
private function onLoadError(e:IOErrorEvent):void
{
trace("Error loading file : " + e.text);
}
]]>
</fx:Script>
<mx:Button label="Load Text File" right="10" bottom="10" click="onLoadFileClick()"/>
<mx:TextArea right="10" left="10" top="370" bottom="40" id="outputField"/>
<s:BorderContainer id="cc" x="130" y="99" width="200" height="200">
</s:BorderContainer>
</s:WindowedApplication>
And I'm getting this error:
TypeError: Error #1034: Type Coercion failed: cannot convert Object#6f2bc41 to spark.components.BorderContainer at primi/onLoadComplete()[C:\Users\user\Adobe Flash Builder 4.5\primi\src\primi.mxml:51]
Any solution would will be fine... as long it works :)
You need to register a class alias for BorderContainer before writing to the ByteArray. Otherwise the object's type cannot be preserved and the container is written as an ordinary Object to the ByteArray.
Check the documentation for registerClassAlias() to get detailed information about how to read/write (or with the more common terms: serialize/deserialize) strongly typed objects in ActionScript.
And when I'm right, you need to register the class alias in both applications the Web-based one and AIR.

Flex 4: State Change Event

Is there any event in Flex 4 that I can use to detect a state change?
I know this question is old but by googling for state change events I still get here so for people that want to know:
There is a StateChangeEvent.CURRENT_STATE_CHANGE event that is dispatched by the component, so your application can also listen for that.
In your listener function you can then acces the StateChangeEvent.oldState and StateChangeEvent.newState properties.
If you are talking about view states the answer is yes, you can listen for the enterState event like this (sorry for the simplicity of the example, it's part of a project I'm working on and I removed any relevant parts of the 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="800" minHeight="600"
currentState="loading">
<fx:Script>
<![CDATA[
import mx.controls.Alert;
private function onEnterLoadingState():void{
Alert.show("Enter the loading state.", "Application");
}
private function onEnterLoginState():void{
Alert.show("Enter the login state.", "Application");
}
private function onEnterAddState():void{
Alert.show("Enter the addUser state.", "Application");
}
private function changeState(state:String):void{
currentState = state;
}
]]>
</fx:Script>
<s:states>
<s:State name="loading" enterState="onEnterLoadingState()"/>
<s:State name="login" enterState="onEnterLoginState()"/>
<s:State name="addUser" enterState="onEnterAddState()"/>
</s:states>
<s:Panel id="loadView" includeIn="loading" title="Loading">
<s:Button label="Go to login" click="changeState('login')"/>
</s:Panel>
<s:Panel id="loginView" includeIn="login" title="Login">
<s:Button label="Go to addUser" click="changeState('addUser')"/>
</s:Panel>
<s:Panel id="addView" includeIn="addUser" title="AddUser">
<s:Button label="Return to loading" click="changeState('loading')"/>
</s:Panel>
</s:Application>
And there is an exitState event in case you need it. I hope this helps you.
There are multiple state events you can listen for on any UIComponent class:
FlexEvent.STATE_CHANGE_COMPLETE
FlexEvent.STATE_CHANGE_INTERRUPTED
StateChangeEvent.CURRENT_STATE_CHANGING
StateChangeEvent.CURRENT_STATE_CHANGE
FlexEvent.ENTER_STATE
FlexEvent.EXIT_STATE
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"
enterState="windowedapplication1_enterStateHandler(event)"
exitState="windowedapplication1_exitStateHandler(event)"
currentStateChange="windowedapplication1_currentStateChangeHandler(event)"
currentStateChanging="windowedapplication1_currentStateChangingHandler(event)"
stateChangeInterrupted="windowedapplication1_stateChangeInterruptedHandler(event)"
stateChangeComplete="windowedapplication1_stateChangeCompleteHandler(event)">
<fx:Script>
<![CDATA[
import mx.events.FlexEvent;
protected function windowedapplication1_stateChangeCompleteHandler(event:FlexEvent):void
{
}
protected function windowedapplication1_stateChangeInterruptedHandler(event:FlexEvent):void
{
}
protected function windowedapplication1_currentStateChangeHandler(event:StateChangeEvent):void
{
var oldState:String = event.oldState;
var newState:String = event.newState;
}
protected function windowedapplication1_currentStateChangingHandler(event:StateChangeEvent):void
{
var oldState:String = event.oldState;
var newState:String = event.newState;
}
protected function windowedapplication1_enterStateHandler(event:FlexEvent):void
{
}
protected function windowedapplication1_exitStateHandler(event:FlexEvent):void
{
}
]]>
</fx:Script>
</s:WindowedApplication>

changing component properties of SkinnableComponent in Actionscript

Flex 4 separates the visual components into the skins. So how do we access those visual elements from Skinnable component? Here is my code:
<?xml version="1.0" encoding="utf-8"?>
<s:SkinnableComponent xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark" skinClass="skins.brushedSkin"
xmlns:mx="library://ns.adobe.com/flex/mx">
<fx:Script>
<![CDATA[
import mx.controls.TextInput;
private var txt:String;
public function setText(s:String) {
txt = s;
// the following line doesn't work
var input:TextInput = this.skin.getChildByName("msg") as TextInput;
input.text = s;
}
]]>
</fx:Script>
</s:SkinnableComponent>
I just need to set the text in the TextInput in the brushedSkin skin. But I have no idea how to do this in Flex 4.
First you must specify in your SkinnableComponent the so called Designer-Developer Contract.
Then you should wait for your component to finish its instantiation in order to access its skin parts.
In your particular case you change your code in the following way:
<?xml version="1.0" encoding="utf-8"?>
<s:SkinnableComponent xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark" skinClass="skins.brushedSkin"
xmlns:mx="library://ns.adobe.com/flex/mx">
<fx:Script>
<![CDATA[
import mx.controls.TextInput;
[SkinPart(required="true")]
public var input:TextInput;
private var txt:String;
public function setText(s:String) {
txt = s;
if (initialized)
input.text = txt;
}
]]>
</fx:Script>
</s:SkinnableComponent>
Then ensure that your skin class contains the following declaration (probably you just need to rename the msg-TextInput to input):
<s:TextInput id="input"/>