界面排版样式的发送方法、移动终端界面排版方法及装置制造方法及图纸

技术编号:19277349 阅读:48 留言:0更新日期:2018-10-30 17:57
本发明专利技术实施例提供了一种界面排版样式的发送方法、移动终端界面排版方法及装置,所述发送方法包括:获取目标用户界面UI设计图;对所述目标UI设计图进行拆分,得到界面布局样式;确定所述界面布局样式对应的界面排版规则样式;将所述界面排版规则样式通过脚本文件下发给移动终端,以便于所述移动终端按照排版协议对脚本文件进行解析得到对应的界面排版规则样式。也就是说,本发明专利技术实施例中,服务端按照目标UI设计图为移动终端动态配置界面排版规则样式,降低丰富的UI界面展示与排版适配的成本,为移动端提供了简便、高效的界面动态排版。

Method for transmitting interface typesetting style, mobile terminal interface typesetting method and device

The embodiment of the invention provides a method for transmitting an interface typesetting style, a mobile terminal interface typesetting method and a device. The sending method comprises acquiring a target user interface UI design diagram, splitting the target UI design diagram to obtain an interface layout style, and determining an interface layout rule corresponding to the interface layout style. The interface typesetting rule style is sent to the mobile terminal through the script file, so that the mobile terminal can parse the script file according to the typesetting protocol to get the corresponding interface typesetting rule style. That is to say, in the embodiment of the invention, the server dynamically configures the interface layout rule style for the mobile terminal according to the target UI design diagram, reduces the cost of rich UI display and typesetting adaptation, and provides a simple and efficient interface dynamic typesetting for the mobile terminal.

