Using Flash Builder 4.5 to Package Arbitrary SWFs for iOS, Android, and PlayBook

Posted on May 2, 2011 | 42 comments

Note: Using non-mobile optimized SWFs will most likely perform poorly. For example using any SWFs created with Flex SDKs before 4.5 should really be done with Flex 4.5 or higher.

Do you want to create Flash/AIR content for the different devices and don’t know where to start? Maybe you have some old SWFs that you want to try on a device or get your SWFs from another source (like an already package apk that you want to try on iOS with out recompiling). Then you might want to read more. This post and video shows how to setup a project in Flash Builder 4.5 to package arbitrary SWFs for Android, iOS, and PlayBook (the currently supported plugins).

Using Flash Builder 4.5 to Package Arbitrary SWFs for iOS, Android, and PlayBook from Renaun Erickson on Vimeo.

The basic steps from the video are:

  • Create a new ActionScript Mobile Project and give it a name.
  • Go to Project -> Properties -> Builders.
  • Uncheck the “Flex” builder (but leave the “AIR application.xml Builder”)
  • Now copy your arbitrary swf (ie: myapp.swf) into the bin-debug folder.
  • Create an ActionScript class with the same name as the swf, (ie: myapp.as) in the default package space.
  • Right click on the myapp.as file and click on “Set as Default Application”
  • Now it will generate a myapp-app.xml, go and open and edit as you like.
  • Click on run configuration and package your app for you the platform you want.
  • Repeat steps to add more SWFs to package.

