CN1695108B

CN1695108B - 利用扩展的图形用户界面功能建立通信的装置和方法

Info

Publication number: CN1695108B
Application number: CN038251612A
Authority: CN
Inventors: 斯蒂芬·多布尔迈尔; 埃尔玛·瑟纳
Original assignee: Siemens AG
Current assignee: Siemens AG
Priority date: 2002-09-25
Filing date: 2003-09-12
Publication date: 2012-09-05
Anticipated expiration: 2023-09-12
Also published as: EP1546849A2; WO2004029785A2; US7337409B2; CN1695108A; US20040056896A1; WO2004029785A3

Abstract

可定制的拖放使得涉及两个相关对象的自定义的或者项目特有的功能易于激活。用户界面图形地显示特定模块的对象。扩展的功能扩展拖放操作，以允许用户来定义当执行拖放操作时应用的新的语义集合。以这种方式，可以利用由自定义的功能所扩展的可定制的拖放来建立通信。通过可定制的拖放，还可以实现工业自动化系统配置的定义和修改，以及制造执行系统中对象的超链接。

Description

利用扩展的图形用户界面功能建立通信的装置和方法

技术领域

本发明涉及一种拖放(Drag & Drop)，特别涉及激活和扩展拖放过程的功能，其应用特别适用于框架。

背景技术

在商用软件应用中，经常有这样的情形，需要将功能合并到新的应用中。过去，这是通过从头开始创建代码并将其连接到工业应用中实现的。当系统扩展时，也同样需要编程代码。在较短时间内，支持系统所需要的编程显然过于繁重。程序员经常发现自己为了不同的应用书写相同或相似的代码，每一次几乎都在重做轮回。

曾经认为对象代码编程通过提供可重用的对象可以解决重写代码的问题。然而，重用对象仍然需要一定量的编程。一则，需要将对象引入并关联到新的应用中去。再则，总是需要对对象进行修改以适合新的应用。在某些方面，合并新对象所需要的编程提出的挑战与从头开始书写代码一样多。接口和协议问题已经导致称为网络分析员的整个新一代程序员的产生。结果，最近几年来关于系统的系统员工的整体数量有了迅猛增长。

另外，商用软件今天的用户习惯于利用图形用户界面(GUI，Graphical User Interface)与系统连接。确实，现在的系统几乎全部基于GUI。要求用户脱离GUI环境并对功能手工重新编程是一种退步。

在工业应用中尤其如此，其中，一个故障可以导致整个工厂的关闭，这种网络要求几乎连续不断的监控。随着几近无数的系统连接到工业网络，为了应对这种使人畏缩的任务的挑战，用户安装有专门的工业网络GUI，例如人机界面(HMI，Human Machine Interface)。即使有所有这样的技术支持，仍然需要用户对他们的应用进行手工编程调整以包含新的功能。

因此，需要一种方法、系统和装置，用于使用户能够简单并有效地将功能从一个应用包含到另一个应用中，对工业网络尤其如此。

发明内容

本发明的一个目的是给拖放操作提供扩展功能。

本发明的另一个目的是在对象上应用拖放操作的扩展功能。

本发明的另一个目的是在框架中的对象上应用拖放操作的扩展功能。

本发明的另一个目的是在工业框架中的对象上应用拖放操作的扩展功能。

根据本发明的目的，提供一种机制用于构造自定义的或者项目特有的功能，以扩展关于拖放操作的语义。一种用户界面图形地显示特定模块的对象。一种扩展的功能扩展拖放操作，以允许用户定义新的语义集合，当执行拖放操作时应用该新的语义。

在本发明的另一方面中，提供一种使用扩展的图形用户界面功能建立通信的方法。第一步是扩展图形用户界面操作的功能，以包括在框架的外部服务器之间建立通信的对象。下一步是响应图形用户界面操作执行该扩展功能。

附图说明

图1是拖放操作的示意图；

图2是在对象的树型表示中拖放操作的示意图；

图3是图示在拖放操作期间对象拖动之前和/或对象放下之前即刻选择特有功能的屏幕快照；

