CN115220847A - 移动应用主题的切换方法、移动应用系统、设备及介质 - Google Patents

Abstract

本发明提出了一种移动应用主题的切换方法、移动应用系统、设备及介质，涉及移动端应用领域、前端技术领域，切换方法应用于移动应用系统中，移动应用系统包括原生应用APP和H5组件，包括：H5组件全局监听移动终端的系统主题；当移动终端的系统主题切换时，原生应用APP获取移动终端的当前系统主题；H5组件从原生应用APP中获取当前系统主题；H5组件根据当前系统主题从预设H5主题库中选择与其相对应的H5主题变量文件；H5组件将移动应用系统切换为与选择的H5主题变量文件相对应的H5主题模式。本发明能够增强用户体验，增加用户粘度，同时所建立的组件库可以作为独立的库提供给同类产品，且使用方可以快捷地生成自己的H5主题库，应用于新的移动应用。

Description

移动应用主题的切换方法、移动应用系统、设备及介质

技术领域

本发明涉及移动端应用领域、前端技术领域，具体涉及了一种移动应用主题的切换方法、移动应用系统、设备及介质。

背景技术

一个移动应用的组件是这个产品对用户最直观地一个展现，随着互联网发展，移动应用的用户体验也越来越重要，ios系统为了优化用户体验建议一些移动应用提供跟随系统变化的暗黑主题模式；而一些用户也对移动应用的主题有一定的倾向性，所以主题切换就成了移动应用增强用户体验比较重要的一个功能。随着前端技术的发展，现在有些移动应用采用h5混合开发模式，移动应用的界面大多由h5完成，于是移动应用的主题切换就需要和h5一起配合实现。

目前很多实现方案大多需要操作DOM，操作DOM导致的卡顿对于用户而言都不是很友好；并且他们大多不考虑图片的切换，这种切换方式更加适合图片量少的管理系统而不适合一些图片较多的移动应用。

发明内容

鉴于以上所述现有技术的缺点，本发明提供一种移动应用主题的切换方法、移动应用系统、设备及介质，以解决现有技术中主题切换方案大多需要操作DOM，操作DOM导致的卡顿对于用户而言都不是很友好；并且他们大多不考虑图片的切换，这种切换方式更加适合图片量少的管理系统而不适合一些图片较多的移动应用的问题。

为了实现上述目的及其他相关目的，本发明采用的技术方案如下，本发明提出一种移动应用主题的切换方法，所述切换方法应用于移动应用系统中，所述移动应用系统包括原生应用APP和H5组件，所述切换方法包括：

所述H5组件全局监听移动终端的系统主题；

当所述移动终端的系统主题切换时，所述原生应用APP获取所述移动终端的当前系统主题；

所述H5组件从所述原生应用APP中获取所述移动终端的当前系统主题；

所述H5组件根据所述移动终端的当前系统主题从预设H5主题库中选择与其相对应的H5主题变量文件，每个所述H5主题变量文件对应一个H5主题模式；

所述H5组件将所述移动应用系统的H5主题模式切换为与选择的所述H5主题变量文件相对应的H5主题模式。

在本发明的一个实施例中，所述原生应用APP获取所述移动终端的当前系统主题的步骤包括：

原生应用APP捕捉移动终端切换系统主题的动作，原生应用APP获取切换后的系统主题为所述当前系统主题。

在本发明的一个实施例中，所述H5组件通过cordova框架调用所述原生应用APP的插件来获取所述移动终端的当前系统主题。

在本发明的一个实施例中，所述H5主题变量文件包括H5主题模式所需要的H5主题变量及对应的变量值；

所述H5组件将所述移动应用系统的H5主题模式切换为与选择的所述H5主题变量文件相对应的H5主题模式，包括：

所述H5组件根据选择的所述H5主题变量文件来更改当前H5主题模式中除图片以外的主题变量的变量值；

所述H5组件根据所述H5主题变量文件来更改当前H5主题模式中图片的地址，以完成所述H5主题模式的切换。

在本发明的一个实施例中，移动应用主题的切换方法还包括：

创建H5主题库；

将所述H5主题库与所述原生应用APP相关联，并将所述H5主题库中的任一主题模式设置为所述H5组件的默认主题。

