Creating Dynamically Flex Custom ItemRender (Constructor) - actionscript-3

am creating some Advanced Datagrid with actionscript.
I have created an actionscript class where I extend the VBox object:
package core
{
import mx.containers.VBox;
import mx.controls.TextInput;
public class customItemRender extends VBox
{
public function customItemRender(_TextInput:TextInput, _TextInput2:TextInput)
{
//TODO: implement function
super.addChild(_TextInput);
super.addChild(_TextInput2);
}
}
}
The problem comes up when I declare de itemrender property on the data grid:
AdvancedDataGridColumn.itemRenderer = new ClassFactory(customItemRender(_TextInput1,_TextInput2));
The compiler wont let me instanciate my customItemRender.
Does any one know if there is an alternative solution to solve the problem?
Thanks in advance for you helps,
Regards Javier

private var _ItemRendere:ClassFactory;
private function get MyItemRendere():ClassFactory
{
if (_ItemRendere == null)
{
_ItemRendere = new ClassFactory();
_ItemRendere.generator = customItemRender;
_ItemRendere.properties = {
_TextInput1:MY_TextInput1_OBJECT,
_TextInput2:MY_TextInput2_OBJECT
};
}
return _ItemRendere;
}
then you can use
AdvancedDataGridColumn.itemRenderer = MyItemRendere;

I've only tried to do this using MXML. In that case, i usually have to wrap the IListItemRenderer instance in mx:Component tags. I'm not exactly sure what is going on programmatically when I do this, but it works. The reason is that the itemRender is actually looking for an instance of IFactory rather than an instance so I suppose to do this strictly using AS you would need to create your own IFactory implementation.
e.g.
<mx:List>
<mx:itemRenderer>
<mx:Component>
<mx:Text />
</mx:Component>
</mx:itemRenderer>
</mx:List>

ClassFactory's constructor has a Class as a parameter, not an instance. You need to call:
new ClassFactory(customItemRender);
and not:
new ClassFactory(new customItemRender(_TextInput1,_TextInput2));
or:
new ClassFactory(customItemRender(_TextInput1,_TextInput2));
Now, since the constructor will not be called with reference to TextInput1 and TextInput2, you'll need to instantiate your own TextInputs in the custom renderer itself. (But this is a good thing, if you continue to call new customItemRender(_TextInput1, _TextInput2), then the two TextInputs will only be added to the LAST instance of customItemRender, and all of the others will not have these two objects ).

Related

Adobe/Apache Flex: Modify View in an ActionScript class

I have a WindowedApplication in Apache/Adobe Flex 4 which currently consists of one view (the view defined in the WindowedApplication MXML).
In that application I have an object which listens to data coming from a network. When data is available a method is called on that object and it shall update my view by changing the text of a label.
I do not have a reference to the view in the network listener object though. How can I get it?
This is part of my MXML where I define my view.
<fx:Script source="./ViewCodeBehind.as"/>
<!-- ommited stuff -->
<s:Label id="errorLabel"
text=""
fontSize="14"/>
<!-- Stuff in between -->
<s:Button label="Get Status"
click="getStatus();"/>
The code which is called when the button is clicked:
public function getStatus(): void
{
var networkGateway: NetworkGateway = new NetworkGatewayImpl();
networkGateway.getConnectionStatus();
}
And the NetworkGatewayImpl
public class NetworkGatewayImpl implements NetworkGateway
{
public function NetworkGatewayImpl()
{
}
public function getConnectionStatus(): void
{
// Start asynchronous network call
// when error occurs onNetworkError() is called
}
private function onNetworkError(): void
{
// Set "errorLabel" here: How?
}
}
Essentially I want to know some ways to update "errorLabel" from the NetworkGatewayImpl.
Based on your code, there could be multiple ways to solve this. Easiest way (as per me) would be to dispatch an event from the NetworkGatewayImpl class and listen to it on the instance you have created in the view class. So sample code would look like this:
public function getStatus(): void
{
var networkGateway: NetworkGateway = new NetworkGatewayImpl();
networkGateway.addEventListener("networkError", onNetworkError);
networkGateway.getConnectionStatus();
}
private function onNetworkError(e:Event):void
{
networkGateway.removeEventListener("networkError", onNetworkError);
this.errorLabel.text = "Your Text Here";
}
Dispatch your event like this from your NetworkGatewayImpl class:
private function onNetworkError(): void
{
this.dispatchEvent("networkError");
}
You will have to ensure that your NetworkGatewayImpl also implements the IEventDispatcher interface to be able to dispatch events.
Also, best practice would be to create a custom Event class (extending the Event class) and use constants instead of the literal 'networkError'
Hope this helps.

