My 3 minutes on stage at Flash on the Beach 09

by with 4 Comments

Thanks to Yezzer and Matt I managed to get hold of a video of my 3 minute “Elevator Pitch” at Flash on the Beach last week. Here it is!

The point I was trying to get across in my 3 minutes was that the differences between OOP programming languages such as ActionScript 3 and Objective-C really just boil down to syntax variants and not too much else really (memory handling aside which is a nightmare on the iPhone!). Flash runs in the browser (or desktop or mobile etc etc), Objective-C runs on the iPhone. Both languages contain classes, methods, static methods, constants, components etc etc.

The iPhone SDK has an MVC framework built in. MVC is a programmatic design pattern, it’s not unique to the iPhone and it’s not unique to PureMVC, Cairngorm or the other ActionScript Frameworks that Flash/Flex Developers often now use to build Apps.

ActionScript has matured so much since I started out as a Flash Dev 10 years ago. With it’s similarities to Java and other languages that have traditionally been considered more *hardcore* good OOP AS3 ActionScripters should no longer see themselves as just developers of Flash content – we now have skills that enable us to jump into other OOP languages quickly and easily (well not always!).

From a personal perspective I welcome Flex Builder and kiss goodbye to the timeline!

I guess the subject matter of my presentation – ActionScript to Objective-C (and everything in between!) was never going to appeal to all the 1000+ attendees of Flash on the Beach but it sounds like my point was taken by a few at least 🙂

Everything You Always Wanted to Know About Flex But Were Afraid to Ask

by with 0 Comments

On Tuesday night I’m going to be talking about Flex at the next Flash Brighton event at the Werks in Hove. It’s an informal event and most of us usually end up in the pub for a few beers afterwards. So, if you’re interested in Adobe Flex SDK and want to know what all the fuss is about then why not come along and see if I can convince you to have a go! Sign up at upcoming here.

In the presentation I’m going to look at my favorite 10 Flex features, try a little Flex Builder coding, link up to a few cool Flex RIAs and give away a demo Flex app I’ve build that brings together some of the features I’ll cover.

Transparency for Flex 4/Spark Applications

by with 16 Comments

This might save you some time if you’re building apps with Flex 4 Beta (Gumbo). In Spark Applications there is no backgroundAlpha property within you main MXML application file. To create a transparent Flex 4 background you’ll need to do the following:

1) Create a custom application skin MXML file.

2) Set the skinClass of your application MXML to the custom skin file: you can do this in the MXML for your app – eg. skinClass=”com.mycompany.myproject.skins.MyAppSkin”.

Search for the default ApplicationSkin.mxml in the Flex 4 SDK. Duplicate this file, rename it and place it within your project source. In the new skin code I just added alpha=”0″ to the backgroundRect declaration.

That’s it 🙂

3 minutes on stage at Flash on the Beach ’09

by with 0 Comments

At Flash on the Beach this year I’ve been selected as one of 20 speakers who will get the chance to present to a full house at the Brighton Dome. But there’s a catch – we’ve each got the limelight for just 3 minutes!

There’s a real mixture of talent for this session and it looks pretty evenly split between designers and developers.

I think for many of the presenters this will be their chance to showcase their most visually engaging work, as 3 minutes is such a short time frame to get anything in-depth across.

The title of my talk, however, is ActionScript to Objective-C (and everything in between) – perhaps not the sexiest title and certainly not that easy to spice up with animated visuals!

I guess my thought behind this proposed presentation was to stick to what you do best. I’m a very experienced OOP ActionScripter and I write good extendable code (even if I do say so myself!). As my OOP skills have developed over the years so has my ability to pick up new programming languages quickly. This is really the message I hope to get across at FOTB – good OOP concepts in ActionScript can be applied to many programming languages and if you’re good at OOP then the core development principles of the iPhone SDK, Objective-C and other OOP based languages will not take long to master.

