Events, Tutorials

“Game of Flex” on tablets

38 Comments 07 December 2011

“Game of Flex” on tablets

I’m very happy to announce that “Game of Flex” is available for iPad and Android tablets users (it will be soon available for BlackBerry PlayBook users). Last week, we released Flex 4.6 with great additions to build cross-platform tablet applications. “Game of Flex” is a game built with Flex 4.6 and inspired by Tour de Mobile Flex. As you may know, Tour de Mobile Flex has never been available on the App Store. Let me tell you why: the application has been rejected by Apple because it’s a demo application which violates the developer guidelines. That’s why I had to find another way to showcase Flex on iOS devices using… a game! Gamification is so trendy that it worked! It has been directly approved by Apple. It’s actually a quiz with 16 questions, and it’s a real game, which means that if you correctly answer all the questions, you get a chance to win a copy of Flash Builder 4.6!!!

“Game of Flex” is not just a game, it’s also a great way for us to showcase the great performance of Flex on tablet devices, and for you to discover the new components and features of our latest release of Flex! Indeed, Game of Flex is also a learning tool. At anytime, you can click on the “Snippet” button and read the source code of the current sample. You can also click on “Tutorial” to read an online tutorial about the current sample.

Download the game and the source code

The direct links to the application are:

Android tablets: https://market.android.com/details?id=air.com.riagora.flexgame
iPad: http://itunes.apple.com/us/app/game-of-flex/id483389384
BlackBerry Playbook: soon

You can also download the source code of the application. Install Flash Builder 4.6 and import this Flash Builder Project (FXP file): FLEXGAME.FXP

 

Some tips inside the code

If you want to check the source code of the app, you’ll learn…:

  • How to use the new SplitViewNavigator architecture (portrait and landscape layouts on tablet devices)
  • How to display HTML content inside a Flex app
  • How to access the camera to take pictures
  • How to use the BusyIndicator, ToggleSwitch and List components
  • How to enable multi-touch
  • How to manage your views
  • How to use the accelerometer
  • How to create custom AS3 item renderers for your lists
  • How to access the local SQLite database
  • How to use native extensions
  • How to set up the new DateSpinner component
  • How to display callout popups
  • How to set up the software keyboard to match your needs
  • How to declare spinner lists
Have fun !!!

Post to Twitter

Your Comments

