基于动态网格的可视化界面集成方法及系统技术方案

本发明专利技术公开了一种基于动态网格的可视化界面集成方法及系统，该方法包括：加载待集成界面模块，构建可选界面内容列表，所述待集成界面模块是根据编制的独立界面模块的界面预览内容生成的，所述独立界面模块为按照标准的软件接口规范封装的界面单元；设置界面网格布局；设置网格单元与界面内容的映射关系；生成预览界面；生成应用软件发布包。本发明专利技术通过界面网格化布局、模块化组装及预览显示等技术途径，实现所见即所得的软件界面集成能力，增强软件界面开发的灵活性、敏捷性及可见性。

Visual grid integration method and system based on Dynamic Grid

The invention discloses a visual interface integration method and a system based on dynamic grid. The method comprises loading an interface module to be integrated and constructing a list of optional interface contents. The interface module to be integrated is generated according to the interface preview content of a compiled independent interface module, and the independent interface module is in accordance with the standard. The standard software interface specification encapsulates the interface unit; Sets the interface grid layout; Sets the mapping relationship between the grid unit and the interface content; Generates the preview interface; Generates the application software release package. The invention realizes WYSIWYG software interface integration capability through interface grid layout, modular assembly and preview display, and enhances the flexibility, agility and visibility of software interface development.