图4a是图示适用于本发明的架构的示意图；

图4b是图示拖放操作结果的屏幕快照。

将对几个附图更详细地进行描述，其中类似的标号指代相同或者相似的元件。

具体实施方式

在图1中图示了基本的拖放操作10。简单地说，就图形用户界面(GUI)而言，拖放指的是在显示屏幕上移动图标或其他图像。通常，利用由鼠标键控制的光标或者指针，通过在对象上“单击”选定对象。在保持按下鼠标键的同时，通过移动鼠标在显示屏幕上移动或者“拖动”对象。当释放鼠标键时就在那个位置上“放下”该数据。

在更加专业的术语中，拖放是一种数据传输应用程序接口(API，Application Program Interface)，其允许用户操纵图形环境12，并因而，操纵与图形对象有关的隐含的应用。采用这样一种GUI操作，在该环境内移动对象是非常实用的。例如，在许多应用中，通过将指针定位在块的端点，然后在该块上拖动指针就可以选定文本块。接着就能够对该高亮显示的资料进行复制或剪切和移动。

图1的本发明提供一种在环境12内基于图形的编辑器。应用14包括一个或更多对象14a...n。操作中，例如，用户用已描述过的拖放16过程，从例如该应用中选择源对象14a。将源对象14a越过图形用户界面拖动到目标对象18。虽然定义了拖放过程的不同方面，但这里应当理解本发明并不受专用术语限制，而是包括不同组件的等效物。图标指的是小图片或者图形，其代表对象或程序。任何项目都能够被单独选定并操作。这可能包括在显示屏幕上出现的形状和图片，以及较不切实的软件实体。例如，在面向对象的编程中，对象是一种自包含(self-contained)实体，其由数据和操作该数据的过程组成。

本发明中参考了鼠标。鼠标是一种控制光标或者指针在显示屏幕上的移动的设备。当移动鼠标时，显示屏幕上的指针按照相同的方向移动。本发明包括各种类型的鼠标及其等效物。存在机械式鼠标，在其下侧带有橡胶或金属滚球，当该球相对于传感器滚动时检测其方向。光机鼠标与机械式鼠标相似，但使用光学传感器来检测滚球的移动和方向。当然，本发明不局限于鼠标的使用，而是包括借助其能够拖放对象的任何装置。

这里还涉及GUI。更具体地说，GUI是一种程序接口，其利用计算机的图形能力使程序易于使用。通常GUIs特色是包含以下基本组件：指针，基本上是一种图形符号，其出现在显示屏幕上，而且可以使其移动以选择对象和命令；定点设备，如鼠标或者轨迹球，其使你能够选择显示屏幕上的对象；图标，代表命令、文件或窗口的小图片；桌面，显示屏幕上的区域，其中将代表在真实桌面上的真实对象的图标分组；一个或多个窗口，其是屏幕的划分，能够运行不同程序或显示不同文件；以及菜单，其允许用户通过从菜单中选择一种选项来执行命令。

GUI不仅仅显示可视组件，它还允许用户在隐式(underlying)的环境中操作对象。例如，采用GUI，将数据从一个应用移动至另一个应用就比较容易。真正的GUI包括用于表示文本和图形的标准格式。因为格式是定义明确的，因而在共用的GUI下运行的不同的程序能够共享数据。这使例如复制由电子表格程序创建的图表到由文字处理软件创建的文档中成为可能。当然，这仅仅是一种示例，并且本发明并不特别限于GUI。

本发明通过扩展拖放操作的功能来利用GUI的适应性。以这种方式，本发明能够执行设置的、自定义的以及甚至可能复杂的关联/相关的操作。例如，如图2所示，提供了一种基于层次的编辑器，用于在层式树中的对象之间对功能进行拖放。在第一窗口20中，具有对象24a...n的层式树22。通过拖放操作26，将处于选定状态的拖动源对象24a，拖动到具有对象32的层式树30的另一窗口28中，拖动到目标对象32a的上面。换句话说，本发明的拖放在不同应用中执行定制的层次对象结构的同步。该结构的同步是自定义的功能，其能够在运行时添加，并且能够在放下之后粘贴之前立即选定。

