The bAS3 Class http://www.brandondement.com/blog Adventures in software development Thu, 02 Sep 2010 05:56:30 +0000 http://wordpress.org/?v=2.8.5 en hourly 1 Flex 4.5 SDK Build Released http://www.brandondement.com/blog/2010/09/01/flex-4-5-sdk-build-released/ http://www.brandondement.com/blog/2010/09/01/flex-4-5-sdk-build-released/#comments Thu, 02 Sep 2010 05:54:36 +0000 Brandon http://www.brandondement.com/blog/?p=127 Adobe has just released their next build of the Flex Framework, codenamed “Hero,” on Adobe Open Source.

Some of the mobile and more advanced features aren’t available until they release a new version of the player, but the new components they list are.  What I thought was particularly interesting was a few of the enhancements being made to the Spark Image Component, which is meant to replace the Halo Image component.

The Spark version is enhanced to provide BitmapData sharing across instances, which both reduces memory footprint and perceived loading time when loading the images multiple times.  Adobe took the Flex Framework a big step forward when they went from 3 to 4, which I think is shown in how they’re just now getting around to releasing fundamental components like Image.

It’s fun and efficient to use the Flex Framework for getting UI work done fast, but at the same time it makes me a little nostalgic for the time when I needed to write neat little gadgets like an image cache myself.

]]> http://www.brandondement.com/blog/2010/09/01/flex-4-5-sdk-build-released/feed/ 0 FITC San Francisco http://www.brandondement.com/blog/2010/08/21/fitc-san-francisco/ http://www.brandondement.com/blog/2010/08/21/fitc-san-francisco/#comments Sat, 21 Aug 2010 22:40:40 +0000 Brandon http://www.brandondement.com/blog/?p=118 FITC held it’s first ever event in San Francisco last week where they brought together some of the most creative and innovative minds from Flash’s design and development communities.  I had heard about previous FITC events and their increasing reputation for great speakers, educational sessions, and never-before-seen demos experiments, so when I heard they were coming to my new home, San Francisco, I have to admit I got a little giddy.
They sent out an early call for volunteers which I jumped on in a heartbeat.  Being a volunteer was a no-brainer for me, it saved a ton of money and for just a little bit of my time I got access to most of the sessions as well as an inside look into how FITC works and what it takes to put it together.  I met several of the FITC staff and chatted with them about their jobs of putting on these events all across the world.  It’s an impressive feat for them to orchestrate so many moving parts remotely, fly to a new city and have them all fall into place, then turn and do it all over again just a couple months later in another new city!  I also thought it was really funny how all these Canadians were caught totally by surprise by San Francisco’s chilly Summer weather, it was warmer in most parts of Canada than it was in SF!
I went to several sessions including the Adobe Keynote with Kevin Lynch, Flex 4 Lifecycle Best Practices with Aaron Pedersen & James Polanco, and High Performance Mobile Content with Flash with Mike Chambers
The Adobe Keynote was great and renewed my confidence that Flash is and will be an integral part of the Internet for a long time to come.  For example, cell handset makers are starting to advertise that their devices support Flash, even putting the Flash Player logo on their packaging.  I also asked Kevin Lynch a question that has been burning in my mind for a while about the capabilities of CS5’s Device Central.  His answer was really, really impressive.  Normally you would expect the first iteration of a major feature like Device Central to be somewhat underwhelming, but not so in this case, just a few of the features are:
  • Simulation of all input types and layouts – In Device Central you can see a little picture of the actual device your testing and play with each and every one of the buttons and input controls it suppors
  • Memory and CPU Simulation – What’s more important on a mobile device than performance?  (See below!)  Device Central actually simulates the capabilities of the device you’re testing to let you know how your content will do.
  • Radio interference – Kevin told a story about how some developers were actually taking test devices into elevators to test how their application performs with degraded reception, so they built this into Device Central!
  • Screen glare – Whaaaat? Does your application have enough contrast to be seen when the device is being used outdoors?  Device Central can help you find out.

Device Central is powerful, but no tool can guarantee that your app will work as designed in real world scenarios, so don’t forget to test yourself, on a real device, because as we all know: ain’t nothing like the real thing, baby.

