一种图形界面编辑方法及装置制造方法及图纸

本发明专利技术公开了一种图形界面编辑方法，包括生成控件实例，添加到根面板的控件面板上；在所述控件面板的最高层设置蒙层，屏蔽所述控件面板上控件实例的行为属性；通过所述蒙层，对所述控件面板上的控件实例进行操作。本发明专利技术还公开了一种图形界面编辑装置。采用本发明专利技术实施例，能够实现设计人员在图形界面设计过程中的所见即所得。

【技术实现步骤摘要】

本专利技术涉及业务处理
，特别是涉及一种图形界面编辑方法及装置。
技术介绍
在软件开发工作中，构建图形界面是一项重要内容。图形界面是软件在被应用过 程中最直接面向用户、和用户交互最多的软件组成部分。 一般，图形界面由大量的控件组 成。所述控件通常包括文本框、按钮、分隔窗格、表等。 设计图形界面的过程就是根据用户需求，将控件逐一放置到设计界面中，并在后 台对控件属性进行编辑，使生成的图形界面中，各控件的展现形式满足用户的需求。 专利技术人通过对现有技术的研究发现，传统的图形界面编辑过程中，放置到设计界 面中的控件，仅仅是各控件的简单示意，并不是真实控件的绘图实例。即为，设计过程中设 计界面中展现的控件，与最终生成给用户的图形界面中展现的控件，其形式并不一致，无法 做到所见即所得。因此，设计人员在图形界面设计过程中，只能根据用户需求凭借感觉去设 置各控件的属性，无法获知该图形界面展示给用户时各控件的真实形式。从而很容易导致 最终生成的用户图形界面与用户需求不完全一致。
技术实现思路
有鉴于此，本专利技术的目的在于提供一种图形界面编辑方法及装置，能够实现设计 人员在图形界面设计过程中的所见即所得。 为实现上述目的，本专利技术提供了如下方案一种图形界面编辑方法，所述方法包 括 生成控件实例，添加到根面板的控件面板上； 在所述控件面板的最高层设置蒙层，屏蔽所述控件面板上的控件实例的行为属 性； 通过所述蒙层对所述控件面板上的控件实例进行操作。 优选地，所述生成控件实例具体为 至少设置控件的状态属性或外观属性或行为属性，生成控件实例。 优选地，所述添加到根面板的控件面板上的控件实例为非容器类控件实例。 优选地，所述方法还包括 在所述蒙层上添加容器类控件； 生成控件实例并添加到对应的容器类控件上； 分别为各容器类控件设置二级蒙层，屏蔽所述容器类控件上控件实例的行为属 性； 通过所述二级蒙层对各容器类控件上的各控件实例进行操作。 优选地，所述通过所述蒙层对所述控件面板上的控件实例进行操作，具体为 通过所述蒙层改变所述控件面板上的控件实例的位置或修改控件实例的外观属性。 优选地，所述通过所述二级蒙层，对各容器类控件上的各控件实例进行操作，具体 为 通过所述二级蒙层，改变各容器类控件上的控件实例的位置或修改控件实例的外 观属性。本专利技术还提供一种图形界面编辑装置，所述装置包括 控件实例添加单元，用于生成控件实例，添加到根面板的控件面板上； 蒙层设置单元，用于在所述控件面板的最高层设置蒙层，屏蔽所述控件面板上的控件实例的行为属性； 操作单元，用于通过所述蒙层对所述控件面板上的控件实例进行操作。 优选地，所述控件实例添加单元具体为至少设置控件的状态属性或外观属性或行为属性，生成控件实例。 优选地，所述控件实例生成单元中添加到根面板的控制面板上的控件实例为非容 器类控件实例。 优选地，所述装置还包括 容器类控件添加单元，用于在所述蒙层上添加容器类控件； 第二控件实例添加单元，用于生成控件实例并添加到对应的容器类控件上； 二级蒙层设置单元，用于分别为各容器类控件设置二级蒙层，屏蔽所述容器类控 件上控件实例的行为属性； 第二操作单元，用于通过所述二级蒙层对各容器类控件上的各控件实例进行操 作。 优选地，所述操作单元具体为通过所述蒙层改变所述控件面板上的控件实例的 位置或修改控件实例的外观属性。 优选地，所述第二操作单元具体为通过所述二级蒙层，改变各容器类控件上的控 件实例的位置或修改控件实例的外观属性。根据本专利技术提供的具体实施例，本专利技术公开了以下技术效果 本专利技术实施例，在图形界面的设计过程中，添加到控件面板上的控件实例，不再仅 仅是各控件的简单示意，而是根据用户需求设置了相应属性后的真实按钮。此时，设计人员 在控件面板上看到的控件实例，即为运行界面生成程序后，在图形界面中展现给用户的控 件，由此实现了所见即所得。 同时，通过采用蒙层，避免设计人员在运用鼠标对控件面板上控件实例进行事件 操作时，触发控件实例的行为属性，使得设计人员能够运用自如的对控件面板上各控件实 例进行操作。附图说明 图1是本专利技术实施例一的图形界面编辑方法流程图； 图2是本专利技术实施例一所述方法对应的控件面板示意图； 图3是本专利技术实施例二的图形界面编辑方法流程图； 图4是本专利技术实施例二所述方法对应的控件面板示意 图5是本专利技术实施例的图形界面编辑装置结构图。 具体实施例方式本专利技术的目的在于提供一种图形界面编辑方法及装置，能够实现设计人员在图形 界面设计过程中的所见即所得。 为使本专利技术的上述目的、特征和优点能够更加明显易懂，下面结合附图和具体实 施方式对本专利技术作进一步详细的说明。 参见图l，本专利技术实施例一提供的图形界面编辑方法包括以下步骤 步骤S101 :生成控件实例，添加到根面板的控件面板上； 对于图形界面设计而言，其设计界面一般都是由根面板和控件面板构成。其中，所 述根面板用于放入控件面板，以便设计人员在所述控件面板上添加界面控件。 在现有技术中，添加到所述控件面板上的控件一般是指该控件对应的示意图标。 例如，对于按钮控件，可以采用方框表示。则现有界面设计中，当需要在图形界面上显示一 个按钮时，设计人员会在控件面板上添加一个表示按钮的方框，再根据用户需求，在后台编 写代码，设置该按钮的属性。但是，经过该设置的按钮属性在控件面板中无法展现。对于设 计人员来说，在控件面板中看到的，仍仅仅是方框。只有运行该图形界面的生成程序时，系 统才会根据该按钮属性的设置代码，生成相应的按钮，显示在图形界面上展现给用户。 这里需要说明的是，控件的属性一般可以包括状态属性、外观属性和行为属性。 仍以按钮控件为例进行说明。其状态属性是控件的使用状态，例如可以包括可用、不可用、 暂不可用等状态；外观属性指控件的外在展示的属性，例如可以包括颜色、或尺寸、或渲染 效果等；行为属性是指控件对事件做出的反应，例如按钮控件的行为属性是对输入设备 (例如鼠标)按下、点击等事件具有不同的反应。 而本专利技术实施例中，在设计过程中，便根据用户需求生成控件实例，展现在控件面 板上。具体的，所述根据用户需求，生成控件实例具体为设计人员根据用户的需求，设置控 件的状态属性、外观属性、行为属性，生成控件实例。 这时，设计人员在控件面板上看到的，不再是控件的示意图，而是控件的实际视 图，即已经根据用户需求对控件各项属性具体定义后的控件实例。例如，仍以按钮控件为 例，其对应的控件实例不再仅仅是方框，而是根据用户需求设置了状态、外观、行为属性后 的真实按钮。此时，设计人员在控件面板上看到的按钮，即为界面生成程序运行后，在图形 界面中展现给用户的按钮，由此实现了所见即所得。 步骤S102 :在所述控件面板的最高层设置蒙层，屏蔽所述控件面板上控件实例的 行为属性； 其中，所述蒙层设置在所述控件面板的最高层，能够覆盖该控件面板上所有的控 件实例。 通过步骤S101，使得本专利技术实施例中，添加到所述控件面板上的控件实例，已经具备了各控件的行为属性。因此，若设计人员直接运用鼠标对各控件实例进行事件操作，很可能会因为鼠标的点击触发其行为属性对应的事件，而无法实现需要的操作。 需要说明的是，所述事件操作可以包本文档来自技高网...

【技术保护点】
一种图形界面编辑方法，其特征在于，所述方法包括：生成控件实例，添加到根面板的控件面板上；在所述控件面板的最高层设置蒙层，屏蔽所述控件面板上的控件实例的行为属性；通过所述蒙层对所述控件面板上的控件实例进行操作。

【技术特征摘要】

【专利技术属性】
技术研发人员：陈泓钊，
申请(专利权)人：金蝶软件中国有限公司，
类型：发明
国别省市：94[中国|深圳]