For the past few months I’ve been working on a Flash Lite project, and 3 months ago I acquired a copy of AdvancED Flash On Devices. Before this book my main point of reference for any questions on the Flash Lite ecosystem was random mutterings here and there on various Flash blogs, or the constantly changing and always over cluttered Adobe pages. To be frank though, very few people seem to talk about Flash Lite at all, including Adobe.

Topics on Flash Lite in the book include details on devices which run Flash Lite, different versions of Flash Lite and their differences, quirks and bugs, framworks others have made, third party tools and more. The only thing it won’t tell you is how to code Flash Lite apps in any detail, but there are already plenty of books on Flash and Actionscript 2, and the classes available on Flash Lite are well covered in Adobe’s technical documentation.

Importantly there are also chapters on the future for Flash on Mobile, including getting Flash apps onto the iPhone and Flash 10 for mobile.

Since development of Flash Lite has stopped, you can also be sure that this book contains a summary of Flash Lite as it ended, and therefore will not go out of date (although you will have to know to ignore any 3.1 information). If you find yourself working on a Flash Lite project a year from now targeting devices which aren’t compatible with the new Flash 10 for mobile, this book should still serve you as well as it does today.

An essential purchase for anyone looking for a comprehensive overview of the complex world of Flash on mobile.

Teenage panel

The undisputed highlight of the day was the teenage dragons den panel organised by Julia Shalet of the Digital Youth Project. During this segment, various startups pitched their idea to a group of six teenagers aged 16 – 18 who gave them feedback and asked questions.

What was most interesting about this segment to me was not so much the fact that these were younger people, but that the stage was given to non-industry people. Listening to ‘normal’ people give their views on apps, how they use their phones and what they want from their services was a real eye-opener and its something the industry should be doing a lot more of. As one panel member stated, app’s and iphones are what ‘you lot’ (us, the audience) are interested in, not your average teenager (or I’d imagine your average person in general).

Points that surprised/interested me:

• All of the teenagers on stage used their phones for texting, and in the case of the 2 Blackberry owners, online messaging, and very little else
• Most of the teenagers were happy to have ’simple phones’, ‘just a Nokia’ etc. One guy who did get a Blackberry said he preferred his N95 and wished he had just stuck with that
• The teenagers were all keen on at least one of the mobile application ideas pitched to them – despite not having a phone that would be able to easily run those apps, nor really showing any strong keeness to upgrade

It would have been nice to hear some more general views on mobile from the panel, but there is plenty of research available at the mobileYouth site as introduced before the panel by Graham Brown.

As developers and startups, we shouldn’t assume we know what people want, and just develop for ourselves (i.e. fun iPhone and android apps, and business-like Blackberry apps). We could be missing out on a big alternative market.

Other interesting topics

Belinda Parmar from Ladygeek made some interesting points about marketing to women. Not over simplifying, not offering too much choice and not simply going for pink versions were among the points mentioned. Like the teenagers, this talk showed that there are plenty of markets we might not even realise we are missing, and each should be carefully considered.

Douglas Richards and a group of VC’s spoke in the morning about getting funding. The key point seemed to be that app’s don’t make money, services do. Money is also to be made in providing the backbone that these app’s and services run on.

Some constructive criticism

Firstly well done to the team for putting on the first conference of its kind, the day went smoothly and seemed to go without a hitch, even managing to stay on schedule, and providing a lunch and some decent food throughout the day.

As with any conference, it wasn’t all perfection however. Sadly one panel was full of people promoting their companies individual offerings, and failing to discuss the topic at hand. Another descended into a discussion about social networks when the topic promised was on context and the user experience. There was also a distinct lack of true ‘heroes of the mobile screen’, although whether that is a bad thing is up for debate – we don’t need an Oscars of mobile just yet!

My advice for improvements for next time would be:

• Less pure business – a focus also on mobile design and user experience would produce more of a balance
• Select energetic interesting speakers over those from a corporate background who are restricted in what they can say
• Ensure those moderating the panels are able to do so properly – keeping the panellists focussed on the topic set
• More full presentations – panels are often a bad idea, people can get dragged down rabbit holes and end up off topic. A solid presentation, by a published field expert, for at least 25 mins wins every time in my book. Think TED and dConstruct not SXSW.