And finally, I attended Mike Chambers’ session on mobile application performance.  I was going in hopes of picking up tips to apply to my day job as a game developer, and I wasn’t disappointed, as most of Mike’s tips could be applied to virtually any application, but is especially important when running in under-powered mobile environments.  Here are my Cliff’s notes:
  • Air 2.5 beta open – Open to anyone who registers.  Repurposes most of the work done for iPhone development and applies it to Android.
  • Bit.ly/as3performance – Grant Skinner’s performance testing framework
  • Github.com/MikeChambers – Mike Chambers’ Simple Game Framework, a set of utility classes to perform various game related functions like a Centralized Game Loop, Object Pooling, Caching, etc.
  • Mobile support coming to next version of Flash Builder (don’t know any details of what this means)
  • ALL vector rendering in AIR 2.5 is done via the GPU, which improves performance on all devices and improves battery life on mobile devices
  • All vectors on stage are rendered, regardless of screen position.  i.e. If you move an object off-screen, it is still iterated over in the rendering phase, wasting resources.  To improve this, set visible = false.
  • A new property called “cacheAsBitmapMatrix” is now available in AIR 2.5, and will be available in the Flash Player in a near release.  Right now when you set cacheAsBitmap=true, and then scale or rotate the bitmap, it has to be redrawn.  By setting the cacheAsBitmapMatrix to a matrix (usually just the identity matrix), you enable bitmap caching and greatly increase the performance of any redraws that occur.
  • Performance tip:  Do anything you can to prevent redraws (check the redraw regions to figure out what’s being redrawn).  Things that force redraws are: Using the drawing API, changing/moving an object or it’s children, removing an object/child, or occluding non-cached objects.
  • Setting Array/vector.length = 0 is faster than setting array/vector = new Array/Vector
  • Object instantiation is very expensive, so instead of disposing objects, you can put them back in the pool and reuse them later.
  • Mouse events are cheaper than touch events on mobile devices, and single finger touch events are automatically translated to mouse events.  You should use these mouse events instead of the touch events to improve performance.
  • Avoid using mouse move which is fired really, REALLY fast, and can cause lots of extra calculations that are made but go unused between frames.  Instead, do your updates at the framerate by using ENTER_FRAME
  • In certain areas where performance is super-important, consider using callbacks rather than events. Event objects have to be created and propagated, which is expensive.
  • If you’re listening to an object that is deeply-nested in the display list, stop its propagation
  • Bytearray.org/?p=1363 – A whitepaper called “Optimizing Performance for the ADOBE® FLASH® PLATFORM” (attached), this is the single greatest resource for performance tweaks I’ve ever come across.  It validates a lot of the techniques I’m already applying for game development, and points out a few others to consider.

All in all, the 1st annual FITC SF was a resounding success, and you can bet I’ll be back next year!

]]> http://www.brandondement.com/blog/2010/08/21/fitc-san-francisco/feed/ 0 Videos from Flash Camp San Francisco http://www.brandondement.com/blog/2010/05/13/videos-from-flash-camp-san-francisco/ http://www.brandondement.com/blog/2010/05/13/videos-from-flash-camp-san-francisco/#comments Thu, 13 May 2010 19:40:44 +0000 Brandon http://www.brandondement.com/blog/?p=113 I had the pleasure of visiting Adobe’s San Francisco office for Flash Camp a couple weeks back. Coming just on the heels of Apple’s big 3.3.1 announcement, it was perfect timing to hear Adobe’s reaction directly from Adobe. All of the videos are posted online on Adobe TV, but to save you some time, here are my Cliff’s notes:

  • Open Discussion and Q&Q with David Wahdwani – Hear the first reaction directly from the head of the Flash Platform on Apple’s move
  • What’s new in Flash CS5 – Nothing new if you’ve been paying attention, lots new if you haven’t
  • Using Flash Builder 4 with CS5 – “You can edit your code in Flash Builder! It will ask you if you want to edit your code in Flash Builder!”
  • Flash Player 10.1 Internals – Must-see for devs, excellent talk about how the player handles low-memory situations and how to develop for them (think: mobile)
  • Flash Build 4 Tips and Tricks – For devs only really, but there’s definitely a couple tidbits worth noting (like keyboard shortcuts!)
  • TV & Mobile Design Challenges & Insights – “Make text and hit areas bigger” But also gives some concrete recommendations
  • Desktop and Mobile Development with Adobe Air – Adobe officially announced the AIR2 Beta for Android during this preso, talked about what it can do, very exciting
  • Introduction to Multi-touch in Flash Player 10.1 – Excellent primer to get you thinking about how to create multi-touch interfaces with Flash on Android
  • Developer Tips and Tricks for Targeting the Flash Platform – Mostly common sense techniques that good developers shouldn’t be news to any decent developer
  • Advanced Text Layout with Flash CS5 – I didn’t see this session, but the new text layout features are very impressive
]]> http://www.brandondement.com/blog/2010/05/13/videos-from-flash-camp-san-francisco/feed/ 0 Flex Formatter Plugin http://www.brandondement.com/blog/2010/01/02/flex-formatter-plugin/ http://www.brandondement.com/blog/2010/01/02/flex-formatter-plugin/#comments Sat, 02 Jan 2010 23:05:50 +0000 Brandon http://www.brandondement.com/blog/?p=90 Code formatting is the reason for many a jihad between developers all over, and spending any time at all discussing it is a waste of time.  (So should I stop writing here?  No!  There is an answer!  Press on…)  Unfortunately this is one issue where it’s impossible to make everyone happy, so you have to settle for making everyone equally UNhappy.

