Ok, so you are now an iPhlash developer, creating cutting edge iPhone apps with the Flex Mobile Framework, AIR and Flash CS5. Things are looking pretty rosy and you can be sure the offers of work are going to start rolling in along with the cash. Who needs Objective C ay? You’re an Actionscript 3 developer … you can build amazing applications and now you can build them for the iPhone … you rock! Hey, what’s that … an email from your client asking if you could build a small marketing app for the iPhone … and they want to pay you a stupid amount of money! Result! Of course you can … you’re now an iPhlash developer!

Cool … the project is go and here’s a design from their Art Director …

NNNNNNNNNNNNNNOOOOOOOOOOOOOO!!!!!!!!!!!!!!!!!!!!!

Now you know I’ve only got love for Flash but I hope you understand the point of this post. Scenario’s like this are gonna bite people in the arse unless they are careful about what they promise their clients. You need that Cocoa UIKit. You need Interface Builder. There’s so much in the iPhone SDK that you will need to build proper iPhone apps.

Let’s be realistic about this … we’re not talking about building apps for the browser or even for AIR. If you build an application for an OS then it is best-practice to adhere to the rules of that OS and use the common UI tools made available. If you own a mac then I think you would agree that when you download and install an app you want to feel comfortable using it. You want the reassurance that the application you are using integrates with the rest of the OS so you can quickly get your head around how it works. This is why the HIG exists and this is why Apple will deny any attempt to reproduce their UIKit components.

Unless your building a game with no OS UI requirements or your app is a bit of eye-candy then you’d be better off building it with XCode. Hopefully Adobe will expand on what they’ve started by creating tools that will let us export assets or views from Flash Builder to Cocoa Obj-C code. It would be great if we could export our project to a View and then integrate it into an iPhone app. There’s already a great tool built in AIR for exporting shapes from SWF to Obj-C that you can view here.

I know that the Flash community are an ingenious bunch and the majority of them aren’t stupid either so I hope that this is just the incentive they need to build some really useful tools that will enable us to build proper iPhone apps in the near future. Until then you’d be best not to promise your clients you’ll be porting over their web apps to the iPhone just yet … not until you’ve discussed the requirements IN DEPTH.

This post by Jeff LaMarche is a much more eloquent argument about why we should all step back and have a re-think about this. Especially how this may effect the relationship between Adobe and Apple. Hopefully Jeff will have some further comments to make on the subject and I invite him to do so here too.

From Jeff …

If I were a Flash developer, I wouldn’t cheer just yet. This looks like a risky proposition to me at present. Adobe and Apple are still acting in an antagonistic fashion toward each other. Adobe could very well have crossed the line here. There are both legal and technical options open to Apple to prevent Adobe from doing this if they choose to. Will they? I honestly don’t know. Apple still makes money from apps that are created with Flash tools, so they might just ignore it and take their 30% cut quietly.

So the big news from the Adobe MAX conference yesterday was the announcement that Flash Player 10.1 will allow Flash Platform developers to create content for a range of other devices including Mobile, NetBooks and Set-top boxes. The new player will include some new multi-touch events to take advantage of this capability on Mobile, MacBook’s and Windows 7 touch-enabled devices. I’ll be looking at these events myself when they release the updated SDK and player and will be sure to post some examples and experiments.

Bigger news came in the form of a spoof ‘MythBusters’ video exploring the ‘myth’ that you can’t produce Flash content for the iPhone. Yes, Adobe will be compiling native iPhone content directly from Flash CS5. There’s no Flash plugin in the browser on the iPhone but the new FP10.1 touch events will work apparently. The compiler technology is way over my head but here’s the press release and some information on labs. It seems that Adobe have snuck a few iPhone apps onto the store in advance and the example I’ve played with, Chroma Circuit, performed very well (and is really addictive).

This got me thinking about the future for apps on the iPhone if Flash peeps all rush off trying to submit their content to the store. For a start Apple are going to be struggling to keep on top of their approval process. Apple is very strict when it comes to the Human Interface Guidelines (HIG) and the iPhone Dev kit that most devs use to generate UI elements on the iPhone ensure that developers ‘toe the line’ and by and large result in a design consistency that has been part of their success with the device. Now, I know there are already a lot of god awful apps on the iPhone that seem to deviate from the HIG exceedingly but it isn’t just the appearance of an app that is the issue here. Developing apps for the iPhone is a tricky, slippery business. Memory management and proper garbage collection is vital to the performance of the app and without thorough testing and a decent authoring/debugging environment like XCode it’s going to be very difficult indeed to create a decent iPhone app in Flash. So how will we develop decent apps for the iPhone or any of the other devices for that matter?

Well, while everyone was tweeting about the iPhone news I found myself reading through the Mobile dev FAQ’s and noticed this …

