Apple Push Notification Service native extension for Adobe AIR

Here’s another AIR native extension for iOS I’m currently working on – Apple Push Notification Service (APNs) support.
It’s almost complete – the most important things are there. You can register to APNs, get your device token and receive remote notification in ActionScript – everything that you need to build a great app.

Grab the source from github: https://github.com/pkoscierzynski/NativeAPNService

To run the example you need to go to Apple Developer Portal and create a new application id, generate push notification certificates and a new mobile provisioning profile.
I’d recomend this tutorial by Matthijs Hollemans, it’s very detailed and self explanatory (like all the tutorials on Ray’s site).
Apple Push Notification Services Tutorial: Part 1/2

I also used php sample to publish my message to APNs sandbox servers. Follow the tutorial step by step and you should get everything working.

When you’ll have your app id and be sure to put it in the apropriate xml tags of AIR application descriptior.
In AIR 3.1, application descriptor has a new section for iOS apps – Entitlements. In Entitlements section you need to provide the id of you application, otherwise the APN won’t work (this section is the content of Entitlements.plist file known from native Xcode / Objective-C).

Adobe AIR application descriptor. iPhone Entitlements section.

Apple Push Notifications in Adobe AIR iOS application from Piotr Koscierzynski on Vimeo.

iOS native extension for Adobe AIR. In-app mail composer


In this tutorial I will show how to create an iOS native extension for Adobe AIR. My extension enables sending an e-mail by invoking MFMailComposeViewController on iOS. This way you can send an e-mail without leaving you app, attachments are supported, too.

Grab the source from github: iOS In-app mail Native Extension for Adobe AIR

How to use iOS mail extension

Create an intance of class pl.randori.air.nativeextensions.ios.MailExtension and call method
sendMail(subject:String, messageBody:String, toRecipients:String, ccRecipients:String = ””, bccRecipients:String = ””, attachmentsData:Array = null):void

To add an attachment from application bundle:

    filename|bundle|file_mimetype|name_of_file_to_be_shown_in_mail

to  add an attachment from application documents directory use

    filename|documents|file_mimetype|name_of_file_to_be_shown_in_mail

sendMail method implementation should make it more clear

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
/**
         * @param subject Mail subject
         * @param messageBody Mail body (can include HTML)
         * @param toRecipients To: recipients in format: "mail@example.com,mail2@example.com"
         * @param ccRecipients Cc: recipients in format: "mail@example.com,mail2@example.com"
         * @param bccRecipients Bcc: recipients in format: "mail@example.com,mail2@example.com"
         * @param attachmentsData Attachments in format: ['filename|bundle|mimetype|name of file to display in attachment']
         * example: ["Default.png|bundle|image/png|Application splash screen.png","Example file.dat|documents|text/xml|A file saved in Adobe AIR iOS app.txt"]
         */

        public function sendMail(subject:String, messageBody:String, toRecipients:String,
                                ccRecipients:String = '', bccRecipients:String = '', attachmentsData:Array = null):void {
           
            extensionContext.addEventListener( StatusEvent.STATUS, onStatusEvent);
            extensionContext.call( "sendMailWithOptions", subject, messageBody, toRecipients,
                                    ccRecipients, bccRecipients, attachmentsData);
        }

MailExtension dispatches MainExtensionEvent.MAIL_COMPOSER_EVENT to let you know what’s going on. You will be notified if the user has sent the mail, saved it, canceled, etc.
Also there will be notifications WILL_SHOW_MAIL_COMPOSER and WILL_HIDE_MAIL_COMPOSER so you could know when the mail composer is shown and dismissed.
This can be used to stop / resume task in AIR while the mail composer is present on the screen

 

 

Creating an native extension for Adobe AIR requires some iOS/Objective-C knowledge so don’t worry if not everything’s clear at the beginning.

I divided the process of development to three steps

1. Creating a native library in Xcode
2. Creating an ActionScript library which will act as a middleware between Adobe AIR and iOS
3. Creating an example Adobe AIR app

My development environtment was Flash Builder 4.5 with Flex SDK 4.5.1 and AIR SDK 3.1 and Xcode 4.2 and iOS SDK 5. Flash Builder 4.5 doesn’t support native extensions development, so I’ve used ANT to compile and package everything.

Before starting be sure to merge Flex SDK with Adobe AIR SDK.

Creating the native library in Xcode for AIR an iOS

A native library can be written in Objective-C, C/C++ or Java depending on the target platform. Currently extensions for iOS, Android, BlackBerry PlayBook and AIR TV are supported. The library exposes an API that the Adobe AIR application can use, which can include functionalities that are not available in the current release of Adobe AIR or make use of performance of native code (math, physics computations; image processing, etc.).

On iOS Adobe AIR cannot access to such APIs as: Game Center, In-App Purchase, Twitter or Bluetooth. With native extensions we can create a fully featured iOS app.

In Xcode create a new static library project and set the project setting as follows:

 

Set “Enable Linking with Shared Libraries” to NO if when packaging your app into an ipa archive you see in console a message that looks like:
ld warning: unexpected srelocation type 9


Add FlashRuntimeExtensions.h and implement required methods
Next, you need to add FlashRuntimeExtensions.h to your project. This file can be found in FLEX_SDK\include. This file will provide necessary data types definitions and functions that will be used for communication between native code and AIR app.

Native extension written using C API (which iOS extension are) requires four methods to be implemented:

  • extension initializer
  • extension finalizer
  • context initializer
  • context finalizer

In MailExtension.m those functions are: ExtInitializer, ExtFinalizer, ContextInitializer, ContextFinalizer. Those are just the names I used, they can actually be named anything you want, but you must provide those functions’ names in configuration xmls.

My main extension file MailExtension.m looks like this:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
//
//  MailExtension.m
//  MailExtension
//
//  Created by Piotr Kościerzyński on 11-11-29.
//  Copyright (c) 2011 Randori. All rights reserved.
//

#import "MailExtension.h"


@implementation MailExtension

static NSString *attachmentsSeparator = @"----";
static NSString *event_name = @"MAIL_COMPOSER_EVENT";

