WebView的应用

最新推荐文章于 2024-01-26 17:26:07 发布
最新推荐文章于 2024-01-26 17:26:07 发布
阅读量816 收藏
点赞数
分类专栏： iphone开发 文章标签： html class components string image function
原文地址：WebView的应用 作者：林肯公园
webview是一个强大的控件，在它的上面几乎可以实现所有的功能，尤其是html5的到来，把它的引用推向了高潮，下面我就浅谈一下我对其使用的一些小小的心得。
在做应用的过程中很多都需要用网页来排版和使用，比如：看新闻的界面。于是就用到了前端的技术－写html文本。
总结一下：在程序中使用html文本有两种形式:
1、把写好的文件引入到程序中来。
比如有一个你写好的html文本，通过如下代码就可以引入：

 

NSArray *paths = NSSearchPathForDirectoriesInDomains(NSDocumentDirectory, NSUserDomainMask, YES);

NSString *documentsDirectory = [paths objectAtIndex:0];    

NSString *path = [documentsDirectory stringByAppendingPathComponent:docName];    

NSURL *url = [NSURL fileURLWithPath:path];

NSURLRequest *request = [NSURLRequest requestWithURL:url];


 

self.myWebView.scalesPageToFit = YES;

[self.myWebView loadRequest:request];

 



或者

 

 

NSString *filePath = [[NSBundle mainBundle] pathForResource:@"238" ofType:@"html"]; 

NSString *file = [[NSString alloc] initWithContentsOfFile:filePath];



字符串file下就可以得到html文本下面所有的html内容。


2、在程序中写html语言。


如果你觉得上面操作后你的网页内容没有写完，那么你可以在file下继续写html语言，如一下代码。


[htmlStr appendString:file];

 