在本发明的一个实施例中，所述创建H5主题库的步骤包括：

接收创建所述H5主题模式所需的变量，并对每个所述变量进行规范命名以获取变量名称；

根据所述变量名称创建不同主题模式的变量文件，并将所述创建的变量文件分别存放在同层级文件夹下的不同文件内，且不同H5主题模式的变量文件中的变量名称相同，且一一对应；

将所述变量文件作为组件库的各个组件以创建不同的主题样式，以作为H5主题库。

本发明还提出一种移动应用系统，包括原生应用APP和H5组件，所述原生应用APP通过cordova框架与所述H5组件建立通信；

所述原生应用APP包括：

系统主题捕捉模块，用于当所述移动终端的系统主题切换时，所述原生应用APP获取所述移动终端的当前系统主题；

网页加载模块，用于加载所述H5组件；

通信模块，用于将当前系统主题发送至所述H5组件；

所述H5组件包括：

主题状态获取模块，用于从接收来自所述通信模块发送的所述当前系统主题；

全局状态管理模块，用于全局监听移动终端的系统主题；

主题模式更改模块，用于根据所述移动终端的当前系统主题从预设H5主题库中选择与其相对应的H5主题变量文件，以及用于将所述移动应用系统的H5主题模式切换为与选择的所述H5主题变量文件相对应的H5主题模式。

在本发明的一个实施例中，所述主题模式更改模块中存储有预先设置好的H5主题库。

本发明还提出一种电子设备，所述电子设备包括：

一个或多个处理器；

存储装置，用于存储一个或多个程序，当所述一个或多个程序被所述一个或多个处理器执行时，使得所述电子设备实现如上述实施例中任一项所述移动应用主题的切换方法。

本发明还提出一种计算机可读存储介质，其上存储有计算机程序，当所述计算机程序被计算机的处理器执行时，使计算机执行上述实施例中任一项所述移动应用主题的切换方法。

本发明的有益效果：本发明提出一种移动应用主题的切换方法、系统及移动应用系统，能够增强用户体验，增加用户粘度，同时可以因ios推荐使用跟随系统的暗黑模式，该发明可减少ios上架被拒概率，同时所建立的组件库可以作为一个独立的库提供给同类产品，且使用方可以快捷地生成自己的H5主题库，应用于新的移动应用，可以使应用该发明的App在作为软件工具开发包提供给他人时，不需要因为主题的更改而重新定制一套移动应用，节省开发时间与沟通成本。

应当理解的是，以上的一般描述和后文的细节描述仅是示例性和解释性的，并不能限制本申请。

附图说明

此处的附图被并入说明书中并构成本说明书的一部分，示出了符合本申请的实施例，并与说明书一起用于解释本申请的原理。显而易见地，下面描述中的附图仅仅是本申请的一些实施例，对于本领域普通技术者来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他的附图。在附图中：

图1是本申请的一示例性实施例示出的移动应用主题的切换装置的应用场景示意图。

图2是本申请的一示例型实施例中提出的一种移动应用主题的切换方法的流程图。

图3是本申请的一示例型实施例中提出的创建H5主题库的步骤的流程图。

图4是本申请的一示例型实施例中提出切换为相应的H5主题模式的步骤的流程图。

图5是本申请的一示例型实施例中提出的移动应用系统的结构框图。

图6是适于用来实现本申请实施例的电子设备的计算机系统的结构示意图。

标号说明：

移动终端100；移动应用系统500；原生应用APP510；cordova框架520；H5组件530；系统主题捕捉模块511；网页加载模块512；通信模块513；主题状态获取模块531；全局状态管理模块532；主题模式更改模块533；字体图标矢量图更改模块534；电子设备600。

具体实施方式

以下将参照附图和优选实施例来说明本发明的实施方式，本领域技术人员可由本说明书中所揭露的内容轻易地了解本发明的其他优点与功效。本发明还可以通过另外不同的具体实施方式加以实施或应用，本说明书中的各项细节也可以基于不同观点与应用，在没有背离本发明的精神下进行各种修饰或改变。应当理解，优选实施例仅为了说明本发明，而不是为了限制本发明的保护范围。

