wap2app优化UI展现

流应用类似原生体验，因此首先要求wap站的UI风格是App化的，在下图示例中，
左侧为超链接方式的M站，右侧是app风格的M站

wap2app优化UI展现，主要分为几大类，本文逐个说明。

去wap化展现

wap2app需要将一些明显带有wap特征的元素给去掉，主要包括：

• 顶部导航条（标题栏）：因为wap2app默认使用原生导航条，若不去除，会显示双标题；
• 原生App下载引导：包括下载banner、仅原生App才支持的业务，流应用是一种独立的发行模式，不允许给原生导流，否则无法通过上线审核；
• PC/mobile版本切换链接
• 版权信息：包括icp备案及版权说明等

优化方案参考如何在流应用环境下去wap化展现

图片全屏预览

wap2app框架支持将页面图片全屏展示，全屏后支持双指缩放；在 sitemap.json 中，配置目标 webview->easyConfig->previewImage 节点。

{  
  "webviewId": "detail",  
  "easyConfig": {  
    "previewImage": [  
      {  
        "gallerySelector": "#slider", //图片组父容器选择器  
        "imageSelector": "img", //图片img节点的选择器  
        "loop": true, //是否支持循环预览  
        "indicator": "number" //图片指示器样式  
      }  
    ]  
  }  
}

下拉刷新

下拉刷新在App中是普遍需求，但鉴于性能体验，很多M站不支持下拉刷新；wap2app弥补了这块缺陷，可通过简单配置，实现原生下拉刷新，如下为刷新效果：

wap2app可通过 webview -> webviewParameter -> pullToRefresh -> support 节点配置当前webview是否启用下拉刷新，默认为不启用；如下为示例代码：

{  
  "webviewId": "pullToRefresh",  
  "webviewParameter": {  
    "pullToRefresh": {  
      "support": true  
    }  
  }  
}