Let’s see what the team comes up with next year!

I’ll go through each aspect of the trip mobile apps helped me with in turn, and then highlight specific apps, some apps span a few of these. I’m using an iPhone, 1st Gen (so no GPS nor compass).

Local transport

By far the best feature I was able to access on mobile was to figure out the local transport systems in the various cities.

How I used to navigate local transport

I used to find local transport a nightmare – I had no idea where any buses were going apart from the final destination, wouldn’t know which one to catch, which side of the road, where to get off – it was basically impossible. I’d either find one bus and use that, walking the rest of the way, or pay the extra for taxis, or even walk everywhere taking massive amounts of time and exhausting myself.

Apps I used on this trip

I downloaded a local bus app for each city – Seattle Metro for Seattle and PDX Bus for Portland. However, both these had awkward interfaces and simply didn’t make navigating the buses any easier.

Seattle Metro screenshot

Google Maps (installed by default on the iPhone) on the hand was a revelation, simple to understand and use, and it wasn’t even a dedicated bus app – it simply integrated perfectly with the other features of finding out where you were and where to go.

How Google Maps public transport feature works

You simply type in where you are, where you want to go and request a route by public transport. If you don’t know where you are you can use GPS or in our case triangulation, which is can pretty much locate you to within a small range in a large city.

Google Maps screenshot

You then select the time you want to leave, and the app will walk you through the steps needed to reach the destination – how to get to the bus stop, what bus to catch, where to get off and how to reach your intended destination.

Benefits – saving time and money

This app enables you to take advantage of the same cheap transport benefits locals have (and in some cases gives you an advantage over locals). Before I would never have attempted to navigate the bus systems in a strange city, and if I did, I am sure I would have wasted a lot of time getting on the wrong bus or failing to take the fastest routes. You also save the money you may have had to spend on taxis.

There were places we simply could not have gone without this app, such as Kurt Cobains old house in the Lake Washington area of Seattle – there’s just one bus, every half hour, from a random location 10mins walk from our hotel. With Google Maps we got there within 30 mins of deciding to go, had a look, went for a quick walk somewhere else, used triangulation to roughly figure out where we were and got the next bus downtown.

Problems encountered

The app isn’t perfect, we did find some issues.

On Labor day (bank holiday Monday in the UK) the buses run on the Sunday schedules, but Google Maps didn’t know this, hence all the bus times were incorrect all day long. Once we figured out the problem we just used the app to locate bus stops and then read the times on the bus stop. In one case there were no times, so I used another app Seattle Metro, to grab the latest times from the bus company.

Although it lists the nearest bus, if you miss it, it assumes you will want to wait for the next bus rather than walk somewhere else. There is no way of searching out alternative bus stops. At one point we found ourselves in a rough part of town having to wait 20 mins for the next bus. I didn’t want to run alternative searches on my phone. In the end we just walked down the road, and I kept checking for alternative buses as we moved along using the triangulation. Essentially we had to physically move to manipulate the data – a cumbersome input device for sure!

Finding things to do and see

There a number of apps dedicated to travel – locating bars and restaurants and finding stuff to do in the day. Some of these aren’t powered by the most trustworthy sources, so I tend to stick to guide books like Time Out, Lonely Planet and Rough Guides and do a quick sweep of websites before leaving.

This year I was able to put the Lonely Planet guides on my phone by downloading PDF’s of sections I was interested in from their website and putting them on the iPhone using the air sharing app. Unfortunately it was almost unusable as the pdf’s take ages to scroll, always go back to the first page when you exit the app off and aren’t that easy to read on the small device.

Much better was Lonely Planets Travel Guides app which lets you download city guides for around £10 each. Overpriced certainly, and not the most usable, but still hands down the best option. Lighter and less touristy than getting out a book each time, and much better than the PDF’s. The main issue with the app was that the only way to view bars and restaurant was either using a near me feature which listed ones close to you at a given moment in time, or by accessing the map and clicking on random dots to see what was there. Another major flaw is resetting the app every time you load it. Not perfect by any means, but a good effort – I look forward to improved versions of this in future.

Lonely Planet guides screenshot

Other features

