Hybrid-iOS『下拉显示网页来源特性的添加』

『下拉显示网页来源』的实现

在最开始先简单介绍一下该效果的实现方式。

这个功能我们在微信中打开链接时、一些手机浏览器中会经常看到，效果如下图：

下拉显示网页来源

• UI实现

  在做之前查了一下实现方式，常见的一种是将Webview的背景色设为透明，在Webview下层添加一个同样大小的View，用此View的背景色来模拟Webview背景色，在这个View层上贴一个Label用于显示文字。这样在Webview向下滑动时，就会露出后面的网页来源文字。

  上面的方法比较直观，但是比较繁琐。我们知道UIWebView对象有一个属性是scrollView，所以可以这样来实现:使用insertSubview方法，在scrollView下面插入一个UILabel。即可实现和上面一样的效果。

  UIWebView *webview = [[UIWebView alloc] init];
  UILabel *label = [[UILabel alloc] init];
  [webview insertSubview:label belowSubview:webview.scrollView];
  

• 来源文本加载

  显示的文本我们一般都会只截取URL的host部分。这里可以使用webview的URL中host部分。

  label.text = webview.request.URL.host;
  

  文本的加载时机一般选择在webview的request加载完成之后。注意对URL字符串进行空判断，如果此时URL为空，则不为文本赋值，也就是此时不显示label。

为Hybrid框架添加此特性

功能实现之后，就开始重点了，为框架添加此特性。也就是前端在进行Hybrid App开发时，可以通过Schema或者插件Plugin的方式，对自己的Webview设置是否下拉显示来源。

关于Hybrid入门这里有一篇文章，大家可以先阅读一下。Hybrid入门。

实现方式是在Webview的基类中暴露一个属性，通过调用该属性对应的setter，来对是否显示进行调整。

关于这部分，我总结了以下几点收获。

• 使用枚举类型表示选项、状态、状态码

  这是我在《Effective Objective-C 2.0》中读到过的一个建议，顺便向大家推荐一下这本书，书中讲到的52个方法对于我们培养良好的iOS编码习惯有很大的帮助。

  在对是否显示此特性进行设置时，我们会用到一些状态码。

  typedef NS_ENUM(NSInteger, WebSourceShowSate)
  {
      WebSourceShowSateNo = 1,
      WebSourceShowSateYes = 2
  };
  

  使用枚举类型的状态码，我们可以通过代码很直观地表示状态。

  关于iOS枚举类型的学习，大家可以看这篇 iOS枚举应用。

• 框架接口设计时，尽量不对外暴露UI相关属性

  我们在对框架的接口进行设计时，应该努力追求直观、清晰，尽量少暴露内部实现细节。努力让使用者只需关注最简单最直观的内容。所以在这个特性中，我们可以选择将一个上述的状态码或者BOOL类型的属性暴露出来，而非将显示文本的Label对外暴露。

  ​

• 框架接口设计时，单个参数暴露为属性，多个参数暴露为方法

  在接口中提供对单个的参数进行设置时，将其设置为属性，使用该属性的setter。

  提供对多个参数同时设置时，暴露一个带多个参数的方法。

  ​

• 利用属性的setter完成一些操作

  有时候，我们可以通过重写属性的setter，在setter中加入一些操作，使得这些操作能在合适的时机进行。比如本例中，

  • 在Webview实例化之前，想要对此刻还未实例化的Label是否显示进行设置。我们就可以在webview所在类中添加一个标记Label是否进行显示的参数属性。在webview实例化之前，调用该参数属性的setter对其进行赋值，然后在webview的初始化部分对该属性值进行检查，作相应的设置。
  • 在Webview实例化之后，想要在框架接口中，提供对已经实例化的Label是否显示进行设置。我们可以利用前文讲到过的暴露出来的状态码或BOOL型属性，重写该属性的setter，然后在该方法中加入对Label是否显示进行设置的代码。这样就可以在对该状态码赋值的同时，完成相关的UI更新。