Can I use the Flex Framework to create content for the iPhone?

While it is possible to create iPhone content using the desktop Flex Framework, we do not recommend it. The Flex framework is currently optimized for execution in a desktop environment. The performance, UI, and interaction models have not been optimized for mobile devices.

Adobe is working on a mobile Flex Framework, which should be better suited for iPhone development.

What? That last line got me very excited. And then I saw the link.

And here’s a sneak preview!

Flex for mobile devices

Here’s the app they built running on an iPhone :

Interesting bit of trivia is that the codename ‘Slider’ is a joke based on a conversation in which the original Flex framework was compared with a nice juicy burger for developers and so the mobile framework would be a smaller burger … a ’slider’. As a brit … I don’t get it.

So, there’ll be a new lightweight Flex framework that will allow us to produce UI elements and advanced layouts for mobile devices and this framework is currently codenamed ‘Slider’. Now, personally the iPhone thing could be painful but lets not forget about all of the other devices that we can now develop for. A project will need to change state dynamically to fit within a range of screen sizes, layout will be extremely important as people expect their content to adjust to different orientations and the implementation of themes is also going to be huge. The Flex framework is perfect for this type of development and the Spark/FXG partnership is lightweight and flexible.

Reading the FAQ I noticed this …

On what platforms will Slider run?
The initial Slider framework will be optimized to run on high-end smartphones (phones with a processor speed of 400Mhz or more, 128MB of RAM), and will initially target standalone application environments such as Adobe AIR. This matches the category of devices targeted by Flash Player 10.

Reading between the lines here but does this suggest that the AIR runtime will also be available on devices?

UPDATE: This video on Adobe TV talks about how the process of developing the iPhone app is very similar to building an AIR app. So I guess there wont be an AIR runtime for mobile devices.

Building Mobile Applications with Adobe AIR

Some interesting information in that video. Hardware acceleration will be supported via the use of the cacheAsSurface property.

Ted Patrick has a great post on developing iPhone apps with CS5 including source. Check it out.

Here’s a real good cast of the Secret Session from yesterday with Richard Galvan which explores a bit more about the new features of Flash Pro CS5 including the Text framework and support for ligatures and flow.

They’ve added integration between the Flash IDE and Flash Builder so you can launch FB4 from the Flash IDE and setup workflows between the two environments including launching Flash pro to test from FB. This is going to be great for managing assets in Flash while coding in Flash Builder. Code snippets in Flash Pro let non-coders add interactivity too. This will allow large agencies with teams to have their tech dude add all the common code the designers need to build banners for example. Code completion in Flash mimics FB too … finally!

I’m expecting more news today in the second keynote and will update this post. If you are at MAX and see any demos of the Slider framework then please leave me a comment and let me know what you saw and heard.

I am now the proud owner of the Hex colour #BADA55 or Bad Ass to give it its official name. Well, that’s as far as the folks over at http://www.myhexcolor.com are concerned who are selling off all the Hex colours to gullible idiots like myself. I had to own ‘Bad Ass’ though … and it was only $1 (65p).

Apologies to Evan Roth who originally brought it to my attention. But I do sooo totally PWN it now! I may sell it to him if he’s interested.

If you want to buy your own Hex colour you may want to read this post to give you some inspiration.

If you are reading this post there’s a very strong chance that you are at the Flash on the Beach conference and you’ve either been given one of my amazing business cards (thanks Moo) or we’ve just spoken and you’re checking me out to make sure I’m not just a crazy man. Well, the good news is that I am indeed a crazy man but my insanity is fueled by a love of all things Flashy.

Welcome to my site, please take a look around … would you like a cup of tea? A biscuit perhaps? This site is my blog but I have a main corporate site which you’ll find over at http://lyraspace.com. There you’ll find some examples of my work in the Case Studies section and you can read about what I do in Services. Most importantly though, keep in touch! You’ll find my details in the Contact section and please bookmark/feed my site for future reference.

I hope you’re having as much of a great time at FotB as I am (I’ve not even left yet as I write this post) and I hope our meeting has made as much of an impression on you as it has on me (I’ve not technically met anyone at the conference yet).

If we haven’t actually met then please do pop over to point at me and laugh … I’m the small, tubby chap with the stupid looking, over-sized glasses. You may have seen me stumbling off my silver Vespa looking flustered. You’ll also spot me loitering around sources of coffee and trying to steal stickers and t-shirts. Please do say hi.

I’ll continue to tweet my experiences (haven’t started) and you can follow me @leeprobert or @lyraspace depending on whether you want the techy geeky stuff or the downright rude!

Thanks for visiting my blog! See you soon.

