CN108008952A - 移动终端页面动态布局方法及系统 - Google Patents

Abstract

本发明公开了一种移动终端页面动态布局方法包括，根据常用UI布局制定移动终端与ERP管理系统之间的UI布局模板协议；根据设定的UI布局模板协议，在ERP管理系统中定制UI布局模板类型，填充数据内容；根据设定的UI布局模板协议，在移动终端中设定用户权限参数、用户属性参数和与在ERP管理系统中定制UI布局模板类型相匹配的UI布局模板属性参数；移动终端根据用户需求选择UI布局模板类型和数据内容，并进行动态拼接生成用户所需的UI布局；本发明还公开了一种移动终端页面动态布局系统，该系统包括移动终端，移动终端通过通信方式连接ERP管理系统。本发明能使UI布局模板与移动终端分离，节约了内存，降低了网络传输时间，保证了页面的流畅性。

Description

移动终端页面动态布局方法及系统

技术领域

本发明涉及移动通信技术领域，具体涉及基于ERP的移动终端页面动态布局方法及系统。

背景技术

随着移动互联的高速发展以及智能手机的普及，越来越多的传统和非传统行业逐渐步入了智能化移动化的工作新模式，通过用安装在移动终端上的应来完成日常生活工作也越来越普遍，因此安装在移动终端上的应用需求爆发式增长，移动终端通常指手机、平板电脑、智能手表等移动设备。

就目前而言，应用在移动终端的原生用户界面(UI)布局通常固定在每个版本中，当用户有新的样式需求时，运营人员无法根据用户需求快速调整移动终端整体用户界面布局。

发明内容

为解决上述问题，本发明的目的在于提供一种基于ERP的移动终端页面动态布局方法及系统。

为了实现以上目的，本发明采用如下技术方案：

一种移动终端页面动态布局方法，该方法包括以下步骤：

根据常用UI布局制定移动终端与ERP管理系统之间的UI布局模板协议；根据设定的UI布局模板协议，在所述ERP管理系统中定制UI布局模板类型，填充数据内容；根据设定的UI布局模板协议，在所述移动终端中设定用户权限参数、用户属性参数和与在所述ERP管理系统中定制UI布局模板类型相匹配的UI布局模板属性参数；移动终端根据用户需求选择UI布局模板类型和数据内容，并进行动态拼接生成用户所需的UI布局。

在设定UI布局模板协议之前，先收集移动终端常规常用的UI布局。

一种移动终端页面动态布局系统，该系统包括移动终端和ERP管理系统，移动终端通信连接ERP管理系统；所述移动终端用于设定用户权限参数、用户属性参数和与UI布局模板属性参数；所述ERP管理系统用于存储根据UI布局模板协议定制的UI布局模板类型。

所述UI布局模板类型包括图片模块、文字模块、图文结合模块和空格模块。

所述图片模块还包括轮播图模块、纯图片模块、二等分图片模块、三等分图片模块、四等分图片模块。

所述图文结合模块包括左图右文模块、左文右图模块、上图下文模块和上文下图模块。

所述UI布局模块还包括闪购促销模块和商品推荐模块。

在所述ERP管理系统中设置有监听模块，监听模块用于监听闪购促销模块中的时间。

所述用户权限参数包括普通用户和管理员，用户属性参数包括国家、语言、购买率、新老用户、浏览记录和用户移动终端屏幕大小。

所述UI布局模板属性参数包括UI布局模板显示的位置和顺序、布局模板类型。

与现有技术相比，采用上述方案的本发明具有以下优点：1、当用户提出需求时，运营人员可根据用户需求快速从ERP管理系统上选取所需的UI布局模板类型和数据内容，并进行快速拼接；2、使UI布局模板类型模块化，降低了运营人员的劳动强度，进而降低了维护成本；3、能使UI布局模板与移动终端分离，节约了移动终端内存，降低了网络传输时间，保证了页面的流畅性。

附图说明

图1是本发明提供的一种移动终端页面动态布局方法实施例1的步骤流程图；

图2是本发明提供的一种移动终端页面动态布局系统实施例2的结构框图。

具体实施方式

为使本发明要解决的技术问题、技术方案和优点更加清楚，下面将结合附图及具体实施例进行详细描述。

实施例1

如图1所示，本实施例提供的一种移动终端页面动态布局方法，该方法包括以下步骤：

S101，先收集移动终端常规常用的UI布局；

S102，根据常用UI布局制定移动终端与ERP管理系统之间的UI布局模板协议；