Come and check out the Elevator Pitch on Tuesday September 22nd at Flash on the Beach 2009 🙂

How to implement background images on Spark control buttons with scale 9

by with 6 Comments

Hopefully this quick post will be a bit of a time saver for Flex Developers developing Flex 4 SDK projects with Flash Builder or other tools…

Over the last year or 2 I’ve really got comfortable with reskinning Flex 3 applications. For me the quickest, simlest way has usually been to cut up the designer’s photoshop file and implement Scale 9 and syntax in my Flex css files – an example of a recent Flex 3 button skin looked like this:

.answerButton
{
fontSize    : 44px;
fontWeight    : bold;
paddingLeft    : 15px;
paddingRight: 15px;

upSkin        : Embed(source=”assets/images/new/buttons/answerButtonUp.png”,scaleGridTop=”20″, scaleGridLeft=”19″, scaleGridRight=”145″,  scaleGridBottom=”99″);
overSkin    : Embed(source=”assets/images/new/buttons/answerButtonOver.png”,scaleGridTop=”20″, scaleGridLeft=”19″, scaleGridRight=”145″,  scaleGridBottom=”99″);
downSkin    : Embed(source=”assets/images/new/buttons/answerButtonOver.png”,scaleGridTop=”20″, scaleGridLeft=”19″, scaleGridRight=”145″,  scaleGridBottom=”99″);
disabledSkin: Embed(source=”assets/images/new/buttons/answerButtonUp.png”,scaleGridTop=”20″, scaleGridLeft=”19″, scaleGridRight=”145″,  scaleGridBottom=”99″);
selectedDisabledSkin: Embed(source=”assets/images/new/buttons/answerButtonUp.png”,scaleGridTop=”20″, scaleGridLeft=”19″, scaleGridRight=”145″,  scaleGridBottom=”99″);

}

Luckily for me the Flex 4 SDK is backwards compatible for the most part so you can still skin an mx.controls.Button component with the CSS above.

However… one of the reasons I’ve been migrating my Flex 3 project to Flex 4 is to make use of some of the skinning improvements it offers with it’s new Spark components built on top of the Flex 3 halo components.

The code above does not work on a spark.components.Button. I assumed it would… Here’s how I got the example below to work:

https://www.nickkuh.com/demos/gumbo/scale_nine/

Step 1) Create a new Flex Project in Flash Builder

Step 2) You can still customize the label colours and states but you’ll need to implement the new namespaces in CSS introduced in Flex 4 to avoid warnings and errors – see the gumbo_scale_nine.css file.

Step 3) You’ll also notice within the gumbo_scale_nine.css file that I’m pointing a custom style (‘answerButton’) to an MXML skin file in the location com.nickkuh.skins.AnswerButtonSkin.mxml. This is the file that I’ve used to custom skin the spark button component. I copied the ButtonSkin.mxml file that comes with Flex 4, stipped out a load of fills and strokes I didn’t require and add these important lines:

<s:BitmapImage left=”0″ right=”0″ top=”0″ bottom=”0″ source=”@Embed(source=’assets/answerButtonUp.png’,scaleGridTop=’20’, scaleGridLeft=’19’, scaleGridRight=’145′,  scaleGridBottom=’99’)” resizeMode=”scale” includeIn=”up” />

<s:BitmapImage left=”0″ right=”0″ top=”0″ bottom=”0″ source=”@Embed(source=’assets/answerButtonOver.png’,scaleGridTop=’20’, scaleGridLeft=’19’, scaleGridRight=’145′,  scaleGridBottom=’99’)” resizeMode=”scale” excludeFrom=”up” />

By default the resizeMode parameter will just tile and repeat your graphic which wasn’t the desired functionality.

So that’s it. Although it took more step to reskin than a Flex 3 component I can certainly see the benefits of the separate FXG skin file. Next step is to change that SimpleText labelElement into a RichEditableText component and enable multilines and imline images into my Spark buttons. Wish me luck!