A really painless way to do make everyone equally unhappy is to automate the formatting, and that’s where the amazing little gadget, the Flex Formatter plugin for Flex and Flash Builder comes in.

The plugin adds a few buttons to the toolbar area of Flex Builder.  These buttons are:

  • Generate ASDoc Comments – For your whole file!  In one click!
  • Generate ASDoc Comment – For one item (also in one click!)
  • Format Flex Code – Formats your entire MXML file (or selected lines) ….with one click
  • Indent Flex Code – Not sure why you’d use this and not just the previous button, it seems to do the same thing
  • Rearrange AS Code – Same as Format Flex Code, but for your AS files

To install it, go to “Help, Software Updates, Find and Install” and install from the new remote site:

http://flexformatter.googlecode.com/svn/trunk/FlexFormatter/FlexPrettyPrintCommandUpdateSite/

Grant Skinner has a nice post on this, as well as a settings file that he has exported for use: http://www.gskinner.com/blog/archives/2009/12/indispensable_p.html

]]> http://www.brandondement.com/blog/2010/01/02/flex-formatter-plugin/feed/ 1 New Features of Flash CS5 IDE http://www.brandondement.com/blog/2009/12/16/new-features-of-flash-cs5-ide/ http://www.brandondement.com/blog/2009/12/16/new-features-of-flash-cs5-ide/#comments Wed, 16 Dec 2009 19:17:11 +0000 Brandon http://www.brandondement.com/blog/?p=101 Today I came across a really nice walkthrough by Lee Brimelow (@leebrimelow) of the Flash CS5 IDE:

http://gotoandlearn.com/play?id=118

He demos and discusses the features with some detail, or you can read my cliffs notes version below:

  • Major upgrades to video support in the IDE
    • Create cuepoints in the IDE
    • Play the video while its on the stage
    • Manipulate the video on the stage while its playing
    • More video player skins
    • Live video player skin switching
  • Font Embedding Improvements
    • New Panel UI
    • Embedded fonts are globally managed through the new panel
  • XFL Format
    • Replaces FLA format
    • FLA data is contained in multiple XML source files
    • Can version control XML files rather than binary FLAs
  • SWF File size History is tracked
  • Code Snippets included to implement simple functionality quickly
  • Editor now has code hinting and completion for all imported classes (just like Flash Builder)
  • Selecting an error in the Compiler Errors brings you to the source
  • Tight integration for code editing with Flash Builder
  • New brushes for Deco tool (Designers will love these)
  • SWFObject2 used as default embedding method (just like Flash Builder)
  • TLF (Text Layout Framework) gives you tons of options for doing awesome things with text
    • flow text between multiple TextFields, TextAreas
    • Multi-column text fields
    • Possibly automatically scrollable
    • Easier Internationalization, including right to left (Arabic) and vertical (Japanese)
    • Highlighting conforms to customized text flow

And a bonus!  Here is a walkthrough of how to export your ActionScript project as a native iPhone application!  http://gotoandlearn.com/play?id=116

]]> http://www.brandondement.com/blog/2009/12/16/new-features-of-flash-cs5-ide/feed/ 0 FlexPMD http://www.brandondement.com/blog/2009/12/10/flexpmd/ http://www.brandondement.com/blog/2009/12/10/flexpmd/#comments Fri, 11 Dec 2009 01:46:08 +0000 Brandon http://www.brandondement.com/blog/?p=106 You probably haven’t heard about FlexPMD.  It’s an open source plugin from Adobe for Flex or Flash Builder.  You run it against your source code and it alerts you to “bad smells,” or potential bad practices, in your code.  These types of tools, from FlexPMD’s older brother, PMD from the Java world, and “Lint” from the C world have been around for a long time, checking over the shoulders of developers, and frustrating computer science students who are required to compile with no lint warnings.  (All my programming homework in college had this requirement, ugh!)

