0

I currently have a Web View within my MainViewController, which I allow users to swipe gesture left and right in order to go back and forth within their url history (swipe gestures call the 'goBack' and 'goForward' instance method of the UIWebView Class). Although functional, I would like to improve the user's experience by having the swipe gestures smoothly transition between old and recently viewed webViews/webSites (similar to the experience of transitioning between between pages in a Scroll View). However, I am not sure of the best way to proceed... Apple specifically placed this note on their UIWebView Class Reference Page:

Important: You should not embed UIWebView or UITableView objects in UIScrollView objects. If you do so, unexpected behavior can result because touch events for the two objects can be mixed up and wrongly handled.

How can I implementing this type of capability into my app and improve the app's user experience?

Thanks in advance!

JRoss
  • 177
  • 10
  • 23

1 Answers1

1

Yes, easily you can subclass UIWebView, and implement

- (BOOL)pointInside:(CGPoint)point withEvent:(UIEvent *)event

in this way:

// ViewController.h

@interface APWebView : UIWebView
@end

@interface APViewController : UIViewController <UIGestureRecognizerDelegate>
{
    IBOutlet APWebView *_webview;
}
@end

// ViewController.m

@implementation APWebView

- (id)initWithCoder:(NSCoder *)aDecoder
{
    self = [super initWithCoder:aDecoder];

    UISwipeGestureRecognizer *SwipeRecognizerLeft =
  [[UISwipeGestureRecognizer alloc] initWithTarget:self action:@selector(SwipeDetected:)];
  SwipeRecognizerLeft.direction = UISwipeGestureRecognizerDirectionLeft;
  [self addGestureRecognizer:SwipeRecognizerLeft];

  UISwipeGestureRecognizer *SwipeRecognizerRight =
  [[UISwipeGestureRecognizer alloc] initWithTarget:self action:@selector(SwipeDetected:)];
  SwipeRecognizerRight.direction = UISwipeGestureRecognizerDirectionRight;
  [self addGestureRecognizer:SwipeRecognizerRight];

    return self;
}

- (void) SwipeDetected:(UISwipeGestureRecognizer*)gesture
{
    if ( gesture.direction == UISwipeGestureRecognizerDirectionLeft ) NSLog(@"LEFT");
    else NSLog(@"RIGHT");
}

- (BOOL)pointInside:(CGPoint)point withEvent:(UIEvent *)event
{
    return YES;
}

@end

@implementation APViewController

- (void)viewDidLoad
{
    [super viewDidLoad];

    [ _webview loadRequest:
         [NSURLRequest requestWithURL:
              [NSURL URLWithString:
                  @"http://www.google.it"]] ];
}

@end

Add on your Xib (or storyboard) the UIWebView and assign the subclass:

enter image description here

In your console log you should see:

2013-10-16 09:51:33.861 SwipeLR[14936:a0b] LEFT
2013-10-16 09:51:34.377 SwipeLR[14936:a0b] RIGHT
2013-10-16 09:51:35.009 SwipeLR[14936:a0b] LEFT
[...]

Hope this helps.

elp
  • 8,021
  • 7
  • 61
  • 120
  • Thanks, @elpsk, for your answer! This will allow the custom webView to detect swipe gestures, but I am wondering how I should go about having those gestures move webViews on/off the screen in order to move back and forward within a user's URL history? Conceptually, for example, I would like the user to start with one webView, but as they navigate to a different URL a new webView would be created and both views would be a part of a scrollView to allow the user to swipe back and forth seamlessly (similar to the functionality in Apple's Weather App). Does this make sense? – JRoss Oct 16 '13 at 16:54
  • Yes, make sense. You can detect the swipe or the pan on the webview, next, make a screenshot of your webview, drag it (the screenshot) on screen to simulate that there is another webview. After drag end, load back or forward from your history. You can also apply a rotation effect, like Google Chrome on Android. It's fun to do, try it and let me know! – elp Oct 16 '13 at 19:39
  • Thanks for the confidence @elpsk! Any chance you could supply me with a little code to get me started? Or is there some open source already available that I could implement and update? Would you potentially need to maintain 3 screenshots (back, current, and forward images) in order to see the new webview (sliding back or forward) as the user drags the current view off the screen? – JRoss Oct 20 '13 at 15:57
  • This answer can help you. It's a similar question: http://stackoverflow.com/a/17566124/88461 – elp Oct 21 '13 at 07:31