I printed all my essential docs as pdfs and put them on the air sharing app. This meant I could quickly check numbers and times without carrying round lots of paper or checking my mail each time.

Being able to access Facebook in the park led me to arrange a meeting with an old friend who was only available that night, there is no doubt we would have otherwise missed each other as I had no time that day to go to an internet cafe (in fact, I didn’t even see any internet cafes).

Web access at anytime allowed me to check opening times for places, ensuring I didn’t go to the trouble of heading all the way to a gallery in Fremont which was closed.

Google Maps helped me to locate hard to find bars and cafe’s, the Seattle and Portland Cocktail Compass even told me which bars near me had happy hour on, and how long they had left!

Final thought

Apps like these don’t just add convenience to a holiday, or satisfy the urge to check your email every 5 mins (not something I actually did), they can actually change your entire trip. We saw and did far more on this trip than any other, traveling faster and cheaper than before on public transport, feeling less tired from walking around everywhere and knowing where and when to visit places. One could say this takes some of the fun out of traveling – the getting lost and finding your way. Personally, I feel getting lost is not something I (and especially not my girlfriend) actually finds as fun as it seems when it happens. It generally leads to wandering around desolate rough parts of towns, worried and stressed.

Whatever your view, there can be no doubt travel is being changed by mobile devices, and we are only at the beginning. Augmented reality here we come!

Image courtesy of FallenPegasus – http://www.flickr.com/photos/fallenpegasus/ / CC BY-NC 2.0

Comments are often used to explain poorly written code

• If you need to explain your code by adding comments inside methods, the method is doing too many things and needs to be broken into smaller methods
• The name of the method should accurately convey what the method is doing to a reader, no comments should be required

Comments rot

• When code is updated, comments don’t always get updated alongside it
• The comments end up lying about what the code is doing

In summary:

• Write better code
• Use highly descriptive method names and parameter names
• Where you feel a comment is needed, instead take the time to rewrite and refactor the code to be more readable

My thoughts

The timing of this couldn’t have been better for me. I’d spent the day working on the code for the memory efficient data list I discussed last week. I had just created 3 functions which each did around 8 different task, broken up by comments explaining what each did. Each task was only 3 – 6 lines of code, so it wasn’t an obscenely long method, but I still wasn’t sure whether to refactor or move on. After listening to the podcast I took their advice of never leaving this until later and refactored the next day.

The result:

• once the code had been refactored into different methods, I was able to see clearly where methods could be combined, reducing the amount of code
• now I had more readable code, I realised some of these new methods really belonged in another class
• so the code was shorter, easier to read, and the comments were gone
• finally, I spotted a bug as it was now really exposed and obvious

Now I plan to impose a new coding ‘rule’ – no comments within methods.

What about comments above public methods, and at the head of classes? The podcast touched on these, saying you might want them for a framework, or for API documentation, although you shouldn’t use them in an auto doc style whereby you just replicate parameter names in comments. I have mixed thoughts on this. I agree that it seems pointless to describe well named methods and well named parameters twice, although it can be useful to detail restrictions on parameters for API documentation. I’d then like to use an automatic tool to produce this documentation to be kept from the code. Also descriptions at the head of certain classes can help explain where, when and how to use the class.

I guess my final thought is to use discretion.

Any thoughts?

The component – a list of data

I’m trying create a list of data which can be navigated by pressing up and down on a nav pad. Each time you navigate, the next item in the list comes into view. You can only see one item at a time.

The intensive option – a basic list

The first time I did this, I created a long list of data, and showed the first item. Pressing up and down simply moved the list up and down as this diagram demonstrates:

There are a couple of issues with this:

• Its uses up a lot of memory as all the list items have to be attached to the stage from the beginning
• You can’t have lists looping round, you can only go to each end

The improved option – reusing movieclips

As the following diagram will hopefully explain, there is another way. You can have just 3 movieclips, and change the position and content of each as required. This saves memory as you only have 3 movieclips on the stage per component and you can loop round and round.

Each coloured square represents one movieclip.

As you can see, this is relatively simple to implement and results in a much more efficient and flexible component. Any thoughts, let me know.

What existing Flash Lite components are available?

Forum Nokia