S103，根据设定的UI布局模板协议，在所述ERP管理系统中定制UI布局模板类型，填充数据内容；根据设定的UI布局模板协议，在所述移动终端中设定用户权限参数、用户属性参数和与在所述ERP管理系统中定制UI布局模板类型相匹配的UI布局模板属性参数；

S104，移动终端根据用户需求选择UI布局模板类型和数据内容，并进行动态拼接生成用户所需的UI布局。

实施例2

如图2所示，一种移动终端页面动态布局系统，该系统包括移动终端和ERP管理系统，移动终端通信连接ERP管理系统；所述移动终端用于设定用户权限参数、用户属性参数和与UI布局模板属性参数；所述ERP管理系统用于存储根据UI布局模板协议定制的UI布局模板类型。

所述UI布局模板类型包括图片模块、文字模块、图文结合模块和空格模块。

所述图片模块还包括轮播图模块、纯图片模块、二等分图片模块、三等分图片模块、四等分图片模块。

所述图文结合模块包括左图右文模块、左文右图模块、上图下文模块和上文下图模块。

所述UI布局模块还包括闪购促销模块和商品推荐模块，在所述ERP管理系统中设置有监听模块，监听模块用于监听闪购促销模块中的时间。

所述用户权限参数包括普通用户和管理员，用户属性参数包括国家、语言、购买率、新老用户、浏览记录和用户移动终端屏幕大小。

所述UI布局模板属性参数包括UI布局模板显示的位置和顺序、布局模板类型、大小、背景色、背景图。

为了便于本领域技术人员理解本发明的技术方案，现对本发明做进一步的阐述，具体阐述如下：

1、制定用户界面布局模板协议

收集移动终端常规常用的UI布局，根据内容填充方式，识别和分类出多种UI布局模板类型，譬如常见的轮播展示方式的轮播图模块就是其中一种UI布局模板类型，在以下阐述中，将通过域名或应用打开显示在移动终端上的Web网页简称为前端，ERP管理系统上的数据内容填充在数据模块中，具体步骤如下：

(1)前端针对当前用户属性参数(国家、语言、购买率、新老用户、浏览记录)获取ERP管理系统上的数据内容。

(2)前端将从ERP管理系统上获取的数据内容解析转换成UI布局中的内容。

(3)前端在解析从ERP管理系统上获取的数据内容过程中剔除脏数据(后台配置有误的数据)，提高容错性，保证动态界面的美观。

(4)前端根据用户新的需求变化，依据UI布局模板类型在UI布局中显示的位置参数，对UI布局中UI布局模板类型显示的顺序进行微调，并动态拼接生成当前的UI布局。

(5)前端根据UI布局模板类型在UI布局中的顺序依次显示单个布局框架。

(6)前端根据用户移动终端的屏幕大小，只显示当前屏幕内的单个布局框架。

(7)前端根据显示的UI布局中的UI布局模板属性参数，确定单个UI布局模板类型。

在上述步骤中的UI布局模板类型包括：

(1)图片模块，前端只展示图片，再根据模块子类型参数，细分图片模块，包括：

1)轮播图模块，再根据轮播参数类型，前端展示自动轮播图片或者展示手动横向滑动显示图片。

2)纯图片模块，前端只展示单张图片。

3)二等分图片模块，二等分平分屏幕宽度，前端展示两张图片。

4)三等分图片模块，三等分平分屏幕宽度，前端展示三张图片。

5)四等分图片模块，四等分平分屏幕宽度，前端展示四张图片。

(2)文字模块，前端展示文本内容，前端再根据Icon参数配置文字前后Icon布局。前端再根据文字模块参数设置文字大小，颜色，文字样式、文字对齐方式。

(3)图文结合模块，此模块支持图文混编布局，根据参数支持各种混编样式，例如左文右图、右文左图、上文下图等。

(4)空格模块，此模块保证单个布局模块之间的间隙，保证了布局的美观。

(5)闪购促销模块，此模块展示正在促销的商品信息，展示倒计时布局，直观的展示促销信息。此模块中监听倒计时，倒计时结束时重新获取后台促销信息，前端刷新此布局模块。

(6)商品推荐模块，此模块展示根据用户属性参数获取的推荐商品。

根据以上分类，在ERP管理系统上定制具体的数据操作模型，主要用于在ERP管理系统和移动终端识别不同模块、数据。

2、ERP实现用户界面布局模板协议

根据协商的用户界面布局模板协议，制作后台桌面操作程序，使运营人员可根据实际情况定制不同的用户界面布局模块，然后进行任意的组合模块，最后填充实际运营数据内容，下发到移动客户端。

3、移动终端实现用户界面布局模板协议