[htmlStr appendString:@"<script language="javascript">document.ontouchstart=function(e){if(e.targetTouches.length == 20){alert('ss')};  }; document.ontouchend=function(){ document.location="myweb:touch:end";  };

document.ontouchmove=function(){if(document.targetTouches.length === 2){ document.location="myweb:touch:move"};}  </script>"];

NSString *string1 = [[NSString alloc] initWithFormat:@"<style> body {margin:0 auto;width:%dpx; padding:0; background: #ffffff}",webViewWidth];

[htmlStr appendString:string1];

[string1 release];

[htmlStr appendString:@".main{padding:8px;word-wrap:break-word; position:relative}"];

[htmlStr appendString:@"p{ padding:0; margin:0}"];

[htmlStr appendString:@".father {width:83px;height:34px;margin:5px 10px 20px 10px;}"];


[htmlStr appendString:@".img {width:30px;height:30px;margin:auto 10px auto 20px;}"];

[htmlStr appendString:@".father p {font-size:13px;color:#14357A;line-height:40px;text-align:center;}"];

[htmlStr appendString:@".comment {width:80px;height:33px;margin:auto auto auto auto}"];

 

[htmlStr appendString:@".father p a {color:#14357A;}"];

[htmlStr appendString:@"a {text-decoration:none;}"];

 

[htmlStr appendString:@".t1{ text-align:center; font-size:19px; color:#134bb0; padding:5px 0}"];

[htmlStr appendString:@".t2{ text-align:center; font-size:14px; color:#666; padding-bottom:2px}"];

[htmlStr appendString:@".t3{ text-align:center; font-size:14px; color:#666; padding-bottom:5px}"];

[htmlStr appendString:@".zhengwen{border:0px solid red;color:#343434;font-size:"];

NSString *string2 = [[NSString alloc]initWithFormat:@"%dpx}",fontSize];

[htmlStr appendString:string2];

[string2 release];

[htmlStr appendString:@".zhengwen p{ text-indent:2em; line-height:1.4em; padding-bottom:0.7em}"];

[htmlStr appendString:@".pic{float:right;padding:0px 9px;position:relative;}"];


[htmlStr appendString:@".small {position:absolute;bottom:-10px;right:0;width:24px;height:25px;}"];

 

[htmlStr appendString:@".small_loading {position:absolute;bottom:-10px;right:0;width:24px;height:25px;}"];

 

[htmlStr appendString:@"</style><meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" /></head><body><div class="main">"];

 

[htmlStr appendString:[NSString stringWithFormat:@"<p class="t1">%@</p>",(NSString*)[userDataobjectForKey:@"title"]]];

NSDate *today = [NSDate dateWithNaturalLanguageString:(NSString*)[userDataobjectForKey:@"pubDate"]];

today = [today dateByAddingTimeInterval:28800];

//[TEXTLABEL_NEWSTIME setText:[[today description]substringToIndex:20]];

[htmlStr appendString:[NSString stringWithFormat:@"<p class="t2">%@</p>",[[todaydescription]substringToIndex:16]]];

[htmlStr appendString:[NSString stringWithFormat:@"<p class="t3">来源：%@</p>",[userDataobjectForKey:@"source"]]];

 

if (url) 

{

NSString *pic_html = [NSString stringWithFormat:@"<div class="pic">

  <div id="img_loading"><img  src="page_pic_loading.png" />

  <a href="refresh://"><img src="zoom.png" class="small_loading" /></div>

  <a href="Image://"><img id="img" οnlοad='javascript:document.getElementByIdx_x("img_loading").style.display="none";document.getElementByIdx_x("zoom").style.display="block";'

  img_loading").style.display="none";'

  src="%@" /></a>

  <a href="Image://"><img id="zoom" style="display:none" src="zoom.png" class = "small"/></a>

  </div>",url];

[htmlStr appendString:pic_html];

}

[htmlStr appendString:[NSString stringWithFormat:@"<div class="zhengwen">"]];

[htmlStr appendString:[NSString stringWithFormat:@"<P>%@",[(NSString*)[userDataobjectForKey:@"description"]stringByReplacingOccurrencesOfString:@"<br/>" withString:@"</p><p>"]]];

[htmlStr appendString:[NSString stringWithFormat:@"</div></body></html>"]];
通过以上的代码最终写完的html语言的完整字符串就在htmlStr下了，只要让webview去显示它就好了，代码如下：
[_webView loadHTMLString:htmlStr baseURL:[NSURL fileURLWithPath:[[NSBundle mainBundle]bundlePath]]];

通过上面两个任意的方法都可以显示出你所写的html语言样式了。

当然我们可以通过程序使网页调用js：

NSMutableString *stringMore = [[NSMutableString alloc] init];

NSString *js = @"";

if (requestFailed == YES) 

{

[stringMore appendFormat:@"<div></div>"];

js = [NSStringstringWithFormat:@"document.getElementByIdx_x('clear').innerHTML='%@';",stringMore];

}

else 

{

 

[stringMore appendString:@"<div class="comment"><p><a href="comment://">"];

[stringMore appendFormat:@"%@",userReviewCount];

[stringMore appendString:@"条评论</a></p></div>"];

js = [NSStringstringWithFormat:@"document.getElementByIdx_x('comment').innerHTML='%@';",stringMore];

}

[stringMore release];

[_webView stringByEvaluatingJavaScriptFromString:js];


以上的js代码的意思就使在标签comment下加入stringMore的代码。


webview还有一个应用就是点击一个链接可以调用本地的函数方法：


- (BOOL)webView:(UIWebView *)webView 

shouldStartLoadWithRequest:(NSURLRequest *)request 

 navigationType:(UIWebViewNavigationType)navigationType

{

if ([[[request URL]absoluteString]hasPrefix:@"Image://"]) 

{

NSString *imgUrl = [self getBigImageURL];

 

MyPhotoFadeView *_photoFadeView = [[MyPhotoFadeView alloc] initWithUrl:imgUrl];

_photoFadeView.alpha = 0.0;

[UIView beginAnimations:nil context:nil];

[UIView setAnimationDuration:0.5];

_photoFadeView.alpha = 1.0;

[self.view addSubview:_photoFadeView];

self.photoFadeView = _photoFadeView;

[_photoFadeView release];

[UIView commitAnimations];

 

return NO;

}

if ([[[request URL]absoluteString]hasPrefix:@"comment://"]) 

{

[self openReviewInfo];

}

if ([[[request URL]absoluteString]hasPrefix:@"refresh://"]) 

{

[self getReviewCount];

[self setHtmlPageContent];

}

[m_activityIndicatorView stopAnimating];

 

NSString *requestString = [[request URL] absoluteString];

    NSArray *components = [requestString componentsSeparatedByString:@":"];

    if ([components count] > 1 && [(NSString *)[components objectAtIndex:0] 

  isEqualToString:@"myweb"]) {

        if([(NSString *)[components objectAtIndex:1] isEqualToString:@"touch"]) 

        {

           // NSLog(@"%@",[components objectAtIndex:2]);

        }

        return NO;

    }

return YES;

}


以上使用的使webview的一个代理方法：
代码的意思就点击的url链接分别是：image:// comment:// refersh:// 的时候分别响应其对应的方法。

这样webview的应用就差不多了吧！

再分享一下webview的一些小技巧吧！
1、获取html里的title。

self.title = [_webView stringByEvaluatingJavaScriptFromString:@"document.title"];

zengconggen
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
webview最全面总结（二）全面介绍webview用法
bg22223的博客
05-05 2562
webview的设置 WebSettings webSettings = webview.getSettings(); //支持js事件 webSettings.setJavaScriptEnabled(true); /* 设置为true表示支持使用js打开新的窗口 */ webSettings.setJavaScriptCanOpenWindowsAutomatically(true); /* 设置为使用webview推荐的窗口 */ webSettings.setUseWideViewPort(tru
WebView详解
xiafangxingg的博客
12-09 367
WebView加载网页 mWebView.loadUrl("http://www.baidu.com"); //加载本地assets目录下的网页 mWebView.loadUrl("file:///android_asset/demo.html")； WebView基本设置 WebSettings settings = mWebView.getSettings(); settings.setBu
每天记录学习的新知识 ：WebView介绍以及基本使用和方法
嗯...
04-04 2309
1.简介： Webview 是一个基于webkit引擎，可以解析DOM 元素，展示html页面的控件。 在Android 中，WebView低版本 不管是ios还是安卓，自带浏览器底层都是基于webkit 2.调用： 添加权限 <uses-permission android:name="android.permission.INTERNET"/> WebActivity p...
androidX WebView 报错
weixin_45376829的博客
12-18 1406
androidX WebView 报错 今天遇到一个WebView 错误 日志指出 在MainActivity oncreate方法中的setContentView(R.layout.activity_main...
使用 AndroidX 增强 WebView 的能力 | 开发者说·DTalk
Android开发者
01-12 437
本文原作者：Qinglin，原文发布于：简绘Android在应用开发过程中，为了在多个平台上保持一致的用户体验和提高开发效率，许多应用选择使用 H5 技术。在 Android 平台上，通常使用 WebView 组件来承载 H5 内容以供展示。WebView 存在的问题自 Android Lollipop 起，WebView 组件的升级已经独立于 Android 平台。然而，控制 WebView 的...
xweb笔记
最新发布
JackBoy的博客
01-26 297
【代码】xweb笔记。
WebView应用实例
12-26
【WebView应用实例】深入解析 在移动开发领域，WebView是一个重要的组件，它允许开发者在原生应用程序中嵌入网页内容，实现与Web的交互。在Android平台上，WebView是Android SDK的一部分，提供了在本地应用中展示...
Android WebView 应用界面开发教程
09-01
在Android应用开发中，WebView是一个非常重要的组件，它允许开发者在应用程序内部展示网页内容，无需启动外部浏览器。WebView实质上是一个内置的轻量级浏览器引擎，使得开发者能够将Web技术与原生Android应用无缝...
ExOS：具有下载功能的Android WebView应用程序
02-09
ExOS WebView应用可能就是为了让ExOS用户在使用ROM时获得更佳的网页浏览体验。 **4. 下载管理** 在ExOS应用中，集成的下载功能意味着用户可以直接在应用内下载网页上的文件，而无需借助第三方下载工具。这可能涉及...
通过命令行自动打包生成单webview应用
06-19
通过命令行自动打包生成单webview应用。 基本原理先建好一个基本的android单webview应用的项目，就是那种一打开就显示webivew的简单项目，将这个项目作为模板项目。然后在这个项目的build.gradle中定义一个task，这...
XWebView：适用于iOS的可扩展WebView（基于WKWebView）
02-06
XWebView-适用于iOS的可扩展WebView 介绍 XWebView是可扩展的WebView，它建立在之上， 是在iOS 8.0中首次亮相的现代WebKit框架。 它提供了经过精心设计的插件API的快速Web运行时，用于开发复杂的iOS本机或混合应用程序。 用Objective-C或Swift编程语言编写的插件可以在JavaScript上下文中自动公开。 借助插件提供的功能，Web应用程序的外观和行为可以像本机应用程序一样。 他们将不再是iOS平台上的二流公民。 样例项目 有关如何使用XWebView（包括Swift和JavaScript代码）的完整示例，请参见 。 产品特点 基本上
解决connect微信的webview失败的问题
antintheway的博客
04-24 829
一，背景 web页面会在微信中运行。由于UI自动化的需要，需连接微信下的webView页面 二，过程 通过appium连接，可通过inspector与android的native交互，但微信访问web页面后，再用inspector获取页面，inspect可以检测到页面的context了，可一切换就报错，提示chromedriver版本不匹配。 appium 中的chromedriver版本 与 微信内嵌的chrome版本不对应 ？ 查看appium的详细日志可知： 目标chrome版本是v86.0.42
webview详解
zzz_zlp的博客
12-08 9224
一、基础知识 1、webview入门知识 1.我们通常是用浏览器来浏览网页，你很清楚的知道你正在使用浏览器，要么是PC客户端，要么是手机上的app。但是webview是一个嵌入式的浏览器，是嵌入在原生应用中的，你可能都意识不到你在用浏览器。 2.传统浏览器分为两个部分，UI(地址栏、导航栏)和浏览器引擎。webview就是原生应用中的浏览器引擎。 3.webview只是一个可视化的组件，是作为原生APP的视觉部分。 4.用webview展示的内容是不需要存储在本地的，可以直接从服务器获取。 5.这种灵活性打
WebView-WebView简介
牛八少爷的专栏
07-24 1292
目录 1 WebView简介 2 Webkit简介 3 常用类 3.1 WebView 3.2 WebSetting 3.3 WebViewClient详解 3.4 WebChromeClient详解 4 调用Browser 4.1 启动android默认浏览器 4.2 启动指定浏览器打开 5 WebView加载方式 6 WebView的状态 7 WebView常用函数 ...
Android 抛弃原生WebView，使用腾讯X5内核、并加入广告拦截。
热门推荐
WL-鬼
04-23 4万+
大家都不知道原生的WebView 存在各种坑。各种适配问题。 最近在使用，总会出现DNS被拦截的情况。预览了各个大神的论坛与博客。 发现可以更改WebView内核。找到了比较火的两个。 分别是：腾讯X5内核 和 crosswalk crosswalk : 据说很强大，但缺点就是会让你的APK包增大很多。（我还没试过，都是看大神们的博客说的） 大家可以参考这篇......
AndroidStudio之WebView详解
qq_45482477的博客
11-30 4195
WebView 简介: WebView是一个基于webkit引擎、展现web页面的控件。 Android的Webview在低版本和高版本采用了不同的webkit版本内核，4.4后直接使用了Chrome。 作用： 1、 显示和渲染Web页面 2、 直接使用html文件（网络上或本地assets中）作布局 3、 可和JavaScript交互调用 使用介绍： 一般来说Webview可单独使用，可联合其子类一起使用： 1、 Webview自身的常见方法； 2、 Webview的最常用的子类（WebSetting
微信html5上传图片闪退,小程序webview上传图片出现闪退
weixin_34175978的博客
06-10 1239
问题描述：用户上传照片，点击上传，图片没有正确上传，小程序webview页面刷新(类似闪退重启，用户区分不了闪退和刷新的概念)并跳转到webview首页。问题页面：小程序webview内嵌h5页面，h5页面中上传图片微信日志：本用户已经上传微信日志，上传日志时间：2020-02-23 13:45微信号：wxid_0gsaq3pq1Irv11UA：Mozilla/5.0 (Linux; Androi...
腾讯浏览器（X5WebView的使用）
EUEH的博客
03-01 1万+
我们在使用Android原生WebView的时候总会遇到各种各样的兼容性问题，比如----遇到&lt;iframe&gt;标签引入的视频链接的时候，发现无法全屏观看，这个时候就需要使用X5WebView了，还可以进行小窗播放。本文Demo地址：http://download.csdn.net/download/eueheuen/10265354GitHub地址：https://github.co...
Xamarin.Forms——WebView技术研究
weixin_33892359的博客
03-13 530
在Xamarin中有一些Forms原生不太好实现的内容可以考虑使用HTML、Javascript、CSS那一套前端技术来实现，使用WebView来承载显示本地或网络上的HTML文件。不像OpenUri方法，不是将用户带到设备中的本地浏览器里去，而是用WebView直接在App内部显示HTML内容。 该文档由下面几节内容组成： 内容（Content）——WebView支持各种内容元素，包括嵌入式H...
Android WebView应用开发：加载网页与交互指南
通过以上知识点，开发者可以掌握基本的Android WebView应用界面开发，进一步结合现代Web技术，可以构建出更加丰富、功能强大的混合应用。在实际开发中，应根据项目需求灵活运用这些功能，并关注WebView的更新和安全...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值