CN105653750A - 人机界面三维设计***中组件布局的实现方法 - Google Patents
人机界面三维设计***中组件布局的实现方法 Download PDFInfo
- Publication number
- CN105653750A CN105653750A CN201410724197.3A CN201410724197A CN105653750A CN 105653750 A CN105653750 A CN 105653750A CN 201410724197 A CN201410724197 A CN 201410724197A CN 105653750 A CN105653750 A CN 105653750A
- Authority
- CN
- China
- Prior art keywords
- assembly
- layout
- scene
- interface
- model
- 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
Landscapes
- Processing Or Creating Images (AREA)
Abstract
本发明涉及一种人机界面三维设计***中组件布局的实现方法,其包括如下步骤:步骤一,建立包含多种组件操作实现函数的组件布局类,确定能实现快速组件布局的各种操作的方法;步骤二,从组件元素库中将所需添加组件模型元素添加进三维场景中;步骤三,调整三维场景中已添加组件在整个界面中的布局;步骤四,若界面组件布局还需要添加新元素和/或还需对组件进行布局调整,则重复步骤二和/或步骤三。本发明能够实现人机界面三维设计***中组件的快速布局,极大地提高了人机界面三维设计***的实用性及有效性。
Description
技术领域
本发明涉及组件布局设计的实现方法,特别涉及人机界面三维设计***中可通过触摸屏对界面上组件布局进行设计修改的实现方法。
背景技术
人机界面三维设计***的主要目的是为人机界面设计提供一种三维可视化设计手段。
人机界面设计讲究艺术性和科学性,强调用户的直观感受,设计过程中需要不断与用户进行交流。为了给用户直观展现设计方案,往往需要按照设计图纸临时构建实物模型,获取用户感知,进一步进行设计优化与完善,造成了成本与时间的浪费,且实物模型不易修改。
人机界面三维设计***可通过构建与真实物体1∶1的三维模型,并在与实际物体尺寸相同大小的触摸屏上进行显示,提供了一种将设计效果进行直观展示的低成本可视化手段,同时在触摸屏上可对三维场景中的界面元素进行动态属性修改,实现三维设计功能。
人机界面设计中包含大量不同类型组件元素,例如按钮、旋钮、指示灯等,为了使设计人员能够方便地对界面元素布局进行编辑修改,需要发明一种组件布局的实现方法,用以进行组件位置移动、角度变换、组件添加/删除、组件类型替换、组件分布排列等操作。
发明内容
在发明的目的在于满足现有技术的至少一种需求和/或对现有技术中的至少一个问题作出改进。
本发明的另一目的是提供一种人机界面三维设计***中组件布局的实现方法,在三维场景中进行组件位置移动、角度变换、组件添加/删除、组件类型替换、组件分布排列等操作。
本发明包括但不限于如下方案。
一种人机界面三维设计***中组件布局的实现方法,其特征在于,所述方法包括如下步骤:
步骤一,建立包含多种组件操作实现函数的组件布局类,确定能实现快速组件布局的各种操作的方法;
步骤二,从组件元素库中将所需添加组件模型元素添加进三维场景中;
步骤三,调整三维场景中已添加组件在整个界面中的布局;
步骤四,若界面组件布局还需要添加新元素和/或还需对组件进行布局调整,则重复步骤二和/或步骤三。
优选地,所述组件布局类包含组件位置移动、角度变换、组件添加、组件删除、组件类型替换、组件分布排列、撤销的操作实现函数中的至少一种。
优选地,所述组件元素库中的模型包含按钮、旋钮、指示灯中的至少一种类别元素。
优选地,调整组件布局的方式包括组件位置移动、角度变换、组件删除、组件类型替换、组件分布排列、撤销中的至少一种操作。
优选地,用户基于投影的多点触控显示***对人机界面三维设计***进行操作。
优选地,用户通过手指触摸屏幕的方式从组件元素库中添加新组件进三维场景和/或对场景中已有组件的布局方式进行调整。
优选地,用鼠标拖拽组件到三维场景中,并将组件放在场景合适位置上。
优选地,组件位置移动包括单选和多选移动,通过鼠标拖拽方式将选中组件移动到场景模型任意表面上,移动过程中根据模型表面的法线方向确定移动组件的朝向。
优选地,组件角度变换包括旋转单个物体或多个物体,旋转方式包括绕组件各自中心旋转和绕所有选中物体中心旋转。
在一个示例中,具体步骤为:
步骤一:建立包含各种组件操作实现函数的组件布局类,确定能实现快速组件布局的各种操作的方法;
该类中包含组件位置移动、角度变换、组件添加/删除、组件类型替换、组件分布排列、撤销等操作实现函数;
步骤二:从组件元素库中将所需添加组件模型元素添加进三维场景;
组件元素库中的模型包含按钮、旋钮、指示灯等不同类别元素;
步骤三:调整三维场景中已添加组件在整个界面中布局;
调整组件布局方式包括组件位置移动、角度变换、组件删除、组件类型替换、组件分布排列、撤销等操作;
步骤四:若界面组件布局还需要添加新元素并对组件进行布局调整,重复步骤二和步骤三;
本发明能够实现人机界面三维设计***中组件的快速布局,其突出特点是可以在三维场景中快速移动组件到任意布局表面,并且包含角度变换、组件添加/删除、组件类型替换、组件分布排列、撤销等多种组件布局操作,极大地提高了人机界面三维设计***的实用性及有效性。
附图说明
图1为根据本发明的一个实施方式的组件布局的应用场景图。
图2为根据本发明的一个实施方式的组件布局的工作流程图。
具体实施方式
下面结合附图对本发明的具体实施方式作进一步详细的描述。
本发明的应用场景如图1所示,用户基于投影的多点触控显示***对人机界面三维设计***进行操作。***运行后,用户可通过手指触摸屏幕的方式从组件元素库中添加新组件进三维场景,并对场景中已有组件的布局方式进行调整;图2是呈现在场景中进行组件布局的工作流程。
人机界面三维设计***为了满足人机交互的实时响应与操作,采用运行速度较快的C++语言作为开发语言,采用微软公司的MFC(MicrosoftFoundationClasses,微软基础类)作为软件平台,图形开发采用OpenGL/OpenScenegraph,硬件设备包括多点触控显示设备。
步骤一:建立包含各种组件操作实现函数的组件布局类,确定能实现快速组件布局的各种操作的方法;
组件布局类的定义如下:
类名:ObjectManipulatorHandler
主要成员变量:
m_moveObjectMTList//所有场景可移动组件的链表
m_moveCurrentObjectMT//当前选中的可移动组件
m_moveObjectDefaultStateList//所有场景可移动组件的状态属性的链表
m_moveObjectDefaultState//当前选中组件的状态属性
m_backUpStack//撤销操作栈
m_moveModelFromLibMT//从元素库中拖拽进场景组件元素
主要成员函数:
pickObject//鼠标单选组件
rectanglePick//鼠标框选组件
checkPickObject//查询选中组件是否为可移动的,并改变相应组件状态属性
clearAllPickObjectsState//将选中组件的选中状态改为默认状态
dragMoveObjects//鼠标拖拽移动选中物体操作
moveWithKeyboard//键盘控制移动选中物体
rotateAllPickObjects//旋转选中物体操作
alignObjects//选中物体对齐操作,包括上对齐和左对齐
arrangeObjects//均匀分布物体操作,包括水平和垂直分布
dragModelFromLib//从元素库中拖拽模型到场景中
deletePickedModels//删除选中组件操作
replacePickedModel//替换选中组件操作
backUpLastStep//撤销回到上一步
recordInBackUpStack//当前操作步骤入栈
类名空间下的重要结构体和枚举类型:
enumManipulateType//包括所有组件操作类型
structBackUpStep//撤销操作用到的如栈结构体
步骤二:从组件元素库中将所需添加组件模型元素添加进三维场景;
首先在元素库中确定组件元素类别;
其次浏览所需组件元素,用鼠标拖拽相应组件到三维场景中,并将组件放在场景合适位置上。
步骤三:调整三维场景中已添加组件在整个界面中布局;
调整组件布局方式包括组件位置移动、角度变换、组件删除、组件类型替换、组件分布排列、撤销等操作,可以用以上各种操作对场景界面快速布局以达到设计效果;
组件位置移动包括单选和多选移动,可通过鼠标拖拽方式将选中组件移动到场景模型任意表面上,移动过程中根据模型表面的法线方向确定移动组件的朝向,移动过程中组件朝向一直是沿着表面法线方向向上的;
组件角度变换包括旋转单个物体或多个物体,有两种旋转方式,绕组件各自中心旋转和绕所有选中物体中心旋转;
组件类型替换需要先在元素库中确定替换元素,再在场景中将选中元素替换为元素库中元素;
组件分布排列是针对选中多个组件的布局操作,可以进行上对齐、左对齐、水平分布和垂直分布;
撤销功能对所有布局操作有效。
步骤四:若界面组件布局还需要添加新元素并对组件进行布局调整,重复步骤二和步骤三;
在对场景中已有组件元素布局调整完成后,可能还需要新的组件才能满足设计要求,此时可以回到步骤二继续添加新元素并对场景布局根据设计要求作出调整。
下面参照图2说明本发明的一个具体示例,然而,应当理解,本发明不限于此。
在步骤S1中,进行场景加载,然后进入步骤S2。在步骤S2中,判断是否从库中加模型,如果结果为是,则进入步骤S21,如果结构为否,则进入步骤S3。
在步骤S21中,可以用鼠标将组件模型拖拽到场景中,然后在步骤S22中,将添加模型操作压入撤消栈,然后进入步骤S23,在步骤S23中,判断是否撤消添加模型操作,如果结果为是,则撤消添加的模型,回到步骤S2,如果结果为否,则进入步骤S3。
在步骤S3中,判断是否调整场景组件布局,如果结果为是,则进入步骤S31,如果结果为否,则进入步骤S4。
在步骤S31中,进行场景组件布局的调整,然后,进入步骤S32,在步骤S32中,将组件布局操作压入撤消栈,然后进入步骤S33,在步骤S33中,判断是否撤消场景组件布局操作,如果结果为是,则撤消之前的场景布局调整并回到步骤S3,如果结果为否,则进入步骤S4。
在步骤S4中,判断场景布局设计是否完成,如果结果为否,则回到步骤S2,如果结果为是,则进行保存,并退出组件布局操作。
上面参照图2描述了模型(组件)的添加和布局调整,然而应当理解,可以类似地进行其它操作,本发明不限于上述具体的操作步骤。
上面参照附图说明了本发明的优选实施方式,但是,应当理解,上述说明仅是示例性的。本领域的技术人员可以在不脱离本发明的精神和范围的前提下,对本发明作出各种修改和变型。本发明的保护范围由所附的权利要求书限定。
Claims (9)
1.一种人机界面三维设计***中组件布局的实现方法,其特征在于,所述方法包括如下步骤:
步骤一,建立包含多种组件操作实现函数的组件布局类,确定能实现快速组件布局的各种操作的方法;
步骤二,从组件元素库中将所需添加组件模型元素添加进三维场景中;
步骤三,调整三维场景中已添加组件在整个界面中的布局;
步骤四,若界面组件布局还需要添加新元素和/或还需对组件进行布局调整,则重复步骤二和/或步骤三。
2.根据权利要求1所述的方法,其特征在于,
所述组件布局类包含组件位置移动、角度变换、组件添加、组件删除、组件类型替换、组件分布排列、撤销的操作实现函数中的至少一种。
3.根据权利要求1所述的方法,其特征在于,
所述组件元素库中的模型包含按钮、旋钮、指示灯中的至少一种类别元素。
4.根据权利要求1所述的方法,其特征在于,
调整组件布局的方式包括组件位置移动、角度变换、组件删除、组件类型替换、组件分布排列、撤销中的至少一种操作。
5.根据权利要求1至4中的任一项所述的方法,其特征在于,
用户基于投影的多点触控显示***对人机界面三维设计***进行操作。
6.根据权利要求5所述的方法,其特征在于,
用户通过手指触摸屏幕的方式从组件元素库中添加新组件进三维场景和/或对场景中已有组件的布局方式进行调整。
7.根据权利要求1至4中的任一项所述的方法,其特征在于,
用鼠标拖拽组件到三维场景中,并将组件放在场景合适位置上。
8.根据权利要求1至4中的任一项所述的方法,其特征在于,
组件位置移动包括单选和多选移动,通过鼠标拖拽方式将选中组件移动到场景模型任意表面上,移动过程中根据模型表面的法线方向确定移动组件的朝向。
9.根据权利要求1至4中的任一项所述的方法,其特征在于,
组件角度变换包括旋转单个物体或多个物体,旋转方式包括绕组件各自中心旋转和绕所有选中物体中心旋转。
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201410724197.3A CN105653750A (zh) | 2014-12-03 | 2014-12-03 | 人机界面三维设计***中组件布局的实现方法 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201410724197.3A CN105653750A (zh) | 2014-12-03 | 2014-12-03 | 人机界面三维设计***中组件布局的实现方法 |
Publications (1)
Publication Number | Publication Date |
---|---|
CN105653750A true CN105653750A (zh) | 2016-06-08 |
Family
ID=56480765
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN201410724197.3A Pending CN105653750A (zh) | 2014-12-03 | 2014-12-03 | 人机界面三维设计***中组件布局的实现方法 |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN105653750A (zh) |
Cited By (3)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN110197038A (zh) * | 2019-06-05 | 2019-09-03 | 北京华如科技股份有限公司 | 一种仿真***实体-组件的生成方法 |
CN110389810A (zh) * | 2019-07-31 | 2019-10-29 | 阿里巴巴集团控股有限公司 | 一种在虚拟画布上快速摆放ui控件的方法、装置及设备 |
CN111258690A (zh) * | 2020-01-10 | 2020-06-09 | 中国建设银行股份有限公司 | 一种构建3d页面的方法和装置 |
Citations (10)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN1487446A (zh) * | 2003-06-24 | 2004-04-07 | 深圳市华磊网络技术有限公司 | 服务器端应用为浏览器客户端提供用户界面的方法 |
CN101470591A (zh) * | 2007-12-29 | 2009-07-01 | 华为技术有限公司 | 页面控件布局方法与装置 |
CN101814024A (zh) * | 2009-10-23 | 2010-08-25 | 深圳创维-Rgb电子有限公司 | 一种跨平台3d界面设计架构和工具 |
CN101944027A (zh) * | 2010-09-26 | 2011-01-12 | 北京神州泰岳软件股份有限公司 | 一种用户界面生成方法 |
CN102375733A (zh) * | 2010-08-24 | 2012-03-14 | 北大方正集团有限公司 | 一种便捷的界面布局方法 |
CN102520935A (zh) * | 2011-11-29 | 2012-06-27 | 曙光信息产业(北京)有限公司 | 一种用于快速开发用户界面的方法 |
CN102609985A (zh) * | 2012-02-29 | 2012-07-25 | 北京恒泰实达科技发展有限公司 | 三维电站图形平台 |
CN102819861A (zh) * | 2012-07-25 | 2012-12-12 | 广州供电局有限公司 | 电力***三维设备场景建模方法 |
CN103035031A (zh) * | 2012-11-15 | 2013-04-10 | 北京科东电力控制***有限责任公司 | 面向电网运行监控的三维人机交互显示控制方法 |
CN103885788A (zh) * | 2014-04-14 | 2014-06-25 | 焦点科技股份有限公司 | 一种基于模型组件化动态web 3d虚拟现实场景的搭建方法及*** |
-
2014
- 2014-12-03 CN CN201410724197.3A patent/CN105653750A/zh active Pending
Patent Citations (10)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN1487446A (zh) * | 2003-06-24 | 2004-04-07 | 深圳市华磊网络技术有限公司 | 服务器端应用为浏览器客户端提供用户界面的方法 |
CN101470591A (zh) * | 2007-12-29 | 2009-07-01 | 华为技术有限公司 | 页面控件布局方法与装置 |
CN101814024A (zh) * | 2009-10-23 | 2010-08-25 | 深圳创维-Rgb电子有限公司 | 一种跨平台3d界面设计架构和工具 |
CN102375733A (zh) * | 2010-08-24 | 2012-03-14 | 北大方正集团有限公司 | 一种便捷的界面布局方法 |
CN101944027A (zh) * | 2010-09-26 | 2011-01-12 | 北京神州泰岳软件股份有限公司 | 一种用户界面生成方法 |
CN102520935A (zh) * | 2011-11-29 | 2012-06-27 | 曙光信息产业(北京)有限公司 | 一种用于快速开发用户界面的方法 |
CN102609985A (zh) * | 2012-02-29 | 2012-07-25 | 北京恒泰实达科技发展有限公司 | 三维电站图形平台 |
CN102819861A (zh) * | 2012-07-25 | 2012-12-12 | 广州供电局有限公司 | 电力***三维设备场景建模方法 |
CN103035031A (zh) * | 2012-11-15 | 2013-04-10 | 北京科东电力控制***有限责任公司 | 面向电网运行监控的三维人机交互显示控制方法 |
CN103885788A (zh) * | 2014-04-14 | 2014-06-25 | 焦点科技股份有限公司 | 一种基于模型组件化动态web 3d虚拟现实场景的搭建方法及*** |
Non-Patent Citations (2)
Title |
---|
常兴华: "指挥显示***三维态势组件的设计与实现", 《自动化技术与应用》 * |
滕红等: "过程***中人机界面布局设计的试验研究", 《机械设计与研究》 * |
Cited By (4)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN110197038A (zh) * | 2019-06-05 | 2019-09-03 | 北京华如科技股份有限公司 | 一种仿真***实体-组件的生成方法 |
CN110389810A (zh) * | 2019-07-31 | 2019-10-29 | 阿里巴巴集团控股有限公司 | 一种在虚拟画布上快速摆放ui控件的方法、装置及设备 |
CN110389810B (zh) * | 2019-07-31 | 2023-03-31 | 创新先进技术有限公司 | 一种在虚拟画布上快速摆放ui控件的方法、装置及设备 |
CN111258690A (zh) * | 2020-01-10 | 2020-06-09 | 中国建设银行股份有限公司 | 一种构建3d页面的方法和装置 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
Langner et al. | Multiple coordinated views at large displays for multiple users: Empirical findings on user behavior, movements, and distances | |
Shen et al. | Augmented reality for collaborative product design and development | |
US7650565B2 (en) | Method for managing annotations in a computer-aided design drawing | |
US20170344116A1 (en) | Haptic output methods and devices | |
KR101546725B1 (ko) | 반응형 레이아웃 설계 방법 | |
Ong et al. | A mixed reality environment for collaborative product design and development | |
US20130067430A1 (en) | User interface description language | |
KR102359732B1 (ko) | 이동 가능 미니 탭들을 갖는 사용자 인터페이스 | |
US20160026363A1 (en) | Apparatus and method for manipulating the orientation of an object on a display device | |
US20200326829A1 (en) | Generating contextual guides | |
CN109716276A (zh) | 访问三维模型中视觉上被遮挡的元素的***和方法 | |
CN102750419A (zh) | 一种地铁综合管线辅助设计***及设计方法 | |
CN103473041A (zh) | 一种可视化的数据处理方法及*** | |
CN105550021A (zh) | 跨浏览器动态展示方法和装置 | |
CN105653750A (zh) | 人机界面三维设计***中组件布局的实现方法 | |
US8902222B2 (en) | Three dimensional contriver tool for modeling with multi-touch devices | |
CN105630378A (zh) | 基于双触摸屏的三维虚拟场景设计装配***及方法 | |
CN102841781B (zh) | 基于电子白板的函数曲线的构造方法和*** | |
US20100257485A1 (en) | Object network alignment line | |
Müller et al. | ReFlex Framework: Rapid Prototyping for Elastic Displays | |
Kukimoto | Open government data visualization system to facilitate evidence-based debate using a large-scale interactive display | |
CN104699866A (zh) | 人机界面三维设计***中的空间表格编辑器的实现方法 | |
JP2016016319A (ja) | 仮想空間平面上に配置したオブジェクトを表示制御するゲーム・プログラム | |
CN103838906B (zh) | 用于在计算机辅助设计***中设计至少一个对象模型组件的方法和*** | |
US20210141524A1 (en) | System For Creating Programs |
Legal Events
Date | Code | Title | Description |
---|---|---|---|
C06 | Publication | ||
PB01 | Publication | ||
SE01 | Entry into force of request for substantive examination | ||
SE01 | Entry into force of request for substantive examination | ||
WD01 | Invention patent application deemed withdrawn after publication |
Application publication date: 20160608 |
|
WD01 | Invention patent application deemed withdrawn after publication |