图3是本发明在工作中的屏幕快照34。该图举例说明如何扩展拖放的功能。根据本发明，已经激活一种拖放功能，经由该功能拖动组件1并在组件2上放下。一旦放下就出现了弹出菜单36，其提供扩展的自定义的功能36a。如图所示，拖放扩展的功能包括复制内容、连接、建议(advise)、链接以及其他，例如设定链接目标和添加到配置。同样，关于拖放的标准功能如复制和移动已经添加到此弹出菜单中。当然，本发明不局限于所列出的任何特定功能，而是还可以包括其他自定义的功能。

在一个方面，本发明提供对象或者应用之间的通信。在示出的图中，提供有设定链接目标的扩展功能。当在目标对象上放下之前选定此扩展功能时，设定对目标的链接，从而建立源和目标之间的通信。

在所附的附录中给出了Windows^TM环境下拖放操作的一种工作示例。这里现将对每一事件进行描述。有两个术语与拖放操作有关，源和目标。因此，如果拖动文件夹到回收站中，文件夹就是源，而回收站就成为目标。与拖放操作相关联的所有事件以顺序方式发生，下面列出了所有事件处理程序。

首先，将描述拖动操作。当用户开始拖动文本选定或选定的对象时，在源对象上激发ondragstart(源事件)。当启动拖动操作时，这是激发的最初事件。在源对象被拖动的同时，在源对象上连续激发ondrag(源事件)。在ondragstart事件之后直接激发ondrag事件，并且连续激发，直至触发ondragend事件处理程序。当将该源拖动经过有效的放下目标对象时，激发ondragenter(目标事件)。该放下目标可以在另一浏览程序窗口中。用户拖动该对象经过有效的放下目标的同时，在目标元素上连续激发ondragover(目标事件)。当用户在有效的放下目标上释放鼠标键时，在目标元素上激发ondrop(目标事件)。如果用户拖动对象经过有效的放下目标然后离开该有效的放下目标，则激发ondragleave(目标事件)。不管该源元素是否在有效的放下目标上，当用户在拖动操作中释放鼠标时，发生ondragend(源事件)，即激发的最后事件。

接着，传输拖动的数据。通过利用window.event.dataTransffer对象，可访问预定义的剪贴板功能以帮助我们进行我们的拖放操作。这使对拖放进行定制成为可能。利用dataTransfer对象，clearData()从剪贴板去除一个或多个数据格式。EffectAllowed指定在该源元素上通过拖放操作允许的效果。

一个或多个拖放功能可以包括各种功能。这些功能可以包括复制选定的对象的复制命令。这不仅仅是如人们所认为的复制那样的复制，而是实际上，对于对象的情况，创建选定对象的新对象，亦即对该选定对象实例化。另一功能可以是通过数据传输操作将选定的对象链接至放下目标。可以具有移动功能，其当放下时将该选定移动至目标位置。可以提供复制链接功能，其根据目标缺省值复制或者链接该选定。也可以提供复制移动功能，其根据目标缺省值复制或者移动该选定。同样地，可以提供链接移动功能，其根据目标缺省值链接或者移动该选定。也可以有启用所有的放下效果的功能和禁用所有由本发明提供的放下效果的功能。在后者的情况下，可以显示不放下光标(no-drop cursor)，以表明禁用该拖放特征。可以提供没有设定任何功能的未初始化槽(unitialized slot)，其中默认效果起作用，但不能查询根据此特性的特性。当然，其它功能也在本发明的范围之内。

本发明扩展用于拖放操作的语义，其自动或者通过用户的操作定义新的语义集合，当执行拖放操作时应用。现在，按照附录中示出的编程代码对拖放操作的详情进行描述。

dropEffect设定或者取回拖放操作的类型和用于对象的显示的光标。调用此操作的语法是window.event.dataTransfer.dropEffect[＝cursorStyle]，其中cursorStyle是指定所显示的光标类型的串(string)。