The latest high profile component release (actually around a year ago now) I could find was the Forum Nokia Flash Lite Components which include a button, popup dialog and scrollbar. Some of the components are skinable, they are flexible in terms of size. They appear easy to install and well documented. Adobe reported on these, mentioning they were rather high in memory consumption – this is down to their flexibility and ease of use – there’s a price to pay for everything on mobile!

Forum Nokia then launched a competition this year which resulted in some winning Flash Lite Components being developed. From that article you can download and play with a few other components. These all appear to follow the same structure as the components created by Nokia.

Adobe examples

The Flash Mobile blog has some Flash Lite UI Component Examples which are intended for internal use only and aren’t documented. Apparently they are very lightweight, so could be a good example of how to develop components, and were developed by the Adobe team. Closer inspection reveals they aren’t especially flexible nor reusable. They are too lightweight! Yes they use less memory, but they haven’t taken into account the need for different sizes and purposes that the Nokia components have. The page that contains the examples has some other great Flash Lite resources and is well worth further investigation.

Shuriken Framwork

Shuriken Components is a framework for creating Flash Lite 2.x+ components, and is the work of one solo developer Jesse Warden. These components are far more developer centric, resulting in a very light SWF file, with as many elements as possible drawn dynamically. This framework requires lots of developer input, and is closest in style to the framework we have been working on recently. My concern about this framework is it ties the presentation to the logic code too closely. As a resource its great if you want to go down the path of creating assets dynamically though, with plenty of code to play with and learn from. Sadly, there’s a lack of documentation (unless I missed it, feel free to chip in Jesse if you find this article).

Conclusion

So in summary, it looks like plenty of people have thought about making Flash Lite component libraries, but really only got to the stage where they were able to teach others how to make those libraries using their ideas. Not many people seem to have taken them up on this, but since we are looking to develop our own components anyway, this seems plenty to go on.

Installing components

Installing components using MXP files

The easiest components to install were those which used MXP files to manage the installation. These then run the Adobe Extension Manager which installs the following:

• Install .fla files containing the assets for the component into your default Flash components folder e.g “[INSTALL PATH]\Flash
  CS4\en\Configuration\Components\Forum Nokia”
• Install class .as files containing the logic of the component into your default Flash classpath, e.g. “[INSTALL PATH]\Flash
  CS4\en\Configuration\Classes\com\forumnokia”

To add components now, all you need to do is drag them from the components window inside Flash CS3/CS4 into your .fla for your app.

In the case of the forum nokia components, it wasn’t quite this simple, they required me to download an additional library and manually add it to the classes folder. It would have been great if the MXP file had done this for me. A point to consider when designing your own components I feel – make it as simple as possible to start using components as quickly as possible. If an automated feature doesn’t take care of the whole install process, the entire process may as well be manual, since the automation tricks you into thinking its taken care of everything.

Installing components manually

In the absence of an MXP file (neither Shuriken nor the Adobe components came with MXP’s) I found I had to open up the .fla file of the component, copy the component into the .fla for my app, and then copy the class into my classpath. It works, but it feels hacky and I’m sure there’s a better way – perhaps just by making an MXP myself.

Creating and using components

Forum Nokia produced their guide to using and creating Flash Lite Components this June. This is an excellent guide and covers many of the topics I had planned to go into here. Read through it to learn how best to create and package your components for reuse. It covers topics I won’t go into here such as

• how to package MXP files, including custom icons and demos to display within the Flash IDE
• how to enable parameters which can be edited from within the IDE using the component inspector
• considerations when planning which features to include in your component

Skinning visual elements

The Nokia components have been designed to make it apparently easy to customise the components. Within the fla file visual elements are placed in a folder structure that can be copied so new skins based on the originals can be added. Providing they share the same names, linkage id’s and positions of the original skin, these new assets can easily be swapped for the originals to create a new skin, but you are restricted to the basic structure defined in the master component.

Where a number of states are used there is a folder for each state within the skin. Personally, I’d like to see a way of changing simple elements like colours dynamically to reduce the amount of visual elements required. The Shuriken Components seem to take this approach, drawing the components dynamically for all states instead of relying on visual assets.

The Nokia components also manage state by hiding the various states and swapping between them, which isn’t great for memory usage as it increases the amount of MovieClips on the stage at a given time. I’d experiment with removing them from the stage when they weren’t needed instead of hiding them.

