基于WebView的Responsive Web Design技术跨平台应用设计与实现.pdfVIP

基于WebView的ResponsiveWebDesign

技术跨平台应用设计与实现

摘 要：为解决同一移动应用App在不同移动终端因为显示性能的不同而带给用户过大的体验差异，在不影响应用开发

效率的前提下，本文利用基于WebView组件的封装技术，结合自适应网页设计技术，既可以提高应用开发及维护升级的周期

和效率，节约开发成本，同时又能自适应不同终端设备的参数差异，给用户提供良好的视觉体验。

关键词：网页视图；响应式网页设计；自适应；跨平台

CrossPlatformDesignandImplementationofResponsiveWebDesign

TechnologyBasedonWebView

【Abstract】：Inordertosatisfyboththeefficiencyofdevelopmentandthelargedifferenceinuserexperience

broughtbymobileterminalswithdifferentAppofdisplaying-performances,thispaperusestheencapsulation

technologybasedontheWebViewcomponent,combinedwiththeresponsivewebdesign,toimprovethe

applicationthecycleandefficiencyofdevelopment,maintenanceandupgradingsavedevelopmentcosts,andat

thesametime,itcanadapttotheparameterdifferencesofdifferentterminaldevicestoprovideuserswithagood

visualexperience.

【Keywords】：WebView;responsivewebdesign;self-adaption;cross-platform

0引言用App独立于运行环境，通过唤醒手机上的Web浏

随着iOS、Android和WindowsPhone等手机移览器来实现其内的应用功能显然是不明智的。因此，在

动平台的迅速发展，开发基于这些平台的手机应用AppWebKit框架下封装其派生组件WebView[2]，将更多样

成为程序开发的新热潮之一。与此同时，跨平台Web式丰富的Web内容集成到应用程序的原生内容中，是

技术的应用在移动互联网领域引起了极大的关注，Web基于Web技术的移动应用开发的大势所趋。

技术所特有的“一次编写，到处运行”很大程度上缩为适应这一趋势，以PhoneGap为例的移动开发平

短了跨平台开发时间，提高了应用开发的效率，但其缺台应运而生[3]。这类移动应用App的快速开发平台都是

点也是显而易见的，即对移动平台浏览器的依赖性太以WebView组件为基础，可以实现任何原生设备特性

强[1]，仅能基于浏览器完成一些简单的基础功能，而无的扩展，开发者只需使用简单的Web技术(如HTML、

法直接调用手机本地操作系统提供的功能和接口。就目CSS和JavaScript）便可获得移动设备的原生特性，如

前的技术发展现状而言，基于Web技术实现的移动应摄像头、加速器、指南针等。之后再通过PhoneGap之

用必须要有一个运行环境，而让终端设备上的移动应类的工具打包App，这样仅编写一次基础代码就可以将

龙辉