【技术实现步骤摘要】
界面排版样式的发送方法、移动终端界面排版方法及装置
本专利技术涉及终端网络
,特别是涉及一种界面排版样式的发送方法、移动终端界面排版方法及装置。
技术介绍
目前,移动终端界面排版是通过纯Native端对界面原子控件的直接排列,或者通过动态下发预先生成的界面布局文件,移动终端进行特定的解析,达到动态排版的目的,但是,对于纯Native端控制界面排版,无法实现动态修改界面布局,同时也无法保证更多平台、更多机型界面的适配;而对于动态下发预置的布局文件,虽然在一定程度上解决了动态更改及适配更多界面布局的问题,但是,界面布局文件的预先配置及规则解析较为繁琐,降低了排版的灵活性和高效性。因此,如何对移动终端的界面进行灵活、高效的动态排版是目前有待解决的技术问题。
技术实现思路
本专利技术实施例所要解决的技术问题是提供一种界面排版样式的发送方法、移动终端界面排版方法,以解决现有技术中由于移动终端的界面排版繁琐,不灵活,导致排版的效率低的技术问题。相应的,本专利技术实施例还提供了一种移动终端界面排版装置,用以保证上述方法的实现及应用。为了解决上述问题,本专利技术是通过如下技术方案实现的:第一方面提供一种界面排版样式的发送方法,所述方法包括:获取目标用户界面UI设计图;对所述目标UI设计图进行拆分,得到界面布局样式;确定所述界面布局样式对应的界面排版规则样式;将所述界面排版规则样式通过脚本文件下发给移动终端,以便于所述移动终端按照排版协议对脚本文件进行解析得到对应的界面排版规则样式。可选的,所述对所述目标UI设计图进行拆分,得到界面布局样式,包括:对所述目标UI设计图进行划分,得到界面的各个模块区域;对所述各个模块区域进行扁平化处理,得到各个模块区域对应的界面布局样式。可选的,所述确定所述界面布局样式对应的界面排版规则样式,包括:将所述各个模块区域对应的界面布局样式一一对应脚本中现有的界面排版规则样式;如果所述脚本中现有的界面排版规则样式没有对应模块区域的界面布局样式,则为没有对应的所述模块区域的所述界面布局样式设定新的界面排版规则样式。可选的,所述为没有对应的模块区域的所述界面布局样式设定新的界面排版规则样式,包括:采用以界面窗口为根节点,所述各个模块区域为子节点,且有嵌套的模块区域递归划分为父节点和子节点的组合,得到所述新的界面排版规则样式;对所述新的界面排版规则样式进行数据描述,其中,所述数据描述包括:父节点和子节点区域的关系描述以及各子节点区域的UI样式描述。第二方面提供一种移动终端界面排版方法,包括:接收服务端发送的脚本文件,所述脚本文件包括:界面排版规则样式;按照排版协议对所述脚本文件进行解析,得到对应的界面排版规则样式;根据所述界面排版规则样式采用Flex的布局排版方式对界面窗口进行整体排列布局;根据所述整体排列布局,回调获取的展示模块内容的子节点控件frame,并在父节点控件frame基础上进行相对位置换算;将位置换算的结果同步给界面布局,完成界面排版适配。可选的,所述根据所述界面排版规则样式采用Flex的布局排版方式对界面窗口进行整体排列布局,包括:根据所述界面排版规则样式采用Flex的布局排版方式,依次绑定划分后的各节点区域UI样式,并根据父子区域关系,每一父节点绑定其所有子节点区域,以及绑定根节点,实现了对界面窗口的整体排列布局。第三方面提供一种界面排版样式的发送装置,其特征在于,包括:获取模块,用于获取目标用户界面UI设计图;拆分模块,用于对所述目标UI设计图进行拆分,得到界面布局样式;确定模块,用于确定所述界面布局样式对应的界面排版规则样式;发送模块,用于将所述界面排版规则样式通过脚本文件下发给移动终端,以便于所述移动终端按照排版协议对脚本文件进行解析得到对应的界面排版规则样式。可选的,所述拆分模块包括:划分模块,用于对所述目标UI设计图进行划分,得到界面的各个模块区域;处理模块,用于对所述各个模块区域进行扁平化处理,得到各个模块区域对应的界面布局样式。可选的,所述确定模块包括:对应模块,用于将所述各个模块区域对应的界面布局样式一一对应脚本中现有的界面排版规则样式;设定模块,用于在所述脚本中现有的界面排版规则样式没有对应模块区域的界面布局样式时,为没有对应的所述模块区域的所述界面布局样式设定新的界面排版规则样式。可选的,所述设定模块包括:设定子模块,用于采用以界面窗口为根节点,所述各个模块区域为子节点,且有嵌套的模块区域递归划分为父节点和子节点的组合,得到所述新的界面排版规则样式;描述模块,用于对所述新的界面排版规则样式进行数据描述,所述数据描述包括:父节点和子节点区域的关系描述以及各子节点区域的UI样式描述。第四方面提供一种移动终端界面排版装置,包括:接收模块,用于接收服务端发送的脚本文件,所述脚本文件包括:界面排版规则样式;解析模块,用于按照排版协议对所述脚本文件进行解析,得到对应的界面排版规则样式;绑定模块,用于按照所述界面排版规则样式绑定各节点区域UI样式;排列布局模块,用于根据所述界面排版规则样式采用Flex的布局排版方式对界面窗口进行整体排列布局;位置换算模块,用于根据所述整体排列布局,回调展示模块内容的子节点控件frame,与父节点控件frame进行位置换算;同步模块,用于将位置换算的结果同步给界面布局,完成界面排版适配。可选的,所述排列布局模块,具体用于根据所述界面排版规则样式采用Flex的布局排版方式,依次绑定划分后的各节点区域UI样式,并根据父子区域关系,每一父节点绑定其所有子节点区域,以及绑定根节点,得到界面窗口的整体排列布局。与现有技术相比,本专利技术实施例包括以下优点:本专利技术实施例中,服务端先对目标用户界面UI设计图进行拆分,得到界面布局样式,然后确定所述界面布局样式对应的界面排版规则样式,以及将所述界面排版规则样式通过脚本文件下发给移动终端,以便于所述移动终端按照排版协议对脚本文件进行解析得到对应界面排版规则样式。也就是说,本专利技术实施例中,服务端按照目标UI设计图为移动终端动态配置界面排版规则样式,降低丰富的UI界面展示与排版适配的成本,为移动端提供了简便、高效的界面动态排版。应当理解的是,以上的一般描述和后文的细节描述仅是示例性和解释性的,并不能限制本申请。附图说明图1是本专利技术实施例提供的一种界面排版样式的发送方法的流程图;图2是本专利技术实施例提供的一种移动终端界面排版方法的流程图;图3是本专利技术实施例提供的一种界面排版样式的发送装置的结构示意图;图4是本专利技术实施例提供的一种移动终端界面排版装置的结构示意图。具体实施方式为使本专利技术的上述目的、特征和优点能够更加明显易懂,下面结合附图和具体实施方式对本专利技术作进一步详细的说明。请参阅图1,为本专利技术实施例提供的一种界面排版样式的发送方法的流程图,具体可以包括如下步骤:步骤101:获取目标用户界面UI设计图;该步骤中,根据运营商或实际需要,预先设置目标用户界面(UI,UserInterface)设计图,即服务端获取目标用户界面UI设计图。其中,UI设计是指对软件的人机交互、操作逻辑、界面美观的整体设计。好的UI设计不仅是让软件变得有个性有品位,还要让软件的操作变得舒适简单、自由,充分体现软件的定位和特点。步骤102;对所述目标UI本文档来自技高网...

