移动端Web应用界面构建方法、Web应用界面及其操作方法技术

技术编号:24352342 阅读:56 留言:0更新日期:2020-06-03 01:51
本发明专利技术公开了一种用于构建移动端Web应用界面的方法,包括:基于单页应用页面框架,对当前站点网页进行整体界面框架布局,得到含有所有子页面界面框架布局信息的网站单页面应用架构,子页面为单页的层;利用预设的站点界面元素布局和子页面访问逻辑,分别对网站单页面应用架构进行内容布局和子页面间跳转布局,得到网站单页应用逻辑内容;构建用于标记转场前后子网页面位置的无限递推页面访问模型,并将其写入网站单页应用逻辑内容中,得到网站单页面应用的界面内容。本发明专利技术提高了移动端Web应用的页面加载速度,降低了开发成本,缩减了Web应用的开发周期,使得界面切换更流畅。

Construction method, web application interface and operation method of mobile web application interface

【技术实现步骤摘要】
移动端Web应用界面构建方法、Web应用界面及其操作方法
本专利技术涉及信息
,尤其是涉及一种基于移动设备浏览器的Web应用界面构建方法、Web应用界面及其操作方法。
技术介绍
目前,移动端应用软件APP开发有两个主流的方向:原生App以及移动WebApp。原生App开发成本大,需要针对不同的操作系统开发不同的APP,并且需要下载安装,更新维护不方便,但原生App界面切换流畅,用户使用体验好。WebApp开发成本低,无需下载且跨平台,维护更新方便,但WebApp用户体验不太好,具体体现在加载页面、界面切换、操作的流畅度、程序的执行效率等几方面,与原生APP都有较大的差距。现有技术中的WebApp开发,主要基于HTML5(以下简称H5)技术,H5技术框架因具备统一丰富的标签体系、多设备跨平台、自适应网页设计等特点,对开发移动端APP具有独特的技术优势,这也是WebApp比较原生App具有开发成本低、无需下载且跨平台、容易维护更新的原因所在。但WebApp具备的缺点也尤其明显,主要是页面加载慢、界面切换不流畅等两方面问题,导致用户体验不好,如本文档来自技高网...

【技术保护点】
1.一种用于构建移动端Web应用界面的方法,其特征在于,包括:/n架构生成步骤、基于单页应用页面框架,对当前站点网页进行整体界面框架布局,得到含有所有子页面界面框架布局信息的网站单页面应用架构,所述子页面为单页的层;/n内容生成步骤、利用预设的站点界面元素布局和子页面访问逻辑,分别对所述网站单页面应用架构进行内容布局和子页面间跳转布局,得到网站单页应用逻辑内容;/n界面生成步骤、构建用于标记转场前后子网页面位置的无限递推页面访问模型,并将其写入所述网站单页应用逻辑内容中,得到网站单页面应用的界面内容。/n

【技术特征摘要】
1.一种用于构建移动端Web应用界面的方法,其特征在于,包括:
架构生成步骤、基于单页应用页面框架,对当前站点网页进行整体界面框架布局,得到含有所有子页面界面框架布局信息的网站单页面应用架构,所述子页面为单页的层;
内容生成步骤、利用预设的站点界面元素布局和子页面访问逻辑,分别对所述网站单页面应用架构进行内容布局和子页面间跳转布局,得到网站单页应用逻辑内容;
界面生成步骤、构建用于标记转场前后子网页面位置的无限递推页面访问模型,并将其写入所述网站单页应用逻辑内容中,得到网站单页面应用的界面内容。


2.根据权利要求1所述的方法,其特征在于,所述架构生成步骤,包括:
根据所述当前站点网页的脚本文档,对所述当前站点网页内所有子页面进行功能分类,将功能分类结果编辑到所述单页应用页面框架中,构建页面应用主架构;
在所述页面应用主架构中,对每个所述子页面进行命名处理,并根据所述当前站点网页的CSS信息对各子页面的样式进行封装处理,完成各子页面主架构的构建;
对每个子页面主架构进行布局测试,并形成相应的功能模块,从而形成为所述网站单页面应用架构。


3.根据权利要求2所述的方法,其特征在于,
所述功能包括:定义新子页面类、定义页面转场类、打开新子页面类和返回调用页面类;
所述命名处理包括:子页面命名、页面布局类命名和页面功能方法类命名。


4.根据权利要求2或3所述的方法,其特征在于,所述内容生成步骤,包括:
将完成各子页面主架构构建处理的所述页面应用主架构进行程序化逻辑编辑处理;
对每个子页面涉及的所述功能进行定义,并将所述站点界面元素布局写入逻辑编辑处理结果内的相应子页面位置处,得到子页面具体布局内容;
建立每个子页面的句柄,在所述子页面具体布局内容中,对所述子页面访问逻辑进行编码,得到所述网站单页应用逻辑内容,其中,不同子页...

【专利技术属性】
技术研发人员:苗润莲毛维娜毛卫南范立焱呂佳途谢志虎
申请(专利权)人:北京市科学技术情报研究所
类型:发明
国别省市:北京;11

网友询问留言 已有0条评论
  • 还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。

1