I ran FlexPMD against the source code for brandondement.com and was really impressed with the results.  Some of the results were of the “I don’t care about that” variety, but Flex PMD can be configured to ignore those, and many more were in the “Oh really?  You’re right!” category.  I’ve only just begun to use it, but even then I would highly recommend it for anyone who’s committed to becoming a better programmer.  More information about installation and use can be found at:

http://opensource.adobe.com/wiki/display/flexpmd/FlexPMD+Eclipse+plugin

]]> http://www.brandondement.com/blog/2009/12/10/flexpmd/feed/ 0 Love Thy Flex Builder Keyboard Shortcuts http://www.brandondement.com/blog/2009/11/24/love-thy-flex-builder-keyboard-shortcuts/ http://www.brandondement.com/blog/2009/11/24/love-thy-flex-builder-keyboard-shortcuts/#comments Wed, 25 Nov 2009 01:42:25 +0000 Brandon http://www.brandondement.com/blog/?p=84 It never ceases to amaze me how after all the time I spend using Adobe’s tools, they always have a few more features that I’m not using but should be. So every now and then I go brush up on the keyboard shortcuts in Flex Builder, so here are a few highlights (Command = CTRL if you’re on Windows):

  • CTRL + 0 (even on Mac) – Quick Outline.  Hit this, then start typing to jump right to any variable or method definition in the class
  • Shift + Command + R – Open Resource.  Hit this, then start typing any file name to open it.  Works on all file types in your project
  • Command + L – Go To Line.  Opens a dialog where you type in a line number
  • Shift + Command + C – Puts a block comment around the selected text

Strangely there doesn’t seem to be a definitive guide to shortcuts in FB, even the LiveDocs look rather incomplete:

http://livedocs.adobe.com/flex/3/html/help.html?content=code_editor_9.html

But a search for “flex builder keyboard shortcuts” returns results from tons of blogs.  Here are a few more gems that weren’t in the LiveDocs:

  • Command + D – Deletes a line
  • Command + / – Comment/Uncomment a line
  • Shift + Command + D – Inserts an ASDoc-style comment, including parameter and return declarations!
  • Shift + Command + L – Opens an outline of all the keyboard shortcuts available

Also, if any of these don’t suit you, you can always go change them!  In the main menu, click Flex Builder -> Preferences -> General -> Keys (or just type “Keys” in the filter).  Coincidentally, this is the most definitive list I could find.

What keyboard shortcuts do you use that you can’t live without?

]]> http://www.brandondement.com/blog/2009/11/24/love-thy-flex-builder-keyboard-shortcuts/feed/ 1 #FollowFriday Flash Edition http://www.brandondement.com/blog/2009/11/20/followfriday-flash-edition/ http://www.brandondement.com/blog/2009/11/20/followfriday-flash-edition/#comments Fri, 20 Nov 2009 18:57:53 +0000 Brandon http://www.brandondement.com/blog/?p=80 Twitter has quickly become the best source of up to date information about our beloved technology, Flash. If you’re on Twitter already, here are a few things you might be interested in. If you’re not on Twitter, here are a few links that should be enough to convince you why you should be!

If you have any more suggestions, please share in the comments!

https://twitter.com/InsideRIA
InsideRIA.com is a community site from O’Reilly and Adobe for Rich Internet Application development and design.

https://twitter.com/CreativeTweet
A prolific tweeter who posts random but useful tips, tutorials, and links relevant to Flash and the rest of the Adobe Creative Suite

http://listorious.com/Adobe/adobe-evangelists
A list of Adobe Flash Platform Evangelists, most post great links and info

http://listorious.com/pixelhandler/flash
A hand-picked list of people who post about Flash, overlaps somewhat with the evangelists list

https://twitter.com/adobeflash
The PR face of Flash. Rarely posts about tech stuff, but if you want to ask a question or have a comment, they’re a good starting place

https://twitter.com/gskinner
Probably the most well known Flash developer in the world. Ranked “Most Influential” in the ActionScript category by http://wefollow.com/twitter/actionscript

https://twitter.com/fwa
Cutting edge website award news, inspiration, latest trends and more from FWA (Favourite Website Awards) founder, Rob Ford.

]]> http://www.brandondement.com/blog/2009/11/20/followfriday-flash-edition/feed/ 0 Flash Player 10.1 Beta Released http://www.brandondement.com/blog/2009/11/17/flash-player-10-1-beta-released/ http://www.brandondement.com/blog/2009/11/17/flash-player-10-1-beta-released/#comments Tue, 17 Nov 2009 21:58:30 +0000 Brandon http://www.brandondement.com/blog/?p=76 Adobe has released betas for both Flash Player 10.1 and AIR 2.0 today! With this release, the Flash platform now fully supports the Open Screen Project. Earlier this year Adobe announced that they were working with TV manufacturers to get the Flash Player onto a chip that will be embedded in the next generation of TVs, and with this release of the Flash player, they’re addressing the needs of mobile devices. Here are some highlights:

  • H.264 hardware acceleration
  • Multi-touch
  • Gestural and other mobile input models
  • Accelerometer, Screen Orientation, Sleep Mode, and other common mobile device feature support