需要说明的是，以下实施例中所提供的图示仅以示意方式说明本发明的基本构想，遂图式中仅显示与本发明中有关的组件而非按照实际实施时的组件数目、形状及尺寸绘制，其实际实施时各组件的型态、数量及比例可为一种随意的改变，且其组件布局型态也可能更为复杂。

在下文描述中，探讨了大量细节，以提供对本发明实施例的更透彻的解释，然而，对本领域技术人员来说，可以在没有这些具体细节的情况下实施本发明的实施例是显而易见的，在其他实施例中，以方框图的形式而不是以细节的形式来示出公知的结构和设备，以避免使本发明的实施例难以理解。

首先需要说明的是，HTML5是第五代超文本标记语言/标准，是构建Web内容的一种语言描述方式，基于此标准形成的组件称作H5组件，现有的移动终端app软件多采用H5开发完成，新一代网络标准能够让程序通过Web浏览器，消费者从而能够从包括个人电脑、笔记本电脑、智能移动终端或平板电脑在内的任意终端访问相同的程序和基于云端的信息。HTML5允许程序通过Web浏览器运行，并且将视频等目前需要插件和其它平台才能使用的多媒体内容也纳入其中，这将使浏览器成为一种通用的平台，用户通过浏览器就能完成任务。由于HTML5技术中存在较为先进的本地存储技术，所以其能做到降低应用程序的响应时间为用户带来更便捷的体验。原生应用APP即为移动终端内部的APP应用，例如：微信APP、支付宝APP等软件应用程序，原生应用APP中包括Webview模块，WebView模块是一个基于WebKit引擎、展现Web组件的控件。

图1是本申请的一示例性实施例示出的移动应用主题的切换装置的应用场景示意图。如图1所示，本实施例中，将该移动应用系统500配置在移动终端100的原生应用APP510内，当所述移动终端100的主题模式切换过后，通过所述原生应用APP510来获取所述移动终端100的当前系统主题，并且根据该移动终端100的当前系统主题来从预先设置的H5主题库里面匹配H5组件530的主题模式，以实现对H5组件530的主题模式的修改。

其中，图1所示的移动终端100可以是智能移动终端、车载电脑、平板电脑或者笔记本电脑等任意支持安装内置有所述移动应用系统100的电子设备，但并不限于此。

现有技术中主题切换方案大多需要操作DOM，操作DOM导致的卡顿对于用户而言都不是很友好；并且他们大多不考虑图片的切换，这种切换方式更加适合图片量少的管理系统而不适合一些图片较多的移动应用的问题，即现有的web前端主题修改的方法中并没有与原生应用APP交互的过程，缺乏自动获取移动终端系统当前主题模式的机制，也没有切换图片的机制；并且需要操作大量的DOM，会导致切换过程中的组件卡顿，因此存在一定的局限性。为解决这些问题，本申请的实施例分别提出一种移动应用主题的切换方法、一种移动应用主题的切换装置以及一种移动应用系统，以下将对这些实施例进行详细描述。

请参阅图2所示，图2是本申请的一示例型实施例中提出的一种移动应用主题的切换方法的流程图，该方法可应用于如图1所示的实施环境，应该理解的是，该方法也可以适用于其它的示例性实施环境，并由其它实施环境中的设备具体执行，本实施例不对该方法所适用的实施环境进行限制。

请参阅图2所示，在一示例性的实施例中，所述切换方法应用于移动应用系统500中，所述移动应用系统500包括原生应用APP510和H5组件530，至少包括步骤S110至S115，详细描述如下：

步骤S110，所述H5组件全局监听移动终端100的系统主题。

需要说明的是，移动终端100指的是智能手机、车载电脑、平板电脑或者笔记本电脑等任意支持安装内置有移动应用系统的电子设备，所述移动应用系统可应用所述移动主题的切换方法。

步骤S120，当所述移动终端的系统主题切换时，所述原生应用APP获取所述移动终端的当前系统主题，其中，原生应用APP510捕捉移动终端切换系统主题的动作，原生应用APP510获取切换后的系统主题为所述当前系统主题。

具体的，用户切换移动终端系统的系统主题，其中，用户在移动终端100上进行系统主题的切换操作，该移动终端100的原生应用APP510系统捕捉用户的操作，并记录当前用户选择的系统主题，即用户切换后选择的主题为当前系统主题。

