• Tutorials
  • Blog
  • About
  • Contact
  • Adding View Source to Adobe Air in Flash Builder 4.5 and 4.6


    2012 - 03.15

    Oh jeez. I remember Flex Builder 3 making it easy for people to just right click your application and view source. What’s happened here?

    Quick answer is:

    Listen for the applicationComplete event and add the menu item:

    ViewSource.addMenuItem(this, “www.LinkToYourSource.org/srcview”)

    The long answer is that I spent the better part of an afternoon looking for an easy way to have Flash Builder do what it used to do (generate and show my source code). I was seeing Flash Builder to crazy stuff like rip out the “viewSourceURL” tag from my WindowedApplication. I figure there’s some sort of setting in the project properties that is set to kill stuff like this when doing a production release but I couldn’t seem to find it. Is my hair falling out?

    Oh, and yes, I’m talking about Adobe Air here. I see everything seem to be in order when doing a Flex browser application.

    To generate the view source files I fired up an old version of Flex 3 and when I went to the export wizard it had that old familiar “Enable view source”. I pulled in a more modern compiler but Flex Builder didn’t seem to get the build right. But it did generate the viewable source code. So I took that code and posted it online. Then I switched back to Flex 4.6 and made the actionscript call to add that source menu:

    protected function applicationCompleteHandler(event:FlexEvent):void
    {
    ViewSource.addMenuItem(this, “http://SAMPLE_WEBSITE.ORG/srcview/index.html”);
    }

    So while this solution works, I’m sure there’s some really simple way to get my old familiar wizard back.

    What am I doing wrong here?

    Getting the View Navigator Change Event


    2012 - 02.20

    Maybe you’re googling to find the Flex View Navigator change event? I know I was but I didn’t find it. Here’s the quick fix:

    You can watch for the length to change like this:
    ChangeWatcher.watch(mainNavigator,’length’, mainNavigator_lengthChangeHandler, false, true);
    Take note that we’re using weak reference here.

    Another option that I’m leaning towards is responding to the view navigator’s elementAdd and elementRemove events.
    ViewNavigator id=”mainNavigator”
    firstView=”view.homeScreen.HomeScreenView”
    elementAdd=”mainNavigator_elementAddHandler(event)”
    elementRemove=”mainNavigator_elementAddHandler(event)”

    Some of these blog posts are just so I can find the answer to the same problem later. But I hope they help someone else also :)

    Best of luck,
    Matt

    Center A Popup in Flex Mobile after Orientation change


    2011 - 12.19

    How do you center or re-center a popup in Flex when a user is changing the orientation of the device?

    Maybe a user rotates the device and the view changes from landscape to portrait view and you have a popup that needs to be re-centered. So what to do . . .

    Well, I’m glad you asked. Basically, you need to listen for the Stage to dispatch a StageOrientationEvent.ORIENTATION_CHANGE event. When the orientation does change, you’ll need to wait for the view to update (or whatever magic you’re doing), give Flex a second to redraw the view by waiting a frame then center the popup. (PopUpManager.centerPopUp)

    Additionally you could set a flag and wait for the updateDisplaylist method to be called before centering your popup.

    Ok if that wasn’t clear, maybe a little code would help:

    protected function addedToStageHandler(event:Event):void
    {

    this.stage.addEventListener(StageOrientationEvent.ORIENTATION_CHANGE, stageOrientation_eventHandler);

    }

    protected function showSettingsPopup():void
    {

    PopUpManager.addPopUp(settingsPopup, this, true);
    centerPopup();

    }

    protected function stageOrientation_eventHandler(event:StageOrientationEvent):void
    {

    if(settingsPopup)
    {
    //we call it later so that Flex can layout the app before we center everything.
    // we could also set a flag and override the update display method.
    callLater(centerPopup);
    }

    }

    protected function centerPopup():void
    {

    PopUpManager.centerPopUp(settingsPopup);

    }

    So in this code we’re using a popup called ‘settingsPopup’. You’ll need to make your own popup and have a reference to it in order to center it.

    Best of luck,
    Matt

    Blinking Text in Flex 4.6 – Stage Text


    2011 - 12.15

    I’m in the middle of a mobile project and just switched from Flex 4.5 to Flex 4.6. No big deal right? Night before a small deadline and I figure I better put it on an Android device and make sure everything is still looking good.

    Whoops, for some reason the TextArea that I was using had text that was disappearing. It was really odd. I’d push a view and the textarea text would show for a second and then disappear.

    Then oddly come back when clicking on stuff. What is this? Black magic? Is this the work of the devil?

    Nope, this is the work of new Stage Text feature in Flex 4.6.

    Stage Text is super helpful because it allows for the native application to display the text and do cool things like use the native OSs text auto-complete but it’s tricky.

    Stage Text has many limitations. For example, It’s not going to work well in items that scroll.

    Solution

    If you don’t want to play around with Stage Text or you’re experiencing blinking / disappearing oddness don’t stress. You can just change the skinClass:

    skinClass=”spark.skins.spark.TextAreaSkin”

    Best of luck and hope this helps!