ActionScript: making a variable `[Bindable]` causes crashes

I have this singleton that I'm using as a wrapper for global variables and constants, but as soon as I make some [Bindable] I get a crash on start up w/a bunch of red text in my console.
TypeError: Error #1009: Cannot access a property or method of a null object reference.
at BrandGlobals$/get COLOUR_EVERYTHING_BACKGROUND()[C:\MyProject\src\BrandGlobals.as:14]
at BrandGlobals$cinit()
at global$init()[C:\MyProject\src\BrandGlobals.as:2]
at _mainWatcherSetupUtil/setup()
at main/initialize()[C:\MyProject\src\main.mxml:0]
at mx.managers::SystemManager/http://www.adobe.com/2006/flex/mx/internal::childAdded()[C:\autobuild\3.5.0\frameworks\projects\framework\src\mx\managers\SystemManager.as:2131]
at mx.managers::SystemManager/initializeTopLevelWindow()[C:\autobuild\3.5.0\frameworks\projects\framework\src\mx\managers\SystemManager.as:3400]
at mx.managers::SystemManager/http://www.adobe.com/2006/flex/mx/internal::docFrameHandler()[C:\autobuild\3.5.0\frameworks\projects\framework\src\mx\managers\SystemManager.as:3223]
at mx.managers::SystemManager/docFrameListener()[C:\autobuild\3.5.0\frameworks\projects\framework\src\mx\managers\SystemManager.as:3069]
BrandGlobals:
package {
public final class BrandGlobals {
[Bindable]public static var COLOUR_EVERYTHING_BACKGROUND:uint = 0xE010FF;
If I remove that [Bindable] and turn var to const there's no problem (except the obvious problem of not being able to set the variable outside of this file) but this doesn't work. Also, making the whole class [Bindable] instead of this one didn't work. When I hover my mouse over the COLOUR_EVERYTHING_BACKGROUND definition, it says "<exception thrown by getter>". 'Don't know what to think about that.
I might have guessed it was because it has no package, but I'm using another similar singleton which has [Bindable] variables and seems to work fine.
I never did get that [Bindable] twaddle.
I'm using the Flex 3.5 SDK.
I tried Brian's suggestion below, but it gave me pretty much the same error. I even tried:
{
_COLOUR_EVERYTHING_BACKGROUND = 0xE010FF;
trace("Var set."); //Breakpoint here
bLoadedFerCryinOutLoud = true;
}
[Bindable]private static var _COLOUR_EVERYTHING_BACKGROUND:uint;
private static var bLoadedFerCryinOutLoud:Boolean = false;
public static function get COLOUR_EVERYTHING_BACKGROUND():uint {
trace("Returning EVERYTHING background");
if (bLoadedFerCryinOutLoud)
return _COLOUR_EVERYTHING_BACKGROUND;
else return 0xFFFFFF;
}
What's more, if I put a breakpoint at that trace("Var set.");, Flash Builder complains that a break is not possible, because there is no executable code there.
I also noticed that in that call stack that I'm shown when this crash happens during a set and it seems to be the one that sets _COLOUR_EVERYTHING_BACKGROUND. But the only place where it is set is:
public static function SetBackground(oApp:UBIApplication):void {
_COLOUR_EVERYTHING_BACKGROUND = oApp.nBackgroundColour;
}
and breakpoints indicate that this is never called.
The documentation on using the tag has the following to say:
Using static properties as the source for data binding
You can use a static variable as the source for a data-binding expression. Flex performs the data binding once when the application starts, and again when the property changes.
You can automatically use a static constant as the source for a data-binding expression. Flex performs the data binding once when the application starts. Because the data binding occurs only once at application start up, you omit the [Bindable] metadata tag for the static constant. The following example uses a static constant as the source for a data-binding expression:
<fx:Script>
<![CDATA[
// This syntax casues a compiler error.
// [Bindable]
// public static var varString:String="A static var.";
public static const constString:String="A static const.";
]]>
</fx:Script>
<!-- This binding occurs once at application startup. -->
<s:Button label="{constString}"/>
Edit: You need to make sure that your variable is initialized before you try to read it. A static initializer is the way to go:
package {
public final class BrandGlobals {
{
_COLOUR_EVERYTHING_BACKGROUND = 0xE010FF;
trace("Var set."); //Breakpoint here
}
[Bindable]private static var _COLOUR_EVERYTHING_BACKGROUND:uint;
public static function get COLOUR_EVERYTHING_BACKGROUND():uint {
trace("Returning EVERYTHING background"); //Breakpoint here
return _COLOUR_EVERYTHING_BACKGROUND;
}
Putting in breakpoints in the places specified will let you verify that things are executing in the expected order
It turns out that the problem was assigning COLOUR_EVERYTHING_BACKGROUND to a static const elsewhere in the code, as a temporary measure. Hopefully I'll remember that assigning [Bindable]s to static consts is bad and if I don't, I'll remember the meaning of that particular cryptic reaction Flash Builder had. I'm starting to choke StackOverflow w/my questions about cryptic error messages.

How to embed MultiDPIBitmapSource objects in Flex library project

I currently store embedded images in a flex library project (swc) like so:
public class BitmapAssets
{
[Embed(source="/assets/icon_160.png")]
public static const icon_160:Class;
[Embed(source="/assets/icon_240.png")]
public static const icon_240:Class;
[Embed(source="/assets/icon_240.png")]
public static const icon_240:Class;
}
And then i reference the images in other projects. For example:
<s:Button>
<s:icon>
<s:MultiDPIBitmapSource source160dpi="{BitmapAssets.icon160}"
source240dpi="{BitmapAssets.icon240}"
source320dpi="{BitmapAssets.icon320}" />
</s:icon>
</s:Button>
What i would like to do is embed the MultiDPIBitmapSource in the library project; then i could reduce the code to this:
<s:Button icon="{MultiDPIBitmapAssets.icon}" />
However, i can't figure out how to embed a MultiDPIBitmapSource object with source160/240/320 values filled.
Any solutions gratefully received ;)
Edit:
As an alternative to 'true' embedding, i'm wondering whether mxml compiling could provide an answer. For instance, if i have an mxml declaration:
<fx:declarations>
<s:MultiDPIBitmapSource id="icon"
source160dpi="{BitmapAssets.icon160}"
source240dpi="{BitmapAssets.icon240}"
source320dpi="{BitmapAssets.icon320}" />
</fx:declarations>
Then the mxml compiler will turn it into:
var icon:MultiDPIBitmapSource = new MultiDPIBitmapSource();
icon.source160dpi = BitmapAssets.icon160;
icon.source240dpi = BitmapAssets.icon240;
icon.source320dpi = BitmapAssets.icon320;
And i can then reference it as i'd like:
<s:Button icon="{MultiDPIBitmapAssets.icon}" />
Technically, its not embedded. But for practical purposes, it is (at least in my mind). The question is, where do i put the declarations tag? Can i define a non-visual class in mxml?
MultiDPIBitmapSource is an object created at runtime, not at compile-time. You won't be able to embed an instance of it in the app.
However, you could create a static reference to an object. It would require a bit more code, but it would be less code to write every time you need to use it.
public class Assets {
private static var _asset:MultiDPIBitmapSource;
public static function get asset():MultiDPIBitmapSource {
if ( !_assets ) {
_assets = new MultiDPIBitmapSource();
_assets.source160 = "url";
_assets.source240 = "url";
_assets.source320 = "url";
_assets.source480 = "url";
}
return _assets;
}
}
And then to use it:
<s:Button icon="{Assets.asset}"/>
So it basically treats the source as a mini-Singleton. I'm personally not a fan of this method. The only gain you get is slightly less code in each class, but you lose flexibility and it goes against general OOP practices. But it should work.

Setter isn't always triggered

I use a bindable variable that represents a Model and pass it down thru several nested components.
Top level component is my variable:
[Bindable]
private var meetingInfo:MeetingInfoModel;
I initialize it in the handler for the "preinitialize" event:
meetingInfo = MeetingInfoModel.getInstance();
I then pass it thru to 1 component:
<meetingViewStack:MeetingViewStack meetingInfo="{meetingInfo}"/>
In that component I have the following:
private var _meetingInfo:MeetingInfoModel;
public function set meetingInfo( model:MeetingInfoModel ):void{
_meetingInfo = model;}
[Bindable]
public function get meetingInfo():MeetingInfoModel{
return _meetingInfo;
}
I then pass that variable to another nested component:
<documentShare:DocumentPanel meetingInfo="{meetingInfo}"/>
Where I have the same setter/getter set up. Then I pass it again to another nested component:
<documentShare:AttachmentFilesPanel meetingInfo="{meetingInfo}" />
In that component I have an ItemRenderer for a DataGroup component where it binds to "meetingInfo":
<s:DataGroup id="attachmentsList"
width="100%"
clipAndEnableScrolling="true"
dataProvider="{meetingInfo.docsAndAttachmentsList}"
itemRenderer="com.fmr.transporter.view.documentShare.DocumentUploadRenderer"
visible="{meetingInfo.docsAndAttachmentsList.length > 0}">`enter code here`
As I update the "meetingInfo.docsAndAttachmentsList" ArrayCollection, the setters in each nested component get called correctly, until....
...and this is an AIR app, mind you...
I log out and back in. Then, the setter/getter in the last nested component is not fired this time.
Why, oh why, would this happen?
I've been troubleshooting for a couple days and cannot figure it out for the life of me.
Thanks for any helpful tips!!
The code MeetingInfoModel.getInstance(); hints that MeetingInfoModel is a singleton, is it? If so, setter will be triggered only once, because of the mxmlc generates the check that objects instance changed, the generated code for SDk 4.5.1 will be like this:
[Bindable(event="propertyChange")]
public function set meetingInfo(value:MeetingInfoModel):void
{
var oldValue:Object = this.meetingInfo;
if (oldValue !== value)
{
this._883716727meetingInfo = value;
if (this.hasEventListener("propertyChange"))
this.dispatchEvent(mx.events.PropertyChangeEvent.createUpdateEvent(this, "meetingInfo", oldValue, value));
}
}
so if you didn't recreate instance of MeetingInfoModel the setter will not be triggered.

Flex custom toggleswitch not working in actionscript

I have a custom Flex Toggleswitch component that changes the text values of the switch.
package skins
{
import spark.skins.mobile.ToggleSwitchSkin;
public class MyToggleSwitchSkin extends ToggleSwitchSkin
{
public function MyToggleSwitchSkin()
{
super();
selectedLabel="Serviceable";
unselectedLabel="Fault";
}
}
}
If I add the control using the MXML tag, it works fine. However, when I add the component using action script, it does not.
import skins.MyToggleSwitchSkin;
public function addToggle():void {
var myCustomToggle:MyToggleSwitchSkin = new MyToggleSwitchSkin();
hgroup.addElement(myCustomToggle);
}
The control dsiplays but will not activate.
Any ideas what I have missed?
Without seeing your MXML Code, it's tough to compare your two approaches, but I believe #al_Birdy addressed the problem. You've created a custom ToggleSwitchSkin; not a custom ToggleSwitch.
Modify your addToggle() method like this:
public function addToggle():void {
var myCustomToggle:MyToggleSwitch = new MyToggleSwitch();
myCustomToggle.setStyle('skinClass',skins.MyToggleSwitchSkin);
hgroup.addElement(myCustomToggle);
}
I suspect you'll have better luck.