UIWebView，移动web

1.只有使用loadRequest:加载网页,才能对之后的链接操作做goBack,goForward操作,即canGoBack,canGoForward才有可能返回YES.使用loadHTMLString,loadData都不可以.并且在load之后通过stringByEvaluatingJavaScriptFromString对网页增加的内容在NSString* outerHTML [iWebView stringByEvaluatingJavaScriptFromString:document.documentElement.outerHTML];//document.documentElement.innerHTML中都不会出现。3.goBack也会请求页面,也会回调代理方法.4. NSURLErrorDomain error -999.This error may occur if an another request is made before the previous request of WebView is completed...I worked around this by ignoring this error and letting the webview continue to load.5.双击一个图片链接不会调用到shouldStartLoadWithRequest判断点击到的是否是图片可设置特殊的url或判断当前点击的tag使用window.pageYOffsetwindow.pageXOffsetwindow.outerWidthdocument.elementFromPoint等。例如 NSString *js [NSString stringWithFormat:document.elementFromPoint(%f, %f).src, pt.x, pt.y];js [NSString stringWithFormat:document.elementFromPoint(%f, %f).getAttribute(_src), pt.x, pt.y];获取自定义属性的值时用getAttribute。7.设置背景色后如下iWebView.backgroundColor[UIColor colorWithPatternImage:[UIImage imageNamed:background.png]];当内容很长时会占用很大内存这说明它会根据ContentSize平铺而不是Bounds使用iWebView.backgroundColor[UIColor blackColor];则不会占用这么大的内存。8.webView_.opaque NO;//设置webView最上面的内容的背景透明webView_.backgroundColor[UIColor clearColor];//设置其中的scrollView透明使用图片背景的方案是在iWebView的下面同级加一层UIImageView, iWebView.backgroundColor[UIColor clearColor];当内容拖动到头或尾时会透出iWebView下面的背景。如果要让内容的背景也透明再设置不透明属性为NOwebView.opaque NO;利用这些属性可以实现在顶部或底部拖动时展现刷新提示效果8.在顶部和底部时禁用拖动回弹for (id subview in iWebView.subviews){if ([[subview class] isSubclassOfClass: [UIScrollView class]]){((UIScrollView *)subview).bounces NO;}}禁止UIWebView的bounceshttp://www.flyblog.info/catprogramming/303.html底部灰色阴影其实是个imageviewhidden就行了不影响任何正常操作for(UIView *v in [[[iWebView subviews] objectAtIndex:0] subviews]){if([v isKindOfClass:[UIImageView class]]){v.hidden YES;}}或者for (UIView *shadowView in [webView_.scrollView subviews]){if ([shadowView isKindOfClass:[UIImageView class]]){shadowView.hidden YES;}}或者// remove shadow view when drag web view for (UIView *subView in [webView_ subviews]) { if ([subView isKindOfClass:[UIScrollView class]]) { for (UIView *shadowView in [subView subviews]) { if ([shadowView isKindOfClass:[UIImageView class]]) { shadowView.hidden YES; } } } }for (UIView *subView in [webView_ subviews]) { if ([subView isKindOfClass:[UIScrollView class]]) { for (UIView *shadowView in [subView subviews]) { if ([shadowView isKindOfClass:[UIImageView class]]) { shadowView.hidden YES; } } } }让网页自适应屏幕webview.scalesPageToFit YES;在网页中写下面的js代码也可以实现bounces NO的功能document.onload function(){ document.ontouchmove function(e){ e.preventDefault(); } }9.由此服务端日志记录可知iphone端safiri及UIWebView的图片缓存是没有的。每次访问都需要从服务端重新下载图片http://tangqiaoboy.blog.163.com/blog/static/11611425820118672051584/cachePolicy:NSURLRequestUseProtocolCachePolicy对同一个设置为本地src的imgUIWebView总是缓存其内容重建UIWebView依旧。只能重新启动软件。在图片地址后加上?t%ld,time(NULL) localPath[localPath stringByAppendingFormat:?t%ld,time(NULL) ];再loadHtml可解决问题。原理是在图片后面加了一个随机数让浏览器不再读取缓存。http://stackoverflow.com/questions/11516278/how-to-clear-cache-for-my-uiwebviews-loadhtmlstringhttp://www.techques.com/question/1-11516278/How-to-clear-cache-for-my-UIWebViews-loadHtmlString10.UIWebView的stringByEvaluatingJavaScriptFromString只能在主线程里面被调用如果恰好这个js执行时间比较长就会造成程序卡死。跟 Mac OS X 比较起来iPhone 上 UIWebView 的公开 API 实在少上许多.http://spring-studio.net/?p26511.UIWebView之获取所点位置图片URLhttp://www.cocoachina.com/newbie/basic/2011/1031/3439.html14.禁用UIWebView中双击和手势缩放页面但测试结果是缩小了一半确实不影响双击了但不缩小时仍然响应双击上下滚动。http://blog.163.com/alex_kame/blog/static/14546748201171263254740/http://learnthemobileweb.com/2009/07/mobile-meta-tags/16. UIWebView处理authentication方法参考 http://www.cocoachina.com/newbie/basic/2011/1123/3583.html17.elementFromPoint() under iOS 5http://www.icab.de/blog/2011/10/17/elementfrompoint-under-ios-5/NSString* js [NSString stringWithFormat:elementFromViewportPoint(%f, %f).tagName, pt.x, pt.y];//privatefunction viewportCoordinateToDocumentCoordinate(x,y){var coord new Object();coord.x x window.pageXOffset;coord.y y window.pageYOffset;return coord;}//privatefunction elementFromPointIsUsingViewPortCoordinates(){if (window.pageYOffset 0){// page scrolled downreturn (window.document.elementFromPoint(0, window.pageYOffset window.innerHeight -1) null);}else if (window.pageXOffset 0){// page scrolled to the rightreturn (window.document.elementFromPoint(window.pageXOffset window.innerWidth -1, 0) null);}return false; // no scrolling, dont care}//publicfunction elementFromViewportPoint(x,y){if (elementFromPointIsUsingViewPortCoordinates()){return window.document.elementFromPoint(x,y);}else{var coord viewportCoordinateToDocumentCoordinate(x,y);return window.document.elementFromPoint(coord.x,coord.y);}}内容高度 int contentHeight[[webView_ stringByEvaluatingJavaScriptFromString:document.body.clientHeight] intValue];18.滚动到顶部[webView_ stringByEvaluatingJavaScriptFromString:window.scrollTo(0,0);];19.在UIGestureRecognizer的响应函数中调用打开一个有输入框的页面UIGestureRecognizer的响应中后续会让webview再次获得焦点从而使键盘隐藏。这样把事件放到shouldStartLoadWithRequest中来曲线解决问题。20. webapp是csshtml来描述的没办法简单的用name2x 解决问题继续求教中iphone4图片问题http://aralbalkan.com/3331在head中添加 meta nameviewport contentwidthdevice-width, initial-scale0.5, minimum-scale0.5, maximum-scaleyes /meta aligncenter nameviewport contentwidth480; initial-scale0.5; maximum-scale0.5; user-scalableno;/也可以控制页面的缩放但并不统一。为视网膜显示屏优化网页上的图片(via:http://xuui.net/ui-design/retinal-display-to-optimize-the-image-the-on-the-the-page.html).在网页中pixel 与 point 比值称为 device-pixel-ratio普通设备都是1iPhone 4是2有些Android机型是1.5。Detecting taps and events on UIWebView – The right wayhttp://mithin.in/2009/08/26/detecting-taps-and-events-on-uiwebview-the-right-way21.对UIWebView中的数据的网络请求js操作一定要放到webViewDidFinishLoad调用之后否则很可能出现找不到标签的异常问题。html模板中把要替换的内容放在div中不要放在p中否则不保证样式正常显示。22.在顶部向下拖动一段距离的事件UIScrollView* scrollView [webView_.subviews objectAtIndex:0];if (scrollView [scrollView isKindOfClass:[UIScrollView class]]){scrollView.delegate self;}- (void)scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate{CGPoint offset scrollView.contentOffset;NSLog(%,NSStringFromCGPoint(offset));if(offset.y-60.0){[super onNavigationBackPressed];}}23.webView_[[UIWebView alloc] initWithFrame:webRect];webView_.delegateself;webView_.dataDetectorTypes UIDataDetectorTypeNone;webView_.opaque NO; //背景透明webView_.backgroundColor[UIColor whiteColor];[self.view addSubview:webView_];self.view.backgroundColor[UIColor blackColor];//隐藏灰影for(UIView *v in [[[webView_ subviews] objectAtIndex:0] subviews]){if([v isKindOfClass:[UIImageView class]]){v.hidden YES;}}//拖动事件UIScrollView* scrollView [webView_.subviews objectAtIndex:0];if (scrollView [scrollView isKindOfClass:[UIScrollView class]]){scrollView.delegate self;}//圆角[[webView_ layer] setCornerRadius:10];[webView_ setClipsToBounds:YES];[[webView_ layer] setBorderColor:[[UIColor blackColor] CGColor]];//[[webView_ layer] setBorderWidth:2.75];[(UIScrollView *)[[webview subviews] objectAtIndex:0] setBounces:NO];24. 取得选中的内容给UIWebView增加类别- (NSString *)selectedText {return [self stringByEvaluatingJavaScriptFromString:window.getSelection().toString()];}25.iphone web框架iUi http://code.google.com/p/iui/ 它是一个javascript和css库用于在网页中模拟iphone的外观和感觉。虽然是专为iphone设计的UI,但在android上90%以上的功能是完全可以使用的因为android和iphone一样都是基于webkit浏览器的系统。iUI框架用Eclipse开发iOS Web应用程序http://www.61ic.com/Mobile/iPhone/201203/41389.html26.[iOS]给UIWebView头尾插入自定义Viewhttp://blog.cnbang.net/tech/1784/示例代码下载https://github.com/bang590/iOSPlayground/tree/master/TWebview11个基本的移动Web编程工具http://developer.51cto.com/art/201107/273822.htm27.iOS 5中safari带来的新特性http://www.qianduan.net/ios-5-brings-new-features-in-safari.html28.HTML5 Showcasehttp://www.apple.com/html5/showcase/typography/29.不用UIWebView辅助排版的困难表情图片混在文字中图片后加载大小不一使列表跳动预知图片尺寸或固定尺寸30.点击UIImageView打开键盘未测试http://android-zhang.iteye.com/blog/175856231.手机版网页的table优化处理 (未使用过)http://www.liubiao4123.com/table_mobile.html32.在UIWebView上追加菜单项http://blog.csdn.net/andyweike/article/details/606109633.关于UIWebView的那些事儿更新中http://www.lanou3g.com/blog/post-163.html34.使用base64http://iphoneincubator.com/blog/windows-views/display-images-in-uiwebview 未使用过h1stringByEvaluatingJavaScriptFromString/h1android平台中调用WebView控件的addJavascriptInterface()方法可以轻松完成很多交互在IOS中会困难复杂一些。h3主程序主动通知UIWebView/h3pre[webView stringByEvaluatingJavaScriptFromString:some js code];/preh3UIWebView主动通知主程序/h3UIWebView通过js设置document.location url; 会触发shouldStartLoadWithRequest接口被调用并且返回NO。url字符串格式可自定义把命令及参数封装到其中。h1通过js设置一些webkit属性/h1pre - (void)webViewDidFinishLoad:(UIWebView*)webView{//Disable user selection 禁用长按UIWebView时放大镜及选择功能[webView stringByEvaluatingJavaScriptFromString:document.documentElement.style.webkitUserSelectnone;];//Disable callout禁止长按链接弹出菜单默认带有打开拷贝取消3个菜单项。[webView stringByEvaluatingJavaScriptFromString:document.documentElement.style.webkitTouchCalloutnone;];//修改整个页面的字体大小[webView stringByEvaluatingJavaScriptFromString:document.getElementsByTagName(body)[0].style.webkitTextSizeAdjust 150%;];//修改点击链接时的高亮背景色[webView stringByEvaluatingJavaScriptFromString:document.documentElement.style.webkitTapHighlightColor#FF0000;];}/preh3嵌入在页面中 修改点击链接时的高亮背景色/h3lt;a style-webkit-tap-highlight-color: rgba(0,0,0,0); hrefhttp://yourlink.com/gt;更多参考webkit webApp 开发技术要点总结a hrefhttp://www.cnblogs.com/pifoo/archive/2011/05/28/webkit-webapp.htmlhttp://www.cnblogs.com/pifoo/archive/2011/05/28/webkit-webapp.html/ah1使用UIWebView显示svg、gif/h1SVGScalable Vector Graphics可缩放矢量图形是用XML描述二维矢量图形的一种图形格式。若使用img标签lt;img src gt;标签中src要带有.svg扩展名才可正常显示。preCGRect rect CGRectMake(0,0,1000,1000);webView [[UIWebView alloc] initWithFrame:rect];[webView loadData:svgData MIMEType:image/svgxml textEncodingName:UTF-8 baseURL:nil];[webView loadData:gifData MIMEType:image/gif textEncodingName:nil baseURL:nil];/preh1使用UIWebView显示本地html文件/h1h3显示安装包中的html文件/h3preNSString* pathInBundle[[NSBundle mainBundle] pathForResource:index ofType:html inDirectory:app-guide forLocalization:nil];[webView loadRequest:[NSURLRequest requestWithURL:[NSURL fileURLWithPath:pathInBundle]]];或者[webView_ loadHTMLString:htmlContent baseURL:[NSURL fileURLWithPath:[[NSBundle mainBundle] bundlePath]]]/pre这里的重点是使用loadRequest且使用fileURLWithPath而不是URLWithString。如果要显示一段html内容且其中有防盗链网络图片则需要修改baseURL为Referer地址例如pre[webView loadHTMLString:htmlContent baseURL:[NSURL URLWithString:http://a.cn]];/preh3动态设置img地址/h3preNSString* path[FileUtil getDocumentsFullPath:logo.png];NSString* path[[NSBundle mainBundle] pathForResource:logo ofType:png];path[NSString stringWithFormat:file://%,path]; //file后面是冒号加3个斜杠NSString* script[NSString stringWithFormat:setImgSrc(\%\);,path];[webView stringByEvaluatingJavaScriptFromString:script];/preh1NSHTTPCookieStorage/h1pre- (void)addCookies:(NSString *)domain withCookies:(NSArray *)cookieArray{NSHTTPCookie *cookie nil;NSDictionary *properties nil;NSString* cookieStr nil;for (int i0; ilt;[cookieArray count]; i){cookieStr [cookieArray objectAtIndex:i];NSRange range [cookieStr rangeOfString:];if(range.location ! NSNotFound){properties [NSDictionary dictionaryWithObjectsAndKeys:[cookieStr substringToIndex:range.location], NSHTTPCookieName,[cookieStr substringFromIndex:range.locationrange.length], NSHTTPCookieValue,/, NSHTTPCookiePath,domain, NSHTTPCookieDomain,nil];}cookie [NSHTTPCookie cookieWithProperties:properties];[[NSHTTPCookieStorage sharedHTTPCookieStorage] setCookie:cookie];}}- (void)clearCookies{NSHTTPCookie *cookie nil;NSHTTPCookieStorage *storage [NSHTTPCookieStorage sharedHTTPCookieStorage];for (cookie in [storage cookies]){[storage deleteCookie:cookie];}}/pre