FREContext g_ctx;
MailComposerHelper *mailComposerHelper;

- (id)init
{
    self = [super init];
    if (self) {
        // Initialization code here.
    }
   
    return self;
}

int canSendMail(void) {

    BOOL result = NO;
   
    //On pre iOS 3.0 devices MFMailComposeViewController does not exists
    Class mailClass = (NSClassFromString(@"MFMailComposeViewController"));
    if (mailClass != nil) {
        // We must always check whether the current device is configured for sending emails
        if ([mailClass canSendMail]) {
            result = YES;
        }
        else {
            result = NO;
        }
    }
    //this will never happen since Adobe AIR requires at least iOS 4.0
    else {
        result = NO;
    }
    return (int)result;
}

//Can we invoke in-app mail ?
FREObject PKIsMailComposerAvailable(FREContext ctx, void* funcData, uint32_t argc, FREObject argv[]) {
   
    BOOL ret = canSendMail();
    FREObject retVal;
   
    FRENewObjectFromBool(ret, &retVal);
    return retVal;    
}

//Send mail
FREObject PKSendMailWithOptions(FREContext ctx, void* funcData, uint32_t argc, FREObject argv[] )
{
    BOOL ret = canSendMail();
   
    if (!ret) {
        FREDispatchStatusEventAsync(ctx, (uint8_t*)[event_name UTF8String], (uint8_t*)[@"MAIL_COMPOSER_NOT_AVAILABLE" UTF8String]);
        return NULL;
    }
   
   
    if(argc<3) {
       
        FREDispatchStatusEventAsync(ctx, (uint8_t*)[event_name UTF8String], (uint8_t*)[@"NOT_ENOUGH_PARAMETERS_PROVIDED" UTF8String]);
       
        return NULL;
    }
   
    //Subject
    uint32_t subjectLength;
    const uint8_t *subjectCString;
    //To Recipients
    uint32_t toRecipientsLength;
    const uint8_t *toRecipientsCString;
    //CC Recipients
    uint32_t ccRecipientsLength;
    const uint8_t *ccRecipientsCString;
    //Bcc Recipients
    uint32_t bccRecipientsLength;
    const uint8_t *bccRecipientsCString;
    //Message Body
    uint32_t messageBodyLength;
    const uint8_t *messageBodyCString;
   
    NSMutableString *attachmentsString = nil;
    NSString *subjectString = nil;
    NSString *toRecipientsString = nil;
    NSString *ccRecipientsString = nil;
    NSString *bccRecipientsString = nil;
    NSString *messageBodyString = nil;
   
    //Create NSStrings from CStrings
    if (FRE_OK == FREGetObjectAsUTF8(argv[0], &subjectLength, &subjectCString)) {
        subjectString = [NSString stringWithUTF8String:(char*)subjectCString];
    }
   
    if (FRE_OK == FREGetObjectAsUTF8(argv[1], &messageBodyLength, &messageBodyCString)) {
        messageBodyString = [NSString stringWithUTF8String:(char*)messageBodyCString];
    }
   
    if (FRE_OK == FREGetObjectAsUTF8(argv[2], &toRecipientsLength, &toRecipientsCString)) {
        toRecipientsString = [NSString stringWithUTF8String:(char*)toRecipientsCString];
    }
   
    if (argc >= 4 && (FRE_OK == FREGetObjectAsUTF8(argv[3], &ccRecipientsLength, &ccRecipientsCString))) {
        ccRecipientsString = [NSString stringWithUTF8String:(char*)ccRecipientsCString];
    }
   
    if (argc >= 5 && (FRE_OK == FREGetObjectAsUTF8(argv[4], &bccRecipientsLength, &bccRecipientsCString))) {
        bccRecipientsString = [NSString stringWithUTF8String:(char*)bccRecipientsCString];
    }
   
     uint32_t attachmentsArrayLength = 0;
   

    //argv[5] is a an array of strings
    if (argc >= 6 && (FRE_OK != FREGetArrayLength(argv[5], &attachmentsArrayLength))) {
        //No valid array of attachments provided.
    }
   
    if (attachmentsArrayLength >= 1) {

        attachmentsString = [[NSMutableString alloc ] init];
        uint32_t attachmentEntryLength;
        const uint8_t *attachmentEntryCString;
   
        for (int i = 0; i < attachmentsArrayLength; i++) {
           
            FREObject arrayElement;
            FREGetArrayElementAt(argv[5], i, &arrayElement);
            FREGetObjectAsUTF8(arrayElement, &attachmentEntryLength, &attachmentEntryCString);
       
            [attachmentsString appendString:[NSString stringWithUTF8String:(char*)attachmentEntryCString]];
       
            if (i<(attachmentsArrayLength-1))
                [attachmentsString appendString:attachmentsSeparator];
        }
    }    
   
    if (mailComposerHelper) {
    }
    else {
        mailComposerHelper = [[MailComposerHelper alloc] init];
    }

    [mailComposerHelper setContext:ctx];
    [mailComposerHelper sendMailWithSubject:subjectString
                               toRecipients:toRecipientsString
                               ccRecipients:ccRecipientsString
                              bccRecipients:bccRecipientsString
                                messageBody:messageBodyString
                            attachmentsData:attachmentsString];
   
    if (attachmentsString != nil)
        [attachmentsString release];
   
   
    return NULL;    
}


//------------------------------------
//
// Required Methods.
//
//------------------------------------

// ContextInitializer()
//
// The context initializer is called when the runtime creates the extension context instance.
void ContextInitializer(void* extData, const uint8_t* ctxType, FREContext ctx,
                        uint32_t* numFunctionsToTest, const FRENamedFunction** functionsToSet)
{
    //we expose two methods to ActionScript
    *numFunctionsToTest = 2;
   
    FRENamedFunction* func = (FRENamedFunction*) malloc(sizeof(FRENamedFunction) * 2);
    func[0].name = (const uint8_t*) "sendMailWithOptions";
    func[0].functionData = NULL;
    func[0].function = &PKSendMailWithOptions;
   
    func[1].name = (const uint8_t*) "isMailComposerAvailable";
    func[1].functionData = NULL;
    func[1].function = &PKIsMailComposerAvailable;
   
    *functionsToSet = func;
   
    g_ctx = ctx;
}

