Detecting and Responding to iPad Orientation Change in Adobe Edge Animate

With the help of Simon Widjaja and friends’ Edge Commons Dirty Little Helpers library I have extended the Flexible Layouts Using Adobe Edge Animate and the Edge Commons Library tutorial to work on an iPad.

Simon’s tutorial/demo works well on a browser when resizing and this demo takes that one stage further and uses the ‘window.orientation‘ event to trigger the resize code uses a simple <meta content> tag to ensure the device as it 100% and recognises the change in dimensions. You can still trigger the resize code in your desktop browser but this is designed to detect your iPad’s orientation too.

I’ll write it up fully later with a walk-through of the functionality but for now you can just play around with it and look at the (fairly simple) code – also I thought it would be a nice start to the week!

I have removed the ‘window.orientation‘ call as it is not required – even simpler!

View the demo on your iPad here 

Download the source here

One thought on “Detecting and Responding to iPad Orientation Change in Adobe Edge Animate

  1. Hi Chris,

    Thanks for posting this code – it’s been really helpful and works a treat on the iPad. I have a question though, I have made an ad using this code which works fine in Safari on the iPad, but the platform the ad is displayed in is inside an app in I assume a HTML container and the re-size events do not seem to be firing. I have also tried re-instating window.orientation but to no avail. The a previous ad that does work used an listener in the index.HTML page:

    window.onorientationchange = detectIPadOrientation;
    function detectIPadOrientation ()
    {
    }

    is there a way I can call

    EC.applyAdaptiveLayout(sym, “adaptiveContainer”);

    inside the index_edgeActions.js

    from the main index.html?

    Many thanks!

    Marcus

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s