Scaling visual elements

The Nokia Components visual elements are cut up so they are scalable, which means their width and height can be altered dynamically without distortion. This has been achieved by separating out intricate elements such as rounded corners, edges and base backgrounds. The AS Class that manages the component then looks for a placeholder movieclip the developer places within the stage and resizes all the visual elements using a scaling multiplier to match the dimensions of the placeholder.

The placeholder technique is a clever one, and a great idea for visual developers. It does mean more movieclips on the stage though, and places all the control in the hands of the Flash visual IDE. In our own apps, I would ensure the components could accept a width and height submitted to the AS Class using its API instead of relying on a placeholder, which would reduce the size of the final SWF and moves control of the components back into the apps Classes.

Since the Shuriken framwork uses dynamic resources these components also scale very nicely.

Targeting different devices

Nokia have considered device targeting, and use the placeholder technique combined with multiple frames to manage different sizes (its all explained in the guide to using and creating Flash Lite Components). I’m not a fan of adding frames into the stage, and would perhaps use a build process, perhaps with rake and MTASC to generate different swf’s with different resource sizes. That’s a blog post for another day for sure!

Conclusions

Nokia have done some great work in this field, laying the ground for people to develop custom components. However, I feel their components may be a little too bloated for many existing devices to cope with. I’d love to hear some feedback from them on this – do they not feel their recommended methods result in swf’s that are simply too large, and lead to high memory usage apps? There is no denying the ease of use and installation of these components though.

I feel that taking things forward, we can learn from both Nokia and Jesse Warden’s Shuriken Framework, the space is wide open for someone to come up with a well documented and useable yet relatively light and optimised framework and set of sample components for Flash Lite. Are you working on such a thing? Leave your comments and thoughts below. I’m off to work on my own ideas now!

Key references and people to follow…

• Forum Nokia
• Mark Doherty of Adobe
• Jesse Warden, Flex and Flash RIA dev
• Pinbadge Actionscript image care of Joe Pemberton of fellow mobile UI guys Punchcut http://www.flickr.com/photos/joepemberton/ / CC BY-NC-ND 2.0
• Ribot, the mobile user interface team behind the project I’m working on that inspired this research – you’ll be hearing more about Flash Mobile components from us in the coming months methinks…

Here are my top suggestions for getting involved…

1 – Attend an event

The easiest way to get started is to get along to an event. There a number of regular/semi regular events as well as one offs and occasional festival type events and conferences, I’ve listed them below along with frequency and price. Many of these are free, and some are more tuned to networking than others.

My advice – start with an event that has a focus (i.e. a speaker) and see who you can get talking to at the end, it's always better to deal with people in person instead of via a phone conference call. Complement this with some regular trips to The Farm which will get your face known by people you might bump into at some of the other events. You’ll soon find you know lots of people, and start getting introduced to others.

Weekly meetups

For those who just want to meet people and possibly find some work there is the Brighton Farm, a meetup for Freelancers, although anyone is welcome. There’s normally at least 10 people in attendence (often more), and it takes the form of sitting round a table in a pub for the first hour, so its easy to take a seat and get chatting to the person next to you – none of this walking up to people you don’t know. As the evening wears on it gets livelier, and subsequently harder to meet new people so a good tip would be to get there early. There’s always a good mix of regulars and newcomers, so you won’t be the only one. Check the website for details, but they always meet in a local pub at 7:30 – look for the people with the tech book on the table. Free to attend, no need to book.

FlashBrighton meets every Tuesday at The Werks, and focuses on a 1 – 2 hour presentation or workshop, often followed by drinks. It was originally aimed at Flash developers, although plenty of people who go along focus on other platforms as well, and the talks often focus on other platforms and areas. The quality of the talks is always high and as its weekly you can quickly get to know people by attending regularly. There’s a different crowd here to some of the other events so well worth popping along to and giving it a try. Free to attend but you must book.

Semi-regular meetups

There are plenty of occasional meetups to suit a wide range of interests. Pick one, or try them all out for size. The meetings generally take place at The Skiff or The Werks (so keep an eye on their sites for details of new groups), and have one or more speakers followed by a trip to a nearby pub where you can get chatting to people. Don’t forget to book tickets by going to the sites listed – these often sell out.

