Flex 4 :: StyleManager.getStyleDeclaration() :: take 2

June 25th, 2009

Hi,

I need to clear the air here, what I said in my last post seems to be deprecated as of Flex 3. I dug into the auto generated classes and now see how the compiler is initializing classes.

For a type selector in a component it would be something like;

var selector:CSSSelector = new CSSSelector("com.teotigraphix.ui.control.TitleBar", null, null);
var style:CSSStyleDeclaration = StyleManager.getStyleDeclaration("com.teotigraphix.ui.control.TitleBar");

if (!style)
{
    style = new CSSStyleDeclaration(selector);
}

if (style.defaultFactory == null)
{
    style.defaultFactory = function():void
    {
        this.skinClass = com.teotigraphix.ui.skin.tk.TitleBarSkin;
    }
}
 

The key difference from Flex 3 to Flex 4 is the CSSStyleDeclaration can take a string OR a CSSSelector instance. If the argument to the CSSStyleDeclaration is a CSSSelector instance, the CSSStyleDeclaration will automatically register the new css declaration to the StyleManager.

The trick here is that the CSSSelector overrides it's toString() method to return the specific selector name based on it's ancestor and conditions. The style manager still uses the string selectorString in the set declaration method, but if an instance of CSSSelector is passed instead of a string selector name, the toString() method is called on the CSSSelector.

That sounded like a tongue twister. :)

Mike

Flex 4 :: StyleManager.getStyleDeclaration()

June 25th, 2009

Hi,

I'm in the process of creating new implementations of some Flex 3 classes in the Spark/Flex 4 framework.

Since Gumbo has been made available back in.. whenever, I kind of glossed over something with css I didn't quite understand.

I understand the new css namespaces but wasn't exactly sure how to create a TypeSelector in actionscript. Where code like;

var selector:CSSStyleDeclaration =
    StyleManager.getStyleDeclaration("TitleBar");

if (!(selector is CSSStyleDeclaration))
{
    selector = new CSSStyleDeclaration();
    StyleManager.setStyleDeclaration("TitleBar", selector, false);
}

would create a new TypeSelector for the TitleBar class. With the new @namespace feature of Flex 4, this has changed. You now need to write the fully qualified class name to register a TypeSelector.

var selector:CSSStyleDeclaration =
    StyleManager.getStyleDeclaration("com.teotigraphix.ui.control.TitleBar");

if (!(selector is CSSStyleDeclaration))
{
    selector = new CSSStyleDeclaration();
    StyleManager.setStyleDeclaration("com.teotigraphix.ui.control.TitleBar", selector, false);
}

Hope that helps someone porting code from Flex 3 to Flex 4/Spark.

Mike

Flex :: ToolTipManager hideEffect

June 24th, 2009

Hi,

Just a passing thought but, I was working on a custom tooltip component today and was researching the hideEffect of the ToolTipManager. I spent 1 whole hour trying to figure out why the hideEffect wasn't working that I registered with the manager.

Low and behold, running through the debugger I realized that when you mouse off the currentTarget of the manager, the hide instantly method runs. The moral of the story is, to get the hideEffect to work that is assigned to the manager, the effect is dependent on the hideDelay of the manager!

Does anybody think there should be a feature that allows the hide effect to run conditionally on a moseOut event of the target? I think it would be nice.

On a side note, re-implementing a new tooltip manager might work, mx_internal overrides though. The problem with this is hideImmediately() is private!

Mike

Flex 4 :: Beta 1 here : Flash Builder

June 1st, 2009

Well,

I think the blogging will now pick up since the vision is starting to become reality; Flex 4 Beta 1.

The last year has been quite a trek for my development. There are some interesting frameworks and components in the mix for this next version of Flex. A couple of open source projects as well from Teoti Graphix.

I have a reminiscent feeling of trekking through the Flex 2 alpha and betas and feeling a glimpse of something really kewl. From a component developers perspective that has been around the block, Flex 4 Spark is just plain awesome. The View has finally been decoupled from the Model and can breath a little better. As far as the Model and Controller, that has yet to b seen, I have an answer for that though.

Flash Builder, for someone out of the loop a bit, I just had to laugh, tip my hat and say Flex Builder thanks for the fish.

For the sake of google and flex 4 namespaces; I am cringing at the pain new developers are experiencing when trying to get flex 4 namespaces working. For the google record and flex 4 namespace, here is my contribution to the monster search engine.


xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:mx="library://ns.adobe.com/flex/halo"
xmlns:s="library://ns.adobe.com/flex/spark"

fx : Holds all tags such as what was mx:Style, mx:Script ect. so... fx:Style, fx:Script

mx : Holds all Halo components IE mx:Tree, mx:Box, mx:Button (can you say skin style with ProgrammaticSkin) :)

s : Holds all of the new Spark architecture, s:Button, now uses skinClass.

Much more to come, now that the animal has been tamed, we can start to dissect it.

Mike

TEOComponents get a Flex 3.2 update

March 16th, 2009

Teoti Graphix, LLC has released it's Flex 3.2 maintenance upgrade, check our components out if you haven't.

Teoti Graphix, LLC

We have been selling Flex UI components since 2006 and have had 100's of happy customers that enjoy professional documentation and low to zero support issues.

What's up with Teoti

We have held off this last year and a half with new releases, getting ready for Flex 4's major view change. This is about the most important change to the framework in relation to component developers yet.

CSB Flex 4 Framework

In my last article I started to explain our CSB (Component, Skin, Behavior) framework. This has been implemented in Flex 4 and you will be hearing a lot more about this in the future.

Mike