The best read for the details are the Release Notes, which cut through the marketing fluff and get right to the point
http://labs.adobe.com/technologies/flashplayer10/releasenotes.pdf

Official Release Page
http://labs.adobe.com/technologies/flashplayer10/

Fluffy Marketing Press Release:
http://www.adobe.com/aboutadobe/pressroom/pressreleases/200910/100509AFPforMobileDevicesandPCs.html

]]> http://www.brandondement.com/blog/2009/11/17/flash-player-10-1-beta-released/feed/ 0 The Developer’s Cycle: Code, Test, Refactor http://www.brandondement.com/blog/2009/11/10/the-developers-cycle-code-test-refactor/ http://www.brandondement.com/blog/2009/11/10/the-developers-cycle-code-test-refactor/#comments Wed, 11 Nov 2009 00:14:30 +0000 Brandon http://www.brandondement.com/blog/?p=66 Most developers code, test until the code works, and then continue coding, happy that they’re so good and successful at their job.  When working this way, the split between coding and testing is roughly 50/50 for more junior developers, and trending towards 75/25 for more seasoned pros.  But when working this way, you lose the most valuable opportunity you have to better yourself and your work. Would you turn in a paper without proof reading it first?  Of course not!  When I work, I try to allocate 20% of the time I’m given for an assignment to planning and architecture, 60% for actually writing and testing code, and the final 20% to cleaning up the huge mess I made along the way, aka refactoring.  That’s it kids, the word of the day is “re-fac-tor-ing.”

Refactoring means taking a chunk of already working code, and making it “better.” It’s vitally important that the code already works, otherwise you’re still developing.  “Better” can mean lots of things, from more efficient to more readable, but when talking about refactoring, we’re mostly talking about more readable, which has trickle down effects making it more efficient.  The important thing is that you take the time to read what you just wrote. Like taking notes in class, if you can’t even read what you wrote the day before, how is anyone else supposed to?  Most of the time developers can read what they wrote, but not what anyone else wrote, which is the biggest problem that refactoring attempts to solve.

When refactoring, you should look for ways to simplify your code, making it more readable and maintainable.  Here are a few questions to ask yourself:

Is this code still used?

If it’s not, don’t comment it out, delete it! Version control can always resurrect it if needed, and you’ll be removing one potential point of confusion for someone maintaining your code down the line.

Is my code documented?

At a minimum you should have inline comments that provide a narrative of what the code block below is doing.  That’s usually enough for leaf classes that aren’t meant to be subclassed and are used sparingly.  As code becomes more reused, eventually becoming a library, it should have more complete documentation, like ASDocs.

Do my package, class, function, constant, and variable names still make sense?

This is huge. Names should have an instantly understandable and useful meaning to the human who’s reading your code.  Don’t be afraid to have names that are long, but look for ways to shorten the really, really long ones too.  Use that vocabulary, smart guy!  Flex Builder has a very nice feature called “Rename” that’s in the “Refactor” menu when you right click a name that is effective at making renaming a trivial task.

Is my code well formatted?

Telling developers where to put whitespace and line breaks is probably the most surefire way to make them secretly hate you.  But you, as a developer, should take pride in your craft and make an effort in making your code at least consistent.  If you write a function with 30 unbroken lines of code, it makes it difficult for someone else to scan what’s going on.  Sprinkle some line breaks and inline comments in there to logically chunk it up, and you’ve instantly saved your company time and money in the future.  By the way, Adobe publishes coding standards that their developers are supposed to follow when writing code for the Flex SDKs.  Does every line of the latest SDK conform to those standards?  No way!  But you can see that the developers make an attempt to make their code readable.

And finally…

Is there a simpler way to do this?  Is there a better algorithm?  Is there a function or library for this already?  Are my objects properly encapsulated and loosely coupled?  The answers to these questions will get easier for you to answer in time, but the fact that you’re asking them of yourself has already put you on the right path.

]]> http://www.brandondement.com/blog/2009/11/10/the-developers-cycle-code-test-refactor/feed/ 0