Here a selection:

£5 app features people demoing apps they’ve worked on in their spare time, or funded themselves. Often some fascinating stories come out of this meetup, and there’s lots to interest designers, developers and entrepreneurs alike. You can easily apply to do a demo on their site as well. Free to attend but you must book.

UX Brighton is essentially a mini 2 hour conference with a focus on crafting a great user experience. One or two speakers will present their thoughts and experiences with UX design, and explain how they or their companies achieved success (or failure) in the UX field. A top quality event for anyone with an interest in UX. Generally takes place in a local office, followed by pub. Free to attend but you must book.

Skillswap Brighton is organised by Clearleft and features an expert sharing some of their knowledge in their field, be it design, development or UX. Speakers are always excellent as they are carefully vetted by the Clearleft team who also organise world renowned events such as dConstruct and UXLondon. Another one that always sells out – keep an eye their site. Free to attend but you must book a ticket.

Conferences

Brighton plays host to a range of conferences which attract people from all over the world, so if your looking to connect with people from outside Brighton as well as locals, you don’t need to go far.

BarcampBrighton is an unconference, where everyone who attends gets a chance to speak. I helped to organise the last one and it was a great success. It takes place over a weekend and as such presents an excellent opportunity to connect with people over a longer period of time. Think tech conference meets weekend break. The next one is due in September 2009, at the university of Sussex. Free to attend but tickets are required.

dConstruct is one of the best conferences I’ve ever attended. Organised by Clearleft, held at The Dome, single day event, the speakers are always world renowned, never pitch and always focus on interesting topics or aspects of design and development in web, mobile, gaming and more. This one pushes the boundaries of what makes a tech conference. Tickets from £120, next one in September.

Flash On The Beach is a three day event for Flash developers and designers, also held at the Dome, costs around £300. Next one in September.

Full Frontal is a new one day conference for Javascript people, its being held at The Duke of Yorks this October. £100.

2 – Work in a co-working space

One of the best ways to meet people is to work alongside them. Let them know what you specialise in, and they’ll be able to turn to you – literally – when they get that call. There are two spaces in Brighton which both allow you to drop in for the day to try them out for free, and then allow you to hot desk on a semi regular basis or rent a desk for a reasonable free. The Werks is in Hove and is the larger of the two, or try The Skiff for a cosier option in the North Laines. I’d say as the Skiff is smaller you’d be more likely to be noticed and get chatting to people there, but a wider range of people make their way through The Werks and there are several companies located inside it. Why not try both?

More suggestions anyone?

The root

The root of your project could contain the following folders:

• build
• deploy
• src

Here’s more details on each

build

The build folder is for your Flash output, generated during the build process.

You can set this folder in Flash CS4 by opening the .fla file and going to : “File -> Publish settings…” in the menu, and then navigating to the build folder to set the file for the Flash type in the popup which comes up.

The build folders contents should be able to be deleted at any time, and recreated by running the build. Do not keep any source files or the .fla in here!

deploy

The deploy folder is a good place to keep your installers, such as the .sis files produced by the Adobe Mobile Packager, or other packagers.

src

The src folder is the place to keep your source code, that’s your .fla and related .as files, structured as explained in the following section.

The source code folder

As mentioned, all your source code should be kept in the src folder.

The structure of src folder will look something like this:

• com
• companyName
• appName
• controller
• model
• view
• main.as
• utils
• components
• appName.fla

So your .fla file goes into the root of src, alongside a folder structure unique to your company, which will also be reflected in the namespaces you give your classes.

The classes specific to the app go within a folder with the same name as the app, and the classes which can be used in other applications are placed alongside this folder in their own folders. I’ll go into more detail on the contents of each folder next.

appName

Within the appName folder, you place the classes which cannot be reused in other applications and are specific to this application. These will form the core of this individual application.

You will also place a main.as file here which will be called from the .fla file and will call the various controllers to manage the app.

model

In the model folder you store datatypes declaring data formats used within the app, as well as perhaps classes to manage arrays of data stored and kept in memory whilst the app is running.

view

In the view folder you store classes relating to screens as well as components that you only want to use within this app.