38 Comments so far

  1. Congratulations Michaël,

    nice work. Thank you for sharing this with us.

    I use FlashBuilder and Flex since summer 2010 and I like it a lot. Hoping that Flex + Adobe Air is further making good progress in the future.

    Cheers,
    Marcus

    P.S.: Good luck for your presentations at OOP 2012 in munich in January

  2. Mark Fuqua says:

    Can we use split screen navigator in a desktop application or just touch?

    It would be a nice, easy interface on desktop as well.

  3. Mark Fuqua says:

    Sorry meant to say SplitViewNavigator.

  4. admin says:

    @Mark. You should be able to load the mobile.swc components plus the mobile theme. Check my article on running flex mobile app in the browser, it will give you some tips

  5. JCLang says:

    Good job Michaël!

  6. Nathan5x says:

    Much awaited one Michael.. Thanks for sharing this…

    Any web/desktop version available ?

  7. admin says:

    @Nathan5x oh I could easily compile a desktop version. You would miss a lot of features (accelerometer, geolocation, etc…) but it’s worth trying. Let me udate that.

  8. Wim Van Buynder says:

    Looks very nice Michaël! I hope it will be available on the Playbook soon!

  9. Wojciech Ptak says:

    Well done!! Great work!!

  10. Joseph says:

    Excellent – Merci Michaël!

    I tried running a Mobile App developed Flex 4.5.1 on the iPad & iPad 2, and recompiled the same App in Flex 4.6 on the iPad 1 & iPad 2.

    Result: While the App is a little slow on response on the iPad 1; The iPad 2 works almost on par with apps that are developed in Objective C.

    I guess this means that time is on AIR’s side and performances get better, as I’m sure it’ll get better & better for the iPad 3 too.

    Will there be a plateau where AIR will not improve anymore on performance?

  11. MP says:

    Awesome this is a wonderful summary of features/tutorial links. One thing I noticed when viewing the source code/running in simulator is that the some answers don’t seem correct. Check the ‘SQL database’ correct answer in the XML.

  12. admin says:

    @MP Ha ! You don’t think I’ll let you find the correct answers so easily :)

  13. Matt says:

    Michaël you’re a genius! What better way to get a developer tool through the app screening process?

    I will remember this trick when the time comes for me to submit a similar app.

    Thank you.

  14. mateusz mackowiak says:

    Great stuf. The game was fun and got me thinking which year the flex started:) good to know. Hope for wining:)

    Found 2 bugs when presing the toggle swich to rotate the screen on the ipad it rotates two times to the right and never goes back, must rotate upside down the ipad, and also when the stageWebView for the source is showing and the divice is in portrait mode the popup for the questios show under. I had that, its ańoying to have to grab the screen capture but it works.

  15. mateusz mackowiak says:

    Uuu .. Also Found this thing that I was thinking its my code!! When You click meny times fast on the button to show the questions in landscape does strange things. Pleas find a way to remove that and reply would be greatful.

  16. Gareth Arch says:

    Nice! I like the idea. Found an issue with it when viewing on iPad2 though. Not sure whether it should be limited to Landscape view vs Portrait, but if you are viewing in portrait mode, select “show questions”, Display HTML pages, and the “show questions” call out button list, shows up behind the StageWebView. It also stays visible behind the source code when displaying. Not trying to be picky, but just want to make sure you guys are showing the best possible showcase of Flex apps :)

  17. Stephen says:

    Hi,

    Great app, looking forward to trying it and going through the code. I’m still slightly concerned about Adobe’s support to Flex/AIR and mobile. While you creating great tablet and mobile apps, you seem to be in the minority of Adobe evangelists a lot are writing examples of HTML and JS. I want to write mobile apps in AIR, but how long term is it?

  18. Ahmed says:

    Well Done, keep your nice work Michael,

  19. Hi Michaël,
    i really like all of your post!
    Im starting to develop app for fun, im doing a little game to!
    Maybe u are the only person that can help me!
    When i debug in desktop it’s working good, on device a get just a black screen! Any idea?
    My IDE it’s of course FlashBuilder and i have the right IOS cretificates!
    Thanks a lot

  20. iBrent says:

    Thanks for sharing the code for this app. It makes all the difference in the world when learning about the new components to see them in action. Excellent content as always Michaël!

    One big question, the layout doesn’t work at all on my Galaxy Tab 7″, why not? I can’t read all the text, or press the submit button on the questions. I’d suggest you fix it quickly… you’re already getting poor reviews because of it.

    iBrent

  21. Paul Michael says:

    Thank you for sharing! Looks great on my Samsung Galaxy Tab 8.9. :)

  22. Keith says:

    Great to see it made it to the AppStore!

  23. Frank says:

    Very nice app. Nicely demonstrates the new capabilities of Flex 4.6.
    However, one thing I noticed is that the CalloutButton (well the fading of the CalloutContent to be exact) is sluggish as hell on the iPad2. I experienced the same with my app, so I think its a general performance issue with the Callout.
    Is there a way to maybe disable the fading transition altogether?
    Thanks a lot!

  24. Humberto says:

    In the question of spinnerList, in landscape orientation, there is a problem with the radioButtons. the seccond and third can’t be selected.

  25. Humberto says:

    Oh, sorry, forgot to say i was using Xoom

  26. Martin Weiser says:

    Fantastic, great job. The performance, especially list scrolling and tabbed view transitions is amazing, really visible improvemnt in 4.6 over 4.5.
    Thank you for such app.

  27. admin says:

    Thanks for all your nice comments. If you could add comments on the app store or the android market, it would be great. Thanks again. I’ll work on fixing some bugs next week.

  28. Huy Vu says:

    Thanks for your sharing :)

  29. Nathan D says:

    Hey! I love the app! One issue I did run into – on the final screen after the game to enter into the contest (fill out the form) – I could click on the text input but, clicking on any letter on the keyboard took focus away from the input text input and removed the keyboard – essentially making it impossible to enter the contest. I had to shut down and restart and after some screen rotating it let me input everything.
    It probably has more to do with the way StageWebView works but, just FYI. :D

  30. Amer Dababneh says:

    When are you going to announce the winner? My 60 trial version of Flash Builder 4.6 will expire soon :)

  31. Anber500 says:

    Is it possible to have a direct download link to the .ipa file for ios? I’m from South Africa and iTunes keeps telling me that the app is only available in the US store.(Which I’m not allowed to access from South Africa :( )

    I don’t have Flex 2.6 but I’m curious to see how your app preform on the ipad.

  32. Nico says:

    Who has won the FB 4.6 ?

  33. admin says:

    In December, the winner was Nicolas Cheng. In January, Jose from Portugal. More winners to come (one per month until May 2012). You don’t have to play again, your name is still in the database and you still have chances to win a FB4.6 license.

  34. Nico says:

    Great. Cheers!

  35. DFoster says:

    Great stuff man, I’ve been using flex for about a year now and I can’t get enough!
    I’ll add some comments on the droid market when I get home!

  36. Dave Foster says:

    Right on man, really good gameflow.. I’ve been using flex for about a year now, I can’t get enough! I’ll throw a comment on the droid mart tonight!

  37. Pavel says:

    Hi, I can develop AIR apps (it is my job) but I would like to start with mobile games developing only for my personal purposes. I have tried developing in Java for Android and cross platform PhoneGap with SenchaTouch or Wink framework but it is not as good as other games. I would like to try to develop these games with Flex. I have downloaded Flash Builder 4.6 and SDK 4.6 but I cant run the generated apk file on real Android device (although it is very simple Hello World app and it can run on the emulator without problems). Dont you know where the problem is? Thank you … Pavel


Trackbacks/Pingbacks

  1. Game of Flex for Tablets Released! | Devgirls Weblog - December 7, 2011

    [...] sure to check out Michael’s post about the game, and visit the official website for it here! Sample [...]

Share your view

Post a comment

Who am I ?

I'm Michaël CHAIZE, Adobe Flash Platform Evangelist based in Paris. I'm a big fan of Rich Internet Applications and I promote the Flash Platform in the Enterprise world.
You can follow me on twitter: http://twitter.com/mchaize

Magazine

Follow us on Facebook

© 2014 RIAgora. Powered by WordPress.

Daily Edition Theme by WooThemes - Premium WordPress Themes