需要说明的是，启动原生应用APP时，所述原生应用APP的通过调用Api来获取移动终端系统的当前系统主题，并且通过创建一个Webview窗口，以加载H5组件530，所述H5组件530从所述移动终端100中的原生应用APP510获取所述当前系统主题。

步骤S130，所述H5组件从所述原生应用APP中获取所述移动终端的当前系统主题，具体的，所述H5组件530通过cordova框架520调用所述原生应用APP510的插件来获取所述移动终端的当前系统主题。其中，Cordova提供了原生应用APP与H5组件沟通的桥梁，H5组件通过cordova框架获取所述当前系统主题。

步骤S140，所述H5组件根据所述移动终端的当前系统主题从预设H5主题库中选择与其相对应的H5主题变量文件，其中，每个所述H5主题变量文件对应一个H5主题模式；其中，H5组件从原生APP510中获取当前系统主题，再根据当前系统主题在预设的H5主题库中选择与所述当前系统主题向对应的H5主题变量文件，该所述H5主题变量文件包括H5主题模式所需要的H5主题变量及对应的变量值，根据H5主题变量及对应的变量值来更改所述H5主题模式。

请参阅图2所示，移动应用主题的切换方法还包括：创建H5主题库，并且将所述H5主题库与所述移动终端内的原生应用APP相关联，并将所述H5主题库中的任一主题模式设置为原生应用APP所加载的H5组件的默认主题。例如，可以在所述H5组件中采用连接的方式引入所创建的H5主题库，以将所述H5主题库与所述移动终端内的原生应用APP相关联。

请参阅图3所示，图3是本申请的一示例型实施例中提出的创建H5主题库的步骤的流程图。具体的，创建H5主题库的步骤包括：

步骤S310，接收创建所述H5主体模式所需的变量，并对每个所述变量进行规范命名以获取变量名称；具体的，可以根据设计图来提取所需的变量，例如，所述变量包括字体的样式、字体的大小、字体的颜色、图片格式以及图片的大小等变量，在接收接收创建所述H5主体模式所需的变量，并对每个所述变量进行规范命名以获取变量名称。

步骤S320，根据所述变量名称创建不同主题模式的变量文件，并将所述创建的变量文件分别存放在同层级文件夹下的不同文件内；需要说明的是，不同主题模式的变量文件中的变量名称相同，且一一对应。

步骤S330，将步骤S320中所述创建的所有所述变量文件作为组件库的各个组件，再利用该组件库中的所有组件之间的搭配以创建不同的主题样式，以作为H5主题库。

还需要说明的是，在一些实施例中，还可以通过与使用者沟通好所有主题变量文件的存储位置，使用者根据自己的需求按照步骤S310至S320的方法创建好他想要的H5主题库，并且将该H5主题库以呈SDK的形式提供给使用者，该方法将H5主题库与组件库融合，并且每个主题变量文件分别存储，在将其作为SDK提供给其他人使用者时，使用者可以方便地对主题模式进行增删改查，而不需要提供方为使用者进行定制化开发。

步骤S150，所述H5组件将所述移动应用系统的H5主题模式切换为与选择的所述H5主题变量文件相对应的H5主题模式；

其中，请参阅图4所示，图4是本申请的一示例型实施例中提出切换为相应的H5主题模式的步骤的流程图。所述H5组件将所述移动应用系统的H5主题模式切换为与选择的所述H5主题变量文件相对应的H5主题模式，包括：

S410、所述H5组件根据选择的所述H5主题变量文件来更改当前H5主题模式中除图片以外的主题变量的变量值；

S420，所述H5组件根据所述H5主题变量文件来更改当前H5主题模式中图片的地址，以完成所述H5主题模式的切换。需要说明的是，当前H5主题模式中的图片以地址的形式存储，需要时，通过调用该地址来实现图片的切换。

综上，所述切换方法能够解决现有方法中并没有与原生应用APP交互的过程，缺乏自动获取移动终端系统当前主题模式的机制，也没有切换图片的机制的问题，同时还能够解决现有切换过程需要操作大量的DOM,会导致切换过程中的组件卡顿的问题，从而能够增强用户体验，增加用户粘度，同时可以因ios推荐使用跟随系统的暗黑模式，使得该APP可减少ios上架被拒概率。

请参阅图5所示，图5是本申请的一示例型实施例中提出的移动应用的切换装置的结构框图。该装置可以应用于图1所示的实施环境，并具体配置在智能终端中。该装置也可以适用于其它的示例性实施环境，并具体配置在其它设备中，本实施例不对该装置所适用的实施环境进行限制。

请参阅图5所示，图5是本申请的一示例型实施例中提出的移动应用系统的结构框图。该移动应用系统500可以应用于图1所示的实施环境，并具体配置在智能终端中。该移动应用系统500也可以适用于其它的示例性实施环境，并具体配置在其它设备中，本实施例不对该装置所适用的实施环境进行限制。

请参阅图5所示，该示例性的移动应用系统500包括原生应用APP510、cordova框架520和H5组件530，其中，所述原生应用APP510通过cordova框架520与所述H5组件530建立通信。

请参阅图5所示，在本实施例中，所述原生应用APP510包括系统主题捕捉模块511、网页加载模块512以及通信模块513，具体的，

系统主题捕捉模块511用于当所述移动终端的系统主题切换时，所述原生应用APP获取所述移动终端的当前系统主题，例如，用户在移动终端上进行系统主题的切换操作，该移动终端的原生应用APP系统捕捉用户的操作，并记录当前用户选择的系统主题，即用户切换后选择的主题为当前系统主题。

网页加载模块512用于通过所述cordova框架520启动加载所述H5组件，例如，所述网页加载模块512通过创建一个Webview窗口，以加载H5组件。

通信模块513用于将当前系统主题发送至所述H5组件，例如通过所述cordova框架520将当前系统主题发送至所述H5组件，所述通信模块513通过所述cordova框架与所述H5组件530建立通讯，以将当前系统主题发送至所述H5组件。另外，所述通信模块513通过调用Api，以使得所述系统主题捕捉模块511获取移动终端系统的当前系统主题，并将当前系统主题发送至H5组件中的主题状态获取模块531。

请参阅图5所示，在本实施例中，所述H5组件包括主题状态获取模块531、全局状态管理模块532和主题模式更改模块533。

主题状态获取模块531用于接收来自所述通信模块发送的所述当前系统主题，其中，用户在移动终端上进行系统主题的切换操作，该移动终端的原生应用APP系统捕捉用户的操作，并记录当前用户选择的系统主题，即用户切换后选择的主题为当前系统主题。

全局状态管理模块532用于全局监听移动终端的系统主题，具体的，全局监听移动终端中的原生应用APP获取到的所述当前系统主题下的主题变量。另外，主题状态获取模块510获取到当前系统主题后将其存储至全局状态管理模块532中的全局变量模块中，再根据所述移动终端的当前系统主题从预设H5主题库中选择与其相对应的H5主题变量文件，需要说明的是，全局变量模块包括但不限于VUEX模块、sessonStorage模块以及localStorage模块等可用于全局通讯的模块。

主题更改模块533用于根据所述移动终端的当前系统主题从预设H5主题库中选择与其相对应的H5主题变量文件，以及用于将所述移动应用系统的H5主题模式切换为与选择的所述H5主题变量文件相对应的H5主题模式。其中，所述H5组件将所述移动应用系统的H5主题模式切换为与选择的所述H5主题变量文件相对应的H5主题模式，包括：所述H5组件根据选择的所述H5主题变量文件来更改当前H5主题模式中除图片以外的主题变量的变量值，以及所述H5组件根据所述H5主题变量文件来更改当前H5主题模式中图片的地址，以完成所述H5主题模式的切换。

所述H5组件530还包括字体图标矢量图更改模块534，所述字体图标矢量图更改模块534用于将移动终端内原始应用APP和H5组件中的小图标转换成字体类型，以便于在更改字体颜色时改变图标的颜色。需要说明的是，在所述主题更改模块30中存储有预先根据步骤S210至步骤S212所创建设置好的H5主题库，具体的，该H5主题库可存储在述主题更改模块30内。

综上，本发明提出一种移动应用主题的切换方法、系统及移动应用系统，能够增强用户体验，增加用户粘度，同时可以因ios推荐使用跟随系统的暗黑模式，该发明可减少ios上架被拒概率，同时所建立的组件库可以作为一个独立的库提供给同类产品，且使用方可以快捷地生成自己的H5主题库，应用于新的移动应用，可以使应用该发明的App在作为软件工具开发包提供给他人时，不需要因为主题的更改而重新定制一套移动应用，节省开发时间与沟通成本。

本申请的实施例还提供了一种电子设备600，包括：一个或多个处理器；存储装置，用于存储一个或多个程序，当所述一个或多个程序被所述一个或多个处理器执行时，使得所述电子设备实现上述各个实施例中提供的主题切换方法。

图6是示出了适于用来实现本申请实施例的电子设备的计算机系统的结构示意图。需要说明的是，图6示出的电子设备的计算机系统仅是一个示例，不应对本申请实施例的功能和使用范围带来任何限制。

如图6所示，计算机系统包括中央处理单元(Central Processing Unit，CPU)，其可以根据存储在只读存储器(Read-Only Memory，ROM)中的程序或者从储存部分加载到随机访问存储器(Random Access Memory，RAM)中的程序而执行各种适当的动作和处理，例如执行上述实施例中所述的方法。

需要说明的是，本申请实施例所示的计算机可读介质可以是计算机可读信号介质或者计算机可读存储介质或者是上述两者的任意组合。计算机可读存储介质例如可以是电、磁、光、电磁、红外线或半导体的系统、装置或器件，或者任意以上的组合。计算机可读存储介质的更具体的例子可以包括但不限于：具有一个或多个导线的电连接、便携式计算机磁盘、硬盘、随机访问存储器(RAM)、只读存储器(ROM)、可擦式可编程只读存储器(ErasableProgrammable Read Only Memory，EPROM)、闪存、光纤、便携式紧凑磁盘只读存储器(Compact Disc Read-Only Memory，CD-ROM)、光存储器件、磁存储器件，或者上述的任意合适的组合。计算机可读的信号介质还可以是计算机可读存储介质以外的任何计算机可读介质，该计算机可读介质可以发送、传播或者传输用于由指令执行系统、装置或者器件使用或者与其结合使用的程序。计算机可读介质上包含的计算机程序可以用任何适当的介质传输，包括但不限于：无线、有线等等，或者上述的任意合适的组合。

附图中的流程图和框图，图示了按照本申请各种实施例的系统、方法和计算机程序产品的可能实现的体系架构、功能和操作。其中，流程图或框图中的每个方框可以代表一个模块、程序段或代码的一部分，上述模块、程序段或代码的一部分包含一个或多个用于实现规定的逻辑功能的可执行指令。也应当注意，在有些作为替换的实现中，方框中所标注的功能也可以以不同于附图中所标注的顺序发生。例如，两个接连地表示的方框实际上可以基本并行地执行，它们有时也可以按相反的顺序执行，这依所涉及的功能而定。也要注意的是，框图或流程图中的每个方框、以及框图或流程图中的方框的组合，可以用执行规定的功能或操作的专用的基于硬件的系统来实现，或者可以用专用硬件与计算机指令的组合来实现。

描述于本申请实施例中所涉及到的单元可以通过软件的方式实现，也可以通过硬件的方式来实现，所描述的单元也可以设置在处理器中。其中，这些单元的名称在某种情况下并不构成对该单元本身的限定。

本申请的另一方面还提供了一种计算机可读存储介质，其上存储有计算机程序，该计算机程序被计算机的处理器执行时，使计算机执行如前所述的主题的切换方法。该计算机可读存储介质可以是上述实施例中描述的电子设备中所包含的，也可以是单独存在，而未装配入该电子设备中。

本申请的另一方面还提供了一种计算机程序产品或计算机程序，该计算机程序产品或计算机程序包括计算机指令，该计算机指令存储在计算机可读存储介质中。计算机设备的处理器从计算机可读存储介质读取该计算机指令，处理器执行该计算机指令，使得该计算机设备执行上述各个实施例中提供的主题的切换方法。

上述实施例仅示例性说明本发明的原理及其功效，而非用于限制本发明。任何熟悉此技术的人士皆可在不违背本发明的精神及范畴下，对上述实施例进行修饰或改变。因此，但凡所属技术领域中具有通常知识者在未脱离本发明所揭示的精神与技术思想下所完成的一切等效修饰或改变，仍应由本发明的权利要求所涵盖。

