PC端Web应用到手机端Web App转换的研究与实现
发布时间：2021-07-14 23:54
随着移动互联网的发展,各类移动设备层出不穷。移动设备的屏幕分辨率各式各样,和传统PC存在较大差别,这将导致用户在使用手机等移动终端访问传统互联网上Web网页时很难快速准确的获得有用的信息,因此如何使移动设备正常显示传统PC端网页资源成为研究热点。本论文主要针对Web应用的表现层即界面表现部分,研究并实现了PC端Web应用到手机端Web App转换,并使用某Web应用部分页面进行验证,主要工作内容如下：（一）研究移动终端分辨率等其他相关特征,根据现有Web网页资源特点,实现网页转码,使其适应移动终端的显示。此外,应用Android平台的WebView组件生成可供用户在移动端安装使用的WebApp,通过此App可以访问经转码后能在移动端友好显示的Web应用页面。（二）移动端原生App是基于某一具体的开发平台,定制开发的第三方应用程序,它和Web App在实现技术上有本质不同。因此,PC端的Web应用到手机端App转码方法的研究更具挑战性。本论文对PC端Web应用到手机端App的转换也做了相应的研究,并对其可行性进行了分析。（三）响应式Web设计是一种全新的Web设计思想,可以实现一次编写的...
【文章来源】：北京邮电大学北京市 211工程院校 教育部直属院校
【文章页数】：67 页
【学位级别】：硕士
【部分图文】：
Web App安装界面
以看出网页采用网格布局，有图片和文字。如果不对网页做任何处理直接缩小浏览器视口的大小，显示效果如图6-1所示。：二 a 纖科勒邊'i? C? (D ftle:///E:Aest/iy/setting.html 三：主in isa.系isisa ‘ “用户&权用&fte&取^ 产 S榜 o^： 色W3cKM.gr' ?分??g应的‘0亂 jpf]场 SOS*授 ttir ；?^^^新力 1 I挪模块 , Pr-^ -SSiJ￡i^ (宅BcS25'}ia_舰8 I i醒國挪或时目抵埋舶 ：5§*!述培户 —==>.，“￠:?楚理S匿 U .创淚KS。, ；SfiSt雜愁與他设gHiRepcdtSiSSS loqoiSM ?以场挪通设链W . 1 -?■_. ‘ ，* i _ ^1. ： ； -二 *‘ ^ *mammmamBSssaamrnKSBaaamma^mmmsBBBmrnsmmmsaBammmmmmm^^asmmmmmmmm图6-1原系统设计界面在视口缩小时显示效果由图6-1可以看到，如果不对网页做任何处理直接缩小浏览器的视口，浏览器会出现纵向和横向滚动条，用户通过拉动滚动条才能看到网页的全貌。网页明显不具有响应式的效果。如果采用响应式设计的技术对网页进行重新编码，可以从网页显示效果的变化体会到响应式设计的优势。随着不断改变浏览器视口的大小，网页的布局发生了变化。响应式网页的特性开始显现。当视口宽度小于768px时，页面布局将发生变化效果如图6-2所示。可以看到由于视口宽度变小
响应式网页的特性开始显现。当视口宽度小于768px时，页面布局将发生变化效果如图6-2所示。可以看到由于视口宽度变小，网页在横向上不能显示完全。此时网页布局发生了流动，之前不能显示的内容移动到了下方，页面在横向上不再出现滚动条。网页的整体显示效果并没有因为视口的减小而变得特别糟糕。整体来看，随着浏览器窗口的减小网页依然能够保持原有风格，用户依然能. 在有限的视口大小下浏览到网页的全部内容，这无疑将给用户带来很棒的用户体验。48
本文编号：3285151
【文章来源】：北京邮电大学北京市 211工程院校 教育部直属院校
【文章页数】：67 页
【学位级别】：硕士
【部分图文】：
Web App安装界面
以看出网页采用网格布局，有图片和文字。如果不对网页做任何处理直接缩小浏览器视口的大小，显示效果如图6-1所示。：二 a 纖科勒邊'i? C? (D ftle:///E:Aest/iy/setting.html 三：主in isa.系isisa ‘ “用户&权用&fte&取^ 产 S榜 o^： 色W3cKM.gr' ?分??g应的‘0亂 jpf]场 SOS*授 ttir ；?^^^新力 1 I挪模块 , Pr-^ -SSiJ￡i^ (宅BcS25'}ia_舰8 I i醒國挪或时目抵埋舶 ：5§*!述培户 —==>.，“￠:?楚理S匿 U .创淚KS。, ；SfiSt雜愁與他设gHiRepcdtSiSSS loqoiSM ?以场挪通设链W . 1 -?■_. ‘ ，* i _ ^1. ： ； -二 *‘ ^ *mammmamBSssaamrnKSBaaamma^mmmsBBBmrnsmmmsaBammmmmmm^^asmmmmmmmm图6-1原系统设计界面在视口缩小时显示效果由图6-1可以看到，如果不对网页做任何处理直接缩小浏览器的视口，浏览器会出现纵向和横向滚动条，用户通过拉动滚动条才能看到网页的全貌。网页明显不具有响应式的效果。如果采用响应式设计的技术对网页进行重新编码，可以从网页显示效果的变化体会到响应式设计的优势。随着不断改变浏览器视口的大小，网页的布局发生了变化。响应式网页的特性开始显现。当视口宽度小于768px时，页面布局将发生变化效果如图6-2所示。可以看到由于视口宽度变小
响应式网页的特性开始显现。当视口宽度小于768px时，页面布局将发生变化效果如图6-2所示。可以看到由于视口宽度变小，网页在横向上不能显示完全。此时网页布局发生了流动，之前不能显示的内容移动到了下方，页面在横向上不再出现滚动条。网页的整体显示效果并没有因为视口的减小而变得特别糟糕。整体来看，随着浏览器窗口的减小网页依然能够保持原有风格，用户依然能. 在有限的视口大小下浏览到网页的全部内容，这无疑将给用户带来很棒的用户体验。48
本文编号：3285151
本文链接：https://www.wllwen.com/guanlilunwen/ydhl/3285151.html