对每个模块布局的展示方式进行技术支持，然后根据实际指定的顺序，拼接多个独立模块，最终显示出整个UI布局。

其中前端根据显示的布局属性，属性包括：大小、背景色、背景图，展示单个布局模块。

前端根据显示布局的跳转属性，配置单个布局框架以及框架内部单元框架跳转方式。

前端根据用户屏幕滑动操作，只会展示屏幕内的单个布局框架，滑出屏幕外的单个布局框架会及时被回收。

前端当一次从ERP管理系统获取的数据模块全部展示完成后，会自动再次获取更多数据模块，直到后台配置的数据模块全部获取完位置。实现了加载更多功能。

前端再次获取的数据模块会依照上面的方式转换成布局模块，插入到布局底部。

前端会根据半个小时为基准，重新获取数据模块。保证用户能及时查看到最新最热的信息。

前端动态布局中开启了后台服务，实时监听各个布局模块的最新动态，监听单个布局模块是否被下架、内容被替换。

如果前端的后台服务监听到ERP管理系统的数据模块发生变化，会及时刷新相应的布局模块，保证了及时性。

前端动态布局实现了数据缓存，保证了用户再次进来时不会出现加载状态和无视图的页面，大大提高了用户体验。

此动态布局适用于Android和IOS系统，通过配置数据模块来灵活的动态展示布局，各个数据模块相对独立，降低了维护成本；与主界面分离，实现了低耦合，高灵活的方式。动态布局中只会展示手机屏幕内的布局，解决传统方式绘制当前页面全部布局的方式，大大降低了绘制布局时间；会及时回收滑出屏幕外的布局框架，降低了占用的手机内存，保证了页面的流畅性；实现了分页加载功能，防止一次性获取大量数据，降低了网络传输时间。

本技术实现方法：首先，移动终端与ERP管理系统预定好用户界面布局模板协议；然后，移动终端、ERP管理系统根据用户界面布局模板协议对用户界面布局技术支持；其次，ERP制作多个用户界面模版，填充数据内容，下发到移动终端；最后移动终端根据用户界面模版动态拼接用户界面视图和内容。如此，运营人员可以根据不同国家、节日和人群等因素来定制、快速调整移动终端整体用户界面布局，提高加购率、转换率。

Claims (10)

1.一种移动终端页面动态布局方法，其特征在于，该方法包括以下步骤：

根据常用UI布局制定移动终端与ERP管理系统之间的UI布局模板协议；

根据设定的UI布局模板协议，在所述ERP管理系统中定制UI布局模板类型，填充数据内容；根据设定的UI布局模板协议，在所述移动终端中设定用户权限参数、用户属性参数和与在所述ERP管理系统中定制UI布局模板类型相匹配的UI布局模板属性参数；

移动终端根据用户需求选择UI布局模板类型和数据内容，并进行动态拼接生成用户所需的UI布局。

2.根据权利要求1所述的移动终端页面动态布局方法，其特征在于：在设定UI布局模板协议之前，先收集移动终端常规常用的UI布局。

3.一种移动终端页面动态布局系统，其特征在于：该系统包括移动终端和ERP管理系统，移动终端通信连接ERP管理系统；所述移动终端用于设定用户权限参数、用户属性参数和与UI布局模板属性参数；所述ERP管理系统用于存储根据UI布局模板协议定制的UI布局模板类型。

4.根据权利要求3所述的移动终端页面动态布局系统，其特征在于：所述UI布局模板类型包括图片模块、文字模块、图文结合模块和空格模块。

5.根据权利要求4所述的移动终端页面动态布局系统，其特征在于：所述图片模块还包括轮播图模块、纯图片模块、二等分图片模块、三等分图片模块、四等分图片模块。

6.根据权利要求4所述的移动终端页面动态布局系统，其特征在于：所述图文结合模块包括左图右文模块、左文右图模块、上图下文模块和上文下图模块。

7.根据权利要求4所述的移动终端页面动态布局系统，其特征在于：所述UI布局模块还包括闪购促销模块和商品推荐模块。

8.根据权利要求7所述的移动终端页面动态布局系统，其特征在于：在所述ERP管理系统中设置有监听模块，监听模块用于监听闪购促销模块中的时间。

9.根据权利要求3所述的移动终端页面动态布局系统，其特征在于：所述用户权限参数包括普通用户和管理员，用户属性参数包括国家、语言、购买率、新老用户、浏览记录和用户移动终端屏幕大小。

10.根据权利要求3所述的移动终端页面动态布局系统，其特征在于：所述UI布局模板属性参数包括UI布局模板显示的位置和顺序、布局模板类型。