iOS UIWebView Web page loading component of the foundation and use of tips examples

  • 2020-06-12 10:42:16
  • OfStack

Basic usage examples


- (void)viewDidLoad
{
  [super viewDidLoad];
  // Do any additional setup after loading the view.

  UIWebView * webView = [[UIWebView alloc]initWithFrame:CGRectMake(0, 20, ScreenWidth, ScreenHeight-20)];
  //  Automatically resizes the page to fit the screen 
  webView.scalesPageToFit = YES;
  webView.userInteractionEnabled = YES;
  webView.opaque = YES;

  [self.view addSubview:webView];

  NSURL * url = [NSURL URLWithString:@"http://www.youku.com"];
  NSURLRequest * request = [NSURLRequest requestWithURL:url];
  [webView loadRequest:request];
//  NSString * myHT = @" youku ";
//  [webView loadHTMLString:myHT baseURL:url];
/*
  [webView goBack];    //  return 
  [webView goForward];   //  To travel to 
  [webView reload];
  [webView stopLoading];
 */
  webView.delegate = self;

  // Removes the scrollable outer shadow 
  UIScrollView *scrollView = webView.scrollView;
  for (int i = 0; i < scrollView.subviews.count ; i++) {
    UIView *view = [scrollView.subviews objectAtIndex:i];
    if ([view isKindOfClass:[UIImageView class]]) {
      view.hidden = YES ;
    }
  }
}

#pragma mark - UIWebViewDelegate
- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType{

  /**
   * typedef NS_ENUM(NSInteger, UIWebViewNavigationType) {
   * UIWebViewNavigationTypeLinkClicked,
   * UIWebViewNavigationTypeFormSubmitted,
   * UIWebViewNavigationTypeBackForward,
   * UIWebViewNavigationTypeReload,
   * UIWebViewNavigationTypeFormResubmitted,
   * UIWebViewNavigationTypeOther
   };
   */

  NSLOG_FUNCTION;

  return YES;
}

//  Start loading 
- (void)webViewDidStartLoad:(UIWebView *)webView{

  NSLOG_FUNCTION;

}

//  Finished loading 
- (void)webViewDidFinishLoad:(UIWebView *)webView{

  NSLOG_FUNCTION;

}

//  Load failed , Pop up error 
- (void)webView:(UIWebView *)webView didFailLoadWithError:(NSError *)error{

  UIAlertView *alterview = [[UIAlertView alloc] initWithTitle:@"" message:[error localizedDescription]
                            delegate:nil cancelButtonTitle:nil otherButtonTitles:@"OK", nil];
  [alterview show];
  [alterview release];
  NSLOG_FUNCTION;

}


Here are some tips on how to use it:

1. Make your web pages fit the width of your phone's screen

If UIWebView is used to display 1 web page of pc station, it will be found that the page will be beyond the screen and look very ugly. At this time, one meta can be added to the webViewDidFinishLoad agent through js:


- (void)webViewDidFinishLoad:(UIWebView *)webView

{

  NSString *meta = [NSString stringWithFormat:@"document.getElementsByName(\"viewport\")[0].content = \"width=%f, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no\"", IPHONE_WIDTH];

  [webView stringByEvaluatingJavaScriptFromString:meta];

}

Note: To use this method, set scalesPageToFit for UIWebView to NO


webView.scalesPageToFit = NO;

2. Add a click event to an image in the web page and zoom in when clicking on the image

The idea is to add an onclick event to every img tag, encapsulate the src attribute of img into a special url in the event, and then intercept it

If the page is loaded via loadHTMLString, the following sentence can be replaced:


    html = [html stringByReplacingOccurrencesOfString:@"<img " withString:@"<img onclick=\"window.location.href=('http://src.'+this.src);\" "];

If it is through loadRequest, then perform the following JS in webViewDidFinishLoad:


  NSString *js = @"var imgs = document.getElementsByTagName(\"img\");"

  "for(var i=0;i<imgs.length;i++){"

  "  var img = imgs[i];"

  "  img.onclick=function(){window.location.href=('http://src.'+this.src);}"

  "}";

  [webView stringByEvaluatingJavaScriptFromString:js];

Then intercept through webview's proxy method, get the image of url, then you can do all kinds of processing


- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType

{

  NSString *url = request.URL.absoluteString;

  if ([url hasPrefix:@"http://src."])

  {

    url = [url stringByReplacingOccurrencesOfString:@"http://src." withString:@""];

    // Do something..

    return NO;

  }

  return YES;

}

3. Add 1 page header to UIWebView to scroll with the page

UIWebView contains 1 scrollview. You can add 1 header to scrollview to follow the page


CGFloat headerHeight = 36.0f;

//  Note: y The coordinates have to be negative, IPHONE_WIDTH It's the width of the screen 

UIView *headerView = [[UIView alloc] initWithFrame:CGRectMake(0, -headerHeight, IPHONE_WIDTH, headerHeight)];

[_webView.scrollView addSubview:_headerView];

//  Modify the webView the scrollView the contentInset Let the top go 1 Some space 

UIEdgeInsets edgeInset = _webView.scrollView.contentInset;

_webView.scrollView.contentInset = UIEdgeInsetsMake(headerView.frameHeight, edgeInset.left, edgeInset.bottom, edgeInset.right);


Related articles: