CN110543308A - 移动端模块化用户界面数据库的建立方法及系统 - Google Patents
移动端模块化用户界面数据库的建立方法及系统 Download PDFInfo
- Publication number
- CN110543308A CN110543308A CN201910751592.3A CN201910751592A CN110543308A CN 110543308 A CN110543308 A CN 110543308A CN 201910751592 A CN201910751592 A CN 201910751592A CN 110543308 A CN110543308 A CN 110543308A
- Authority
- CN
- China
- Prior art keywords
- user interface
- module
- mobile
- packaging
- computer program
- 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.)
- Withdrawn
Links
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/20—Information retrieval; Database structures therefor; File system structures therefor of structured data, e.g. relational data
- G06F16/21—Design, administration or maintenance of databases
- G06F16/211—Schema design and management
- G06F16/212—Schema design and management with details for data modelling support
-
- 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)
- Theoretical Computer Science (AREA)
- General Engineering & Computer Science (AREA)
- Software Systems (AREA)
- Physics & Mathematics (AREA)
- General Physics & Mathematics (AREA)
- Databases & Information Systems (AREA)
- Human Computer Interaction (AREA)
- Data Mining & Analysis (AREA)
- Stored Programmes (AREA)
Abstract
本申请公开了一种移动端模块化用户界面数据库的建立方法，包括：封装用户界面，并得到用户界面封装模块；及将所述用户界面封装模块导入sass文件。与现有技术相比，本申请具有如下优点：通过设计此UI库，抽象并提取了业务的重复样式，减少重复代码的书写，优化了页面布局的开发复杂度，提供了简单使用与可配置的功能。
Description
技术领域
本申请涉及系统开发领域，具体而言，涉及一种移动端模块化用户界面(UI)数据库的建立方法及系统。
背景技术
现今开发很多时候讲究效率，给你很短的时间，完成很多的内容。由于是加班加点赶出来的项目，百分百会有各种问题，兼容性啊、功能性啊、与设计图偏差。如果有套经历过沉淀的UI库，那么能够通过样式组件，快速搭建页面，并且兼容性等各方面都有保证。很多开源库都做些精细的雕琢，但自己公司的UI设计可能并不喜欢这种风格。
发明内容
本申请的主要目的在于提供一种移动端模块化用户界面数据库的建立方法，包括：
封装用户界面，并得到用户界面封装模块；及
将所述用户界面封装模块导入sass文件。
可选地，所述封装用户界面包括：
工程搭建，通过构建工具Gulp，基于流的构建工具，利用“Node.js”包管理，导入插件。
可选地，所述封装用户界面还包括：
通过CSS预处理器，使用Sass开发各个用户界面，并打包。
可选地，所述封装用户界面还包括：
借助flexible.js，通过计算html中的font-size设置viewport的放大倍数，以实现移动自适应。
可选地，所述封装用户界面还包括：
开放部分接口和变量，使得各个模块均可配置。
根据本申请的一方面，还提供了一种移动端模块化用户界面数据库的建立系统，包括：
封装模块，用于封装用户界面，并得到用户界面封装模块；及
导入模块，用于将所述用户界面封装模块导入sass文件。
本申请还公开了一种计算机设备，包括存储器、处理器和存储在所述存储器内并能由所述处理器运行的计算机程序，所述处理器执行所述计算机程序时实现上述任一项所述的方法。
本申请还公开了一种计算机可读存储介质，非易失性可读存储介质，其内存储有计算机程序，所述计算机程序在由处理器执行时实现上述任一项所述的方法。
本申请还公开了一种计算机程序产品，包括计算机可读代码，当所述计算机可读代码由计算机设备执行时，导致所述计算机设备执行上述任一项所述的方法。
与现有技术相比，本申请具有如下优点：
通过设计此UI库，抽象并提取了业务的重复样式，减少重复代码的书写，优化了页面布局的开发复杂度，提供了简单使用与可配置的功能。
附图说明
构成本申请的一部分的附图用来提供对本申请的进一步理解，使得本申请的其它特征、目的和优点变得更明显。本申请的示意性实施例附图及其说明用于解释本申请，并不构成对本申请的不当限定。在附图中：
图1是根据本申请一个实施例的移动端模块化用户界面数据库的建立方法的流程示意图；
图2是根据本申请一个实施例的封装用户界面的流程示意图；
图3是根据本申请一个实施例的计算机设备的示意图；以及
图4是根据本申请一个实施例的计算机可读存储介质的示意图。
具体实施方式
为了使本技术领域的人员更好地理解本申请方案，下面将结合本申请实施例中的附图，对本申请实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例仅仅是本申请一部分的实施例，而不是全部的实施例。基于本申请中的实施例，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例，都应当属于本申请保护的范围。
需要说明的是，本申请的说明书和权利要求书及上述附图中的术语“第一”、“第二”等是用于区别类似的对象，而不必用于描述特定的顺序或先后次序。应该理解这样使用的数据在适当情况下可以互换，以便这里描述的本申请的实施例。此外，术语“包括”和“具有”以及他们的任何变形，意图在于覆盖不排他的包含，例如，包含了一系列步骤或单元的过程、方法、系统、产品或设备不必限于清楚地列出的那些步骤或单元，而是可包括没有清楚地列出的或对于这些过程、方法、产品或设备固有的其它步骤或单元。
需要说明的是，在不冲突的情况下，本申请中的实施例及实施例中的特征可以相互组合。下面将参考附图并结合实施例来详细说明本申请。
请参照图1，本申请一实施例提供了一种移动端模块化用户界面数据库的建立方法，包括：
S2：封装用户界面，并得到用户界面封装模块；及
S4：将所述用户界面封装模块导入sass文件。
请参照图2，在本申请一实施例中，所述封装用户界面包括：
S21：工程搭建，通过构建工具Gulp，基于流的构建工具，利用“Node.js”包管理，导入插件。
在本申请一实施例中，所述封装用户界面还包括：
S22：通过CSS预处理器，使用Sass开发各个用户界面，并打包。
在本申请一实施例中，所述封装用户界面还包括：
S23：借助flexible.js，通过计算html中的font-size设置viewport的放大倍数，以实现移动自适应。
在本申请一实施例中，所述封装用户界面还包括：
S24：开放部分接口和变量，使得各个模块均可配置。
本申请还提供了了一种移动端模块化用户界面数据库的建立系统，包括：
封装模块，用于封装用户界面，并得到用户界面封装模块；及
导入模块，用于将所述用户界面封装模块导入sass文件。
请参照图3，本申请还提供了一种计算机设备，包括存储器、处理器和存储在所述存储器内并能由所述处理器运行的计算机程序，所述处理器执行所述计算机程序时实现上述任一项所述的方法。
请参照图4，一种计算机可读存储介质，非易失性可读存储介质，其内存储有计算机程序，所述计算机程序在由处理器执行时实现上述任一项所述的方法。
一种计算机程序产品，包括计算机可读代码，当所述计算机可读代码由计算机设备执行时，导致所述计算机设备执行上述任一项所述的方法。
本申请提供的移动端模块化用户界面数据库的建立方法，提取日常开发频率较高的样式，封装成UI库的模块，包括字体、网格、边框、布局、表格、表单等，开箱即用，只要将相关模块引入到Sass文件中，就能使用其中的功能。同时，工程搭建，本次开发使用了构建工具“Gulp”，基于流的构建工具。利用“Node.js”丰富的包管理，可以将各种插件收入囊中；利用CSS预处理器Sass开发各个模块，并自动打包；借助flexible.js，通过计算html中的font-size(用于计算rem)，设置viewport的放大倍数，来实现移动自适应；开放部分接口和变量，使得各个模块都实现可配置。
与现有技术相比，本申请具有如下优点：
通过设计此UI库，抽象并提取了业务的重复样式，减少重复代码的书写，优化了页面布局的开发复杂度，提供了简单使用与可配置的功能。
显然，本领域的技术人员应该明白，上述的本发明的各模块或各步骤可以用通用的计算装置来实现，它们可以集中在单个的计算装置上，或者分布在多个计算装置所组成的网络上，可选地，它们可以用计算装置可执行的程序代码来实现，从而，可以将它们存储在存储装置中由计算装置来执行，或者将它们分别制作成各个集成电路模块，或者将它们中的多个模块或步骤制作成单个集成电路模块来实现。这样，本发明不限制于任何特定的硬件和软件结合。
以上所述仅为本申请的优选实施例而已，并不用于限制本申请，对于本领域的技术人员来说，本申请可以有各种更改和变化。凡在本申请的精神和原则之内，所作的任何修改、等同替换、改进等，均应包含在本申请的保护范围之内。
Claims (10)
1.一种移动端模块化用户界面数据库的建立方法，其特征在于，包括：
封装用户界面，并得到用户界面封装模块；及
将所述用户界面封装模块导入sass文件。
2.根据权利要求1所述的移动端模块化用户界面数据库的建立方法，其特征在于，所述封装用户界面包括：
工程搭建，通过构建工具Gulp，基于流的构建工具，利用“Node.js”包管理，导入插件。
3.根据权利要求2所述的移动端模块化用户界面数据库的建立方法，其特征在于，所述封装用户界面还包括：
通过CSS预处理器，使用Sass开发各个用户界面，并打包。
4.根据权利要求3所述的移动端模块化用户界面数据库的建立方法，其特征在于，所述封装用户界面还包括：
借助flexible.js，通过计算html中的font-size设置viewport的放大倍数，以实现移动自适应。
5.根据权利要求4所述的移动端模块化用户界面数据库的建立方法，其特征在于，所述封装用户界面还包括：
开放部分接口和变量，使得各个模块均可配置。
6.根据权利要求4所述的移动端模块化用户界面数据库的建立方法，其特征在于，所述用户界面封装模块包括：字体、网格、边框、布局、表格或表单。
7.一种移动端模块化用户界面数据库的建立系统，其特征在于，包括：
封装模块，用于封装用户界面，并得到用户界面封装模块；及
导入模块，用于将所述用户界面封装模块导入sass文件。
8.一种计算机设备，包括存储器、处理器和存储在所述存储器内并能由所述处理器运行的计算机程序，其特征在于，所述处理器执行所述计算机程序时实现如权利要求1-6中任一项所述的方法。
9.一种计算机可读存储介质，非易失性可读存储介质，其内存储有计算机程序，其特征在于，所述计算机程序在由处理器执行时实现如权利要求1-6中任一项所述的方法。
10.一种计算机程序产品，包括计算机可读代码，其特征在于，当所述计算机可读代码由计算机设备执行时，导致所述计算机设备执行权利要求1-6中任一项所述的方法。
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201910751592.3A CN110543308A (zh) | 2019-08-13 | 2019-08-13 | 移动端模块化用户界面数据库的建立方法及系统 |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201910751592.3A CN110543308A (zh) | 2019-08-13 | 2019-08-13 | 移动端模块化用户界面数据库的建立方法及系统 |
Publications (1)
| Publication Number | Publication Date |
|---|---|
| CN110543308A true CN110543308A (zh) | 2019-12-06 |
Family
ID=68711360
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN201910751592.3A Withdrawn CN110543308A (zh) | 2019-08-13 | 2019-08-13 | 移动端模块化用户界面数据库的建立方法及系统 |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN110543308A (zh) |
Cited By (1)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN111209613A (zh) * | 2020-01-10 | 2020-05-29 | 杭州涂鸦信息技术有限公司 | 一种智能产品的快速设计方法及系统 |
Citations (4)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| US20160078006A1 (en) * | 2014-09-15 | 2016-03-17 | Oracle International Corporation | High performant and high fidelity previews for css preprocessing frameworks |
| CN105893014A (zh) * | 2015-12-08 | 2016-08-24 | 乐视云计算有限公司 | 用于前端的项目开发方法及系统 |
| CN105930166A (zh) * | 2016-05-09 | 2016-09-07 | 统通信（苏州）有限公司 | 一种基于web界面弹出层的方法 |
| CN107329747A (zh) * | 2017-06-20 | 2017-11-07 | 福建中金在线信息科技有限公司 | 一种生成多主题样式的方法及装置 |
-
2019
- 2019-08-13 CN CN201910751592.3A patent/CN110543308A/zh not_active Withdrawn
Patent Citations (4)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| US20160078006A1 (en) * | 2014-09-15 | 2016-03-17 | Oracle International Corporation | High performant and high fidelity previews for css preprocessing frameworks |
| CN105893014A (zh) * | 2015-12-08 | 2016-08-24 | 乐视云计算有限公司 | 用于前端的项目开发方法及系统 |
| CN105930166A (zh) * | 2016-05-09 | 2016-09-07 | 统通信（苏州）有限公司 | 一种基于web界面弹出层的方法 |
| CN107329747A (zh) * | 2017-06-20 | 2017-11-07 | 福建中金在线信息科技有限公司 | 一种生成多主题样式的方法及装置 |
Cited By (2)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN111209613A (zh) * | 2020-01-10 | 2020-05-29 | 杭州涂鸦信息技术有限公司 | 一种智能产品的快速设计方法及系统 |
| CN111209613B (zh) * | 2020-01-10 | 2023-05-12 | 杭州涂鸦信息技术有限公司 | 一种智能产品的快速设计方法及系统 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| US11829695B2 (en) | Method and system for logic design partitioning | |
| KR101314949B1 (ko) | 통합 환경 생성기 | |
| CN107918666B (zh) | 一种区块链上的数据同步方法和系统 | |
| CN109901838A (zh) | 基于组件化的前端开发方法、装置、设备及存储介质 | |
| CN111290778B (zh) | Ai模型的包装方法、平台及电子设备 | |
| CN107609004B (zh) | 应用程序埋点方法和装置、计算机设备和存储介质 | |
| CN107450972A (zh) | 一种调度方法、装置以及电子设备 | |
| CN109582909A (zh) | 网页自动生成方法、装置、电子设备和存储介质 | |
| CN107506181A (zh) | 业务处理、数据处理方法、装置以及电子设备 | |
| CN108170435A (zh) | 一种源代码转换方法、装置及设备 | |
| CN110347378A (zh) | 项目开发环境的搭建方法及装置 | |
| CN110580174B (zh) | 应用组件生成方法、服务器及终端 | |
| CN109491652A (zh) | 程序代码文件的生成方法和装置、电子设备 | |
| CN109840083A (zh) | 网页组件模板构建方法、装置、计算机设备和存储介质 | |
| CN112711414A (zh) | 一种表单界面适配展现方法、装置及存储介质 | |
| CN109828759A (zh) | 代码编译方法、装置、计算机装置及存储介质 | |
| CN111767217A (zh) | Js单元测试案例生成方法及装置 | |
| CN110543308A (zh) | 移动端模块化用户界面数据库的建立方法及系统 | |
| CN112560413B (zh) | 基于配置模式的报表扩展方法、装置和设备 | |
| WO2024066825A1 (zh) | 页面项目开发方法、装置、设备、介质及产品 | |
| CN112965721A (zh) | 基于Android的项目编译方法、装置、计算机设备及存储介质 | |
| CN106293658A (zh) | 一种界面组件生成方法及其设备 | |
| CN110008035B (zh) | 数据接口扩展方法、数据处理方法、装置及设备 | |
| US10706193B1 (en) | Computer processing during simulation of a circuit design | |
| CN116225419A (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 | ||
| WW01 | Invention patent application withdrawn after publication |
Application publication date: 20191206 |
|
| WW01 | Invention patent application withdrawn after publication |