Shared codebase for both mobile and web applications?
I've been developing a mobile application for a while now. It runs on iOS and Android as well as on the desktop as an AIR app. This is great and I'm very excited about it. However, last week I was asked why I couldn't export a version of the app that ran within a web browser. I said that I assumed I could and that I would look into it.
But why would you want to run mobile code on the desktop?
A couple of reasons:
- Greater re-use of code. This doesn't make sense in all cases but it does in many cases. (I won't elaborate because I think this is self-evident. If you disagree I'd be happy to talk about it but I'd rather not clog this description with it.)
- Quicker/easier client demos. Rather than having to install an apk or an ipa on a mobile device, I can just send a URL.
So what have I found? Well, from what I've tried so far.. it.. doesn't work. Or rather I haven't been able to make it work.
I started by creating a Flex Library project for all shared code. Then I created 2 application projects that reference it- one for mobile and one for web. The mobile project works fine but the web project does not. Here's what I've tried so far to make it work:
I tried adding the mobilecomponents.swc and the mobile.swc theme to my web project so that Flash Builder knows about MobileSkin (and other mobile-only classes). This enables my app to compile but when I launch it immediately throws a runtime error inside of UIComponent: VerifyError: Error #1014: Class flash.text::StageText could not be found. I've found very little about this error, and the one tip I did find (adding the --swf-version=13 compiler option) does not work.
- I tried using conditional compilation to control which class my skin components inherited from: MobileSkin or SparkSkin. This was just a quick experiment to see if it worked. I know it's disgusting and not a production solution. My thinking though was that if MobileSkin was really just an optimized version of SparkSkin, my skins should be okay inheriting from either. This didn't work right away- app wouldn't compile b'c certain methods were missing (ex. layoutContents) and so I bailed on it because it felt dirty to begin with.
I tried replacing MobileSkin with UIComponent as the super class for all of my skins thinking that MobileSkin was probably just a lightweight subclass of UIComponent anyway. This approach resulted in some compiler errors at first (ex. no layoutContents method, no measuredDefaultWidth/measuredDefaultHeight properties, addChild vs addElement, etc.). Once those issues were resolved the app compiled but crashed with runtime errors inside of UIComponent's "getState" method. (Looks like MobileSkin overrides this method to prevent UIComponent's default behavior.)
So none of those approaches have worked for me so far... but what about you guys? I have no hopes of Adobe reading this thread or responding to it in any way, but I would love to hear from other people in the community. Have you encountered this issue yet? Were you able to make it work or can you spot any obvious oversights I've made in the methods I mentioned trying above? Thanks in advance if you can. ![]()