// ContextFinalizer()
//
// The context finalizer is called when the extension's ActionScript code
// calls the ExtensionContext instance's dispose() method.
// If the AIR runtime garbage collector disposes of the ExtensionContext instance, the runtime also calls
// ContextFinalizer().

void ContextFinalizer(FREContext ctx) {

    [mailComposerHelper setContext:NULL];
    [mailComposerHelper release];
    mailComposerHelper = nil;

    return;
}

// ExtInitializer()
//
// The extension initializer is called the first time the ActionScript side of the extension
// calls ExtensionContext.createExtensionContext() for any context.
void ExtInitializer(void** extDataToSet, FREContextInitializer* ctxInitializerToSet,
                    FREContextFinalizer* ctxFinalizerToSet) {
   
    *extDataToSet = NULL;
    *ctxInitializerToSet = &ContextInitializer;
    *ctxFinalizerToSet = &ContextFinalizer;

}

// ExtFinalizer()
//
// The extension finalizer is called when the runtime unloads the extension. However, it is not always called.
void ExtFinalizer(void* extData) {

    return;
}

@end

MailExtension.m is responsible for instantiating the extension and invoking the methods called from ActionScript.

Second part of Objective-C code is MailComposerHelper class which does all the work needed to send the mail.
This class manages MFMailComposeViewController and dispatches events back to ActionScript.

MailComposerHelper implementation looks like this:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
//
//  MailComposerHelper.m
//  NativeMail iOS extension for Adobe AIR
//
//  Created by Piotr Kościerzyński on 11-11-28.
//  Copyright (c) 2011 Randori. All rights reserved.
//

#import "MailComposerHelper.h"

@implementation MailComposerHelper

static NSString *attachmentPropertySeparator = @"|";
static NSString *attachmentsSeparator = @"----";
//Event name
static  NSString *event_name = @"MAIL_COMPOSER_EVENT";


-(void) sendMailWithSubject:(NSString *)subject
               toRecipients:(NSString *)toRecipients
               ccRecipients:(NSString *)ccRecipients
              bccRecipients:(NSString *)bccRecipients
                messageBody:(NSString *)messageBody
            attachmentsData:(NSString *)attachmentsData
{
   
    FREDispatchStatusEventAsync(context, (uint8_t*)[event_name UTF8String], (uint8_t*)[@"WILL_SHOW_MAIL_COMPOSER" UTF8String]);
   
   
    MFMailComposeViewController *mailComposer = [[MFMailComposeViewController alloc] init];
    mailComposer.mailComposeDelegate = self;
   
    if (subject != nil)
        [mailComposer setSubject: subject];
   
    if (messageBody != nil)
        [mailComposer setMessageBody:messageBody isHTML:YES];
   
    if (toRecipients != nil && [toRecipients rangeOfString:@"@"].location != NSNotFound)
        [mailComposer setToRecipients:[toRecipients componentsSeparatedByString:@","]];
   
    if (ccRecipients != nil && [ccRecipients rangeOfString:@"@"].location != NSNotFound)
        [mailComposer setCcRecipients:[ccRecipients componentsSeparatedByString:@","]];
   
    if (bccRecipients != nil && [bccRecipients rangeOfString:@"@"].location != NSNotFound)
        [mailComposer setBccRecipients:[bccRecipients componentsSeparatedByString:@","]];
   
   
   
    //Add attachments (if any)
    if (attachmentsData) {      
     
        NSArray *paths = NSSearchPathForDirectoriesInDomains(NSDocumentDirectory, NSUserDomainMask, YES);
        NSString *documentsDirectory = [paths objectAtIndex:0];
        NSString *filePath;
       
        NSArray *attachmentProperties;
        NSString *fileName;
        NSString *fileExtension;
        NSString *fileSearchSource;
        NSString *fileMimeType;
        NSString *fileAttachName;
       
        NSArray *attachments = [attachmentsData componentsSeparatedByString:attachmentsSeparator];

        for (NSString *attachmentEntry in attachments) {
       
            attachmentProperties = [attachmentEntry componentsSeparatedByString:attachmentPropertySeparator];
            fileName = [[[attachmentProperties objectAtIndex:0] componentsSeparatedByString:@"."] objectAtIndex:0];
            fileExtension = [[[attachmentProperties objectAtIndex:0] componentsSeparatedByString:@"."] objectAtIndex:1];
            fileSearchSource = [(NSString *)[attachmentProperties objectAtIndex:1] lowercaseString];//bundle or documents
            fileMimeType = [attachmentProperties objectAtIndex:2];//mime type of file
            fileAttachName = [attachmentProperties objectAtIndex:3];//how to name the file
           
            //search for file in app bundle
            if ([fileSearchSource isEqualToString:@"bundle"]) {
                filePath = [[NSBundle mainBundle] pathForResource:fileName ofType:fileExtension];                
            }
            else
            //search for file in Documents
            if ([fileSearchSource isEqualToString:@"documents"]) {
                filePath = [documentsDirectory stringByAppendingPathComponent:(NSString *)[attachmentProperties objectAtIndex:0]];            
            }
            else {
                //ERROR - ignoring
                continue;
            }
       
            if ([[NSFileManager defaultManager] fileExistsAtPath:filePath]) {
       
                NSData *fileData = [[NSData alloc] initWithContentsOfFile:filePath];
       
                if (fileData) {
                    [mailComposer addAttachmentData: fileData mimeType:fileMimeType fileName:fileAttachName];            
                }
       
                [fileData release];
       
            }
        }
    }
   
       
    //show mail composer
    [[[[UIApplication sharedApplication] keyWindow] rootViewController] presentModalViewController:mailComposer animated:YES];
   
    [mailComposer release];

}

