CN106909385A - 可视化页面编辑器及可视化页面编辑器的操作方法 - Google Patents

可视化页面编辑器及可视化页面编辑器的操作方法 Download PDF

Info

Publication number
CN106909385A
CN106909385A CN201710108103.3A CN201710108103A CN106909385A CN 106909385 A CN106909385 A CN 106909385A CN 201710108103 A CN201710108103 A CN 201710108103A CN 106909385 A CN106909385 A CN 106909385A
Authority
CN
China
Prior art keywords
component
editing machine
page editing
visual page
user
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
Application number
CN201710108103.3A
Other languages
English (en)
Inventor
陈敏亮
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Beijing Baidu Netcom Science and Technology Co Ltd
Original Assignee
Beijing Baidu Netcom Science and Technology Co Ltd
Priority date (The priority date 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 date listed.)
Filing date
Publication date
Application filed by Beijing Baidu Netcom Science and Technology Co Ltd filed Critical Beijing Baidu Netcom Science and Technology Co Ltd
Priority to CN201710108103.3A priority Critical patent/CN106909385A/zh
Publication of CN106909385A publication Critical patent/CN106909385A/zh
Pending legal-status Critical Current

Links

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F8/00Arrangements for software engineering
    • G06F8/30Creation or generation of source code
    • G06F8/34Graphical or visual programming
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F8/00Arrangements for software engineering
    • G06F8/30Creation or generation of source code
    • G06F8/38Creation or generation of source code for implementing user interfaces

Landscapes

  • Engineering & Computer Science (AREA)
  • Software Systems (AREA)
  • General Engineering & Computer Science (AREA)
  • Theoretical Computer Science (AREA)
  • Physics & Mathematics (AREA)
  • General Physics & Mathematics (AREA)
  • Human Computer Interaction (AREA)
  • User Interface Of Digital Computer (AREA)
  • Processing Or Creating Images (AREA)

Abstract

本申请公开了可视化页面编辑器及可视化页面编辑器的操作方法。方法的一具体实施方式包括:接收用户在可视化页面编辑器的交互界面中对操作对象的拖曳操作;将该操作对象作为子元素插入该拖曳操作的终点对应的组件或元素中,其中,该操作对象包括组件或元素。该实施方式实现了根据用户的操作灵活的开发组件或元素,使得组件或元素的融合功能突出。

Description

可视化页面编辑器及可视化页面编辑器的操作方法
技术领域
本申请涉及计算机技术领域,具体涉及计算机网络技术领域,尤其涉及可视化页面编辑器及可视化页面编辑器的操作方法。
背景技术
页面编辑器,可以用于构建网页的页面或应用程序的页面等。
目前业界常用的页面编辑器,包括一起秀、不用编码就可以快速创建网站的浏览器插件(Webflow)等可视化页面编辑器。其中,一起秀是一种绝对定位的页面编辑器,可以做简单的运营页面。Webflow是个完整的编辑平台,可以实现动态交互设计。
然而,目前的页面编辑器存在以下问题:(1)一起秀的绝对定位布局的布局元素不能被内部元素撑开,只能做简单的运营页面,更为复杂的页面只有通过流式布局完成。(2)Webflow的动态交互设计的内容不可定制,并非组件化,也不能插入业务自定义组件,使得运用范围比较狭隘。
发明内容
本申请的目的在于提出一种改进的可视化页面编辑器及可视化页面编辑器的操作方法,来解决以上背景技术部分提到的技术问题。
第一方面,本申请提供了一种可视化页面编辑器,可视化页面编辑器包括:接收模块,用于接收用户在可视化页面编辑器的交互界面中对操作对象的拖曳操作;插入模块,用于将操作对象作为子元素插入拖曳操作的终点对应的组件或元素中,操作对象包括组件或元素。
在一些实施例中,可视化页面编辑器的交互界面中的组件和元素采用相对定位和/或绝对定位。
在一些实施例中,当可视化页面编辑器的交互界面中的组件和元素采用相对定位时,组件和元素的定位位置根据组件和元素的尺寸和/或位置进行调整。
在一些实施例中,可视化页面编辑器还包括:生成模块,用于响应于用户的操作符合预设的组合操作,基于预设的组件和/或上传的组件生成组合的组件。
在一些实施例中,操作对象位于交互界面的菜单栏或交互界面的视图区域。
在一些实施例中,交互界面的菜单栏包括以下一项或多项:预览按钮、撤销操作按钮、重复操作按钮、保存按钮、组合按钮和树状结构按钮。
在一些实施例中,可视化页面编辑器还包括:调整模块,用于根据用户的编辑操作,调整组件和元素的参数。
在一些实施例中,可视化页面编辑器的配置文件与操作平台无关。
第二方面,本申请提供了一种可视化页面编辑器的操作方法,操作方法包括:接收用户在可视化页面编辑器的交互界面中对操作对象的拖曳操作;将操作对象作为子元素插入拖曳操作的终点对应的组件或元素中,其中,操作对象包括组件或元素。
在一些实施例中,交互界面中的组件和元素采用相对定位和/或绝对定位。
在一些实施例中,当交互界面中的组件和元素采用相对定位时,组件和元素的定位位置根据组件和元素的尺寸和/或位置进行调整。
在一些实施例中,操作方法还包括:响应于用户的操作符合预设的组合操作,基于预设的组件和/或上传的组件生成组合的组件。
在一些实施例中,操作对象位于交互界面的菜单栏或交互界面的视图区域。
在一些实施例中,交互界面的菜单栏包括以下一项或多项:预览按钮、撤销操作按钮、重复操作按钮、保存按钮、组合按钮和树状结构按钮。
在一些实施例中,操作方法还包括:根据用户的编辑操作,调整组件和元素的参数。
第三方面,本申请提供了一种页面,页面的内容采用如上所述的可视化页面编辑器编辑。
第四方面,本申请提供了一种设备,包括:一个或多个处理器;存储装置,用于存储一个或多个程序;交互单元,用于采集用户操作以及显示用户操作的结果;当一个或多个程序被一个或多个处理器执行,使得一个或多个处理器实现如上任一所述的操作方法。
第五方面,本申请提供了一种计算机可读存储介质,其上存储有计算机程序,其特征在于,该程序被处理器执行时实现如上任一所述的操作方法。
本申请提供的可视化页面编辑器及可视化页面编辑器的操作方法,该可视化页面编辑器首先接收用户在可视化页面编辑器的交互界面中对操作对象的拖曳操作,之后将操作对象作为子元素插入拖曳操作的终点对应的组件或元素中,操作对象包括组件或元素。从而实现了根据用户的操作灵活的开发组件或元素,使得组件或元素的融合功能突出。
附图说明
通过阅读参照以下附图所作的对非限制性实施例所作的详细描述,本申请的其它特征、目的和优点将会变得更明显:
图1是根据本申请的可视化页面编辑器的一个实施例的示意性流程图;
图2是根据本申请的可视化页面编辑器的又一个实施例的示意性流程图;
图3示出了根据本申请的可视化页面编辑器的一个实施例的示例性应用场景;
图4是根据本申请的可视化页面编辑器的操作方法的一个实施例的示例性结构图;
图5是根据本申请的可视化页面编辑器的操作方法的又一个实施例的示例性结构图;
图6是适于用来实现本申请实施例的终端设备或服务器的计算机系统的结构示意图。
具体实施方式
下面结合附图和实施例对本申请作进一步的详细说明。可以理解的是,此处所描述的具体实施例仅仅用于解释相关发明,而非对该发明的限定。另外还需要说明的是,为了便于描述,附图中仅示出了与有关发明相关的部分。
需要说明的是,在不冲突的情况下,本申请中的实施例及实施例中的特征可以相互组合。下面将参考附图并结合实施例来详细说明本申请。
图1示出了根据本申请的可视化页面编辑器的一个实施例的流程100。该可视化页面编辑器包括:接收模块110和插入模块120。该可视化页面编辑器可以应用于各种电子设备中。
其中,接收模块110,配置用于接收用户在可视化页面编辑器的交互界面中对操作对象的拖曳操作。插入模块120,配置用于将操作对象作为子元素插入拖曳操作的终点对应的组件或元素中。
在本实施例中,可视化页面编辑器是指利用计算机图形学和图像处理技术,将数据转换成图形或图像在屏幕上显示出来,并进行交互处理的用于编辑页面内容的软体程序,这里的页面内容,可以为网页的内容或应用程序的页面内容。
在接收模块110中,可视化页面编辑器的交互界面为用于与用户进行交互的界面,例如,计算机的显示屏、移动设备的触摸屏等等。用户在可视化页面编辑器的交互界面中对操作对象的拖曳操作,可以通过可视化页面编辑器所在的电子设备的输入装置来实现,例如,可以通过计算机的鼠标输入实现拖曳操作,通过移动设备的触摸屏是吸纳拖曳操作,以及通过电子设备的摄像头捕捉的用户手势实现拖曳操作等。其中的操作对象,可以为页面的组件或元素。这里的组件是指对数据和方法的简单封装,例如页面中的表格、树、联动下拉框等;这里的元素是指页面中可以看到的基本数据,例如文字、图片、音频、动画、视频等。
在插入模块120中,用户的拖曳操作的终点所停留的位置,可以指示用户希望插入的组件或元素。在确定该用户指示的组件或元素后,可以将用户拖曳的操作对象插入该指示的组件或元素中。例如,将用户拖曳的组件或元素作为子元素插入另一个组件中,或者将用户拖曳的组件或元素插入另一个元素中。也即,任何拥有插入子元素能力的组件或元素(比如布局组件),都可以往其中拖入任何组件或元素,拖入的组件或元素中依然可以拖入可以插入子元素的组件或元素,这样可以无限循环的插入子元素。
在本实施例的一些可选实现方式中,上述的可视化页面编辑器的交互界面中的组件和元素采用相对定位和/或绝对定位。
在本可选实现方式中,布局元素可以采用相对定位,在相对定位时,元素的宽高会影响其它元素,比如顶部元素增加了高度,会把下面的元素挤到下方,这样可以胜任复杂布局页面的制作。备选地或附加地,布局元素也可以采用绝对定位,在绝对定位时,元素的在页面中的位置为设定的位置,并不根据元素自身或其它元素的参数的变化进行调整。
可视化页面编辑器的交互界面中的组件和元素,通过采用相对定位,可以快捷的应对组件或元素的任何变化,反应更快更积极。可视化页面编辑器的交互界面中的组件和元素,也可以通过采用绝对定位来固定组件或元素在页面中的位置,不受其它组件或元素变化的干扰。
在本实施例的一些可选实现方式中,当可视化页面编辑器的交互界面中的组件和元素采用相对定位时,组件和元素的定位位置根据组件和元素的尺寸和/或位置进行调整。
在本实现方式中,由于组件和元素的定位位置根据组件和元素的尺寸和/或位置进行调整,因此可以使得页面中的组件和元素适应页面的尺寸变化,和/或适应页面中组件或元素的尺寸或位置变化。
本申请上述实施例提供的可视化页面编辑器,首先通过接收模块接收用户在可视化页面编辑器的交互界面中对操作对象的拖曳操作,之后通过插入模块将操作对象作为子元素插入拖曳操作的终点对应的组件或元素中,实现了根据用户的操作灵活的开发组件或元素,提高了组件或元素的融合功能。
进一步参考图2,图2示出了根据本申请的可视化页面编辑器的又一个实施例的流程200。该可视化页面编辑器包括:
接收模块210,用于接收用户在可视化页面编辑器的交互界面中对操作对象的拖曳操作;插入模块220,用于将操作对象作为子元素插入拖曳操作的终点对应的组件或元素中,操作对象包括组件或元素;备选地或附加地,可视化页面编辑器还可以包括生成模块230,用于响应于用户的操作符合预设的组合操作,基于预设的组件和/或上传的组件生成组合的组件;备选地或附加地,可视化页面编辑器还可以包括调整模块240,用于根据用户的编辑操作,调整组件和元素的参数。
在本实施例中,接收模块210与图1中接收模块110相同,插入模块220与图1中插入模块120相同,在此不再赘述。
在生成模块230中,预设的组合操作至少可以包括:用户提交组合对象的操作,以及用户提交对组合对象的组合请求的操作。这两个操作的提交顺序,可以根据用户的需求设定,本申请对此不做限定。例如,在一个可视化页面编辑器中,可以首先执行提交组合对象的操作,之后执行提交组合请求的操作;在另一个可视化页面编辑器中,可以首先执行提交组合请求的操作,之后执行提交选中组合对象的操作。
用户在提交预设的组合操作时,可以以现有技术或未来发展的技术中的人机交互方式来提交。这些人机交互方式包括但不限于:晃动终端、点击虚拟按钮(例如显示在显示屏上的虚拟按钮)、点击实体按钮(例如音量按键)、手势识别、语音识别或者其它未来将开发的人机交互方式。以手势识别为例,在终端具有摄像头的情况下,预设的组合操作的发起方式还可以是作用于摄像头的、与预设的组合操作相对应的操作手势。更具体而言,首先,可以预定义与提交预设的组合操作相对应的操作手势;之后,终端的摄像头可以实时地对用户手势进行捕捉和识别,如果用户手势随后被识别为与提交的预设的组合操作相对应的操作手势,则提交预设的组合操作。
在生成模块230响应于用户的操作符合预设的组合操作,基于预设的组件和/或上传的组件生成组合的组件时,可以有两种方式制作组合的组件,分别是私有化部署时制作组合的组件,以及在线制作组合的组件。
在私有化部署时制作组合的组件时,是指在开发人员安装这个可视化页面编辑器时,可以将组件传入编辑器,并通过编写配置文件,让编辑器可以像操作通用组件一样操作任意定制组件。
在线制作,指的是编辑器的组合功能,组合功能可以将任意视图区域组件(包括含有任意子元素的高聚合度组件)设置为一个新的组件(比如组合1,组合2),组合会出现在拖拽菜单栏上,和普通组件一样,也可以拖拽到页面中,而且会直接生成该组合。例如,在制作一个招聘网站时,我们可以把做好的内容区域整体设置为一个组合的组件,当制作下一块内容区域时,直接拖拽组合到视图区域生成内容区块,会立即拷贝一个与当时生成组合时选中组件一模一样的组件(这个组件有很多子元素,组成了整个内容区块),比重新拖拽N(N为大于0的整数)个小组件来的快得多。
在调整模块240中,可视化页面编辑器向用户提供修改组件的参数或元素的参数的接口,并响应于用户对于接口的编辑操作,调整组件或元素的参数。这里的组件的参数可以为组件架构、尺寸、位置或呈现形式等,元素的参数可以为元素的尺寸、位置以及呈现形式等。
在本实施例的一些可选实现方式中,操作对象位于交互界面的菜单栏或交互界面的视图区域。
在本实现方式中,当用户拖曳位于菜单栏操作对象时,会将该操作对象插入拖曳的终点对应的组件或元素中,并且原菜单栏中的操作对象仍存在;当用户拖曳位于交互界面的视图区域的操作对象时,会将该操作对象插入拖曳的终点对应的组件或元素中,并且原视图区域的操作对象不再存在。
通过对位于菜单栏的操作对象的拖曳,有利于用户对操作对象的选择和应用,提高了用户的开发效率。通过在视图区域的操作对象的拖曳,有利于用户对操作对象的进一步操作,提高了用户的开发效率。
在本实施例的一些可选实现方式中,交互界面的菜单栏包括以下一项或多项:预览按钮、撤销操作按钮、重复操作按钮、保存按钮、组合按钮和树状结构按钮。
在本实现方式中,交互界面的菜单栏通过设置预览按钮、撤销操作按钮、重复操作按钮、保存按钮、组合按钮和树状结构按钮中的一项或多项,可以方便用户选择应用,从而提高开发效率。
在本实施例的一些可选实现方式中,可视化页面编辑器的配置文件与操作平台无关。
在本实现方式中,可视化页面编辑器生成的配置文件是与电子设备的操作平台无关的,因此可以运行的操作平台可以包括:个人电脑端的网页应用程序、移动端的网页应用程序、安卓操作系统的原生应用程序、苹果操作系统的原生应用程序等。网页端使用网页的应用程序编程接口构建文档对象模型树,而安卓和苹果原生应用程序可以使用跨平台移动应用开发(例如React-native)技术,最终将配置文件转化为系统原生用户界面组件渲染。通过可视化页面编辑器的配置文件与操作平台无关,可以扩展可视化页面编辑器在不同操作平台上的应用,从而扩展了可视化页面编辑器的应用范围。
本申请上述实施例提供的可视化页面编辑器,与图1中所示的实施例相比,增加了生成模块和/或调整模块,通过增加生成模块,可以在下一次采用生成模块中的组件或元素编辑页面时,增快用户编辑页面速度;通过增加调整模块,可以在用户编辑页面时,根据用户需要设置组件或元素的参数,从而提高了可视化页面编辑器的适用性。
以下结合图3,描述根据本申请的可视化页面编辑器的一个实施例的示例性应用场景。
如图3所示,可视化页面编辑器310中,可以接收用户输入的通用组件320,也可以接收用户输入的定制组件330,还可以接收用户将通用组件和定制组件组合后的组件340,还可以在可视化页面编辑器310中,接收用户对选中组件的拖曳操作,从而得到嵌套组件,从而根据用户输入的编辑操作,生成网页页面350和应用程序页面360。
本申请上述应用场景提供的可视化页面编辑器,拓展了可视化编辑页面的应用场景。
进一步参考图4,作为对上述方法的实现,本申请提供了一种可视化页面编辑器的操作方法的一个实施例,该操作方法的实施例与图1所示的可视化页面编辑器的实施例相对应,由此,上文针对图1中可视化页面编辑器描述的操作和特征同样适用于操作方法400及其中包含的步骤,在此不再赘述。
如图4所示,本实施例的可视化页面编辑器的操作方法400包括以下步骤:
在步骤410中,接收用户在可视化页面编辑器的交互界面中对操作对象的拖曳操作;
在步骤420中,将操作对象作为子元素插入拖曳操作的终点对应的组件或元素中,其中,操作对象包括组件或元素。
在本实施例的一些可选实现方式中,交互界面中的组件和元素采用相对定位和/或绝对定位。
在本实施例的一些可选实现方式中,当交互界面中的组件和元素采用相对定位时,组件和元素的定位位置根据组件和元素的尺寸和/或位置进行调整。
进一步参考图5,作为对上述方法的实现,本申请提供了一种可视化页面编辑器的操作方法的又一个实施例,该装置实施例与图2所示的可视化页面编辑器的实施例相对应,由此,上文针对图2中可视化页面编辑器的各模块描述的操作和特征同样适用于操作方法500及其中包含的步骤,在此不再赘述。
如图5所示,本实施例的可视化页面编辑器的操作方法500包括:
在步骤510中,接收用户在可视化页面编辑器的交互界面中对操作对象的拖曳操作;
在步骤520中,将操作对象作为子元素插入拖曳操作的终点对应的组件或元素中,其中,操作对象包括组件或元素;
可选地,在步骤530中,响应于用户的操作符合预设的组合操作,基于预设的组件和/或上传的组件生成组合的组件;
可选地,在步骤540中,根据用户的编辑操作,调整组件和元素的参数。
在本实施例的一些可选实现方式中,操作对象位于交互界面的菜单栏或交互界面的视图区域。
在本实施例的一些可选实现方式中,交互界面的菜单栏包括以下一项或多项:预览按钮、撤销操作按钮、重复操作按钮、保存按钮、组合按钮和树状结构按钮。
在本实施例的一些可选实现方式中,可视化页面编辑器的配置文件与操作平台无关。
本申请还提供了一种页面的实施例,所述页面的内容采用如上所述的可视化页面编辑器编辑。
本申请还提供了一种设备的实施例,包括:一个或多个处理器;存储装置,用于存储一个或多个程序;交互单元,用于采集用户操作以及显示用户操作的结果;当所述一个或多个程序被所述一个或多个处理器执行,使得所述一个或多个处理器实现如上所述的操作方法。
本申请还提供了一种计算机可读存储介质的实施例,其上存储有计算机程序,该程序被处理器执行时实现如上所述的操作方法。
下面参考图6,其示出了适于用来实现本申请实施例的终端设备或服务器的计算机系统600的结构示意图。图6示出的终端设备/服务器仅仅是一个示例,不应对本申请实施例的功能和使用范围带来任何限制。
如图6所示,计算机系统600包括中央处理单元(CPU)601,其可以根据存储在只读存储器(ROM)602中的程序或者从存储部分608加载到随机访问存储器(RAM)603中的程序而执行各种适当的动作和处理。在RAM 603中,还存储有系统600操作所需的各种程序和数据。CPU 601、ROM 602以及RAM 603通过总线604彼此相连。输入/输出(I/O)接口605也连接至总线604。
以下部件连接至I/O接口605:包括键盘、鼠标等的输入部分606;包括诸如阴极射线管(CRT)、液晶显示器(LCD)等以及扬声器等的输出部分607;包括硬盘等的存储部分608;以及包括诸如LAN卡、调制解调器等的网络接口卡的通信部分609。通信部分609经由诸如因特网的网络执行通信处理。驱动器610也根据需要连接至I/O接口606。可拆卸介质611,诸如磁盘、光盘、磁光盘、半导体存储器等等,根据需要安装在驱动器610上,以便于从其上读出的计算机程序根据需要被安装入存储部分608。
特别地,根据本公开的实施例,上文参考流程图描述的过程可以被实现为计算机软件程序。例如,本公开的实施例包括一种计算机程序产品,其包括承载在计算机可读介质上的计算机程序,所述计算机程序包含用于执行流程图所示的方法的程序代码。在这样的实施例中,该计算机程序可以通过通信部分609从网络上被下载和安装,和/或从可拆卸介质611被安装。在该计算机程序被中央处理单元(CPU)601执行时,执行本申请的方法中限定的上述功能。
需要说明的是,本申请所述的计算机可读介质可以是计算机可读信号介质或者计算机可读存储介质或者是上述两者的任意组合。计算机可读存储介质例如可以是——但不限于——电、磁、光、电磁、红外线、或半导体的系统、装置或器件,或者任意以上的组合。计算机可读存储介质的更具体的例子可以包括但不限于:具有一个或多个导线的电连接、便携式计算机磁盘、硬盘、随机访问存储器(RAM)、只读存储器(ROM)、可擦式可编程只读存储器(EPROM或闪存)、光纤、便携式紧凑磁盘只读存储器(CD-ROM)、光存储器件、磁存储器件、或者上述的任意合适的组合。在本申请中,计算机可读存储介质可以是任何包含或存储程序的有形介质,该程序可以被指令执行系统、装置或者器件使用或者与其结合使用。而在本申请中,计算机可读的信号介质可以包括在基带中或者作为载波一部分传播的数据信号,其中承载了计算机可读的程序代码。这种传播的数据信号可以采用多种形式,包括但不限于电磁信号、光信号或上述的任意合适的组合。计算机可读的信号介质还可以是计算机可读存储介质以外的任何计算机可读介质,该计算机可读介质可以发送、传播或者传输用于由指令执行系统、装置或者器件使用或者与其结合使用的程序。计算机可读介质上包含的程序代码可以用任何适当的介质传输,包括但不限于:无线、电线、光缆、RF等等,或者上述的任意合适的组合。
附图中的流程图和框图,图示了按照本申请各种实施例的系统、方法和计算机程序产品的可能实现的体系架构、功能和操作。在这点上,流程图或框图中的每个方框可以代表一个模块、程序段、或代码的一部分,所述模块、程序段、或代码的一部分包含一个或多个用于实现规定的逻辑功能的可执行指令。也应当注意,在有些作为替换的实现中,方框中所标注的功能也可以以不同于附图中所标注的顺序发生。例如,两个接连地表示的方框实际上可以基本并行地执行,它们有时也可以按相反的顺序执行,这依所涉及的功能而定。也要注意的是,框图和/或流程图中的每个方框、以及框图和/或流程图中的方框的组合,可以用执行规定的功能或操作的专用的基于硬件的系统来实现,或者可以用专用硬件与计算机指令的组合来实现。
描述于本申请实施例中所涉及到的模块可以通过软件的方式实现,也可以通过硬件的方式来实现。所描述的模块也可以设置在处理器中,例如,可以描述为:一种处理器包括接收模块和插入模块。其中,这些模块的名称在某种情况下并不构成对该模块本身的限定,例如,接收模块还可以被描述为“接收用户在可视化页面编辑器的交互界面中对操作对象的拖曳操作的模块”。
作为另一方面,本申请还提供了一种非易失性计算机存储介质,该非易失性计算机存储介质可以是上述实施例中所述装置中所包含的非易失性计算机存储介质;也可以是单独存在,未装配入终端中的非易失性计算机存储介质。上述非易失性计算机存储介质存储有一个或者多个程序,当所述一个或者多个程序被一个设备执行时,使得所述设备:接收用户在可视化页面编辑器的交互界面中对操作对象的拖曳操作;将该操作对象作为子元素插入该拖曳操作的终点对应的组件或元素中,其中,该操作对象包括组件或元素。
以上描述仅为本申请的较佳实施例以及对所运用技术原理的说明。本领域技术人员应当理解,本申请中所涉及的发明范围,并不限于上述技术特征的特定组合而成的技术方案,同时也应涵盖在不脱离上述发明构思的情况下,由上述技术特征或其等同特征进行任意组合而形成的其它技术方案。例如上述特征与本申请中公开的(但不限于)具有类似功能的技术特征进行互相替换而形成的技术方案。

Claims (18)

1.一种可视化页面编辑器,其特征在于,所述可视化页面编辑器包括:
接收模块,用于接收用户在可视化页面编辑器的交互界面中对操作对象的拖曳操作;
插入模块,用于将所述操作对象作为子元素插入所述拖曳操作的终点对应的组件或元素中,所述操作对象包括组件或元素。
2.根据权利要求1所述的可视化页面编辑器,其特征在于,所述可视化页面编辑器的交互界面中的组件和元素采用相对定位和/或绝对定位。
3.根据权利要求2所述的可视化页面编辑器,其特征在于,当所述可视化页面编辑器的交互界面中的组件和元素采用相对定位时,所述组件和元素的定位位置根据所述组件和元素的尺寸和/或位置进行调整。
4.根据权利要求1-3任意一项所述的可视化页面编辑器,其特征在于,所述可视化页面编辑器还包括:
生成模块,用于响应于用户的操作符合预设的组合操作,基于预设的所述组件和/或上传的所述组件生成组合的组件。
5.根据权利要求1-3所述的可视化页面编辑器,其特征在于,所述操作对象位于所述交互界面的菜单栏或所述交互界面的视图区域。
6.根据权利要求5所述的可视化页面编辑器,其特征在于,所述交互界面的菜单栏包括以下一项或多项:
预览按钮、撤销操作按钮、重复操作按钮、保存按钮、组合按钮和树状结构按钮。
7.根据权利要求1所述的可视化页面编辑器,其特征在于,所述可视化页面编辑器还包括:
调整模块,用于根据用户的编辑操作,调整所述组件和所述元素的参数。
8.根据权利要求1所述的可视化页面编辑器,其特征在于,所述可视化页面编辑器的配置文件与操作平台无关。
9.一种可视化页面编辑器的操作方法,其特征在于,所述操作方法包括:
接收用户在可视化页面编辑器的交互界面中对操作对象的拖曳操作;
将所述操作对象作为子元素插入所述拖曳操作的终点对应的组件或元素中,其中,所述操作对象包括组件或元素。
10.根据权利要求9所述的操作方法,其特征在于,所述交互界面中的组件和元素采用相对定位和/或绝对定位。
11.根据权利要求10所述的操作方法,其特征在于,当所述交互界面中的组件和元素采用相对定位时,所述组件和元素的定位位置根据所述组件和元素的尺寸和/或位置进行调整。
12.根据权利要求9-11任意一项所述的操作方法,其特征在于,所述操作方法还包括:
响应于用户的操作符合预设的组合操作,基于预设的所述组件和/或上传的所述组件生成组合的组件。
13.根据权利要求9-11任意一项所述的操作方法,其特征在于,所述操作对象位于所述交互界面的菜单栏或所述交互界面的视图区域。
14.根据权利要求13所述的操作方法,其特征在于,所述交互界面的菜单栏包括以下一项或多项:预览按钮、撤销操作按钮、重复操作按钮、保存按钮、组合按钮和树状结构按钮。
15.根据权利要求9所述的操作方法,其特征在于,所述操作方法还包括:
根据用户的编辑操作,调整所述组件和所述元素的参数。
16.一种页面,其特征在于,所述页面的内容采用如权利要求1-8任意一项所述的可视化页面编辑器编辑。
17.一种设备,其特征在于,包括:
一个或多个处理器;
存储装置,用于存储一个或多个程序;
交互单元,用于采集用户操作以及显示用户操作的结果;
当所述一个或多个程序被所述一个或多个处理器执行,使得所述一个或多个处理器实现如权利要求9-15中任一所述的操作方法。
18.一种计算机可读存储介质,其上存储有计算机程序,其特征在于,该程序被处理器执行时实现如权利要求9-15中任一所述的操作方法。
CN201710108103.3A 2017-02-27 2017-02-27 可视化页面编辑器及可视化页面编辑器的操作方法 Pending CN106909385A (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN201710108103.3A CN106909385A (zh) 2017-02-27 2017-02-27 可视化页面编辑器及可视化页面编辑器的操作方法

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN201710108103.3A CN106909385A (zh) 2017-02-27 2017-02-27 可视化页面编辑器及可视化页面编辑器的操作方法

Publications (1)

Publication Number Publication Date
CN106909385A true CN106909385A (zh) 2017-06-30

Family

ID=59207994

Family Applications (1)

Application Number Title Priority Date Filing Date
CN201710108103.3A Pending CN106909385A (zh) 2017-02-27 2017-02-27 可视化页面编辑器及可视化页面编辑器的操作方法

Country Status (1)

Country Link
CN (1) CN106909385A (zh)

Cited By (23)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN107577459A (zh) * 2017-08-21 2018-01-12 杰为软件系统(深圳)有限公司 一种基于组件化的拖拽式跨平台应用开发系统及方法
CN107885533A (zh) * 2017-11-30 2018-04-06 广州酷狗计算机科技有限公司 管理组件代码的方法及装置
CN107918958A (zh) * 2017-11-07 2018-04-17 珠海金山网络游戏科技有限公司 一种可视化和可定制的三维渲染系统及方法
CN108008943A (zh) * 2017-11-30 2018-05-08 深圳市华力特电气有限公司 一种webAPP开发方法和系统
CN108388444A (zh) * 2018-03-05 2018-08-10 重庆邮电大学 一种基于React组件的前端页面配置方法及系统
CN108958736A (zh) * 2018-07-20 2018-12-07 北京三快在线科技有限公司 页面生成方法、装置、电子设备及计算机可读介质
CN109032568A (zh) * 2018-07-13 2018-12-18 孟智平 程序逻辑的生成方法、终端设备及存储介质
CN109130336A (zh) * 2018-07-19 2019-01-04 上海复合材料科技有限公司 一种高精度高稳定复合材料天线反射面及其制备方法
CN109299422A (zh) * 2018-09-20 2019-02-01 江苏满运软件科技有限公司 可视化网页编辑方法、系统、设备及存储介质
CN109558190A (zh) * 2018-10-26 2019-04-02 深圳点猫科技有限公司 一种基于编程语言便捷移动网页模块的方法以及电子设备
CN109815469A (zh) * 2018-12-29 2019-05-28 天津字节跳动科技有限公司 一种文字编辑方法、装置、介质和电子设备
CN109918600A (zh) * 2019-01-28 2019-06-21 平安普惠企业管理有限公司 生成h5活动页的方法、装置、计算机设备和存储介质
CN110109727A (zh) * 2019-04-30 2019-08-09 上海掌门科技有限公司 应用的配置方法和装置
CN110543307A (zh) * 2019-07-23 2019-12-06 江苏联盟信息工程有限公司 一种应用构建方法及装置
CN110633436A (zh) * 2019-08-28 2019-12-31 河南九商科技有限公司 可视化、自定义全景编辑方法、系统、存储介质及设备
CN111061473A (zh) * 2019-12-16 2020-04-24 新奥数能科技有限公司 用于快速构建页面的可视化组件编辑方法和装置
CN111381899A (zh) * 2020-02-21 2020-07-07 泰康保险集团股份有限公司 用于开发目标系统的方法和装置
CN112015501A (zh) * 2020-07-15 2020-12-01 深圳市金蝶天燕云计算股份有限公司 可视化页面生成方法、装置、计算机设备和存储介质
CN112230914A (zh) * 2019-07-15 2021-01-15 腾讯科技(深圳)有限公司 小程序的制作方法、装置、终端及存储介质
CN112596728A (zh) * 2020-12-26 2021-04-02 中国农业银行股份有限公司 一种页面生成方法及装置
CN114185523A (zh) * 2022-02-11 2022-03-15 北京金堤科技有限公司 一种基于组件的页面树状结构处理方法及装置
WO2023000867A1 (zh) * 2021-07-21 2023-01-26 京东科技控股股份有限公司 页面配置方法和装置
CN116225414A (zh) * 2023-03-09 2023-06-06 广州市华势信息科技有限公司 一种基于零代码的软件可视化快速开发系统

Citations (7)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN102270125A (zh) * 2010-06-04 2011-12-07 中兴通讯股份有限公司 Web应用的开发装置及其开发方法
US20150012818A1 (en) * 2013-07-07 2015-01-08 Ana Rink System and method for semantics-concise interactive visual website design
CN104484171A (zh) * 2014-12-11 2015-04-01 深圳市路通网络技术有限公司 终端界面设计系统、方法及相关设备
CN104615422A (zh) * 2015-01-07 2015-05-13 青岛艾迪森软件有限公司 一种应用软件界面流程自定义的方法
CN104932889A (zh) * 2015-06-15 2015-09-23 北京奇虎科技有限公司 页面可视化生成方法和装置
CN105068815A (zh) * 2015-08-24 2015-11-18 用友网络科技股份有限公司 页面编辑器交互装置和方法
CN106445520A (zh) * 2016-09-23 2017-02-22 北京赢点科技有限公司 一种可视化专题页面制作方法及装置

Patent Citations (7)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN102270125A (zh) * 2010-06-04 2011-12-07 中兴通讯股份有限公司 Web应用的开发装置及其开发方法
US20150012818A1 (en) * 2013-07-07 2015-01-08 Ana Rink System and method for semantics-concise interactive visual website design
CN104484171A (zh) * 2014-12-11 2015-04-01 深圳市路通网络技术有限公司 终端界面设计系统、方法及相关设备
CN104615422A (zh) * 2015-01-07 2015-05-13 青岛艾迪森软件有限公司 一种应用软件界面流程自定义的方法
CN104932889A (zh) * 2015-06-15 2015-09-23 北京奇虎科技有限公司 页面可视化生成方法和装置
CN105068815A (zh) * 2015-08-24 2015-11-18 用友网络科技股份有限公司 页面编辑器交互装置和方法
CN106445520A (zh) * 2016-09-23 2017-02-22 北京赢点科技有限公司 一种可视化专题页面制作方法及装置

Cited By (30)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN107577459B (zh) * 2017-08-21 2020-11-13 杰为软件系统(深圳)有限公司 一种基于组件化的拖拽式跨平台应用开发系统及方法
CN107577459A (zh) * 2017-08-21 2018-01-12 杰为软件系统(深圳)有限公司 一种基于组件化的拖拽式跨平台应用开发系统及方法
CN107918958A (zh) * 2017-11-07 2018-04-17 珠海金山网络游戏科技有限公司 一种可视化和可定制的三维渲染系统及方法
CN107918958B (zh) * 2017-11-07 2020-10-30 珠海金山网络游戏科技有限公司 一种可视化和可定制的三维渲染系统及方法
CN107885533A (zh) * 2017-11-30 2018-04-06 广州酷狗计算机科技有限公司 管理组件代码的方法及装置
CN108008943A (zh) * 2017-11-30 2018-05-08 深圳市华力特电气有限公司 一种webAPP开发方法和系统
CN108388444A (zh) * 2018-03-05 2018-08-10 重庆邮电大学 一种基于React组件的前端页面配置方法及系统
CN109032568A (zh) * 2018-07-13 2018-12-18 孟智平 程序逻辑的生成方法、终端设备及存储介质
CN109130336A (zh) * 2018-07-19 2019-01-04 上海复合材料科技有限公司 一种高精度高稳定复合材料天线反射面及其制备方法
CN108958736B (zh) * 2018-07-20 2022-04-15 北京三快在线科技有限公司 页面生成方法、装置、电子设备及计算机可读介质
CN108958736A (zh) * 2018-07-20 2018-12-07 北京三快在线科技有限公司 页面生成方法、装置、电子设备及计算机可读介质
CN109299422A (zh) * 2018-09-20 2019-02-01 江苏满运软件科技有限公司 可视化网页编辑方法、系统、设备及存储介质
CN109558190A (zh) * 2018-10-26 2019-04-02 深圳点猫科技有限公司 一种基于编程语言便捷移动网页模块的方法以及电子设备
CN109815469A (zh) * 2018-12-29 2019-05-28 天津字节跳动科技有限公司 一种文字编辑方法、装置、介质和电子设备
CN109815469B (zh) * 2018-12-29 2023-09-26 天津字节跳动科技有限公司 一种文字编辑方法、装置、介质和电子设备
CN109918600A (zh) * 2019-01-28 2019-06-21 平安普惠企业管理有限公司 生成h5活动页的方法、装置、计算机设备和存储介质
CN110109727A (zh) * 2019-04-30 2019-08-09 上海掌门科技有限公司 应用的配置方法和装置
US11954464B2 (en) 2019-07-15 2024-04-09 Tencent Technology (Shenzhen) Company Limited Mini program production method and apparatus, terminal, and storage medium
CN112230914B (zh) * 2019-07-15 2023-09-15 腾讯科技(深圳)有限公司 小程序的制作方法、装置、终端及存储介质
CN112230914A (zh) * 2019-07-15 2021-01-15 腾讯科技(深圳)有限公司 小程序的制作方法、装置、终端及存储介质
CN110543307A (zh) * 2019-07-23 2019-12-06 江苏联盟信息工程有限公司 一种应用构建方法及装置
CN110633436A (zh) * 2019-08-28 2019-12-31 河南九商科技有限公司 可视化、自定义全景编辑方法、系统、存储介质及设备
CN110633436B (zh) * 2019-08-28 2022-12-20 河南九商科技有限公司 可视化、自定义全景编辑方法、系统、存储介质及设备
CN111061473A (zh) * 2019-12-16 2020-04-24 新奥数能科技有限公司 用于快速构建页面的可视化组件编辑方法和装置
CN111381899A (zh) * 2020-02-21 2020-07-07 泰康保险集团股份有限公司 用于开发目标系统的方法和装置
CN112015501A (zh) * 2020-07-15 2020-12-01 深圳市金蝶天燕云计算股份有限公司 可视化页面生成方法、装置、计算机设备和存储介质
CN112596728A (zh) * 2020-12-26 2021-04-02 中国农业银行股份有限公司 一种页面生成方法及装置
WO2023000867A1 (zh) * 2021-07-21 2023-01-26 京东科技控股股份有限公司 页面配置方法和装置
CN114185523A (zh) * 2022-02-11 2022-03-15 北京金堤科技有限公司 一种基于组件的页面树状结构处理方法及装置
CN116225414A (zh) * 2023-03-09 2023-06-06 广州市华势信息科技有限公司 一种基于零代码的软件可视化快速开发系统

Similar Documents

Publication Publication Date Title
CN106909385A (zh) 可视化页面编辑器及可视化页面编辑器的操作方法
US11875437B2 (en) Image drawing method based on target template image, apparatus, readable medium and electronic device
CN104932889B (zh) 页面可视化生成方法和装置
US8555186B2 (en) Interactive thumbnails for transferring content among electronic documents
CN112540763A (zh) 前端页面生成方法、装置、平台设备及存储介质
US10649618B2 (en) System and method for creating visual representation of data based on generated glyphs
CN106303723A (zh) 视频处理方法和装置
US9323737B2 (en) Generating an interactive page template based on setting a material type and a plurality of input and output signals for a mobile device
CN106980508A (zh) 用于生成页面的方法和装置
CN106033333A (zh) 一种可视化的增强现实场景制作系统及方法
CN106383630A (zh) 一种阅读书籍的方法和装置
CN110796712A (zh) 素材处理方法、装置以及电子设备、存储介质
US10410606B2 (en) Rendering graphical assets on electronic devices
CN109857388A (zh) 代码生成方法、装置、服务器及计算机可读介质
US20200175975A1 (en) Voice interaction for image editing
US11146742B2 (en) Method and apparatus for multi-exposure photography, and storage medium
CN105930059A (zh) 一种移动终端的显示方法和装置
CN113052262A (zh) 表单生成方法、装置、计算机设备及存储介质
CN109389660A (zh) 图像生成方法和装置
Fanning Coyote's Guide to Traditional IDL Graphics
CN115510347A (zh) 演示文稿的转换方法、装置、电子设备及存储介质
CN110109591A (zh) 一种图片编辑方法和装置
CN109559274A (zh) 图像处理方法、装置、电子设备及计算机可读存储介质
CN113515922A (zh) 一种文档处理方法、系统、装置以及交互装置
CN113110829A (zh) 多ui组件库数据处理方法及装置

Legal Events

Date Code Title Description
PB01 Publication
PB01 Publication
SE01 Entry into force of request for substantive examination
SE01 Entry into force of request for substantive examination
RJ01 Rejection of invention patent application after publication

Application publication date: 20170630

RJ01 Rejection of invention patent application after publication