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);