// Dismisses the email composition interface when users tap Cancel or Send.
-(void) mailComposeController: (MFMailComposeViewController*)controller didFinishWithResult: (MFMailComposeResult)result error:(NSError*)error
{  
    NSString *event_info = @"";
    // Notifies users about errors associated with the interface
    switch (result)
    {
        case MFMailComposeResultCancelled:
            event_info = @"MAIL_CANCELED";
            break;
        case MFMailComposeResultSaved:
            event_info = @"MAIL_SAVED";
            break;
        case MFMailComposeResultSent:
            event_info = @"MAIL_SENT";
            break;
        case MFMailComposeResultFailed:
            event_info = @"MAIL_FAILED";
            break;
        default:
            event_info = @"MAIL_UNKNOWN";
            break;
    }
   
    FREDispatchStatusEventAsync(context, (uint8_t*)[event_name UTF8String], (uint8_t*)[event_info UTF8String]);
    FREDispatchStatusEventAsync(context, (uint8_t*)[event_name UTF8String], (uint8_t*)[@"WILL_HIDE_MAIL_COMPOSER" UTF8String]);
   
    context = nil;

    //hide mail composer
    [[[[UIApplication sharedApplication] keyWindow] rootViewController] dismissModalViewControllerAnimated:YES];
}

-(void)setContext:(FREContext)ctx {
    context = ctx;
}


@end

Native iOS code can dispatch events for ActionScript – it’s done by calling FREDispatchStatusEventAsync. This will be seen as a StatusEvent.STATUS in Adobe AIR. I used it to let my application know whether the mail composer can be shown and to inform about the mail compose result and status.

When you build the static library you will get libMailExtension.a file in ‘build’ directory.
This file will be needed in ‘NativeMail-iOS’ library project to create .swc and .ane files.

 

Creating Adobe Native Extension project

In Flash Builder create a new ActionScript Library project. The project will contain ActionScript classes responsible for calling iOS code.

My project’s structure – you can see the libMailExtension.a file present

 

Since I used command line tools to create the extension there are  lot of configuration files and ANT scripts, if you’re using Flash Builder 4.6 it should be much simpler.

 

iOS library methods are invoked by calling extensionContext.call method.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
package pl.randori.air.nativeextensions.ios
{
    import flash.events.EventDispatcher;
    import flash.events.IEventDispatcher;
    import flash.events.StatusEvent;
    import flash.external.ExtensionContext;

   
    /**
     * An iOS native extension for Adobe AIR 3.1 for sending mail.
     * Implements MFMailComposeViewController in iOS
     *
     * @author Piotr Kościerzyński, piotr@flashsimulations.com
     * www.flashsimulations.com
     * www.randori.pl
     *
     * */

    public class MailExtension extends EventDispatcher
    {
       
        protected var extensionContext:ExtensionContext;
       
        private static const EXTENSION_ID : String = "pl.randori.air.nativeextensions.ios.MailExtension";
       
       
        public function MailExtension(target:IEventDispatcher=null)
        {
            super(target);
            extensionContext = ExtensionContext.createExtensionContext( EXTENSION_ID, null);
        }

       
        /**
         * @param subject Mail subject
         * @param messageBody Mail body (can include HTML)
         * @param toRecipients To: recipients in format: "mail@example.com,mail2@example.com"
         * @param ccRecipients Cc: recipients in format: "mail@example.com,mail2@example.com"
         * @param bccRecipients Bcc: recipients in format: "mail@example.com,mail2@example.com"
         * @param attachmentsData Attachments in format: ['filename|bundle|mimetype|name of file to display in attachment']
         * example: ["Default.png|bundle|image/png|Application splash screen.png","Example file.dat|documents|text/xml|A file saved in Adobe AIR iOS app.txt"]
         */

        public function sendMail(subject:String, messageBody:String, toRecipients:String,
                                ccRecipients:String = '', bccRecipients:String = '', attachmentsData:Array = null):void {
           
            extensionContext.addEventListener( StatusEvent.STATUS, onStatusEvent);
            extensionContext.call( "sendMailWithOptions", subject, messageBody, toRecipients,
                                    ccRecipients, bccRecipients, attachmentsData);
        }
       
        /**
         * @private
         * Handle mail compose result.
         * When the native mail composer finished an result event will be dispatched.
         * Event will contain the result information.
         *
         */
   
        private function onStatusEvent( event : StatusEvent ) : void
        {
            if( event.code == MailExtensionEvent.MAIL_COMPOSER_EVENT)
            {
                dispatchEvent( new MailExtensionEvent(event.code, event.level ));
            }
        }
       
        /**
         * Can the in-app mail composer be invoked?
         */
   
        public function isMailComposerAvailable() : Boolean
        {
            return extensionContext.call( "isMailComposerAvailable") as Boolean;           
        }
       
       
        /**
         * Clean up
         */

        public function dispose():void {
            extensionContext.removeEventListener( StatusEvent.STATUS, onStatusEvent );
            extensionContext.dispose();
        }
       
       
    }
}

ANT script used for creating .ane and .swc files:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
<?xml version="1.0" encoding="UTF-8"?>
<project name="NativeMail iOS for Adobe AIR Extension" default="build-extension" basedir=".">
   
    <property file="local.properties" />
    <property file="build.properties" />
   
    <target name="clean">
        <delete dir="${app.builddir}"/>
        <delete dir="${app.releasedir}"/>
        <mkdir dir="${app.builddir}"/>
        <mkdir dir="${app.releasedir}"/>
        <delete file="${app.rootdir}/library.swf"/>
        <delete file="${app.rootdir}/${app.swcfilename}"/>
    </target>
   
    <target name="build-extension" depends="clean">
        <exec executable="${ACOMPC}">
            <arg line="
                -output ${app.builddir}/${app.swcfilename}
                -load-config+=${app.configfile}
                +configname=airmobile
                -swf-version=14
            "/>

        </exec>
        <copy file="${app.builddir}/${app.swcfilename}" tofile="${app.rootdir}/${app.swcfilename}"/>
        <unzip src="${app.builddir}/${app.swcfilename}" dest="${app.rootdir}"/>
        <delete file="${app.rootdir}/catalog.xml"/>
        <exec executable="${ADT}">
                    <arg line="
                        -package -target ane ${app.releasedir}/iOS_MailExtension.ane ${app.extensionxmlfile}
                        -swc ${app.swcfilename}
                        -platform iPhone-ARM library.swf libMailExtension.a
                        -platformoptions ios-platformoptions.xml
                    "/>

        </exec>
        <delete file="${app.rootdir}/library.swf"/>
        <delete file="${app.rootdir}/${app.swcfilename}"/>
    </target>