Claims (10)

1.一种移动应用主题的切换方法，其特征在于，所述切换方法应用于移动应用系统中，所述移动应用系统包括原生应用APP和H5组件，所述切换方法包括：

所述H5组件全局监听移动终端的系统主题；

当所述移动终端的系统主题切换时，所述原生应用APP获取所述移动终端的当前系统主题；

所述H5组件从所述原生应用APP中获取所述移动终端的当前系统主题；

所述H5组件根据所述移动终端的当前系统主题从预设H5主题库中选择与其相对应的H5主题变量文件，每个所述H5主题变量文件对应一个H5主题模式；

所述H5组件将所述移动应用系统的H5主题模式切换为与选择的所述H5主题变量文件相对应的H5主题模式。

2.根据权利要求1所述的移动应用主题的切换方法，其特征在于，所述原生应用APP获取所述移动终端的当前系统主题的步骤包括：

原生应用APP捕捉移动终端切换系统主题的动作，原生应用APP获取切换后的系统主题为所述当前系统主题。

3.根据权利要求1所述的移动应用主题的切换方法，其特征在于，所述H5组件通过cordova框架调用所述原生应用APP的插件来获取所述移动终端的当前系统主题。

4.根据权利要求1所述的移动应用主题的切换方法，其特征在于，所述H5主题变量文件包括H5主题模式所需要的H5主题变量及对应的变量值；

所述H5组件将所述移动应用系统的H5主题模式切换为与选择的所述H5主题变量文件相对应的H5主题模式，包括：

所述H5组件根据选择的所述H5主题变量文件来更改当前H5主题模式中除图片以外的主题变量的变量值；

所述H5组件根据所述H5主题变量文件来更改当前H5主题模式中图片的地址，以完成所述H5主题模式的切换。

5.根据权利要求1所述的移动应用主题的切换方法，其特征在于，移动应用主题的切换方法还包括：

创建H5主题库；

将所述H5主题库与所述原生应用APP相关联，并将所述H5主题库中的任一主题模式设置为所述H5组件的默认主题。

6.根据权利要求5所述的移动应用主题的切换方法，其特征在于，所述创建H5主题库的步骤包括：

接收创建所述H5主题模式所需的变量，并对每个所述变量进行规范命名以获取变量名称；

根据所述变量名称创建不同主题模式的变量文件，并将所述创建的变量文件分别存放在同层级文件夹下的不同文件内，且不同H5主题模式的变量文件中的变量名称相同，且一一对应；

将所述变量文件作为组件库的各个组件以创建不同的主题样式，以作为H5主题库。

7.一种移动应用系统，其特征在于，包括原生应用APP和H5组件，所述原生应用APP通过cordova框架与所述H5组件建立通信；

所述原生应用APP包括：

系统主题捕捉模块，用于当所述移动终端的系统主题切换时，所述原生应用APP获取所述移动终端的当前系统主题；

网页加载模块，用于加载所述H5组件；

通信模块，用于将当前系统主题发送至所述H5组件；

所述H5组件包括：

主题状态获取模块，用于接收来自所述通信模块发送的所述当前系统主题；

全局状态管理模块，用于全局监听移动终端的系统主题；

主题模式更改模块，用于根据所述移动终端的当前系统主题从预设H5主题库中选择与其相对应的H5主题变量文件，以及用于将所述移动应用系统的H5主题模式切换为与选择的所述H5主题变量文件相对应的H5主题模式。

8.根据权利要求7所述的移动应用系统，其特征在于，所述主题模式更改模块中存储有预先设置好的H5主题库。

9.一种电子设备，其特征在于，所述电子设备包括：

一个或多个处理器；

存储装置，用于存储一个或多个程序，当所述一个或多个程序被所述一个或多个处理器执行时，使得所述电子设备实现如权利要求1至6中任一项所述移动应用主题的切换方法。

10.一种计算机可读存储介质，其特征在于，其上存储有计算机程序，当所述计算机程序被计算机的处理器执行时，使计算机执行权利要求1至6中任一项所述移动应用主题的切换方法。

Images