【技术实现步骤摘要】
基于动态网格的可视化界面集成方法及系统
本专利技术涉及软件类集成技术，具体而言是针对待集成的模块级界面单元，提供一种基于动态网格的可视化集成方法及系统。
技术介绍
近些年来，软件模块化开发被广泛接受，各业务领域在发展过程中已积累大量通用(如表格、树、甘特图等)或专用(如设备结构图、用户关系图等)的界面模块，软件界面开发基于已有界面成果，采用复用、改造、新研相结合的方式，通过集成开发形成最终界面成为了趋势。软件开发人员与用户之间进行直接交互，通过所见即所得的方式完成需求确认和界面开发成为更加高效的模式。然而，目前的可视化工具仅解决了从控件到模块级界面单元的开发过程，缺乏从模块级界面单元集成为软件的可视化工具，软件开发人员缺少支持界面布局灵活且可重构、界面内容快速可替换、界面效果直观可见的界面集成方法。
技术实现思路
本专利技术所要解决的技术问题是：针对现有技术存在的问题，提出一种基于动态网格的可视化界面集成方法及系统，通过界面网格化布局、模块化组装及预览显示等技术途径，实现所见即所得的软件界面集成能力，增强软件界面开发的灵活性、敏捷性及可见性。本专利技术提供的一种基于动态网格的可视化界面集成方法，包括：加载待集成界面模块，构建可选界面内容列表，所述待集成界面模块是根据编制的独立界面模块的界面预览内容生成的，所述独立界面模块为按照标准的软件接口规范封装的界面单元；设置界面网格布局；设置网格单元与界面内容的映射关系；生成预览界面；生成应用软件发布包。进一步，编制独立界面模块的界面预览内容的方法包括静态图片模式和/或动态对象模式；所述静态图片模式包括：获取独立界面模块的界面预览静态图片，编制配置文件设定界面预览内容与界面静态预览图片的关联关系；所述动态对象模式包括：按接口规范实现界面显示要素对象获取接口，编制配置文件指定界面预览所须加载的动态对象的接口访问路径和参数信息；对应于静态图片模式的待集成界面模块包括软件执行体、配置文件和界面预览静态图片，对应于动态对象模式的待集成界面模块包括软件执行体、配置文件和动态对象接口导出文件。进一步，待集成界面模块可按需添加、删除和/或更新。进一步，设置界面网格布局的方法包括网格切分和位置拖拽；所述网格切分包括：通过正则划分将界面切分为面积均等或通过自定义切分界面切分为面积不等的m×n网格单元，其中m和n为正整数；所述位置拖拽包括：拖拽分隔线改变网格单元的大小；拖拽选中网格单元使其在其他网格单元的上、下、左、右四个位置方向停靠从而改变位置布局。进一步，设置网格单元与界面内容的映射关系的方法包括选填、拖拽和/或删除，所述选填包括：选中网格单元，以弹出菜单的形式选择并设置对应的界面内容，直接构建网格单元与界面内容间的映射关系；所述拖拽包括：从构建的可选列表中选择界面内容，通过拖拽的方式放置到对应的网格单元中，以坐标关系为媒介构建界面内容与网格单元间的映射关系；所述删除包括：选中网格单元，在界面预览右上角点击删除按钮或以弹出菜单的方式选择删除界面内容，解除网格单元与界面内容间的映射关系。本专利技术的另一方面提供的一种基于动态网格的可视化界面集成系统，包括：加载单元，用于加载待集成界面模块，构建可选界面内容列表，所述待集成界面模块是根据编制的独立界面模块的界面预览内容生成的，所述独立界面模块为按照标准的软件接口规范封装的界面单元；网格布局单元，用于设置界面网格布局；映射关系设置单元，用于设置网格单元与界面内容的映射关系；预览界面生成单元，用于生成预览界面；软件发布包生成单元，用于生成应用软件发布包。进一步，编制独立界面模块的界面预览内容的方法包括静态图片模式和/或动态对象模式；所述静态图片模式包括：获取独立界面模块的界面预览静态图片，编制配置文件设定界面预览内容与界面静态预览图片的关联关系；所述动态对象模式包括：按接口规范实现界面显示要素对象获取接口，编制配置文件指定界面预览所须加载的动态对象的接口访问路径和参数信息；对应于静态图片模式的待集成界面模块包括软件执行体、配置文件和界面预览静态图片，对应于动态对象模式的待集成界面模块包括软件执行体、配置文件和动态对象接口导出文件。进一步，设置界面网格布局的方法包括网格切分和位置拖拽；所述网格切分包括：通过正则划分将界面切分为面积均等或通过自定义切分界面切分为面积不等的m×n网格单元，其中m和n为正整数；所述位置拖拽包括：拖拽分隔线改变网格单元的大小；拖拽选中网格单元使其在其他网格单元的上、下、左、右四个位置方向停靠从而改变位置布局。进一步，设置网格单元与界面内容的映射关系的方法包括选填、拖拽和/或删除，所述选填包括：选中网格单元，以弹出菜单的形式选择并设置对应的界面内容，直接构建网格单元与界面内容间的映射关系；所述拖拽包括：从构建的可选列表中选择界面内容，通过拖拽的方式放置到对应的网格单元中，以坐标关系为媒介构建界面内容与网格单元间的映射关系；所述删除包括：选中网格单元，在界面预览右上角点击删除按钮或以弹出菜单的方式选择删除界面内容，解除网格单元与界面内容间的映射关系。本专利技术的另一方面提供的一种计算机可读存储介质，其上存储有计算机程序，其特征在于，所述计算机程序被处理器执行时实现如上所述的方法的步骤。与现有技术相比，本专利技术实现了：网格化布局动态可变性——符合界面综合设计、内容分块开发的软件开发模式，主要采用界面网格化布局与网格位置动态可变更相结合，操作方式灵活、简洁、高效、直观。界面布局模块化可替换性——通过网格与界面内容的映射关系，实现界面布局与具体的界面模块实现间的解耦，既支持界面内容的动态可替换性，又满足界面模块的独立可开发性和可继承性。界面效果即时可视性——通过界面预览的方式，是可视化集成工具具备所见即所得的界面效果渲染能力，不但能够减少软件界面设计与具体实现间偏差带来的影响，还能够增强界面开发的趣味性。附图说明本专利技术将通过例子并参照附图的方式说明，其中：图1为本专利技术的基于动态网格的可视化界面集成方法的流程图；图2为界面网格布局示意图；图3为可视化界面集成工具界面示意图。具体实施方式本说明书中公开的所有特征，或公开的所有方法或过程中的步骤，除了互相排斥的特征和/或步骤以外，均可以以任何方式组合。本说明书中公开的任一特征，除非特别叙述，均可被其他等效或具有类似目的的替代特征加以替换。即，除非特别叙述，每个特征只是一系列等效或类似特征中的一个例子而已。本专利技术提出了一种界面集成方法，基于对界面的动态网格化切分过程将网格内容与界面对象关联映射起来，实现界面单元的可视化预览和集成，包括如下步骤，如图1所示：步骤S11：按统一接口规范开发界面模块按照标准的接口规范，软件开发人员将各个界面单元封装为能够被统一加载和调度的独立界面模块。步骤S12：编制界面模块的界面预览内容编制界面模块的界面预览样式并设置预览对象。界面预览样式及预览对象的编制方法包括两种模式：模式一：静态图片模式通过界面截图工具或其他手段，获取界面模块的界面预览静态图片(BMP、JPG、PNG、GIF格式)。编制配置文件设定界面预览内容与界面静态预览图片的关联关系。将界面模块包括的软件执行体、配置文件、界面预览静态图片打包，生成待集成的界面模块。模式二：动态对象模式按接口规范实现界面本文档来自技高网...