</project>

Native extensions ADT parameters

One of the most important parameter in this script is  -platformoptions ios-platformoptions.xml . Why?
My extension uses iOS frameworks that are not linked by ADT packager by default, as a result the linker won’t fine MFMailComposeViewController definition and will fail.
Sadly, the documentation is very poor and I haven’t found any examples except from this one Adobe Blogs: iOS5 support for AIR/Using external SDKs to package apps

MFMailComposeViewController requires MessageUI.framework so adding it to ADT’s linker solves the problem.

Also, note that -swf-version is set to 14 because we’re targeting for AIR 3.1. See: Adobe Docs: Building the ActionScript library of a native extension

ios-platformoptions.xml looks like this:

1
2
3
4
5
6
7
<platform xmlns="http://ns.adobe.com/air/extension/3.1">
    <sdkVersion>5.0</sdkVersion>
    <linkerOptions>
        <!-- to use the MessageUI framework -->
        <option>-framework MessageUI</option>
    </linkerOptions>
</platform>

Another new parameter is extensions.xml file. It holds information about native libraries we want to include. Here we define the id of extension and the names of extension’s initializer and finalizer methods. See that the names of functions in <initializer> and finalizer match the names of functions in MailExtension.m

Here’s extension.xml

1
2
3
4
5
6
7
8
9
10
11
12
13
<extension xmlns="http://ns.adobe.com/air/extension/3.1">
    <id>pl.randori.air.nativeextensions.ios.MailExtension</id>
    <versionNumber>1.0.0</versionNumber>
    <platforms>
        <platform name="iPhone-ARM">
            <applicationDeployment>
                <nativeLibrary>libMailExtension.a</nativeLibrary>
                <initializer>ExtInitializer</initializer>
                <finalizer>ExtFinalizer</finalizer>
            </applicationDeployment>
        </platform>
    </platforms>
</extension>

After running ANT script we will have two new files: NativeMail_iOS.swc in ‘build’ directory and iOS_MailExtension.ane in ‘release’ directory.
iOS_MailExtension.ane is the AIR native extension we wanted to create.

 

Example – using native extension in Adobe AIR application

 

 

 

 

‘Can I send mail?’ button calls MailExtension.isMailComposerAvailable() method which returns true / false.
This method will return false if iOS mail client hasn’t been properly configured. This check is also done before sending the mail to prevent the app from crashing.

‘Send mail’ button calls MailExtension.sendMail method. In the example all available mail fields are filled and two attachments are added.

 

Invoked mail composer view

 

Example app project structure:

Copy ‘iOS_MailExtension.ane’ file to ‘extensions’ directory.

 
One last thing left to is to add the following information you you application descriptor file. extensionID has to match our extension’s id. Otherwise ADT will fail to package the app.

1
2
3
<extensions>
        <extensionID>pl.randori.air.nativeextensions.ios.MailExtension</extensionID>
</extensions>

Packaging application is done by following ANT script:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
<?xml version="1.0" encoding="UTF-8"?>
<project name="NativeMail iOS extension for Adobe AIR example app" default="publish-ios" basedir=".">
   
    <property file="local.properties" />
    <property file="build.properties" />
   
    <target name="clean">
        <delete dir="${app.builddir}"/>
        <delete dir="${app.releasedir}"/>
        <mkdir dir="${app.builddir}"/>
        <mkdir dir="${app.releasedir}"/>
    </target>
   
    <target name="copy" depends="clean">
        <copy todir="${app.builddir}" preservelastmodified="true" verbose="true">
             <fileset dir="${app.sourcedir}">
                <patternset>
                    <include name="assets/**"/>
                    <include name="*.png"/>
                    <include name="*.xml"/>
                    <include name="*.ane"/>
                </patternset>
             </fileset>
        </copy>
   
    </target>
   
    <target name="compile" depends="copy">
        <exec executable="${MXMLC}">
            <arg line="
                +configname=airmobile
                -output ${app.builddir}/${build.swfname}
                ${app.sourcedir}/NativeMail.mxml
                -source-path+=${app.rootdir}/src
                -load-config+=NativeMail_app.config
                -swf-version=14
            "/>

        </exec>
    </target>
   
    <target name="publish-ios" depends="compile">
        <copy file="${app.builddir}/${build.swfname}" tofile="${app.rootdir}/${build.swfname}"/>
        <copy file="${app.sourcedir}/NativeMail-app.xml" tofile="${app.rootdir}/NativeMail-app.xml"/>
       
        <exec executable="${ADT}">
            <arg line="-package
                        -target ipa-test-interpreter
                        -provisioning-profile ${build.mobileprofile}
                        -storetype ${build.storetype}
                        -keystore ${build.keystore}
                        -storepass YOUR_PASSWORD
                        ${app.releasedir}/${build.name}
                        ${app.descriptor}
                        ${build.swfname}
                        -extdir extensions
                        -C ${app.builddir} Default.png Default@2x.png"/>

        </exec>
    </target>
   
</project>

Notice ‘-swf-version=14′ and ‘-extdir extensions’ parameters

That’s it.

Worth reading:
Adobe Blogs: iOS5 support for AIR/Using external SDKs to package apps
MFMailComposeViewController Class Reference
Adobe Docs: Building the ActionScript library of a native extension
Native Alert iOS native extension tutorial
AIR Native Extension Example: iBattery for iOS
as3c2dm – AIR native extension to push notifications with C2DM

Developing Android applications with Adobe AIR – setting up the environment

Since July 2010 I’ve been playing with Adobe AIR for Android. I got the prerelease version of the runtime and started investigating the new APIs for mobile devices. Adobe AIR hit the Android Market on 9th October 2010, so it’s time for the AIR developers to get to work. There are few things that if found difficult at the begining, especially the configuration and building the Android APK archive.

Setup your development environment

Here’s how I setup my Adobe AIR for Android environment (both MacOS X and Windows)

Setup – Adobe AIR / Flex part

FLEX_DIR (MacOs) = /Users/piotr/SDK/flex_sdk_4.1_air_2.5
FLEX_DIR (Windows) = C:\SDK\flex_sdk_4.1_air_2.5

1. Download Flex SDK (version 3.5 and newer – I used 4.1) and put it in directory FLEX_DIR

2. Get the Adobe AIR 2.5 SDK – it’s a zip file like Flex SDK 3. Extract AIR 2.5 SDK and copy all the files to FLEX_DIR – overwrite all the files in FLEX_DIR that might overlap 4. In FLEX_DIR you now have the Flex SDK combined with AIR 2.5

Setup – Android part

ANDROID_DIR (MacOs) = /Users/piotr/SDK/android
ANDROID_DIR (Windows) = C:\SDK\android

3. Download Android SDK and put it in ANDROID_DIR

4. Get Android 2.2 libraries and emulator using “Android SDK and AVD manager”
- goto ANDROID_DIR\tools
- run android (Windows) or ./android (MacOs X)

5. Create an virtual device (for emulator) with Android 2.2 system (if you don’t have an Android 2.2 device)

You could add the FLEX_SDK\bin and ANDROID_SDK\tools directories to your system’s PATH variables to make the development process faster, but I’m not going to cover this topic here.
I will keep it simple to illustrate the whole process.

6. To be able to test you application you need to install Adobe AIR runtime for Android.
The AIR prerelease comes with two versions of the runtime – one for the device and one for the emulator.

The runtime for the device is Runtime_Device_Froyo_20100930.apk

The runtime for the emulator is Runtime_Emulator_Froyo_20100930.apk

Creating Android 2.2 virtual device for emulator

I created an Android 2.2 emulator (virtual device) with name “Android_22″ and the install process looks like this:

I’ll use the ANDROID_EMULATOR_NAME for “Android_22″ – my virtual device name. If you created a virtual device with a different name, then it would be the device’s name.

First, you need to make sure that the emulator is up and running.
Goto ANDROID_SDK\tools by typing: cd ANDROID_SDK\tools
Run the emulator:

(MacOS) ./emulator -avd ANDROID_EMULATOR_NAME or ./emulator @ANDROID_EMULATOR_NAME

(Windows) emulator -avd ANDROID_EMULATOR_NAME or emulator @ANDROID_EMULATOR_NAME

Android - starting emulator with virtual device

Install Adobe AIR for Android runtime

(Important) Copy both Runtime_Device_Froyo_20100930.apk and Runtime_Device_Froyo_20100930.apk into ANDROID_SDK\tools.

To install the AIR runtime on the emulator:
(MacOS X): ./adb -e install -r Runtime_Emulator_Froyo_20100930.apk
(Windows) adb -e install -r Runtime_Emulator_Froyo_20100930.apk

To install the AIR runtime on the device:

(MacOS X) ./adb  install -r Runtime_Device_Froyo_20100930.apk
(Windows): adb install -r Runtime_Device_Froyo_20100930.apk

Installing Adobe AIR on Android

Potential problems

If you get the “device not found” message you might need to restart the adb service.
I had that problem but it worked after running these commands:

adb kill-server
adb start-server

After the adb has restarted give the runtime install another try, it should work.

You rock

If you see “Adobe AIR” under Settings -> Applications -> Manage Applications than congratulations – you are ready to develop AIR apps for Android.

Adobe AIR runtime on Android apps list

Add Flex + AIR 2.5 SDK to your IDE
One last thing is to add the FLEX_DIR into your IDE (Flash Builder or other like FlashDevelop)

Flash_Builder_SDKs_Android_AIR

In the next part of this series I’ll show how to create and deploy and Adobe AIR project and Android.

Other posts that you might find useful

http://blog.digitalbackcountry.com/2010/10/publishing-air-apps-to-the-android-market/ http://www.adobe.com/newsletters/edge/august2010/articles/article1/ http://unitedmindset.com/jonbcampos/2010/07/20/creating-a-flash-builder-android-project/

Handling image loading in TLF TextFlow and TextField

Recently, I was building a cms driven (Drupal 6 to be precise) website and faced the problem of detecting whether the content of TextField or TFL TextFlow has completed loading.
This example is based on TLF Editor from Tour de Flex, which I used as a base for the created editor/display component.

1. TLF TextFlow solution

The solution I used is actually very simple.

First, you need to analyze the TextFlow markup to get the number of images in text.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
//total images counter
private var totalImages:uint = 0;
//number of loaded images
private var imagesLoaded:uint = 0;

private function initTextFlowImagesCounter(textFlowMarkup:String):void {
//<img  source="http://image_url.jpg" />
            var source_AttributeRegExp:RegExp = /source="[^"]+"/gi;
            var result:Object = source_AttributeRegExp.exec(textFlowMarkup);

            while (result != null) {
                var image_source:String = String(result);

                totalImages++;
                result = source_AttributeRegExp.exec(textFlowMarkup);
            }

}

Then, create a TextFlow instance and setup the necessary listeners.

1
2
3
initTextFlowImagesCounter(markup);
var activeFlow:TextFlow = TextConverter.importToFlow(markup, TextConverter.TEXT_LAYOUT_FORMAT);
activeFlow.addEventListener(StatusChangeEvent.INLINE_GRAPHIC_STATUS_CHANGE,recomposeOnLoadComplete,false,0,true);

