自从WKWebView出来以后UIWebView逐渐的被开发者们冷落,正所谓一代新人换旧人嘛。当然WKWebView相较于UIWebView来说,在性能、稳定性、功能等方面有很大的提升,最直接的体现就是加载网页时占用的内存。但是今天的主角是UIWebView,接下来让我们进入正题。
由于公司的产品需求,先前用原生写的富文本编辑器已经满足不了产品经理的“野心”了(先前的富文本编辑只支持文本和图片混合)。于是公司决定在项目加入类似简书这样的文本编辑器,为用户提供多元化的文本编辑体验(当然,功能没有简书那般强大)。由于页面比较单一,我便试着用UIWebView和JavaScript共同完成这一任务。
如图1,键盘上的那些编辑样式的按钮是原生的,下面的页面布局是一个web界面,话不多说直接上代码。
1.初始化web如图二
2.根据UIWebViewDelegate的一个重要的代理方法webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType来接受并处理web界面传来的消息。这个代理的字面意思是将要进行request请求,即当web页面的跳转链接发生变化时,这个方法便会被触发。我们可以利用这一特性在JavaScript中加入方法,每当触发不同的时间时,我们传入不同的跳转链接;然后在代理方法中根据接收到的链接做出相应的响应如图3、4
4.因为我们做的是文本编辑器,当本地改变一些文本属性时,就需要向web页面传递消息,令其发生变化。这时候我们可以用UIWebView的一个非常重要的交互方法
其中的script参数就是JavaScript文件中的方法名,类似图3中的“RE.titleCallback”
至此,简单的页面交互就完成了
效果如下