controller

In the controller folder you can store classes relating to the logic of the programme, a key controller to manage what key is pressed and when, a screen controller to manage what screen is currently being displayed, perhaps an API controller to manage all the API calls. The classes here will work closely with the view and the model, building views and manipulating the model. They will be called initially from your main.as class.

utils

Within the utils folder you place helpers and utilities which can be reused in other apps. You should be able to drop classes in here and just start reusing them.

components

Within the components folder you place classes which relate to visual components of your app, stored in the library of the .fla. These components classes, although may come with different assets in another app, can always be reused and will always behave in the same way when placed in another app.

This tutorial is aimed at OS X 10.5 users, with Device Central CS4.

1 – Get a capable unarchiver

You need a file unarchiver which can cope with .cpgz files. The only one I could find was File Juicer which costs around $12 – if anyone finds a free one, let me know.

2 – Extract the Shared Object file

Navigate to your home folder and “Library/Application Support/Adobe/Adobe Device Central CS4″.

Locate the file named storageObjects.bin and drag it onto the File Juicer icon in your apps.

A folder should appear named “Storage Objects Juice”, containing a folder named “txt”, containing a file called something like StorageObject(xx% copy)-1.txt – this is the file you’ll need.

3 – Interpreting the StorageObject file

Open the txt file with your editor of choice. You will see likely see lots of text, expand the text editor to fill your screen to make things easier.

This file contains reference to all saved shared objects, so to see the latest you need to be at the bottom of the file.

Look for codes resembling “B81FA49052AAA2BD750992BCFD03478D 8144600B02252A799C14CCE2BC9F50B6 ø TCSO ” – this appears to be the delimiter between shared object sessions.

Directly following each of delimiter you will find the name of your shared object, the name of the shared object element, and any data saved.

The layout isn’t great, line breaks are seemingly random, and its clear this file was not meant for human consumption. Until Adobe add a Shared Object inspector to Device Central, its all we got though, as far as I know.

Anyone got an easier method?

API restrictions

Unfortunately there are some restrictions within Flash Lite which means you will only be able to access certain API’s. Before continuing, ensure the API you are trying to access meets the following criteria. If its your API, you are in luck, you can fix these issues.

Crossdomain Policy

You will need to be accessing an API which has a crossdomain policy file in place. If you own the API you can create one. If not you will need to create a proxy – although that’s out of scope of this tutorial.

Authentication

Flash Lite does not work with HTTP header based security using the “Authorize” header. The function for adjusting headers – XML.addRequestHeader has a bug. In addition, you cannot use the addRequestHeader feature unless you are making a POST request, bug or no bug. This means for GET request you need to find another way of authenticating anyway. If the API you have access to doesn’t allow any other means of authentication, you won’t be able to write a Flash Lite client.

If you have control of the API, ensure it can read the user credentials from the URL for GET requests, and from either the URL or parameter body for POST requests. That way you can avoid having to use addRequestHeader.

HTTP Status codes

Flash can’t easily interpret HTTP status codes. The API should therefore have an option for returning status in either an XML or string format. The HTTP status should always be 200, with the actual success code returned in the body of the content. This code can then be interpreted by Flash.

Please note, for POST’s, the status returned should be of the same type (either XML or string) as the data posted. So in other words if you pass XML to the API to POST data, the status should be returned as XML, if you pass name key pairs to POST data, the status should be returned as a plain text name key pair (e.g. name=xxxx). If the API interprets POSTed data in chunks of XML, it should return the status as XML. This enables you to use either XML.sendAndLoad to send and read XML or LoadVars.sendAndLoad to send and read variables. You can’t (as far as I can tell) send XML and read variables, or send variables and read XML.

PUT and DELETE

You can’t make PUT and DELETE requests from Flash (or indeed any browser), so you will need to ensure your API uses overloaded POST. That is, you can specify the PUT or DELETE method in the POST url and the API interprets it, or you can make edits and deletes through the basic POST or GET functions.

Flash Lite checklist

You will need to make a few updates to your app before connecting to the API.

Playback settings

Ensure you have set the playback settings to access network only (File in top menu -> Publish Settings option -> Flash tab -> Advanced section -> Local playback security dropdown -> set to Access network only)