We handle all StatusChangeEvent.INLINE_GRAPHIC_STATUS_CHANGE events in recomposeOnLoadComplete function.
Basicaly, this function updates the ‘imagesLoaded’ counter, but there are few things worth mentioning.
The whole image loading process in TLF is quite different than flash TextField approach, we need to manually handle the states of image elements.
When the status is InlineGraphicElementStatus.SIZE_PENDING then the image has finished loaded, but the TLF didn’t actually render it, because the controller didn’t know the dimensions of the image – so we need to call activeFlow.flowComposer.updateAllControllers(). This situation will happen only when an tag doesn’t have declared ‘width’ and ‘height’ explicitly to a number.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
private function recomposeOnLoadComplete(e:StatusChangeEvent):void
        {
        //image load error
            if (e.status == InlineGraphicElementStatus.ERROR)
            {
                imagesLoaded--;
        }

            if (e.element.getTextFlow() == activeFlow) {
                //image has loaded - we need to recalculate the size of the TLF container
                if (e.status == InlineGraphicElementStatus.SIZE_PENDING)
                {
                    activeFlow.flowComposer.updateAllControllers();
                }
                else
                //image has been loaded and updated
                if (e.status == InlineGraphicElementStatus.READY)
                {
                    imagesLoaded++;
                }

                checkIfLoaded();
            }

        }

private function checkIfLoaded():void {

//all images loaded
            if (totalImages == imagesLoaded)
            {
                updateSizeInfo();//just an option
                                dispatchEvent(new Event(Event.COMPLETE));
            }

}

The content displayed on the website has a lot of images, so need to know the height of the TextFlow object to be able to scroll it.
This is done by this handy function.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
private function updateSizeInfo():int {

if (activeFlow) {
                var cont:ContainerController = activeFlow.flowComposer.getControllerAt(0);
                if (cont.container)
                {
//height of the TextFlow instance
                    var textHeight:int = Math.ceil(cont.getContentBounds().height);
                    return textHeight;
                }
            }

            return 0;
}

2. TextField solution

The whole idea is the same, but we need to setup a Loader instance for each image to handle errors and load events. We can get the height of TextField content from the textHeight attribute.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
private function initTextFieldImagesLoading(htmlText:String):void {
//search for the 'id' attribute of 'img' tag
    var idAttributeRegExp:RegExp = /id="[^"]+"/gi;
    var result:Object = idAttributeRegExp.exec(htmlText);

    while (result != null) {
        var imageId:String = String(result);
        imageId = imageId.replace('id="', '');
        imageId = imageId.replace('"', '');
        //create an Loader instance for each image - txtDescription is our TextField with htmlText
        var ldr:Loader = txtDescription.getImageReference(imageId) as Loader;

        if (ldr != null) {
            totalImages++;
            ldr.contentLoaderInfo.addEventListener(Event.INIT, onTextFieldImageLoaded);
            ldr.contentLoaderInfo.addEventListener(IOErrorEvent.IO_ERROR, onTextFieldIOError);
        }

        result = idAttributeRegExp.exec(htmlText);
    }

private function onTextFieldImageLoaded(e:Event):void
        {
            e.target.removeEventListener(Event.INIT, onTextFieldImageLoaded);
            e.target.removeEventListener(IOErrorEvent.IO_ERROR, onTextFieldIOError);
            imagesLoaded++;

            checkIfLoaded();
        }

        private function onTextFieldIOError(e:IOErrorEvent):void
        {
            e.target.removeEventListener(Event.INIT, onTextFieldImageLoaded);
            e.target.removeEventListener(IOErrorEvent.IO_ERROR, onTextFieldIOError);

            totalImages--;
            checkIfLoaded();
        }
}

3d physics in Flash with Jiglibflash and Away3DLite

Newest experiment using Jiglibflash and Away3DLite, requires Flash Player 10. The speed boost in comparison to PV3D and FP9 version of Jiglib is unbelieveable (over 3500 triangles and realtime collision detection). It’s a work in progress, but you can take a look here: Letters and car 3d physics demo.

Using jiglib car physics in Away3DLite is pretty hard, I don’t know why it differs so much from the PV3D version. If the car starts to behave ‘crazy’ or gets stuck, press the ‘r’ key to reset it. You can also throw a snowball by pressing ‘b’ key.
Use arrows to steer the car and space bar for handbrake.

How it's made? Blender + Papervision3D = Flash car drive

How it's made? Blender + Papervision3D = Car drive in flash

Polonez Borewicz - click to drive it!

Welcome to flashsimulations.com!

Hello.

If you’ve been to this website before, you might be suprised, because it has changed significantly. I decided to run a blog under flashsimulations.com to archive my experiments involving various technologies.
If you’re looking for the car demo that used to be the landing page, read on. You’ll find it and even more.
This site’s name is flashsimulations.com, but it’s not going to cover only topics that have something to do with Adobe Flash Platform.

Let’s start blogging !

Long time ago, in April of 2008 while experimenting with 3d in flash, I created a car driving experiment that used to be under this address – you can find it here. In October 2008 my demo has been  selected as one of the 9 cool experiments on Papervision3D official blog, since then I got a lot of feedback and questions from enthusiasts of flash and 3d.

flashsimulations-pv3d-blog

Fig. 1: Polonez Borewicz showcased on PV3D blog, October 2008

I decided to write this tutorial after I got many e-mails from people asking how that car demo was made. Unfortunately, I didn’t have time to write everyone back, due to the complexity of this topic.

1981 FSO Polonez “Borewicz”, the car

Recently, I updated the original flash demo to work with the latest version of Papervision3D 2 and I slightly upgraded the car model itself. In this tutorial I will describe how you can export your model from Blender 2.49 to Flash and create a 3D car driving simulation using ActionScript 3 and Papervision3D engine.
I guess that most of you aren’t familliar with the car that I’ve modeled, it’s the  1981 FSO Polonez, nicknamed “Borewicz”.

Here’s the test drive of Polonez by Jeremy Clarkson.
YouTube Preview Image

Preparing the model in Blender

First of all, you need to export model from the 3d application of your choice – Papervision 2 accepts formats such as: .3ds, Collada, .MD2 and a few other.

