Flex doesn’t support adding child components to containers at multiple levels. I.e. it’s not possible to create an mxml component of type HBox with some components declared in mxml inside it, and then use that component somewhere else and put another set of components inside it there also. If you try to do this then you get a runtime error saying:
“Multiple sets of visual children have been specified for this component”
The reason that this isn’t supported in flex is that there’s not really any way for the mxml compiler to know what to do with the additional components. Any option taken would result in numerous possible conflicts and special cases.
There are several possible ways to avoid this issue however:
Only declare mxml components in ‘leaf’ classes (ie. Have no descendants)
Declare all components in action script rather than mxml
Explicitly handle the passing in of the mxml components within the container class and place the components in their correct position.
Option 3 is by far the most flexible/useful, and the following example explains how to implement components which can be used in this way. (more…)
Today Mike Britton posted a question on his blog about private constructors in Flex2. I’ve seen this question come up a few times in the last little while, so I decided I will post my answer to this issue here in the hope that other people might find it useful.
The Problem:
It’s not possible to create a private contructor in flex, yet this is the standard way to implement the singleton pattern. How then do we enforce a singleton in flex?
The Solution:
Here is a simple example of the way in which I enforce singleton classes:
public class MyClass{
public static var myClass:MyClass = new MyClass();
public function MyClass()
{
if( myClass )
throw new Error("Cannot create instance
of singleton class. Use MyClass.myClass");
}
}
Note: This post is not intended to imply that you should use the singleton pattern in your Flex applications My personal experience is that people tend to use patterns like singleton more often than would be ideal.
Data binding in Flex is amazingly useful. So much so, that I sometimes find it hard to remember how I implemented things before I started working with Flex. If you try to make a read-only property bindable however, you get a compiler warning, because Flex has no way of knowing when the value behind the property has changed and thus will never fire the PropertyChangedEvent necessary for the binding to update.
The solution to this problem is to attach an event type to the binding tag which will notify the binding that it should re-execute. The syntax is as follows:
[Bindable(event="EVENT_TYPE")]
public function get property():Object
You then dispatch an event of type ‘EVENT_TYPE’ whenever you want the binding to be updated.
In my last post, I explained how it is possible to invoke a function ‘inside’ an object which it was not declared inside. This is means that within that function, the key word ‘this’ points to the object you are currently running inside. I am using this functionality within my current project to make highly configurable/reusable components, but I have recently come across a pretty major limitation that I wasn’t expecting.
Using the ‘call’ function of the Function class, it is possible to change the object which will be referred to by the keyword ‘this’. However, despite the fact that your code now refers to things through the keyword this, you can only access public properties and functions of that object. This makes the functionality pretty redundant, because you can’t do anything with this that you couldn’t do more intuitively another way. (more…)
All functions within Flex are objects of type Function. This means you can do fun things with them like pass them around within your application. You can even pass a private function to another class and have it invoke it for you. There are lots of examples around on the net where people use this functionality to define call-back functions for asynchronous methods etc.
The documentation for the Function class says that the ‘call’ function (which invokes the function represented by this object) takes as its first parameter the ‘thisObject’. The ‘thisObject’ being the object which is referred to by the keyword ‘this’ from inside the function.
Parameters
thisObject:Object — An object that specifies the value of thisObject within the function body.
myObject.myMethod.call(myOtherObject, 1, 2, 3);
The first thing I thought of when I read that was, surely then you could make the ‘thisObject’ something other than the object which originally held the function. If that were possible, there are a lot of ways in which this could go wrong, but there are also a lot of interesting use cases for such functionality. On my current project at work I got a chance to play with this functionality, and I can confirm that it does work, but it’s a little trickier than the docs imply. (more…)
Apologies for the lack of posts in the last week or so. Now that I have people in my team at work, and I have to work flat out every day to keep ahead of them and make sure they have things to do, and that the project keeps organized and on track. Granted, the client keeps asking me for changes which takes up a lot of my time, but I haven’t done any coding since Monday @.@
I will get back into my normal rythm soon, but for now I promised my sister that I would post this video about the amazing Lyre Bird. It’s definatly worth watching!
This is your chance to get your 15 minutes 10 seconds of fame in front of millions of viewers.
Head on over to the GMail homepage, and the link at the bottom will take you through to the Gmail: A Behind the Scenes Video page. Anyone can upoload their own 10 second video of a GMail message moving along it’s journey to be included as part of the final video. Now I just have to think of something cool to do