Share the post "Using Flash Builder 4.5 to Package Arbitrary SWFs for iOS, Android, and PlayBook"

  • Pingback: Daily Developer Journal – May 3rd 2011

  • shawn

    How arbitrary of a swf ? Can I package flex or as swfs or only pre 6 motion stuff ?

    • http://www.renaun.com Renaun Erickson

      The packaged AIR application still has to work in the right profile and runtime version. So for mobileDevice AIR profile that is AVM2 (AS3) and a correct swf-version possibly for SWF 2.6 compiled SWFs trying to be run on an AIR 2.5 runtime.

  • http://zanuka.com zanuka

    video not working :-(

  • http://ckeromen.posterous.com CK

    Thanks for the trick !

    Trying to use it to package a Flex app for iOS
    1) Export Debug version works
    2) export release version fails as the app requires assets and icons folders and Package Contents inly include descriptor file and .swf.

    Any idea ?

    • http://www.renaun.com Renaun Erickson

      go to project -> Properties -> Flex Build Packaging -> iOS and there should be a place to tell what files are included for that package platform.

  • pyth

    hi renaun

    does this also work for .swf files created with AS 1.0 / AS 2.0 ?

    • http://www.renaun.com Renaun Erickson

      no the mobileDevice profile only supports AS3 based SWFs.

  • Kirk

    Thanks for the great tip!

    Is there a way to set variables or parameters to pass into the SWF? We are passing in both from the HTML page in the web version.

    • http://www.renaun.com Renaun Erickson

      AIR only allows for that on the desktop, on mobile there isn’t really a concept of variable passing for standalone applications. You could package in a config.xml file or load config values off the web.

  • Kirk

    I’m able to package and run a debug version of an SWF on the device, but once I create a release build, the app only shows the loading image (Default.png) and a blank background, then stops. (I also have the required icons, which show up properly as well.)

    Any clues as to why this might happen?

    Thanks again for your great post!

    • http://www.renaun.com Renaun Erickson

      If it is iOS make sure it doesn’t use RSLs, all the code has to be in the SWF.

      • Techspec

        This is the same problem I am having. Everywhere I have searched, so
        many others have the same problem. Mine is for android and release build
        does not build my swf correctly….

        • renaun

          Don’t worry about release build with the steps shown. Just make sure your swf is a release swf.

          • Techspec

            My swf files are release built, so how then do we package them if your tutorial does not work in release build?

          • renaun

            Like the steps say, just click “run” configuration and it will build the apk

          • Techspec

            Ok, this is what you need to do if you want a “Release Build”. In “Export Release Build” a temp-bin-debug folder is created. Before you add the signed certifiacte replace the swf file in the temp-bin-debug folder with your swf file (make sure it has same name). Then finish the Release Build. Presto, you have a working APK ready for the Play Store!

          • renaun

            Nice

  • http://www.quizengine.co.uk Pat Nevison

    Hi. Excellent tutorial. Thank you.

    I have Flash Builder 4.5 and am using it with an HTC Desire running Froyo 2.22.351.3. I have created the simplest AS3 swf using Flash CS4. It is very much like the animated shape in your sample video. There is nothing else in the fla – no script at all – only a simple shape tween on the timeline.

    When I run it from Flash Builder, it plays perfectly on the phone. When I export a release build Flash Builder reports that it has installed and launched the packaged app on the phone, but the phone shows a blank (white) screen. It’s as if the swf had launched, but stopped before it had done anything. (I made the stage orange to see if it had started playing the swf, but the screen of the phone remained white)

    So I guess in summary, it works when run from Flash builder (is that debug mode?), but stalls / fails when run as a release build.

    Any ideas ? (Have googled extensively and found no help)

    • http://www.renaun.com Renaun Erickson

      So the .apk file in bin-debug should just be fine because the SWF is not a debug swf (since it came from Flash CS4). I am assume that the export release build either builds the swf off the .as placeholder or you need to copy over the swf into the bin-release folder and run it again (or the folder you choose in the export release build dialog).

  • http://www.quizengine.co.uk Pat Nevison

    Hi Renaun, and thanks for the feedback. I think this may be half a solution, but that’s better than what I had. Here’s what happened next.

    I took the release build apk, renamed it to become a zip file. I open the renamed file and extracted the swf out of it. It was *not* my swf, but an absolutely empty swf presumable compiled from (as you suggest) the .as placeholder.

    This next bit sounds like a bit of a hack, but I took the *working* swf and popped it into the zip file, replacing the one that was created from the placeholder. I then renamed it back to being an apk and tried to sideload it onto my phone using an sd card. It failed to install when I ran it on the phone (I have the ‘unknown sources’ enabled on the phone.

    I’m assuming this failed because of the hacky way I did this and presume I broke some hash of the apk that no longer matches the certificate.

    So, it looks like I’ve found the problem (thanks) – I now just need to try and discover how to prevent Flash Builder from creating the unwanted swf and to force it to use the one I gave it instead.

    • http://www.renaun.com Renaun Erickson

      Just don’t worry about the export process, the apk in the bin-debug after hitting the run button should be just fine. Your SWF isn’t a debug swf and you can put app.xml in bin-debug that is a locked file so it can’t get copied over if you really want that (say for keep FB from putting -debug in the names).

      • Amy

        When I tried this (copying MyApp-app.xml to the bin-debug directory), it failed to launch or create an apk. Is there a trick to it?

    • Programmingdeisnger

      Same problem here.
      Release build – I get a white screen instead of my swf. Everything works fine until the release build – on device or in flash pro.

      Taking the same steps, I renamed the .apk to .zip and inspected the included swf. It is NOT my swf…rather a blank, default swf. Im pretty sure this is a tiny little problem somewhere. Any help would be appreciated.

      • Anonymous

        This doesnt work with release build. But that doesnt matter since your swf is in your control.

  • http://timeister.com Adrian Pirvulescu

    Hi There,

    Really nice tutorial (I am a fan of this one).
    Still not so clear for me from the comments above. If I have a FLEX 4.5 (including s:List s:Button s:…etc) swf will it still work ?
    Making a pure AS3 Mobile project and trying to code a List component it’s pretty nasty so why not using flex sdk ?

    Thanks so far!
    Good luck with the next ones ;)

    –
    Adrian

  • BK

    Is there a way to scale the swf to fit the ipad screen using this method?

    • Anonymous

      If the swf has code in it that tells the swf not to scale there is nothing you can do. If the swf its default scaleMode you can try and set there width and height in the app descriptor file.

      • BK

        Thanks, I removed “stage.scaleMode = StageScaleMode.NO_SCALE;” from the embedded swf. Now it scales :)

  • Diego Rotondo

    Sorry for my english Renaun.
    i’m almost new in flash builder…
    i’m not sure about the “Aplication id”…
    when you put “com.renaun.RandomSWF”…
    what it means? what should i put?

    i’m receiving this error when i compile

    Error occurred while packaging the application:

    Packaging failed:1
    C:UserspixAppDataLocalTempbar-app457600814557028736.xml: error 302: Root content Turner.swf is missing from package
    Error: AIR validation failed

    but the file is en the bin-debug folder…

    what am i doing wrong??

    thanks a lot… very helpfull!

    • Anonymous

      Application ID is the unique identifier of you application, the specs for that value differ form iOS to Android.

      The error is saying it can’t find the content that you specified in your app.xml file. Where is Turner.swf? Which I assume is your main application SWF.

  • Yop

    really cool tut. thx a lot !

  • Techspec

    This does not work in ‘release build’ as a new swf is created instead of your own swf being used. In debug, no problem – but release build replaces your swf with a newly created one that only shows a black screen.

    • renaun

      That is correct but if you created your swf with -debug=false it pretty much is a release build.

  • ked

    Hi i tried your tutorial but when i try to install the app i get this erorr “apk installation failed :INSTALL_CPU_ABI_INCOMPATIBLE”

    can you help me fix this?

    • renaun

      Sounds like you are trying to install the apk on a non-arm device. What device are u installing it on?

      • ked

        On blue stacks but when i move it to my android phone i get a msg that the app is not installed i’m trying to convert a swf game to apk file

        • renaun

          Is the SWF as3?

  • http://www.facebook.com/niwarOllagram Niwar Hokage

    hi! will there be no performance issues? you know devices hate vector :D

    • renaun

      There will be performance issues with vectors, but this meant more for prototyping and a way to see old content on a device. Not meant as a production workflow.

  • http://twitter.com/stefanokx97 stefano giannini

    How i can do this with Flash CS6? Please Answer

    • renaun

      In flash pro you would need to change the project to a mobile project and the target/build it for mobile.