CN111310087A - 一种页面显示方法、装置、及存储介质 - Google Patents
一种页面显示方法、装置、及存储介质 Download PDFInfo
- Publication number
- CN111310087A CN111310087A CN202010086664.XA CN202010086664A CN111310087A CN 111310087 A CN111310087 A CN 111310087A CN 202010086664 A CN202010086664 A CN 202010086664A CN 111310087 A CN111310087 A CN 111310087A
- Authority
- CN
- China
- Prior art keywords
- color
- page
- variable
- variables
- value
- 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
- 238000000034 method Methods 0.000 title claims abstract description 36
- 230000004048 modification Effects 0.000 claims description 7
- 238000012986 modification Methods 0.000 claims description 7
- 238000004590 computer program Methods 0.000 claims description 6
- 239000003086 colorant Substances 0.000 description 11
- 238000007726 management method Methods 0.000 description 7
- 230000006870 function Effects 0.000 description 6
- 230000008569 process Effects 0.000 description 6
- 238000005516 engineering process Methods 0.000 description 4
- 230000008859 change Effects 0.000 description 2
- 238000004891 communication Methods 0.000 description 2
- 238000011161 development Methods 0.000 description 2
- 230000018109 developmental process Effects 0.000 description 2
- 238000013461 design Methods 0.000 description 1
- 238000010586 diagram Methods 0.000 description 1
- 230000002452 interceptive effect Effects 0.000 description 1
- 238000012423 maintenance Methods 0.000 description 1
- 230000003287 optical effect Effects 0.000 description 1
- 230000033772 system development Effects 0.000 description 1
- 230000007723 transport mechanism Effects 0.000 description 1
- 230000000007 visual effect Effects 0.000 description 1
- 239000002699 waste material Substances 0.000 description 1
Images
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/90—Details of database functions independent of the retrieved data types
- G06F16/95—Retrieval from the web
- G06F16/957—Browsing optimisation, e.g. caching or content distillation
- G06F16/9577—Optimising the visualization of content, e.g. distillation of HTML documents
Landscapes
- Engineering & Computer Science (AREA)
- Databases & Information Systems (AREA)
- Theoretical Computer Science (AREA)
- Data Mining & Analysis (AREA)
- Physics & Mathematics (AREA)
- General Engineering & Computer Science (AREA)
- General Physics & Mathematics (AREA)
- User Interface Of Digital Computer (AREA)
Abstract
一种页面显示方法，包括接收更换配色方案的操作，并依据该操作对主题配置文件中相应的通用颜色变量的值进行修改；当打开一个或者多个页面时，对所述一个或者多个页面中的每个页面分别进行如下操作：在所述主题配置文件中，查找该页面对应的一个或多个页面颜色变量的值；其中，当页面颜色变量引用通用颜色变量时，将所引用的通用颜色变量的值作为该页面颜色变量的值；根据所查找到的页面颜色变量的值显示该页面中相应内容的颜色；其中，所述通用颜色变量为预定义的一个或多个变量。本申请能够实现快速换肤。
Description
技术领域
本文涉及计算及技术，尤指一种页面显示方法、装置、及存储介质。
背景技术
随着互联网的高速发展，用户对于交互体验的要求也越来越高，目前很多场景会要求对系统、网页等实现多主题的开发要求，来达到视觉效果的丰富。但是需要通过开发人员经过较多的代码才能实现换肤，换肤过程繁琐，速度较慢。
发明内容
本申请提供了一种页面显示方法、装置、及存储介质，能够达到快速换肤的功能。
本申请提供了一种页面显示方法，包括：接收更换配色方案的操作，并依据该操作对主题配置文件中相应的通用颜色变量的值进行修改；
当打开一个或者多个页面时，对所述一个或者多个页面中的每个页面分别进行如下操作：
在所述主题配置文件中，查找该页面对应的一个或多个页面颜色变量的值；其中，当页面颜色变量引用通用颜色变量时，将所引用的通用颜色变量的值作为该页面颜色变量的值；根据所查找到的页面颜色变量的值显示该页面中相应内容的颜色；其中，所述通用颜色变量为预定义的一个或多个变量。
在一个示例性实施例中，所述页面对应的页面颜色变量禁止引用其他页面的页面颜色变量。
在一个示例性实施例中，所述接收对主题配置文件中通用颜色变量值的修改之前，包括：根据默认的配色方案，确定主题配置文件中的通用颜色变量的值。
在一个示例性实施例中，所述通用颜色变量包括其中至少之一：文字颜色变量、状态颜色变量、样式颜色变量、及图表配配色变量。
在一个示例性实施例中，所述方法基于SASS预编辑语言实现；所述主题配置文件为预定义variable.scss文件。
本申请提供一种页面显示装置，包括：接收模块，用于接收更换配色方案的操作，并依据该操作对主题配置文件中相应的通用颜色变量的值进行修改；显示模块，用于当打开一个或者多个页面时，对所述一个或者多个页面中的每个页面分别进行如下操作：
在所述主题配置文件中，查找该页面对应的一个或多个页面颜色变量的值；其中，当页面颜色变量引用通用颜色变量时，将所引用的通用颜色变量的值作为该页面颜色变量的值；根据所查找到的页面颜色变量的值显示该页面中相应内容的颜色；其中，所述通用颜色变量为预定义的一个或多个变量。
在一个示例性实施例中，所述页面对应的页面颜色变量禁止引用其他页面的页面颜色变量。
在一个示例性实施例中，所述装置还包括确定模块，用于在接收模块接收对主题配置文件中通用颜色变量值的修改之前，根据默认的配色方案，确定主题配置文件中的通用颜色变量的值。
本申请提供一种定向投放内容的装置，包括处理器和存储器，其特征在于，所述存储器中存储有用于定向投放内容的程序；所述处理器用于读取所述用于定向投放内容的程序，执行上述任一项所述的方法。
本申请提供一种计算机存储介质，其上存储有计算机程序，其特征在于，所述计算机程序被处理器执行时实现上述任一项所述的方法。。
与相关技术相比，本申请包括通过定义通用颜色变量，多个页面的颜色变量引用通用颜色变量，从而在需要对多个页面颜色进行修改时，只需要对通用颜色变量进行修改即可实现多个页面颜色的修改，达到快速换肤的功能。
本申请的其它特征和优点将在随后的说明书中阐述，并且，部分地从说明书中变得显而易见，或者通过实施本申请而了解。本申请的其他优点可通过在说明书以及附图中所描述的方案来实现和获得。
附图说明
附图用来提供对本申请技术方案的理解，并且构成说明书的一部分，与本申请的实施例一起用于解释本申请的技术方案，并不构成对本申请技术方案的限制。
图1为本申请实施例页面显示方法流程图；
图2为本申请多个页面通用颜色变量示例一；
图3为本申请多个页面通用颜色变量示例二；
图4为本申请实施例页面显示装置模块示意图。
具体实施方式
本申请描述了多个实施例，但是该描述是示例性的，而不是限制性的，并且对于本领域的普通技术人员来说显而易见的是，在本申请所描述的实施例包含的范围内可以有更多的实施例和实现方案。尽管在附图中示出了许多可能的特征组合，并在具体实施方式中进行了讨论，但是所公开的特征的许多其它组合方式也是可能的。除非特意加以限制的情况以外，任何实施例的任何特征或元件可以与任何其它实施例中的任何其他特征或元件结合使用，或可以替代任何其它实施例中的任何其他特征或元件。
本申请包括并设想了与本领域普通技术人员已知的特征和元件的组合。本申请已经公开的实施例、特征和元件也可以与任何常规特征或元件组合，以形成由权利要求限定的独特的发明方案。任何实施例的任何特征或元件也可以与来自其它发明方案的特征或元件组合，以形成另一个由权利要求限定的独特的发明方案。因此，应当理解，在本申请中示出和/或讨论的任何特征可以单独地或以任何适当的组合来实现。因此，除了根据所附权利要求及其等同替换所做的限制以外，实施例不受其它限制。此外，可以在所附权利要求的保护范围内进行各种修改和改变。
此外，在描述具有代表性的实施例时，说明书可能已经将方法和/或过程呈现为特定的步骤序列。然而，在该方法或过程不依赖于本文所述步骤的特定顺序的程度上，该方法或过程不应限于所述的特定顺序的步骤。如本领域普通技术人员将理解的，其它的步骤顺序也是可能的。因此，说明书中阐述的步骤的特定顺序不应被解释为对权利要求的限制。此外，针对该方法和/或过程的权利要求不应限于按照所写顺序执行它们的步骤，本领域技术人员可以容易地理解，这些顺序可以变化，并且仍然保持在本申请实施例的精神和范围内。
如图1所示，本申请页面显示方法，包括如下步骤：
S1、接收更换配色方案的操作，并依据该操作对主题配置文件中相应的通用颜色变量的值进行修改；
S2、当打开一个或者多个页面时，对所述一个或者多个页面中的每个页面分别进行如下操作：
在所述主题配置文件中，查找该页面对应的一个或多个页面颜色变量的值；其中，当页面颜色变量引用通用颜色变量时，将所引用的通用颜色变量的值作为该页面颜色变量的值；根据所查找到的页面颜色变量的值显示该页面中相应内容的颜色；其中，所述通用颜色变量为预定义的一个或多个变量。
当需要对系统或者网页中多个页面更换颜色时，通过对多个页面共同引用的通用颜色变量即可实现对多个页面同时更换颜色。例如当出现特殊节日，需要将网页中所有页面的标题颜色修改为红色时，只需要通过对多个页面标题对应的页面颜色变量引用的通用颜色变量值修改为红色对应值即可对多个页面的标题颜色进行快速修改，不需要一个一个页面去修改标题的颜色。又如在系统开发过程中，当需要对系统中的多个页面的颜色进行调整时，可以通过多个页面的颜色变量引用的通用颜色变量进行修改从而对系统的多个页面的颜色进行快速修改，避免对多个页面单独进行修改带来的时间浪费。
在一个示例性实施例中，接收更换配色方案的操作，可以通过用户点击快捷键，或者在界面里用鼠标操作选择新的配色方案；或者直接进入配置文件中修改。
在一个示例性实施例中，所述页面对应的页面颜色变量禁止引用其他页面的页面颜色变量。
通过给每个页面或功能设置自己的颜色变量，该变量中引用定义好的通用变量，不引用其他颜色变量，从而能够更好的维护。
在一个示例性实施例中，所述方法基于SASS预编辑语言实现。
在一个示例性实施例中，步骤S1所述接收对主题配置文件中通用颜色变量值的修改之前，包括：
S3、根据默认的配色方案，确定主题配置文件中的通用颜色变量的值。其中，默认的配色方案可以为预先设定的配色方案，可以由设计师提供。
在一个示例性实施例中，所述主题配置文件为预定义variable.scss文件，在该文件中，将设计师提供的一系列配色，定义为通用颜色序列，然后给每个页面或功能设置自己的颜色变量。其中，variable.scss文件为变量文件。
在一个示例性实施例中，所述通用颜色变量包括其中至少之一：文字颜色变量、状态颜色变量、样式颜色变量、及图表配配色变量。
其中，文字颜色包括标题、正文、提示等等；状态颜色包括成功、进行中、失败等等；样式颜色包括背景色、边框等等。具体的，可以根据设计师给出一套配色方案；针对不同组件，出统一的设计规范，如：间距、字号、颜色等。
如图2所示，在主体配置文件中定义通用颜色变量，例如通用颜色序列中$white，值为#ffffff，以及配色方案中$bg-color：$white。其中通用颜色序列为系统常用颜色。系统不同的页面“用户管理”、“角色管理”中的颜色变量$system-user-bg-color引用通用颜色变量$bg-color。“用户管理”、“角色管理”中的颜色变量禁止引用其他模块中的颜色变量，例如：角色管理管理中的$rolor-bg-color禁止引用“角色管理”中的颜色变量$system-user-bg-color。当需要对页面进行快速换肤时，可以通过对通用颜色变量值进行修改，对于应用该通用变量的页面自动进行页面对于位置颜色的更改。
如图3所示，在主体配置文件中定义通用颜色变量，例如通用颜色序列中$black、$white、$gray-77；配色方案中的$main-color、$sub-color、$error-color、$success-color、$$bg-color。系统不同页面的文字配色中的颜色变量$title-color引用通用颜色变量$main-color、$text-color引用通用颜色变量$sub-color、$border-color引用通用颜色变量$gray-77、$success-text-color引用通用颜色变量$error-color。系统用户管理页面$system-user-bg-color引用通用颜色变量$bg-color、$system-user-text-color引用通用颜色变量$text-color、$system-user-border-color引用通用颜色变量$border–color。当需要对页面进行快速换肤时，可以通过对通用颜色变量值进行修改，对于应用该通用变量的页面自动进行页面对于位置颜色的更改。
如图4所示，本申请实施例一种页面显示装置，包括如下模块：
接收模块10，用于接收更换配色方案的操作，并依据该操作对主题配置文件中相应的通用颜色变量的值进行修改；
显示模块20，用于当打开一个或者多个页面时，对所述一个或者多个页面中的每个页面分别进行如下操作：
在所述主题配置文件中，查找该页面对应的一个或多个页面颜色变量的值；其中，当页面颜色变量引用通用颜色变量时，将所引用的通用颜色变量的值作为该页面颜色变量的值；根据所查找到的页面颜色变量的值显示该页面中相应内容的颜色；其中，所述通用颜色变量为预定义的一个或多个变量。
在一个示例性实施例中，所述页面对应的页面颜色变量禁止引用其他页面的页面颜色变量。
在一个示例性实施例中，所述装置还包括确定模块30，用于在接收模块10接收对主题配置文件中通用颜色变量值的修改之前，根据默认的配色方案，确定主题配置文件中的通用颜色变量的值。
本申请还一种定向投放内容的装置，包括处理器和存储器，其特征在于，所述存储器中存储有用于定向投放内容的程序；所述处理器用于读取所述用于定向投放内容的程序，执行上述中任一项所述的方法。
本申请还提供一种计算机存储介质，其上存储有计算机程序，其特征在于，所述计算机程序被处理器执行时实现上述中任一项所述的方法。
本领域普通技术人员可以理解，上文中所公开方法中的全部或某些步骤、系统、装置中的功能模块/单元可以被实施为软件、固件、硬件及其适当的组合。在硬件实施方式中，在以上描述中提及的功能模块/单元之间的划分不一定对应于物理组件的划分；例如，一个物理组件可以具有多个功能，或者一个功能或步骤可以由若干物理组件合作执行。某些组件或所有组件可以被实施为由处理器，如数字信号处理器或微处理器执行的软件，或者被实施为硬件，或者被实施为集成电路，如专用集成电路。这样的软件可以分布在计算机可读介质上，计算机可读介质可以包括计算机存储介质(或非暂时性介质)和通信介质(或暂时性介质)。如本领域普通技术人员公知的，术语计算机存储介质包括在用于存储信息(诸如计算机可读指令、数据结构、程序模块或其他数据)的任何方法或技术中实施的易失性和非易失性、可移除和不可移除介质。计算机存储介质包括但不限于RAM、ROM、EEPROM、闪存或其他存储器技术、CD-ROM、数字多功能盘(DVD)或其他光盘存储、磁盒、磁带、磁盘存储或其他磁存储装置、或者可以用于存储期望的信息并且可以被计算机访问的任何其他的介质。此外，本领域普通技术人员公知的是，通信介质通常包含计算机可读指令、数据结构、程序模块或者诸如载波或其他传输机制之类的调制数据信号中的其他数据，并且可包括任何信息递送介质。
Claims (10)
1.一种页面显示方法，其特征在于，包括：
接收更换配色方案的操作，并依据该操作对主题配置文件中相应的通用颜色变量的值进行修改；
当打开一个或者多个页面时，对所述一个或者多个页面中的每个页面分别进行如下操作：
在所述主题配置文件中，查找该页面对应的一个或多个页面颜色变量的值；其中，当页面颜色变量引用通用颜色变量时，将所引用的通用颜色变量的值作为该页面颜色变量的值；根据所查找到的页面颜色变量的值显示该页面中相应内容的颜色；其中，所述通用颜色变量为预定义的一个或多个变量。
2.根据权利要求1所述的方法，其特征在于，所述页面对应的页面颜色变量禁止引用其他页面的页面颜色变量。
3.根据权利要求1所述的方法，其特征在于，所述接收对主题配置文件中通用颜色变量值的修改之前，包括：
根据默认的配色方案，确定主题配置文件中的通用颜色变量的值。
4.根据权利要求1所述的方法，其特征在于，所述通用颜色变量包括其中至少之一：文字颜色变量、状态颜色变量、样式颜色变量、及图表配配色变量。
5.根据权利要求1所述的方法，其特征在于，所述方法基于SASS预编辑语言实现；所述主题配置文件为预定义variable.scss文件。
6.一种页面显示装置，其特征在于，包括：
接收模块，用于接收更换配色方案的操作，并依据该操作对主题配置文件中相应的通用颜色变量的值进行修改；
显示模块，用于当打开一个或者多个页面时，对所述一个或者多个页面中的每个页面分别进行如下操作：
在所述主题配置文件中，查找该页面对应的一个或多个页面颜色变量的值；其中，当页面颜色变量引用通用颜色变量时，将所引用的通用颜色变量的值作为该页面颜色变量的值；根据所查找到的页面颜色变量的值显示该页面中相应内容的颜色；其中，所述通用颜色变量为预定义的一个或多个变量。
7.根据权利要求6所述的装置，其特征在于，所述页面对应的页面颜色变量禁止引用其他页面的页面颜色变量。
8.根据权利要求6所述的装置，其特征在于，所述装置还包括确定模块，用于在接收模块接收对主题配置文件中通用颜色变量值的修改之前，根据默认的配色方案，确定主题配置文件中的通用颜色变量的值。
9.一种定向投放内容的装置，包括处理器和存储器，其特征在于，所述存储器中存储有用于定向投放内容的程序；所述处理器用于读取所述用于定向投放内容的程序，执行权利要求1-5中任一项所述的方法。
10.一种计算机存储介质，其上存储有计算机程序，其特征在于，所述计算机程序被处理器执行时实现如权利要求1-5中任一项所述的方法。
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202010086664.XA CN111310087A (zh) | 2020-02-11 | 2020-02-11 | 一种页面显示方法、装置、及存储介质 |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202010086664.XA CN111310087A (zh) | 2020-02-11 | 2020-02-11 | 一种页面显示方法、装置、及存储介质 |
Publications (1)
| Publication Number | Publication Date |
|---|---|
| CN111310087A true CN111310087A (zh) | 2020-06-19 |
Family
ID=71156428
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN202010086664.XA Pending CN111310087A (zh) | 2020-02-11 | 2020-02-11 | 一种页面显示方法、装置、及存储介质 |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN111310087A (zh) |
Citations (3)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| JP2001331809A (ja) * | 2000-05-23 | 2001-11-30 | Fuji Xerox Co Ltd | 配色支援装置および配色支援方法 |
| CN107329747A (zh) * | 2017-06-20 | 2017-11-07 | 福建中金在线信息科技有限公司 | 一种生成多主题样式的方法及装置 |
| CN109542434A (zh) * | 2018-10-25 | 2019-03-29 | 深圳点猫科技有限公司 | 一种基于编程语言的主题动态切换方法及电子设备 |
-
2020
- 2020-02-11 CN CN202010086664.XA patent/CN111310087A/zh active Pending
Patent Citations (3)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| JP2001331809A (ja) * | 2000-05-23 | 2001-11-30 | Fuji Xerox Co Ltd | 配色支援装置および配色支援方法 |
| CN107329747A (zh) * | 2017-06-20 | 2017-11-07 | 福建中金在线信息科技有限公司 | 一种生成多主题样式的方法及装置 |
| CN109542434A (zh) * | 2018-10-25 | 2019-03-29 | 深圳点猫科技有限公司 | 一种基于编程语言的主题动态切换方法及电子设备 |
Non-Patent Citations (1)
| Title |
|---|
| MARTSFOREVER: ""Vue基于sass实现切换主题"", 《CSDN》 * |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| US11086638B2 (en) | Method and apparatus for loading application | |
| CN105700925B (zh) | 一种app的界面实现方法和装置 | |
| CN110502298B (zh) | 一种用于提供电子书的更新提醒信息的方法与设备 | |
| CN104572668B (zh) | 基于多个样式文件生成合并样式文件的方法和设备 | |
| CN111443912A (zh) | 基于组件的页面渲染方法、装置、计算机设备和存储介质 | |
| CN112948039A (zh) | 页面显示方法、装置、设备及存储介质 | |
| CN108416679A (zh) | 多保险产品出单的装置、方法及计算机可读存储介质 | |
| CN111078221A (zh) | 页面颜色主题的切换方法、装置、存储介质及电子设备 | |
| CN112099891A (zh) | 弹窗展示方法、装置、电子设备及计算机可读存储介质 | |
| CN110806866A (zh) | 一种前端管理系统的生成方法及装置 | |
| CN103902562A (zh) | 一种终端数据库升级方法及相关装置 | |
| CN112035117A (zh) | 页面展示系统、方法及装置 | |
| CN105159673A (zh) | 一种设置控件样式的方法和装置 | |
| CN114638200A (zh) | 电子书排版样式代码生成方法、装置、设备及存储介质 | |
| CN111310087A (zh) | 一种页面显示方法、装置、及存储介质 | |
| CN112631648A (zh) | 一种服务配置方法、装置、电子设备及存储介质 | |
| CN112560403A (zh) | 文本的处理方法及装置、电子设备 | |
| CN110990799A (zh) | 一种反爬虫的数据处理方法、装置、系统及存储介质 | |
| CN113868565B (zh) | 皮肤样式的文件编辑方法及装置 | |
| CN112988810A (zh) | 信息查找方法、装置及设备 | |
| CN112667298A (zh) | 显卡配置项的设置方法以及装置、存储介质、电子装置 | |
| CN112835494A (zh) | 一种语音识别结果纠错方法及装置 | |
| CN114422858B (zh) | 一种Linux智能电视皮肤快速生成方法、系统、设备及介质 | |
| CN116136760B (zh) | 浏览器的原生选择器替换方法、装置、设备及存储介质 | |
| CN115167854A (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 |
Application publication date: 20200619 |
|
| RJ01 | Rejection of invention patent application after publication |