可能的光标类型可以包括所显示的复制光标。也可以显示链接光标。可以显示移动光标。另外，也可以不显示光标，如果没有指定光标，则这是缺省值。此外，可以显示缺省光标，其是不放下光标(no-drop cursor)。这种最后的光标可以是例如带有斜杠穿过其中的圆的形式。

然后，setDate()将特定格式的数据分配给dataTransfer对象。用于此方法的语法是window.event.dataTranefer.setData(sDataFormat，sData)，其中sDataFormat是指定要传输的数据的格式所必需的串。它可以包括值“Text”或“URL”两者之中的任意一个。SData参数是另一必需的串，其指定由源要素提供的数据。它可以是描述性的文本或者某种URL。

getData()事件通过dataTransfer对象从剪贴板取回特定格式的数据。用于此方法的语法是：window.event.dataTransfer.getData(sDataFormat)，此处sDataFormat是必需的并且是指定数据格式值为“Text”或者“URL”的串。

本发明可以用在框架的语境中。框架是一种要被实例化的软件系统或者子系统。框架的实例化包括构成和子类化现有的类。用于特定领域中的应用的框架称为应用框架。它定义用于系统或者子系统的族系(family)的结构，并提供创建它们的基本构建块，以及对于具体功能应当进行修改的地方。在面向对象的环境中，框架包括抽象的和具体的类。在本发明语境中的框架不局限于工业框架(Industrial Framework)，而是可以包括其他框架，如无线电通信、ERP、Billing等。

图4a举例说明一种类型的框架，工业框架37，其中本发明运转。该工业框架是被设计来集成工厂内的系统的高度集成的组件的集合。其是提供对组成制造运行系统(manufacturing execution system，MES)的组件进行集成和协调是一种基础技术。工业框架实现并管理不同功能组件之间的数据通信，并且允许用户对这些组件一起工作的方式进行建模，以达到制造目标。

所示出的工业框架包括服务器层38，其构成网络的主干网，因为它提供对所有耦合到其的系统的连接和集成，并控制通信流。应用层40包括各种系统，其控制耦合到工业框架的工厂设备。表示层42提供经由包括例如HMI、蜂窝电话、手持机和PC的远程系统到一个或多个用户的连接。

从图4a中可以理解，本发明的工业框架提供了一种可伸缩、分布式和开放的柔性架构，同时提供一种真正的n级架构(n-level architecture)。从图中还可以看到，该框架具有多种数据传输，包括超级文本传输协议(HTTP)和MS报文排队(Message Queuing)，其可以支持远程访问和控制，例如因特网，或者通过GSM、UMTS。根据该图，示出了该框架既支持同步通信也支持异步通信，因此可以配备来集成任何系统。

从该架构可以观察到，该工业框架被设计成可扩展、可动态配置并可重用。正如已经提到的，监测和控制这种一种网络很重要。为了使此项任务更加容易，当给出这种工业网络的复杂性时，本发明在诸如工业框架的工业网络内提供HMI或者GUI设备的支持。这提供了建模的公布式和图形式方法，并使网络范围的信息流动的执行成为可能。

在所述工业框架的背景内，设置有(如图4b所示)称为工作台(workbench)44的专用GUI，其提供图形配置或工作区46，其中可以设计和修改分布式工作流和/或数据流，以及业务对象的设计、映射和项目部署。其还规定(provide for)了业务对象的设计和运行时GUIs的设计。利用该工作台，用户能够创建作为脚本实现的自定义的或者项目特有的定制的拖动命令，该脚本作为项目文件或者用户配置文件(user-profile)的一部分来编辑、保存和加载。

为提供该工业系统的纵览或映射，提供有导航或树型窗格(treepane)48，其显示工业网络的系统组件的层式树型目录(hierarchical treedirectory)。在本发明中，该树型目录可以是各种类型，包括显示该工业网络的全局系统组件的全局树型目录。也可以提供在该树型窗格内的局部树型目录，其显示局部层次。此外，可以在另一树型窗格50中提供分类树(catalog tree)，其图形地显示例如工业框架适配器(Adapter)的层次。

