Disabling iOS Elastic Scrolling on an embedded YT IFrame

Question

I'm making an app in Adobe AIR targeting iOS 4.0+ and Android 2.3+. I've tried to disable iOS elastic scrolling for the embedded YT video: When the user presses the player's IFrame the whole video pans over and I can't seem to find a way around this.

I've tried adding event listeners to prevent this behavior but it doesn't work.

By the way, I'm aware that I can't really control what happens in the IFrame. A quick and dirty solution would be to put elements directly over the frame, like a transparent canvas or a div that would catch the events. Not ideal at all, because users won't be able to press the buttons on the player.

Any ideas or suggestions?

Thanks!

dornad dornad · Accepted Answer · 2012-09-06T16:00:07

I found a solution.

You need access to UIWebView (the underlying iOS implementation under StageWebView) to disable elastic scrolling.

Once you have your Adobe Native Extension (ANE) setup, its relatively simple. (A great ANE Wizard/Generator is found here https://github.com/freshplanet/ANE-Wizard)

For iOS 5 its straightforward: webView.scrollView.bounces = NO;

If you want to support iOS 4, it gets a bit more complex. You don't have the convenience of webView.scrollView, so you need to find this view manually.

An Objective-C code block that handles both iOS 4 and 5 would be something like this:

NSString *currSysVer = [[UIDevice currentDevice] systemVersion];
if ([currSysVer compare:@"5.0" options:NSNumericSearch] != NSOrderedAscending) {
    // iOS 5 is straightforward
    webView.scrollView.bounces = NO;
} 
else {
  // iOS 4 requires a bit more of work
  UIScrollView *scrollView = nil;
  for (UIView *subview in [webView subviews]) 
  {
    if ([subview isKindOfClass:[UIScrollView class]]) {
      scrollView = (UIScrollView *)subview;
    }
  } 
  if (scrollView != nil) {
    scrollView.bounces = NO;
  }
}

Hope this helps!

Disabling iOS Elastic Scrolling on an embedded YT IFrame

1 Answers