【技术保护点】
1.一种界面排版样式的发送方法,其特征在于,包括:获取目标用户界面UI设计图;对所述目标UI设计图进行拆分,得到界面布局样式;确定所述界面布局样式对应的界面排版规则样式;将所述界面排版规则样式通过脚本文件下发给移动终端,以便于所述移动终端按照排版协议对脚本文件进行解析得到对应的界面排版规则样式。

【技术特征摘要】
1.一种界面排版样式的发送方法,其特征在于,包括:获取目标用户界面UI设计图;对所述目标UI设计图进行拆分,得到界面布局样式;确定所述界面布局样式对应的界面排版规则样式;将所述界面排版规则样式通过脚本文件下发给移动终端,以便于所述移动终端按照排版协议对脚本文件进行解析得到对应的界面排版规则样式。2.根据权利要求1所述的方法,其特征在于,所述对所述目标UI设计图进行拆分,得到界面布局样式,包括:对所述目标UI设计图进行划分,得到界面的各个模块区域;对所述各个模块区域进行扁平化处理,得到各个模块区域对应的界面布局样式。3.根据权利要求2所述的方法,其特征在于,所述确定所述界面布局样式对应的界面排版规则样式,包括:将所述各个模块区域对应的界面布局样式一一对应脚本中现有的界面排版规则样式;如果所述脚本中现有的界面排版规则样式没有对应模块区域的界面布局样式,则为没有对应的所述模块区域的所述界面布局样式设定新的界面排版规则样式。4.根据权利要求3所述的方法,其特征在于,所述为没有对应的模块区域的所述界面布局样式设定新的界面排版规则样式,包括:采用以界面窗口为根节点,所述各个模块区域为子节点,且有嵌套的模块区域递归划分为父节点和子节点的组合,得到所述新的界面排版规则样式;对所述新的界面排版规则样式进行数据描述,其中,所述数据描述包括:父节点和子节点区域的关系描述以及各子节点区域的UI样式描述。5.一种移动终端界面排版方法,其特征在于,包括:接收服务端发送的脚本文件,所述脚本文件包括:界面排版规则样式;按照排版协议对所述脚本文件进行解析,得到对应的界面排版规则样式;根据所述界面排版规则样式采用Flex的布局排版方式对界面窗口进行整体排列布局;根据所述整体排列布局,回调获取的展示模块内容的子节点控件frame,并在父节点控件frame基础上进行相对位置换算;将位置换算的结果同步给界面布局,完成界面排版适配。6.根据权利要求5所述的方法,其特征在于,所述根据所述界面排版规则样式采用Flex的布局排版方式对界面窗口进行整体排列布局,包括:根据所述界面排版规则样式采用Flex的布局排版方式,依次绑定划分后的各节点区域UI样式,并根据父子区域关系,每一父节点绑定其所有子节点区域,以及绑定根节点,实现了对界面窗口的整体排列布局。7.一种界面排版样式的发送装置,...

【专利技术属性】
技术研发人员:杨阳
申请(专利权)人:北京奇艺世纪科技有限公司
类型:发明
国别省市:北京,11

网友询问留言 已有0条评论
  • 还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。

1