I created Polonez model using Blender 2.49 and exported it to Collada 1.4 (.dae). I admit – the model isn’t pretty, but it was the first model I ever did. My priority was to keep the number of triangles as low as possible, to get better rendering speed in flash.
After many Papervision performance tests I managed to get a reasonable frame rate (at least 15) when the model had less than 2,000 triangles. Of course the performance of the application varies depending on the user’s processor  – I wanted this demo (in April 2008) to run smoothly even on low budget computers, so I tested it on Intel Core2Duo T 5250@1.50Ghz with 2GB RAM laptop. The performance is no longer such an issuse as it was back then, as Papervision has been improved and the performance increased.

Since we want to be able to control the car wheels to simulate steering and movement, we need to provide proper name to each element of the car. On the following picture you can see the names I gave to wheels and the ‘Transforn Properties’ window (‘N’ key shotcut), where you enter the name.

Naming car model elements in Blender

Fig. 2: Naming car model elements in Blender

When the model is finished, it’s time to export it to Collada 1.4. Select File -> Export -> Collada 1.4(.dae) , set the plugin options like on the picture below; click ‘Export & Close’ and that’s it.

Blender - Collada 1.4 export plugin options

Fig. 3: Blender - Collada 1.4 export plugin options

Importing the model to Papervision

When the model is ready, it’s time to do some coding. You’ll need the latest version of PV3D, get it here. The code of the car simulation  is pretty straightforward (I also commented it heavily), so I’m going to comment it just briefly.
Main class is based on PV3D’s BasicView and here’s the init function, where we setup everything.

1
2
3
4
5
6
7
8
private function init(e:Event = null):void  {
    removeEventListener(Event.ADDED_TO_STAGE, init);
    initCameras();
    initTextures();
    initModel();
    //...
    //pv3d statistics and other UI stuff
}

Initialize four cameras – their positions will be set in other function.

1
2
3
4
5
6
7
8
9
10
private function initCameras():void {
    cameras[CAMERA_DEFAULT] = new Camera3D();
    cameras[CAMERA_DEFAULT].y = 5;
    cameras[CAMERA_DEFAULT].z = - 60;
    cameras[CAMERA_DEFAULT].zoom = 50;cameras[CAMERA_CAR_HOOD] = new Camera3D();
    cameras[CAMERA_CAR_BEHIND] = new Camera3D();
    cameras[CAMERA_CAR_WHEEL] = new Camera3D();
    //set the camera to default
    this._camera = cameras[CAMERA_DEFAULT];
}

Init material from embedded texture .jpg.

1
2
3
4
5
private function initTextures():void {
    carModelTexture = new BitmapMaterial((new carTextureAsset as Bitmap).bitmapData);
    //looks better, but the framerate drops
    carModelTexture.smooth = true;
}

The loaded model will be parented to an empty container because we won’t apply any tranlations nor rotations to the model itself.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
private function initModel():void {
    carModelParent = new DisplayObject3D();
    scene.addChild(carModelParent);
    //car texture
    var mats:MaterialsList = new MaterialsList();
    mats.addMaterial(carModelTexture, "all");carModel = new DAE();
    //initial position
    carModelParent.x = 50;
    carModelParent.y = 0;
    carModelParent.z = 1050;
    carModelParent.rotationY = -35;
    carModel.addEventListener(FileLoadEvent.LOAD_COMPLETE, onLoad);
    carModel.load(XML(new carModelAsset()), mats);//we add the Collada model to the parent DO3D
    carModelParent.addChild(carModel);
}

To control the wheels roll and steer angle we have to create a series of instances of DisplayObject3D class that will hold the reference to each part of the car – that’s the moment when the knowledge car elements’ names comes in handy. The same rule applies to our defined cameras and their targets.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
private function onLoad(e:Event):void {
    carModel.scale = 100;
    viewport.getChildLayer(carModel).layerIndex = 1;
    //set references to car wheels;
    wheelFrontRight = carModel.getChildByName( "Wheel_Front_Right", true);
    wheelFrontLeft = carModel.getChildByName( "Wheel_Front_Left", true );
    wheelRearLeft = carModel.getChildByName( "Wheel_Rear_Left", true );
    wheelRearRight = carModel.getChildByName( "Wheel_Rear_Right", true );
    //set targets for all cameras
    cameraTargets[CAMERA_CAR_HOOD] = carModel.getChildByName( "Camera_Hood_Target", true );
    cameraTargets[CAMERA_DEFAULT] = carModelParent;
    cameraTargets[CAMERA_CAR_BEHIND] = carModel.getChildByName( "Licence_Plate_Front", true );
    cameraTargets[CAMERA_CAR_WHEEL] = carModel.getChildByName( "Camera_Wheel_Target", true );enableListeners(); //KEY_UP, KEY_DOWN and ENTER_FRAME
}

Here’s the ENTER_FRAME handler

1
2
3
4
5
6
7
public function tick(e:Event):void {
    updateCamerasPositions();
    camera.lookAt(cameraTargets[currentCamera]);
    driveCar();
    updateCarState();
    singleRender();
}

The last thing I’m going to describe is the updateCarStateFunction. All the coefficients that you can see have been matched by trial & error method. Change them to get different car behaviour.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
private function updateCarState():void {
    var movingForward:Boolean = speed &gt; 0;
    //adjust the angular velocity of the wheel
    var wheelRoll:Number = (0.7) * speed;wheelFrontRight.rotationY  -= wheelRoll;
    wheelFrontLeft.rotationY += wheelRoll;
    wheelRearLeft.rotationY -=  wheelRoll;
    wheelRearRight.rotationY -=  wheelRoll;
    //90 and -90 are here to fix the rotation - normal vectors of front wheels must be opposite
    wheelFrontRight.rotationZ = 90-wheelAngle;
    wheelFrontLeft.rotationZ = -90-wheelAngle;
    carModelParent.yaw(speed * wheelAngle * (0.002 + 0.0004 * Number(movingForward)) );
    // we use different speed for car rotation around it's Z axis
    //(lower value when the car is reversing - simple technique, but adds a bit of realism
    carModelParent.moveBackward( speed * (0.9 + 0.2 * Number(movingForward)) );
}

Get this project sources (FlashDevelop AS3 project). Requires Flex 3.4 SDK.