另外，设置有工具接口窗格(Tool Interface Pane)52，其显示命令的交互式的图形集合。这些命令可以是例如公共命令，诸如打开文件、保存文件、创建新项目、激活/减活项目、退出、关闭，以及如手册文献和支持的帮助和调试信息。这样，工作台提供了集成工程环境(Integrated Engineering Environment)，其中可视地监视并控制分布式工作流和数据流的图形配置。

使用由本发明提供的工作台工具能够执行若干功能。用于数据流适配器的配置和集成，例如，OPC到SAP连接。由这些工具提供了具有如单步的调试支持的状态机图(State Machine Diagram)的定义和测试。利用这些工具，该GUI设计器可用来图形地操纵基于HTML的瘦身客户(thinclient)。适配器提供可访问分布式系统内部所有可得数据的工业框架服务器(Industrial Framework Server)。同样还提供基于web的GUI，其向web传送这种数据的任意部分，以及，利用活动服务器页面(Active Server Page)，使得能够遥控工业框架组件。

利用所述工作台，可以理解本发明能够启动在树型窗格中的对象上的拖放功能。例如，本发明能够在对象之间对功能进行剪切和粘贴。此外，所扩展的功能能够影响在使用该拖放扩展功能的任何选定对象上的功能。如图3所示，执行拖放操作，以在对象组件2上完成设定链接目标。

将理解本发明是有利的，因为它提供了一种灵活的工具，通过该工具用户在两个相关对象的语境(context)中可以容易并快速地使用几种不同的功能。因为在运行时能够给拖放机制功能添加新的功能，并能将其应用于对象，而不需要用户重写软件代码，或者修改或者改写现有对象。在其中大量系统在运行的需要快速并有效的解决方案的如工业框架的复杂网络中，这尤其有利。此外，本发明提供一种优势的方法，通过该方法能够应用新的功能而不用离开GUI环境。

除了如上所述的本发明方面的实施例之外，本领域技术人员将能够做出各种其他的布置和步骤，其即使在本文档中没有明确描述，但仍然体现本发明的原理并且落入所附权利要求的范围。例如，方法步骤的次序不必固定而可以进行修改，并不背离本发明的范围和精神。

在本发明中，做出了几个参考。应该理解术语“源对象”是关于被拖动的对象的同义术语。术语“目标对象”应用作关于该被拖动的对象将要拖到的或已经拖到的对象的同义词。

附录

<html>

<head>

<title>shopping Anyone？</title>

//the object that you are dragging：

var srcObj＝new Object；

//string to hold source of object being dragged：

var dummyObj；

function startDrag() {

//get what is being dragged：

srcObj＝window.event.srcElement；

//store the source of the object into a string acting

as a dummy object so we don′t ruin the original object：

dummyObj＝srcObj.outerHTML；

//post the data for Windows：

var dragData＝window.event.dataTransfer；

//set the type of data for the clipboard：

dragData.setData(′Text′，window.event.srcElement.src)；

//allow only dragging that involves moving the object：

dragData.effectAllowed＝′linkMove′；

//use the special′move′cursor when dragging：

dragData.dropEffect＝′move′；

}

function enterDrag() {

//allow target object to read clipboard：

window.event.dataTransfer.getData(′Text′)；

｝

function endDrag() {

//when done remove clipboard data

window.event.dataTransfer.clearData()；

｝

function overDrag() {

//tell onOverDrag handler not to do anything：

window.event.returnValue＝false；

｝

function drop() {

//eliminate deault action of ondrop so we can

customize：

window.event.returnValue＝false；

//manually add new attributes：

dummyObj＝addAttribute(dummyObj，′height＝″25″

width＝″25″alt＝″′+srcObj.myLabel+′″′)；

//add the picture below shopping cart：

miniProductBar.innerHTML+＝dummyObj+′&nbsp；′；

//change shopping cart message：

productBarstatus.innerHTML＝′<b>′+srcObj.myLabel+

′<\/b>has been added to the shopping cart.′；

}

//since we aren′t working with an actual object，we will

add our attributes manually：

function addAttribute(oObj，sVal) {

var loc＝oObj.indexOf(″>″) ；

return oObj.substring(0，loc)+′′+sVal+′>′；

}

//--></script>

</head>

<body>

<！-----------------DRAG THESE IMAGES------------------------

---->

<img src＝″jsbible.gif″ondragstart＝″startDrag()″

ondragend＝″endDrag()″myLabel＝″Java script superBible″

border＝″1″>

<img src＝″dhtml.gif″ondragstart＝″startDrag()″

ondragend＝″endDrag()″myLabel＝″Dynamic HTML″border＝″1″>

<img src＝″html.gif″ondragstart＝″startDrag()″

ondragend＝″endDrag()″myLabel＝″HTML 4 Super Bible″

border＝″1″>

</p>

<！--------------------------------------CART----------------

---------------->

<img src＝″cart.jpg″id＝″cart″ondrop＝″drop()″

ondragover＝″overDrag()″ondragenter＝″enterDrag()″>

<！------------------------------------PRODUCT BAR STATUS----

---------------->

<div id＝″productBarStatus″style＝″font-family：arial；font-

size：9pt″>Drag Items Into shoppoing Cart.Works in IE 5.0

only.</div>

<！-------------------------------------MINI PRODUCT BAR-----

---------------->

<div id＝″miniProductBar″style＝″width：400px；

height：10Dpx；″></div>

</body>

</html>

Claims

1.一种利用扩展的图形用户界面功能建立通信的装置，包括：

用于选择所述扩展的图形用户界面中的源对象的部件；

用于拖动该选定的源对象以及在目标对象上放下该源对象的部件，以使得应用特有和用户特有的功能应用于所述源对象和基于放下应用于所述目标对象，

用于基于把该选定的源对象在该目标对象上放下显示弹出菜单的部件，该弹出菜单示出至少一个扩展功能；以及

用于从所述弹出菜单选择功能的部件，其中所述扩展功能定义目标对象和源对象之间的关系，

其中，所述关系在所述源对象和目标对象之间建立通信协议。

2.根据权利要求1所述的装置，其中，所述扩展功能包括设置链接目标的功能，其在所述源对象和所述目标对象之间建立链接。

3.根据权利要求1所述的装置，其中，所述扩展功能包括添加到配置的功能，其添加所述源对象到描述个人计算机、工作站和可编程逻辑控制器的工业系统软件的配置的模型。

4.根据权利要求1所述的装置，其中，所述用户界面是工作台，其中所述用户与图形地表示的对象图形地连接。

5.根据权利要求4所述的装置，其中，所述工作台包括导航窗格，其以层式树的方式列出了应用和相关联的对象。

6.根据权利要求4所述的装置，还包括框架，其中，所述工作台连接到所述框架。

7.根据权利要求6所述的装置，其中，所述框架是工业框架。

8.一种利用扩展的图形用户界面功能建立通信的方法，包括以下步骤：

选择所述扩展的图形用户界面中的源对象；

拖动该选定的源对象以及在目标对象上放下该源对象，以使得应用特有和用户特有的功能应用于所述源对象和基于放下应用于所述目标对象，

其中，基于把该选定的源对象在该目标对象上放下，显示弹出菜单，该弹出菜单示出至少一个扩展功能；以及

从所述弹出菜单选择功能，其中所述扩展功能定义目标对象和源对象之间的关系，

9.根据权利要求8所述的方法，其中，所述扩展功能的激活执行对象代码程序。

10.根据权利要求8所述的方法，其中，所述扩展功能包括设置链接目标的功能。

11.根据权利要求8所述的方法，其中，所述扩展功能包括添加到配置的功能，其添加所述源对象到描述个人计算机、工作站和可编程逻辑控制器的工业系统软件的配置的模型。

12.根据权利要求8所述的方法，还包括将用户界面耦合到框架的步骤。

13.根据权利要求12所述的方法，其中，所述功能建立所述框架的服务器之间的通信。