Building iPhone apps with Flash Pro CS5
Yesterday in the MAX 2009 Keynote Adobe did not announce a Flash Player for iPhone, but there was some surprising news. They made it possible to build applications for iPhone using the Flash Platform and Tools. More concrete: with Flash Professional CS5 you can export/publish your swf file to a native iPhone application.
It is definitely good news because for a production company, this makes it a lot easier to offer a unified solution. We can now reuse code and assets to build applications for the web and different mobile devices. Cool thing is that also AIR 2.0 features are available for the iPhone. This means you can use multi-touch, file api, sockets network and all the other existing AIR features. But you can't use PixelBender, remote SWF files. And yes no AS2 anymore, so that's a good thing.
I am very eager start playing with it, and after seeing this video it all looks very interesting indeed. Now let's hope that Apple doesn't close the door on this.
If you want to know how it works check out this recorded session from Adobe MAX 2009:
Everything you need to know can be found on http://adobe.com/go/iphone
Useful actionscript libraries part 2
A while ago I wrote a blog post about a list of useful actionscript libraries on Google Code. So this is a follow up post, and an addition to the previous list. Not all projects are hosted on Google Code, so hence the slightly different title.
Here's the list:
- AlivePdf is a client side AS3 PDF generation library for Adobe Flash, Flex and AIR. It can also be used to display PDF files.
- HydraMVC is the result of a total rewrite of the PureMVC API exclusively for Flex, allowing Flex developers to take advantage of the PureMVC paradigm while leveraging native Flex features. Currently we mostly use the PureMVC framework, but this could be interesting for big Flex applications.
- FlexMonkey is a testing framework for Flex apps that provides for the capture, replay and verification of Flex UI functionality. FlexMonkey can record and playback Flex UI interactions, and generates ActionScript-based testing scripts that can easily be included within a continuous integration process.
- Open Flash Chart is a library that contains a number of frequently used charts like line, bar, pie, scatter charts and some more.
- Merapi is a Java™ application, intended to run on a user's (client) computer. Merapi connects other Java™ applications on the user's computer to Adobe AIR™ applications that the user has installed. In May, Merapi has officially become Open Source!
- Efflex is a library with a list of effect that can be used in Flex applications. Here's a list of available effects: Slide, CoverFlowPapervision3D, FlipPapervision3D, GridZoom, Grid, List, Squash, FadeZoom, Fade,TileFade, MovieClipEffect,...
- Spring Actionscript aims to bring Inversion of Control to ActionScript for use in Flex, AIR and even Flash applications. It contains an IoC container, based on that of Spring, a reflection API, extensions for the Cairngorm and PureMVC frameworks and several interesting utilities.
- The last one is actually not an actionscript library, but still very interesting if you are into application development using Flex. flex-mojos is a collection of maven plugins to allow maven to compile, optimize, test and ... Flex SWF, Flex SWC, Air SWF and Air SWC.We are currently using it for Flex projects that rely heavy on a Java back-end.
Some of the libraries I have used or played with already, and others I still need to checkout. Hope you find something useful here.
Flex 4: Create a simple Unit Test in Flash Builder
One of the new features of Flash Builder is the support for FlexUnit (the Unit testing framework for Flex applications). You could use FlexUnit in the past, but as from Flash Builder it's a piece of cake to create Test classes for your own code. You just need to follow these simple steps.
NOTE: This demo needs the latest beta version of Flash Builder. Be aware that this is still a beta version and the following could still change in future versions of Flash Builder.
Before we start we need to create a new Flex Project. After creating your project you need to create a class with some functionality that we can use in this example. The typical classes to unit test are classes that have a public interface and have a complicated implementation. When you change something inside the class implementation, the public methods still works as expected. But for the sake of simplicity we will create a very simple class with some simple behaviour.
{
/**
* Class that does something.
*
* @author alain
*
*/
public class MyObject
{
/**
* The constructor
*/
public function MyObject()
{
}
/**
* Returns the numeric vallue five
* @return 5
*/
public function giveMeFive():int
{
return 5;
}
/**
* Returns the letter A
* @return "A"
*/
public function sayA():String
{
return "B";
}
/**
* Returns always true
* @return true
*/
public function alwaysTrue():Boolean
{
return true;
}
}
}
Alright, now we have a Class that we can test. To create a new Unit Test you select New > TestCase Class and the following window should appear:
Enter the Name of the TestCase Class (in this case: MyTestClass), select the Class to test (in this case: MyObject) and select Finish. Flash Builder now generates several items. First a new folder name flexUnitTests is generated. Also a new mxml file named flexUnitCompilerApplication.mxml is generated. This file is necessary because the Unit Tests need a swf application that can be started and the tests can be executed. The last and most important file that's been generated is the TestCase itself. The only thing you now need to do is implement the actual test methods. In the following code example the test methods are implemented:
{
import flexunit.framework.Assert;
import flexunit.framework.TestCase;
import net.hufkens.MyObject;
public class MyTestClass extends TestCase
{
// Reference declaration for class to test
private var classToTestRef : net.hufkens.MyObject;
public function MyTestClass(methodName:String=null)
{
super(methodName);
}
//This method will be called before every test function
override public function setUp():void
{
super.setUp();
classToTestRef = new MyObject();
}
//This method will be called after every test function
override public function tearDown():void
{
super.tearDown();
}
public function testGiveMeFive():void
{
Assert.assertEquals(classToTestRef.giveMeFive(), 5);
}
public function testSayA():void
{
Assert.assertEquals(classToTestRef.sayA(), "A");
}
public function testIsTrue():void
{
Assert.assertTrue(classToTestRef.alwaysTrue());
}
}
}
If we now right-click the project and select Execute FlexUnit Tests we get the following message:
It says we need to create a Test Suite, otherwise Flash Builder can't execute the tests. To create a new Test Suite you select New > TestSuite Class and the following window should appear:
Now select Execute FlexUnit Tests again and your Test are executed. As you can see, one of the tests has failed. A quick view in the source of sayA() method reveals the problem. Fix the problem and all the tests should succeed now.
That's all there is to it. Flash Builder makes it a lot easier to create Unit Tests for your libraries and components. This is a good thing, so you should definitely check it out.
Flash Catalyst beta 1 for Mac: License Expired
After installing the latest Flash Catalyst beta 1 on my Macbook, the application didn't want to start because this problem:
License Expired
Licensing for this product has been expired.
I had the MAX Preview version installed, so this was probably causing the problem. If you are installing the Windows version or haven't installed the MAX Preview before, you won't have the problem.
To solve it I tried a lot of uninstalling and re-installing, but in the end these five steps did the trick:
- Run the Adobe Licensing Repair Tool
- Uninstall Flash Catalyst
- Reboot the computer
- Running Repair Tool again but with 0 option
- Reinstall Flash Catalyst
It worked for me, so let's hope it will work for you.
Retrieve Basecamp data with BasecampAS3Lib
One of the projects I am currently working on is an open source Actionscript library that wraps the Basecamp REST API in an easy to use AS3 classes. The project is called BasecampAS3Lib an can be found on Google Code. The project is still in development and I did some serious refactoring yesterday.
At this point the services can only retrieve data from Basecamp and you can already experiment with the ProjectService, CategoryService and TodoListService classes. The other services still need to be implemented. But this post will give you a sneak peak on how simple it can be to retrieve data (in this case project data) from Basecamp with this lib.
NOTE: This code only works in an Adobe AIR application (see below for more details why).
<mx:WindowedApplication
xmlns:mx="http://www.adobe.com/2006/mxml"
xmlns:basecamp="net.hufkens.basecamp.*"
xmlns:services="net.hufkens.basecamp.services.*"
layout="absolute" viewSourceURL="srcview/index.html">
<mx:VBox width="100%" height="100%">
<mx:HBox width="100%">
<mx:Label text="url:"/>
<mx:TextInput id="apiurl" width="100"/>
<mx:Label text="username:"/>
<mx:TextInput id="username" width="100"/>
<mx:Label text="password:"/>
<mx:TextInput id="password" width="100"/>
<mx:Button label="get projects"
click="getProjects()"/>
</mx:HBox>
<mx:DataGrid dataProvider="{projects}"
width="100%" height="100%"/>
</mx:VBox>
<basecamp:BasecampAPI id="api"
url="{apiurl.text}"
username="{username.text}"
password="{password.text}"/>
<mx:ArrayCollection id="projects"/>
<mx:Script>
<![CDATA[
import net.hufkens.basecamp.events.BasecampEvent;
private function getProjects():void {
api.projectService.addEventListener(
BasecampEvent.GET_LIST, handleGetList);
api.projectService.addEventListener(
BasecampEvent.FAIL, handleFail);
api.projectService.getList();
}
private function handleGetList(event:BasecampEvent):void {
projects = new ArrayCollection(event.data as Array);
}
private function handleFail(event:BasecampEvent):void {
Alert.show(event.data as String);
}
]]>
</mx:Script>
</mx:WindowedApplication>
However there is still an issue with the authentication. Apparently using basic authentication from a Flash/Flex application is not that trivial as it would sound. A while ago I wrote a blog post about this (read it here), but this approach only works when you run it from an AIR application. The same code doesn't work when running from a url on a web site.
So, if you have any suggestions or a solution for the basic authentication issue please let me know.
Tracking AIR applications with pubblegum
I don't have a lot of experience yet with tracking AIR applications developed with Flash or Flex. Adhese has a service called pubblegum that can be used directly from Flash without calling an external Javascript (which is the case with Google Analytics). So we decided to give it a try.
What exactly is pubblegum?
Whether it is Adobe® Flash®, Adobe® Air®, Microsoft® Silverlight®, Javascript or something as basic as an image. Pubblegum tracks your content in real-time from within the file and reports all available info, from custom interactions to URLs where your content was published.
Cool is that they have a specific API for AIR applications built in Actionscript 3 and the API also takes care of the fact that your application can be disconnected. If you want to use it, you can send them a mail to get a free trial. In our case we used the specific API for tracking user actions in the AIR application. And it is fairly easy to use. You only need to include the com.adhese.pubblegum.PubblegumAir class in your source code (a .swc file for Flex projects would also be nice guys) and write these two lines of code:
new PubblegumAir("companyID", "campaignID", "creativeID", true);
api.action("action");
The first variable is provided by Adhese and should be your company name/identifier, the second and third parameter can be chosen freely. The last parameter specifies whether you are tracking an application. So true tells the API, that the client is an application.
That isn't all that bad is it, and on top of that you get a nice dashboard where you can analyze your results.
VAIO Contest: Europe’s Top Spots
Check out the latest contest on Club VAIO created by Nascom. The idea is to add tips about your favorite cities in five different categories (Architecture, Fashion, Food, Music and Art). Be sure the check out the cool Flash visualization map created by my colleague David. Kudos to the rest for creating this contest. And the best part is that you can win a VAIO P-Series + a City Trip.
Check out my favorite cities here:
Flashers wanted @ Nascom
At Nascom we are currently looking for fresh faces. At the moment there are several positions available. If you are interested to work in a team of talented developers and designers that do cool stuff with the Adobe Flash Platform, please contact us. As a Flash Designer you will be responsible for creating cutting-edge banners and web sites. As a Flash Developer you will be building rich internet applications and web sites using frameworks like Flex, AIR, PureMVC, Papervision3D, ...
More information about the difference between a Flash developer and designer can be found in this blog post by Lee Brimelow, Platform Evangelist at Adobe. You can find more information about these jobs and the other available jobs here.
Useful Actionscript libraries on Google Code
I recently discovered the Starred Projects feature in Google Code. As a developer I don't want to write everything myself because there is already so much out there. The following list contains libraries that every Actionscript developer doing Flex should be aware of their existence:
- antennae: Templates for building complex Flex projects with Ant. I have been using ANT for a while but have to check out this project to see if it can make things easier. It has been around for a while.
- as3corelib: A must know library. The corelib project is an ActionScript 3 Library that contains a number of classes and utilities for working with ActionScript 3. These include classes for MD5 and SHA 1 hashing, Image encoders, and JSON serialization as well as general String, Number and Date APIs.
- as3crypto: As3 Crypto is a cryptography library written in Actionscript 3 that provides several common algorithms. This version also introduces a TLS engine (TLS is commonly known as SSL.)
- as3xls: Project that makes it possible to read and write Excel files in Flex. The example on the site does not work with my Excel file, but still it could come in handy.
- as3yaml: as3yaml is an Actionscript 3 YAML 1.1 parser and emitter.
- facebook-actionscript-api: The Facebook Actionscript API provides an interface between the Facebook REST based API and Flash/Flex based applications.
- flash-thunderbolt: ThunderBolt is a logger extension for ActionScript 2 and 3 applications using Firebug. For logging without Firebug, especially for AIR applications, check out the ThunderBolt AS3 Console.
- flex-object-handles: A very common UI element found in many applications are those little square handles around an on-screen object that allow you to move & resize it.
- flexcairngorm: Extensions for the Adobe Cairngorm MVC Framework.
- flexcover: Flexcover is a code coverage tool for Flex, AIR and AS3. It incorporates a modified version of the AS3 compiler which inserts extra function calls in the code within the SWF or SWC output file.
- flexlib: The FlexLib project is a community effort to create open source user interface components for Adobe Flex 2 and 3.
- flexundoredo: The Flex UndoRedo Framework provides all the facilities that you need for implementing undo and redo within your applications. The Framework can be used with or without Cairngorm.
- gaforflash: This is an ActionScript 3 API for Google Analytics data collection.
- openflux: OpenFlux is an open-source component framework for Flex which makes radically custom component development fast and easy.
- papervision3d: Open Source realtime 3D engine for Flash.
- swizframework: Swiz is a framework for Adobe Flex that aims to bring complete simplicity to RIA development. Swiz provides Inversion of Control, event handing, and simple life cycle for asynchronous remote methods. In contrast to other major frameworks for Flex, Swiz imposes no JEE patterns on your code, no repetitive folder layouts, and no boilerplate code on your development.
- tweener: Tweener (caurina.transitions.Tweener) is a Class used to create tweenings and other transitions via ActionScript code for projects built on the Flash platform.
- twitterscript: This is an ActionScript 3.0 library for accessing Twitter's APIs. This was originally code from Twitter, but it is being open sourced so it can be maintained and kept current.
- urlkit: UrlKit supports Adobe Flex applications that need to expose URLs and window titles in the browser to represent their state. These URLs can be bookmarked, accessed via the Back button, etc.
- wick3d: Wick3d is a 3D engine in progress for ActionScript 3 my colleague David Lenaerts who does some pretty amazing things
The order of this list is pure alphabetic and contains must know libraries and useful stuff that could come in handy in future projects.
Adobe MAX: Gumbo, Flash Catalyst and Johnny
This week I was one of the lucky ones to attend the Adobe MAX event in Milan. I just blogged about the general sessions on the event already at the Nascom blog. So I won't repeat too much what I said there in this post. I just want to share with you what I got out of MAX for my professional career.
My top 5 sessions:
1. Anatomy of a Seriously Sophisticated Adobe AIR Application: Definitely the best session for me because it showcases the power of Adobe AIR. The presenters Rick Williams and Adam Creeger were involved in the Fiat ecoDrive project. We got a high level presentation about how they organized their development team by using Unit tests and Continuous Integration. The application also added a community aspect by uploading the data to ecoVille, an online community by Fiat.
2. Looking ahead to the next version of Flex: The session was a demo about the new FXG format that is going to be used in the new version of Flex. This basically means that we can represent graphics like shapes, paths, strokes, ... in MXML. Also the new components will be based on this new format. Flex will also have better text support. For more information about the new component architecture click here.
3. Looking ahead to the next version of Flex Builder: The next version of Flex Builder (also called Gumbo) will have a lot of new features. The most important features are productivity improvements like generating getters/setters, FlexUnit integration, auto generate event handler functions and more. Te also added Data Centric functionality like being able to use the Client Side Data Management without LifeCycle DS. And last but not least the Network Monitor is back. You can download the Preview version of Gumbo here.
4. Introduction to Thermo and the Next Generation of Flex: Well actually it's not Thermo anymore the new name is Flash Catalyst. We had a quick feature tour of Flash Catalyst and Flex Builder Gumbo. Exciting times are coming for the Flex developers. Unfortunately the Preview version of Flash Catalyst is only available on Mac for now.
5. Flash Lite3: Learn to Package and Distribute Mobile Content: This session made it clear to me that building Flash Lite application is one thing, getting them deployed on all the different devices is a challenge. We saw a demo of the Adobe Mobile Packager Beta that makes it easier to create packages that can be deployed on Windows Mobile and Symbian.
Some of the other sessions I attended were a bit disappointing because they did not matched my expectations. Maybe this is because Adobe MAX is a commercial event where Adobe showcases their new technologies and products and they don't want to scare people off, but for me it could have been be a lot more technical.
I had a good time in Milan, got to know my colleagues Rien, Michael and Sakri a bit better. We ended each day with a Johnny Walker at Hotel Johnny. Hopefully until next year somewhere in Europe.
Lifestream
-
Club #nespresso's lost password functionality is a disaster. I'm locked out, so no new pads for me :/ [hufkens]
-
Forget Agile here's Asshole Driven Development http://twitpic.com/17qgcg [hufkens]
-
This happens to me multiple times every day and I guarantee it happens to you too! http://bit.ly/94zQbU (via @paddydonnelly) So true! [hufkens]
-
Aaargh, MS Visual SourceSafe brings back painfull memories. [hufkens]
-
Shared AsGeolocation.
-
Shared 3 photos.
-
Shared XAML Power Toys.
-
-
Look out, there are llamas! http://yfrog.com/1dpjkcj [hufkens]
Recent Posts
- Playing with Maven & NativeProcess API in AIR 2.0
- Model-View-ViewModel in Silverlight and Flex
- Awesome iPhone app: Hipstamatic
- The cyclist iPhone app: PedalBrain
- Silverlight 4 beta announced
- My favourite iPhone apps
- Slider, a mobile version of the Flex framework
- Building iPhone apps with Flash Pro CS5
- The F*Team @ Nascom
- Testing PureMVC code with FlexUnit
- FlexMonkey 1.0 released (adding AIR support)
- Pixel art by Kristof
- Enable iPhone 3.0 Internet Tethering
- Timy – Time tracking in 7th gear using Adobe AIR
- Bidirectional (two-way) data binding in Flex 4
Recent Comments
- brandongeiger (Brandon Geiger) on Flex HTTPService and Basic Authentication
- Tweets that mention Model-View-ViewModel in Silverlight and Flex | Alain Hufkens -- Topsy.com on Model-View-ViewModel in Silverlight and Flex
- uberVU - social comments on Model-View-ViewModel in Silverlight and Flex
- Alain on Testing PureMVC code with FlexUnit
- M on Testing PureMVC code with FlexUnit
Tags
Friends
- Copyrafter
- Cornflakes
- Der Schmale
- Farfields
- Geert Bollen
- Gigadesign
- I Am Paddy
- Jan Nikolaas Gijsen
- Journeyman Project Manager
- Kristof Saelen
- Lizbee
- Mr Gonzalez
- Rive
- Sakri
- SEO Blog
