Flex Toggle Switch Spark Skin

With Flex 4.6 Adobe introduced a new mobile component called the ToggleSwitch. This is a toggle button that uses an interaction paradigm made popular with the iPhone. Unfortunately it is a Mobile component and using it in a desktop application or anything under Flex 4.6 requires some workarounds. In addition, as it's designed for a mobile context the skin is not written in MXML but rather in pure actionscript. This makes customizing difficult.

These limitations made me to decide to write a Spark skin for a Spark CheckBox that functions in the same way. It can be toggled by either clicking/touching or by sliding the toggle. It can be used in any Flex 4 application including desktop applications. That means it also doesn't require Flash Player 11 like Flex 4.6 does.

Read More

Flash Builder custom metadata for Parsley and FlexXB

Flash Builder 4.5 added code completion for metadata tags. Adding support for custom metadata tags however requires building a swc containing a metadata.xml file outlined in hard to find documentation. They could have just added a preferences panel but this is a good way for developers to include custom metadata info right in their library swcs.

Two libraries I use quite often and leverage metadata tags heavily are Parsley and FlexXB. Neither of them have included this metadata.xml file in their latest releases so I have created 2 extra swcs containing just the metadata info using xml files found here and here respectively. I'm sharing them here in case anyone else wants to use them.

Note that they just contain the metadata info not the rest of the library. I could have bundled it in, but if the library recieves an update that still doesn't include the metadata file it will need to be integrated again.

XML parsing with FlexXB

One of the necessary evils of working with xml in Flash is the mundane task of writing xml parsers. I've written countless xml to object and object to xml functions over the years. That is until I came across FlexXB.

FlexXB is a library for handling automatic xml (de)serialisation within Flash. There are a few xml serializers out there including the XML to Object Mapper that's built into Spicelib which is the core of Parsley (my new favourite application framework). Most of these libraries however require you to write quite verbose actionscript to utilize their most basic functions. They end up being hard to write, read and maintain in my opinion. FlexXB can create mappings this way too, but utilizing it within Flex is where it really comes into its own. There you can easily decorate your classes with simple as3 metadata tags that define the mappings automagically.

Here is an example taken from the documentation:  

This is a simple example on using xml annotations. Only fields that have been decorated with an annotation will be taken into account in the (de)serialization process. Notice the idField attribute. It specifies that this object supports a compact method of defining it in xml, by only specifying the id. The id will be rendered as element or attribute in the owner xml.

[XmlClass(alias="Mock2Replacement", idField="id")]
public class Mock3
{
    [XmlAttribute]
    public var id : Number = 3;
    [XmlAttribute]
    public var attribute : Boolean;
    [XmlElement(alias="objectVersion")]
    public var version : Number;
                
    public function Mock3()
    {
        super();
    }
}

The object has been built as:

var target : Mock3 = new Mock3();
target.attribute = true;
target.id = 5;
target.version = 33;

The resulting XML is:

<Mock2Replacement attribute="true" id="5">
    <objectVersion>33</objectVersion>
</Mock2Replacement>

This makes it so easy to use as classes can be configured inline and most of the time all you need is a simple [XmlElement] tag before a property and you're good to go. If there is ever a whole lot of logic to how an object is (de)serialised all you have to do is implement the XMLSerializer interface and you can do your work in the encode and decode functions. The options at your disposal within the tags gives you lots of power though with support for attributes, elements, array handling, class names, namespaces, virtual xml paths, id referencing, object caching and more. As well as creating mappings for custom objects you can create Convertors for simple objects like Dates that (de)serialize to/from strings.

There are some rare cases where you don't have access to the classes you want to (de)serialize (such as from a swc) which means you can't annotate them. But FlexXB has you covered with an easy to use api for programatically configuring your mappings. There are a few other features of the library such as classes for communicating with web services and object persistence, but I won't go into those here.

The developer recently announced details about an upcoming version (1.7) which will include more robust caching support including a feature I asked for only recently. He has also talked about adding support for xml versioning, which would allow for different xml mappings based on the version specified.

All I can say is this library has saved me hours and hours of time and recommend it highly. I have yet to see something that handles the mundane problem of xml (de)serialization so elegantly.