I discovered a bug in the Spark ScrubBar class that I thought I’d better document. It’s a real git!

Firstly I noticed that despite setting the bufferEnd property of the class I wasn’t seeing any results. So I watched the numbers and sure enough the bufferEnd property was being set as my media loaded and was significantly larger than the playhead value which made sense.

So then I figured the skin part wasn’t being rendered so I forced a width on it in the skin class and sure enough it was rendered. I soon realised that the bufferedArea was being drawn and was being adjusted over time. Unfortunately its width was being set to exactly the same size as the playedArea element so it was hidden underneath.

So then I did some digging and I traced the calculation of the size of the skin part down to a private method in the ScrubBar class called ‘calculateAreaSize’. Both the playedArea and the bufferedArea get their sizes from this method as the ‘value’ and ‘bufferEnd’ properties change.

The problem is that the argument passed into this method is called ‘value’ which is the same name as the class property ‘value’ that is used to determine the width of playedArea. So when this method was being used to also calculate the width of bufferedArea it was yielding the same results.

The solution is to sub-class ScrubBar and then add the following methods …

You need to create the newCalculateAreaSize method because the Super class method is private.

Hope this helps someone out.

So here I am sitting in bed blogging about blogging on an iPhone. I’ve installed the Wordpress app and so far it all seems to work rather well. I was able to set up both of my blogs with ease and the interface is easy to understand although the initial blog selection screen uses arrow buttons to indicate the edit mode which is counter intuitive. To make this app really useful however I would like to see blogging options integrated into other apps on the phone which will allow me to automatically attach video, photos and maplets. Maplets? I’m not sure if I’ve heard that before or just made it up. In my mind a Maplet is a small map widget with some data attached to it … a mini-google map.

I’ve added a photo from my library of my lovely daughter. I have no idea how it’s going to attach it to my post … We’ll see ay?

Not the most interesting of Screencasts but I thought I’d share anyway. I did this for a client while researching some inline processes. It is a really nice registration process and I intend to try and build a tutorial to show how you can use Flex layouts and transition effects to get that slick look and feel.

Also, I must apologise to Lee[AT]photoshop[DOT]com whoever you are … I made a huge mistake by using an email address that has a 99.99% chance of existing. Sorry about that Lee.

I’m currently building a video player and have built this simple player as a proof-of-concept to test the full-screen capability of the new Flex 4 sdk. I’m having trouble with my particular project as it doesn’t seem to want to trigger the FullScreenEvent.FULL_SCREEN event when the user uses the ESCAPE key to change the display state. This example was my way of testing for a bug. This example seems to work however.

What I have enjoyed about this exercise and the main reason for publishing it is the use of the new state model in Flex 4 to change the layout and properties of the components. First take a look at the example …

(Note: IFrames are not visible in RSS feeds)

Notice when you enter full-screen mode the layout changes from a vertical layout to a basic one with the controls floating on top of the video. Now take a look at the code …

That’s all of the code for this example. The two different layout objects are declared in the declarations tag.

… and within the main content Group tag there’s a property called layout which is set for each of the two possible states. Changing the state will change the layout. The states are set in the states tag and the names are the same as the StageDisplayState.FULL_SCREEN and StageDisplayState.NORMAL string properties. Unfortunately you can’t bind to the stage.displayState property or I probably would not have needed the script tag.

So this is a much easier way of adjusting the layout dynamically and the same principle is used to change the position and size of the VideoElement and controls. The transparent rectangle below the controls is rendered only when in full-screen mode because the includeIn property is set to the fullScreen state and because this state uses the BasicLayout the children need to be positioned absolutely so the x & y coordinates are required also.

You may notice that when you exit fullscreen mode you need to click into the SWF to give it focus before you can re-click the button. I’m not entirely sure if this is a bug in the FlashPlayer or the browser (I’m in FF3.5).

Anyway, hope this helps people understand some of the great new features in Flex 4. Don’t forget to grab the source from the example above.

How do you do what with huh?

Yes. Things are getting slightly more confusing and I worry about just how much this is going to ‘encourage’ the young Noob’s into the wonderful world of Flex.

The Spark TextArea component will allow you to display straight text just by referencing its ‘text’ property like so …

But if you want to start messing about with the new TextLayout framework with columns and funky wrapping then you need to import a TextFlow object into the component. You can do this very simply by using XML as long as the schema is ok. Here’s a quick example of an XML schema …

… and here’s how you import that XML (saved as a file called plainText.xml) into your TextArea component …

More information on the TextLayout framework here.

I’m publishing the very latest Flex sdk language reference files for my own sake as there are discrepancies between the latest builds and the ‘official’ releases.

You can view the latest language reference here.

I’ll *try* and keep this up to date as the builds get released. Give me a poke if I miss one.