CN108132783A - 一种Web App的配置方法及装置 - Google Patents
一种Web App的配置方法及装置 Download PDFInfo
- Publication number
- CN108132783A CN108132783A CN201611085145.1A CN201611085145A CN108132783A CN 108132783 A CN108132783 A CN 108132783A CN 201611085145 A CN201611085145 A CN 201611085145A CN 108132783 A CN108132783 A CN 108132783A
- Authority
- CN
- China
- Prior art keywords
- single table
- list file
- library
- web page
- design
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Pending
Links
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F8/00—Arrangements for software engineering
- G06F8/30—Creation or generation of source code
- G06F8/38—Creation or generation of source code for implementing user interfaces
Landscapes
- Engineering & Computer Science (AREA)
- Software Systems (AREA)
- General Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- Human Computer Interaction (AREA)
- Physics & Mathematics (AREA)
- General Physics & Mathematics (AREA)
- Stored Programmes (AREA)
Abstract
本发明公开了一种Web App的配置方法及装置，该配置方法包括设计步骤及运行步骤，所述设计步骤包括步骤：S11、拖动控件库中的控件至单表设计器中，以配置Web页面的布局及样式设计；S12、通过规则设计器配置所述Web页面的功能设计；S13、依据所配置的Web页面生成单表模板，并通过JSON格式将所述单表模板保存在数据库中；所述运行步骤包括步骤：S21、依据所述单表模板生成单表文件；S22、将所述单表文件与单表解析器打包至前端设备；S23、于所述前端设备中依据所打包的单表文件与单表解析器生成前端Web页面。该发明的有益效果为：极大提高简单Web App的开发效率；解决了App的跨平台运行，降低软件开发的入门门槛，节约开发成本。
Description
技术领域
本发明涉及网页开发技术领域，尤其涉及一种Web App的配置方法及装置。
背景技术
在软件开发过程中，在实现某些简单功能的时候往往需要编写大量的代码，并且软件开发都需要开发者具有相当程度的技术水平。这就导致了软件开发这个行业的入门门槛较高，同时也增加了企业的开发成本。因此现有技术以写代码的形式实现App的开发的方式存在以下缺点：
(1)技术要求高，开发效率较低；
(2)开发成本高。
发明内容
本发明要解决的技术问题在于，针对上述现有技术中技术要求高、开发效率较低、开发成本高的问题，提供一种Web App的配置方法及装置。
本发明解决其技术问题所采用的技术方案是：
构造一种Web App的配置方法，包括设计步骤及运行步骤；
所述设计步骤包括步骤：
S11、拖动控件库中的控件至单表设计器中，以配置Web页面的布局及样式设计；
S12、通过规则设计器配置所述Web页面的功能设计；
S13、依据所配置的Web页面生成单表模板，并通过JSON格式将所述单表模板保存在数据库中；
所述运行步骤包括步骤：
S21、依据所述单表模板生成单表文件；
S22、将所述单表文件与单表解析器打包至前端设备；
S23、于所述前端设备中依据所打包的单表文件与单表解析器生成前端Web页面。
在本发明所述的配置方法中，所述步骤S11包括以下子步骤：
S111、所述单表设计器通过HTML5页面配置UI；
S112、所述单表设计器通过设计逻辑控制处理器对所述HTML5页面进行处理；
S113、所述单表设计器通过zebra框架及App组件设计控件。
在本发明所述的配置方法中，所述单表设计器包括控件、规则及函数。
在本发明所述的配置方法中，所述步骤S22包括子步骤：
S221、将所述单表文件转换为JSON格式；
S222、将JSON格式的单表文件与单表解析器打包至前端设备。
在本发明所述的配置方法中，所述步骤S23包括子步骤：
S231、通过所述单表解析器读取JSON格式的单表文件；所述单表解析器包括单表控件库、规则解析库及样式库；
S232、通过所述单表控件库解析所述单表文件的控件，通过所述规则解析库解析所述单表文件的规则及函数，通过所述样式库解析所述单表文件的布局及样式；
S233、生成前端Web页面。
另一方面，提供一种Web App的配置装置，包括设计模块及运行模块；
所述设计模块包括：
控件配置单元，用于拖动控件库中的控件至单表设计器中，以配置Web页面的布局及样式设计；
规则配置单元，用于通过规则设计器配置所述Web页面的功能设计；
单表生成单元，用于依据所配置的Web页面生成单表模板，并通过JSON格式将所述单表模板保存在数据库中；
所述运行模块包括：
文件生成单元，用于依据所述单表模板生成单表文件；
打包单元，用于将所述单表文件与单表解析器打包至前端设备；
页面生成单元，用于于所述前端设备中依据所打包的单表文件与单表解析器生成前端Web页面。
在本发明所述的配置装置中，所述控件配置单元包括：
UI配置子单元，用于通过HTML5页面配置UI；
页面处理子单元，用于通过设计逻辑控制处理器对所述HTML5页面进行处理；
控件设计子单元，用于所述单表设计器通过zebra框架及App组件设计控件。
在本发明所述的配置装置中，所述单表设计器包括控件、规则及函数。
在本发明所述的配置装置中，所述打包单元包括：
转换子单元，用于将所述单表文件转换为JSON格式；
打包子单元，用于将JSON格式的单表文件与单表解析器打包至前端设备。
在本发明所述的配置装置中，所述页面生成单元包括：
文件读取子单元，用于通过所述单表解析器读取JSON格式的单表文件；所述单表解析器包括单表控件库、规则解析库及样式库；
解析子单元，用于通过所述单表控件库解析所述单表文件的控件，通过所述规则解析库解析所述单表文件的规则及函数，通过所述样式库解析所述单表文件的布局及样式；
页面生成子单元，用于生成前端Web页面。
上述公开的一种Web App的配置方法及装置具有以下有益效果：极大提高简单WebApp的开发效率；解决了App的跨平台运行，降低软件开发的入门门槛，节约开发成本。
附图说明
图1为本发明提供的一种Web App的配置方法的流程图；
图2为本发明提供的Web App的配置方法的框架示意图。
具体实施方式
为了使本发明的目的、技术方案及优点更加清楚明白，以下结合附图及实施例，对本发明进行进一步详细说明。应当理解，此处所描述的具体实施例仅用以解释本发明，并不用于限定本发明。
本发明提供了一种Web App的配置方法及装置，其目的在于，极大提高简单WebApp的开发效率；解决了App的跨平台运行，降低软件开发的入门门槛，节约开发成本。
参见图1，图1为本发明提供的一种Web App的配置方法的流程图，该Web App的配置方法，包括设计步骤及运行步骤；
设计步骤面向开发者/后端，所述设计步骤包括步骤S11-S13：
S11、拖动控件库中的控件至单表设计器中，以配置Web页面的布局及样式设计；参见图2，图2为本发明提供的Web App的配置方法的框架示意图，所述步骤S11包括以下子步骤S111-S113：
S111、所述单表设计器通过HTML5页面配置UI；参见图2，该步骤主要为UI层所完成的配置工作。
S112、所述单表设计器通过设计逻辑控制处理器对所述HTML5页面进行处理；该步骤主要为控制层完成的处理工作。
S113、所述单表设计器通过zebra框架及App组件设计控件。该步骤主要为控件库完成的设计工作。
图2中：
表单设计器：用于配置Web App的工具；
移动端解析器：用于解析已配置的Web页面模板；
表单模版：用户使用表单设计器配置Web页面后产出的JSON格式数据，是衔接设计时和运行时的上下文，主要由控件，后台规则和UI规则构成；
UI规则：用于执行Web App的UI操作，比如为一个文本框填充一个值，存储于表单模版中；
后台规则：用于执行Web App的后台数据处理，比如获取一个下拉框的数据，存储于表单模板中；
表达式：用于执行Web App中的逻辑运算，通常在规则中使用，存储于表单模板中；
控件：组成一个Web页面的最小单位，存储在表单模版中；
zebra：一种基于Canvas的前端技术框架；
App组件：常用的原生App功能模块，通过Phone Gap和Web页面进行交互；
PhoneGap：一种解决Web页面和原生App交互的第三方技术框架；
JSON：一种数据组装格式；
HTTP/TCP：数据传输的协议，是一种技术标准；
WebService：一种数据访问方式，移动设备通常通过WebService和服务端进行数据交互。
综上，该单表设计基于zebra技术框架，所述单表设计器包括控件、规则及函数。
S12、通过规则设计器配置所述Web页面的功能设计；
S13、依据所配置的Web页面生成单表模板，并通过JSON格式将所述单表模板保存在数据库中；
即开发人员可以通过拖动控件库中的控件到设计器中，从而实现web页面的布局和样式设计。完成Web页面的UI配置后，可以通过规则设计器实现Web页面的功能配置。表单配置完成后，设计器会生成一个完整的表单模版已JSON格式保存到数据库中。
运行步骤面向客户端/前端(手机等移动终端)，所述运行步骤包括步骤S21-S23：
S21、依据所述单表模板生成单表文件；
S22、将所述单表文件与单表解析器打包至前端设备；所述步骤S22包括子步骤S221-S222：
S221、将所述单表文件转换为JSON格式；
S222、将JSON格式的单表文件与单表解析器打包至前端设备。
S23、于所述前端设备中依据所打包的单表文件与单表解析器生成前端Web页面。所述步骤S23包括子步骤S231-S233：
S231、通过所述单表解析器读取JSON格式的单表文件；所述单表解析器包括单表控件库、规则解析库及样式库；
S232、通过所述单表控件库解析所述单表文件的控件，通过所述规则解析库解析所述单表文件的规则及函数，通过所述样式库解析所述单表文件的布局及样式；
S233、生成前端Web页面。
即开发人员完成表单配置后，后台服务将已保存的表单模版数据生成表单文件，通过App打包将生成的JSON文件和表单解析器打包到移动设备中。表单解析器中也包含了运行时的控件库，规则解析库、以及样式库。App启动时，表单解析器将读取表单JSON文件，将JSON文件中的控件、规则和函数于分别进行解析。最终形成一个可运行的Web页面。即前端Web页面。
另一方面，本发明还提供一种Web App的配置装置，包括设计模块及运行模块；
所述设计模块包括：
控件配置单元，用于拖动控件库中的控件至单表设计器中，以配置Web页面的布局及样式设计；
规则配置单元，用于通过规则设计器配置所述Web页面的功能设计；
单表生成单元，用于依据所配置的Web页面生成单表模板，并通过JSON格式将所述单表模板保存在数据库中；
所述运行模块包括：
文件生成单元，用于依据所述单表模板生成单表文件；
打包单元，用于将所述单表文件与单表解析器打包至前端设备；
页面生成单元，用于于所述前端设备中依据所打包的单表文件与单表解析器生成前端Web页面。
优选的，所述控件配置单元包括：
UI配置子单元，用于通过HTML5页面配置UI；
页面处理子单元，用于通过设计逻辑控制处理器对所述HTML5页面进行处理；
控件设计子单元，用于所述单表设计器通过zebra框架及App组件设计控件。
优选的，所述单表设计器包括控件、规则及函数。
优选的，所述打包单元包括：
转换子单元，用于将所述单表文件转换为JSON格式；
打包子单元，用于将JSON格式的单表文件与单表解析器打包至前端设备。
优选的，所述页面生成单元包括：
文件读取子单元，用于通过所述单表解析器读取JSON格式的单表文件；所述单表解析器包括单表控件库、规则解析库及样式库；
解析子单元，用于通过所述单表控件库解析所述单表文件的控件，通过所述规则解析库解析所述单表文件的规则及函数，通过所述样式库解析所述单表文件的布局及样式；
页面生成子单元，用于生成前端Web页面。
本文提供了实施例的各种操作。在一个实施例中，所述的一个或操作可以构成一个或计算机可读介质上存储的计算机可读指令，其在被电子设备执行时将使得计算设备执行所述操作。描述一些或所有操作的顺序不应当被解释为暗示这些操作必需是顺序相关的。本领域技术人员将理解具有本说明书的益处的可替代的排序。而且，应当理解，不是所有操作必需在本文所提供的每个实施例中存在。
而且，本文所使用的词语“优选的”意指用作实例、示例或例证。奉文描述为“优选的”任意方面或设计不必被解释为比其他方面或设计更有利。相反，词语“优选的”的使用旨在以具体方式提出概念。如本申请中所使用的术语“或”旨在意指包含的“或”而非排除的“或”。即，除非另外指定或从上下文中清楚，“X使用A或B”意指自然包括排列的任意一个。即，如果X使用A；X使用B；或X使用A和B二者，则“X使用A或B”在前述任一示例中得到满足。
而且，尽管已经相对于一个或实现方式示出并描述了本公开，但是本领域技术人员基于对本说明书和附图的阅读和理解将会想到等价变型和修改。本公开包括所有这样的修改和变型，并且仅由所附权利要求的范围限制。特别地关于由上述组件(例如元件等)执行的各种功能，用于描述这样的组件的术语旨在对应于执行所述组件的指定功能(例如其在功能上是等价的)的任意组件(除非另外指示)，即使在结构上与执行本文所示的本公开的示范性实现方式中的功能的公开结构不等同。此外，尽管本公开的特定特征已经相对于若干实现方式中的仅一个被公开，但是这种特征可以与如可以对给定或特定应用而言是期望和有利的其他实现方式的一个或其他特征组合。而且，就术语“包括”、“具有”、“含有”或其变形被用在具体实施方式或权利要求中而言，这样的术语旨在以与术语“包含”相似的方式包括。
本发明实施例中的各功能单元可以集成在一个处理模块中，也可以是各个单元单独物理存在，也可以多个或多个以上单元集成在一个模块中。上述集成的模块既可以采用硬件的形式实现，也可以采用软件功能模块的形式实现。所述集成的模块如果以软件功能模块的形式实现并作为独立的产品销售或使用时，也可以存储在一个计算机可读取存储介质中。上述提到的存储介质可以是只读存储器，磁盘或光盘等。上述的各装置或***，可以执行相应方法实施例中的存储方法。
综上所述，虽然本发明已以优选实施例揭露如上，但上述优选实施例并非用以限制本发明，本领域的普通技术人员，在不脱离本发明的精神和范围内，均可作各种更动与润饰，因此本发明的保护范围以权利要求界定的范围为准。
Claims (10)
1.一种Web App的配置方法，其特征在于，包括设计步骤及运行步骤；
所述设计步骤包括步骤：
S11、拖动控件库中的控件至单表设计器中，以配置Web页面的布局及样式设计；
S12、通过规则设计器配置所述Web页面的功能设计；
S13、依据所配置的Web页面生成单表模板，并通过JSON格式将所述单表模板保存在数据库中；
所述运行步骤包括步骤：
S21、依据所述单表模板生成单表文件；
S22、将所述单表文件与单表解析器打包至前端设备；
S23、于所述前端设备中依据所打包的单表文件与单表解析器生成前端Web页面。
2.根据权利要求1所述的配置方法，其特征在于，所述步骤S11包括以下子步骤：
S111、所述单表设计器通过HTML5页面配置UI；
S112、所述单表设计器通过设计逻辑控制处理器对所述HTML5页面进行处理；
S113、所述单表设计器通过zebra框架及App组件设计控件。
3.根据权利要求1所述的配置方法，其特征在于，所述单表设计器包括控件、规则及函数。
4.根据权利要求3所述的配置方法，其特征在于，所述步骤S22包括子步骤：
S221、将所述单表文件转换为JSON格式；
S222、将JSON格式的单表文件与单表解析器打包至前端设备。
5.根据权利要求4所述的配置方法，其特征在于，所述步骤S23包括子步骤：
S231、通过所述单表解析器读取JSON格式的单表文件；所述单表解析器包括单表控件库、规则解析库及样式库；
S232、通过所述单表控件库解析所述单表文件的控件，通过所述规则解析库解析所述单表文件的规则及函数，通过所述样式库解析所述单表文件的布局及样式；
S233、生成前端Web页面。
6.一种Web App的配置装置，其特征在于，包括设计模块及运行模块；
所述设计模块包括：
控件配置单元，用于拖动控件库中的控件至单表设计器中，以配置Web页面的布局及样式设计；
规则配置单元，用于通过规则设计器配置所述Web页面的功能设计；
单表生成单元，用于依据所配置的Web页面生成单表模板，并通过JSON格式将所述单表模板保存在数据库中；
所述运行模块包括：
文件生成单元，用于依据所述单表模板生成单表文件；
打包单元，用于将所述单表文件与单表解析器打包至前端设备；
页面生成单元，用于于所述前端设备中依据所打包的单表文件与单表解析器生成前端Web页面。
7.根据权利要求6所述的配置装置，其特征在于，所述控件配置单元包括：
UI配置子单元，用于通过HTML5页面配置UI；
页面处理子单元，用于通过设计逻辑控制处理器对所述HTML5页面进行处理；
控件设计子单元，用于所述单表设计器通过zebra框架及App组件设计控件。
8.根据权利要求6所述的配置装置，其特征在于，所述单表设计器包括控件、规则及函数。
9.根据权利要求8所述的配置装置，其特征在于，所述打包单元包括：
转换子单元，用于将所述单表文件转换为JSON格式；
打包子单元，用于将JSON格式的单表文件与单表解析器打包至前端设备。
10.根据权利要求9所述的配置方法，其特征在于，所述页面生成单元包括：
文件读取子单元，用于通过所述单表解析器读取JSON格式的单表文件；所述单表解析器包括单表控件库、规则解析库及样式库；
解析子单元，用于通过所述单表控件库解析所述单表文件的控件，通过所述规则解析库解析所述单表文件的规则及函数，通过所述样式库解析所述单表文件的布局及样式；
页面生成子单元，用于生成前端Web页面。
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201611085145.1A CN108132783A (zh) | 2016-11-30 | 2016-11-30 | 一种Web App的配置方法及装置 |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201611085145.1A CN108132783A (zh) | 2016-11-30 | 2016-11-30 | 一种Web App的配置方法及装置 |
Publications (1)
| Publication Number | Publication Date |
|---|---|
| CN108132783A true CN108132783A (zh) | 2018-06-08 |
Family
ID=62387341
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN201611085145.1A Pending CN108132783A (zh) | 2016-11-30 | 2016-11-30 | 一种Web App的配置方法及装置 |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN108132783A (zh) |
Cited By (3)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN110597508A (zh) * | 2019-08-14 | 2019-12-20 | 平安国际智慧城市科技股份有限公司 | 界面动态配置方法、装置及存储介质 |
| CN112114805A (zh) * | 2020-08-27 | 2020-12-22 | 长沙市到家悠享网络科技有限公司 | 页面生成方法、装置、设备 |
| CN113434425A (zh) * | 2021-07-06 | 2021-09-24 | 重庆唯哲科技有限公司 | 一种可快速开发测控***及测控***看板 |
Citations (5)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| US20130268883A1 (en) * | 2012-04-05 | 2013-10-10 | Lg Electronics Inc. | Mobile terminal and control method thereof |
| CN104317587A (zh) * | 2014-10-22 | 2015-01-28 | 中国人民解放军国防科学技术大学 | 面向安卓移动设备的程序自动生成方法 |
| CN104484171A (zh) * | 2014-12-11 | 2015-04-01 | 深圳市路通网络技术有限公司 | 终端界面设计***、方法及相关设备 |
| CN105094832A (zh) * | 2015-08-01 | 2015-11-25 | 李志丹 | 一种所见即所得的动态生成用户界面的方法和*** |
| CN105302578A (zh) * | 2015-11-27 | 2016-02-03 | 中国电子科技集团公司第二十八研究所 | 一种拖拽式布局配置的门户综合管理*** |
-
2016
- 2016-11-30 CN CN201611085145.1A patent/CN108132783A/zh active Pending
Patent Citations (5)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| US20130268883A1 (en) * | 2012-04-05 | 2013-10-10 | Lg Electronics Inc. | Mobile terminal and control method thereof |
| CN104317587A (zh) * | 2014-10-22 | 2015-01-28 | 中国人民解放军国防科学技术大学 | 面向安卓移动设备的程序自动生成方法 |
| CN104484171A (zh) * | 2014-12-11 | 2015-04-01 | 深圳市路通网络技术有限公司 | 终端界面设计***、方法及相关设备 |
| CN105094832A (zh) * | 2015-08-01 | 2015-11-25 | 李志丹 | 一种所见即所得的动态生成用户界面的方法和*** |
| CN105302578A (zh) * | 2015-11-27 | 2016-02-03 | 中国电子科技集团公司第二十八研究所 | 一种拖拽式布局配置的门户综合管理*** |
Cited By (3)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN110597508A (zh) * | 2019-08-14 | 2019-12-20 | 平安国际智慧城市科技股份有限公司 | 界面动态配置方法、装置及存储介质 |
| CN112114805A (zh) * | 2020-08-27 | 2020-12-22 | 长沙市到家悠享网络科技有限公司 | 页面生成方法、装置、设备 |
| CN113434425A (zh) * | 2021-07-06 | 2021-09-24 | 重庆唯哲科技有限公司 | 一种可快速开发测控***及测控***看板 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| CN109614568B (zh) | 一种页面生成方法及装置 | |
| CN109670053B (zh) | 数据对象映射方法、装置、设备和计算机可读存储介质 | |
| CN105447099A (zh) | 日志结构化信息提取方法及装置 | |
| CN111125598A (zh) | 数据智能查询方法、装置、设备及存储介质 | |
| CN111126019B (zh) | 基于模式定制的报表生成方法、装置和电子设备 | |
| CN101196913A (zh) | 变色龙图形用户界面 | |
| CN104375875B (zh) | 用于应用程序的编译优化的方法以及编译器 | |
| CN103226510B (zh) | 解析vmcore文件的方法和装置 | |
| CN104951508A (zh) | 时间信息识别方法和装置 | |
| CN103095726A (zh) | 一种协议解析器的处理方法和装置 | |
| CN112835323B (zh) | 可编程逻辑控制语言编译方法及装置 | |
| CN108132783A (zh) | 一种Web App的配置方法及装置 | |
| CN114138244A (zh) | 模型类文件自动生成方法、装置、存储介质及电子设备 | |
| CN112799670B (zh) | 一种统一多端逻辑开发的方法及*** | |
| CN113050921A (zh) | 一种网页转换方法、装置、存储介质和计算机设备 | |
| CN110569230A (zh) | 数据库设计模型与设计文档互相转换方法、***及设备 | |
| CN107329756B (zh) | 程序文件的生成方法、装置、存储介质、处理器和终端 | |
| CN117787226A (zh) | 标签生成模型训练方法、装置、电子设备及存储介质 | |
| CN110377891B (zh) | 事件分析文章的生成方法、装置、设备及计算机可读存储介质 | |
| CN111026604B (zh) | 一种日志文件解析方法及装置 | |
| CN110727458A (zh) | 一种通过后台管理切换页面模板设置的方法和装置 | |
| CN115617673A (zh) | 基于Cosim平台的测试用例配置的方法及应用 | |
| Filipovikj et al. | Analyzing industrial simulink models by statistical model checking | |
| CN111435300A (zh) | web***开发方法、装置、设备及存储介质 | |
| CN108536715B (zh) | 一种预览页面生成方法、装置、设备以及存储介质 |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| PB01 | Publication | ||
| PB01 | Publication | ||
| SE01 | Entry into force of request for substantive examination | ||
| SE01 | Entry into force of request for substantive examination | ||
| RJ01 | Rejection of invention patent application after publication | ||
| RJ01 | Rejection of invention patent application after publication |
Application publication date: 20180608 |