Device central

Ensure you have selected a Flash Lite 3.1 device in Device Central for testing.

Ensure under the device central security settings you have selected “Local Trusted Sandbox”.

Flash Lite security settings

When testing on a device as a swf, if you find network errors, ensure the swf is placed inside the Flash Lite trusted folder, if available. Location of the trusted folder will vary from device to device, but for Nokia’s N95 its located in C:/Data/Others/Trusted. Note that the Others folder may appear as Other without the s – this is not an issue. If you can’t find the Trusted folder inside Other(s), create it. To access the swf from the device just navigate directly to C:/Other(s), the data folder won’t appear within the phone view. There’s more on this topic on Kuneri Bloggy.

Making a GET request

To perform a GET request, returning XML you use the XML.load method.

[code lang="actionscript"]
var my_xml:XML = new XML();

my_xml.onLoad = function(success:Boolean) {

var endTime:Number = getTimer();

var elapsedTime:Number = endTime-startTime;

if (success) {
trace("xmlDecl:"+my_xml.xmlDecl);
trace("contentType:"+my_xml.contentType);
trace("docTypeDecl:"+my_xml.docTypeDecl);
trace("packet:"+my_xml.toString());
} else {
trace("Unable to load remote XML.");
}

trace("loaded in: "+elapsedTime+" ms.");

};
my_xml.load("http://api.url.com/user/1.xml");
[/code]

You get the idea, you could create a text field to output the data on the device, manipulate the xml etc.

To perform a GET request returning name value pairs, you use the LoadVars.load method.

[code lang="actionscript"]
var myLoadVars:LoadVars = new LoadVars();
myLoadVars.onLoad = function(success:Boolean) {
if (success) {
trace(this.toString());
} else {
trace("Error loading/parsing LoadVars.");
}
};
myLoadVars.load("http://api.url.com/user/1.json");
[/code]

POST request

To make a POST request by sending name value pairs and processing a returned status code in name value format, you use the LoadVars.sendAndLoad method.

In this example we are posting a name value pair of “name=New Category”, with the server interpreting the field name, and returning either “error=404″ or “status=200″ as plain text output. The code interprets either the error or the status and traces it out to the console. You would probably interpret it in some way and do something more with it.

[code lang="actionscript"]
var resultLoadVars:LoadVars = new LoadVars();
resultLoadVars.onLoad = function(success:Boolean) {
if (success) {
if (resultLoadVars.error !== undefined) {
trace("error: "+result_lv.error);
}
if (resultLoadVars.status !== undefined) {
trace("status: "+result_lv.status);
}
} else {
trace("Error connecting to server.");
}
};
var send_lv:LoadVars = new LoadVars();
send_lv.name = "New Category";
send_lv.sendAndLoad("http://api.url.com/user/1", result_lv, "POST");
[/code]

To make a POST request by sending XML and processing a returned status code in XML format, you use the XML.sendAndLoad method.

In this example we are posting xml containing the tag name with content “New Category”, with the server interpreting the field name, and returning either an error tag with the code “404″ or a status tag with the code “200″ as XML. The code interprets either the error or the status and traces it out to the console. You would probably interpret it in some way and do something more with it.

[code lang="actionscript"]
var dataToPost:String = "New Category";
var my_xml:XML = new XML(dataToPost);
var myReply_xml:XML = new XML();
myReply_xml.ignoreWhite = true;
myReply_xml.onLoad = myOnLoad;
my_xml.sendAndLoad("http://api.url.com/user/1", myReply_xml);
function myOnLoad(success:Boolean) {
if (success) {
if ((myReply_xml.firstChild.nodeName == "error")) {
trace("error: "+myReply_xml.firstChild);
}
if ((myReply_xml.firstChild.nodeName == "status")) {
trace("status: "+myReply_xml.firstChild);
}
} else {
trace("Error connecting to server.");
}
}
[/code]

Next steps

Don’t worry too much about following the code examples here, follow the links to the adobe documentation and see if you can get the code to work with the API you have. I’m starting out in this area too – so have really just presented my initial findings after a couple of days research – hopefully this will save some of you that time at least! Leave issues or problems with specific devices, links to better ways of doing things or suggestions in the comments.