【技术保护点】
1.一种基于动态网格的可视化界面集成方法，其特征在于，包括：加载待集成界面模块，构建可选界面内容列表，所述待集成界面模块是根据编制的独立界面模块的界面预览内容生成的，所述独立界面模块为按照标准的软件接口规范封装的界面单元；设置界面网格布局；设置网格单元与界面内容的映射关系；生成预览界面；生成应用软件发布包。

【技术特征摘要】
1.一种基于动态网格的可视化界面集成方法，其特征在于，包括：加载待集成界面模块，构建可选界面内容列表，所述待集成界面模块是根据编制的独立界面模块的界面预览内容生成的，所述独立界面模块为按照标准的软件接口规范封装的界面单元；设置界面网格布局；设置网格单元与界面内容的映射关系；生成预览界面；生成应用软件发布包。2.根据权利要求1所述的一种基于动态网格的可视化界面集成方法，其特征在于，编制独立界面模块的界面预览内容的方法包括静态图片模式和/或动态对象模式；所述静态图片模式包括：获取独立界面模块的界面预览静态图片，编制配置文件设定界面预览内容与界面静态预览图片的关联关系；所述动态对象模式包括：按接口规范实现界面显示要素对象获取接口，编制配置文件指定界面预览所须加载的动态对象的接口访问路径和参数信息；对应于静态图片模式的待集成界面模块包括软件执行体、配置文件和界面预览静态图片，对应于动态对象模式的待集成界面模块包括软件执行体、配置文件和动态对象接口导出文件。3.根据权利要求1所述的一种基于动态网格的可视化界面集成方法，其特征在于，待集成界面模块可按需添加、删除和/或更新。4.根据权利要求1所述的一种基于动态网格的可视化界面集成方法，其特征在于，设置界面网格布局的方法包括网格切分和位置拖拽；所述网格切分包括：通过正则划分将界面切分为面积均等或通过自定义切分界面切分为面积不等的m×n网格单元，其中m和n为正整数；所述位置拖拽包括：拖拽分隔线改变网格单元的大小；拖拽选中网格单元使其在其他网格单元的上、下、左、右四个位置方向停靠从而改变位置布局。5.根据权利要求1所述的一种基于动态网格的可视化界面集成方法，其特征在于，设置网格单元与界面内容的映射关系的方法包括选填、拖拽和/或删除，所述选填包括：选中网格单元，以弹出菜单的形式选择并设置对应的界面内容，直接构建网格单元与界面内容间的映射关系；所述拖拽包括：从构建的可选列表中选择界面内容，通过拖拽的方式放置到对应的网格单元中，以坐标关系为媒介构建界面内容与网格单元间的映射关系；所述删除包括：选中网格单元，在界面预览右上角点击删除按钮或以弹出菜单的方式选择删除界面内容，解除网格单元与界面内容间的映射关系。6.一种基于动态网格的可视化界面集成系统，其特征在于，包括：...

【专利技术属性】
技术研发人员：江果，张智，王飞，旷生玉，臧维明，张旭昕，蒋鸣远，邓文伟，
申请(专利权)人：中国电子科技集团公司第二十九研究所，
类型：发明
国别省市：四川,51