一种拖拽页面组件时显示对齐线的方法及装置制造方法及图纸

本发明专利技术提供了一种拖拽页面组件时显示对齐线的方法及装置，其中，获取创建网页时待进行对齐操作的第一组件，以及与所述第一组件进行对齐的第二组件；确定所述第一组件中的第一边线，以及所述第二组件中的第二边线；将所述第二边线延长作为对齐线呈现，能够提高创建网页过程中组件对齐的效率和精度。

【技术实现步骤摘要】

本专利技术涉及网页设计领域，具体而言，涉及一种拖拽页面组件时显示对齐线的方法及装置。
技术介绍
通常情况下，创建网页需要专业人员通过编程实现，这就要求网页创建人员具备较高的专业性，对于普通用户来说无法实现网页创建，局限性较强。为了增强创建网页的通用性，提出了快速创建网页的方法，达到网页可视化制作的目的，例如将一组html代码片段定义为组件，通过预先设定的网页设计器，用户可以进行选择、拖拽改变组件的位置及大小、设置组件的属性等操作改变不见外观和功能，通过不同组件组合成目标网页。但是，在通过组件实现网页创建的过程中，当拖拽页面对齐组件时，仅能够将页面中的组件对齐到被对齐组件的外边缘，当需要将对齐组件向被对齐组件的外边缘的其他对齐组件对齐时，只有通过目测调节实现对齐，导致现有的组件对齐效率较低、精度较低。
技术实现思路
有鉴于此，本专利技术的目的在于提供一种拖拽页面组件时显示对齐线的方法及装置，以提高在网页可视化制作过程中绘制组件对齐的效率和精度。第一方面，本专利技术实施例提供了一种拖拽页面组件时显示对齐线的方法，包括获取创建网页时待进行对齐操作的第一组件，以及与所述第一组件进行对齐的第二组件；确定所述第一组件中的第一边线，以及第二组件中的第二边线；将所述第二边线延长作为对齐线呈现。结合第一方面，本专利技术实施例提供了第一方面的第一种可能的实施方式，其中，所述第一组件的第一边线和第二组件中的第二边线垂直对齐；所述第一组件和第二组件的形状相同，所述第一组件的大小和所述第二组件的大小不相同；将所述第二边线延长作为对齐线呈现，包括：确定所述第一边线的两个端点在设定坐标系中的第一纵坐标的两个对应值，和所述第一边线对齐的第二边线的两个端点在设定坐标系中的第二纵坐标的两个对应值；将所述四个值中最小值对应的端点和所述最大值对应的端点连线延长后作为对齐线呈现。结合第一方面，本专利技术实施例提供了第一方面的第二种可能的实施方式，其中，所述第一组件的第一边线和第二组件中的第二边线水平对齐；所述第一组件和第二组件的形状相同，所述第一组件的大小和所述第二组件的大小不相同；确定所述第一边线的两个端点在设定坐标系中的第一横坐标的两个对应值，和所述第一边线对齐的第二边线的端点在设定坐标系中的第二纵坐标的两个对应值；将所述四个值中最小值对应的端点和所述最大值对应的端点连线延长后作为对齐线呈现。结合第一方面的第一种可能的实施方式或第二种可能的实施方式，本专利技术实施例提供了第一方面的而第三种可能的实施方式，其中所述第一边线包含第一组件的中线，所述第二边线包含第二组件的中线；其中所述中线包含纵向中线和横向中线，所述纵向中线垂直设定坐标系中的水平轴，所述横向中线平行设定坐标系的水平轴。结合第一方面或第一方面的第一种可能的实施方式，本专利技术实施例提供了第一方面的第四种可能的实施方式，其中，还包括：将所述对齐线按照创建网页页面的形状、大小展示。第二方面，本专利技术实施例提供了一种拖拽页面组件时显示对齐线的装置，包括：获取模块、确定模块、执行模块；其中，所述获取模块，用于获取创建网页时待进行对齐操作的第一组件，以及与所述第一组件进行对齐的第二组件；所述确定模块，用于确定所述第一组件中的第一边线，以及所述第二组件中的第二边线；所述执行模块，用于将所述第二边线延长作为对齐线呈现。结合第二方面，本专利技术实施例提供了第二方面的第一种可能的实施方式，所述第一组件的第一边线和第二组件中的第二边线垂直对齐；所述第一组件和第二组件的形状相同，所述第一组件的大小和所述第二组件的大小不相同；所述执行模块，具体用于确定所述第一边线的端点在设定坐标系中的第一纵坐标的最小值，和所述第一边线对齐的第二边线的端点在设定坐标系中的第二纵坐标的最大值；将所述最小值对应的端点和所述最大值对应的端点连线延长后作为对齐线呈现。结合第二方面，本专利技术实施例提供了第二方面的第二种可能的实施方式，所述第一组件的第一边线和第二组件中的第二边线水平对齐；所述第一组件和第二组件的形状相同，所述第一组件的大小和所述第二组件的大小不相同；所述执行模块，具体用于确定所述第一边线的端点在设定坐标系中的第一横坐标的最小值，和所述第一边线对齐的第二边线的端点在设定坐标系中的第二纵坐标的最大值；将所述最小值对应的端点和所述最大值对应的端点连线作延长后作为对齐线呈现。结合第二方面的第一种或者第二种可能的实施方式，本专利技术实施例提供了第二方面的第三种可能的实施方式，所述确定模块用于确定所述第一边线包含第一组件的中线，所述第二边线包含第二组件的中线；其中所述中线包含纵向中线和横向中线，所述纵向中线垂直设定坐标系中的水平轴，所述横向中线平行设定坐标系的水平轴。结合第二方面或者第二方面的第一种可能的实施方式，本专利技术实施例提供了第二方面的第四种可能的实施方式，所述执行模块还包括：将所述对齐线按照创建网页页面的形状、大小展示。本专利技术实施例提供了一种拖拽页面组件时显示对齐线的方法及装置，其中，获取创建网页时待进行对齐操作的第一组件，与第一组件进行对齐的第二组件；确定第一组件中的第一边线，以及待进行对齐的第二组件中的第二边线；将第二边线延长作为对齐线呈现。与现有技术的创建网页相比，提高了组件对齐的效率和精度。为使本专利技术的上述目的、特征和优点能更明显易懂，下文特举较佳实施例，并配合所附附图，作详细说明如下。附图说明为了更清楚地说明本专利技术实施例的技术方案，下面将对实施例中所需要使用的附图作简单地介绍，应当理解，以下附图仅示出了本专利技术的某些实施例，因此不应被看作是对范围的限定，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他相关的附图。图1示出了本专利技术实施例所提供的拖拽页面组件时显示对齐线的方法的流程图；图2a示出了本专利技术实施例所提供的拖拽页面组件时显示对齐线的绘制方法之一；图2b示出了本专利技术实施例所提供的拖拽页面组件时显示对齐线的绘制方法之二；图2c示出了本专利技术实施例所提供的拖拽页面组件时显示对齐线的绘制方法之三；图2d示出了本专利技术实施例所提供的拖拽页面组件时显示对齐线的绘制方法之四；图2e示出了本专利技术实施例所提供的拖拽页面组件时显示对齐线的绘制方法之五；图3a示出了本专利技术实施例所提供的拖拽页面组件时显示对齐线的绘制方法之一；图3b示出了本专利技术实施例所提供的拖拽页面组件时显示对齐线的绘制方法之二；图3c示出了本专利技术实施例所提供的拖拽页面组件时显示对齐线的绘制方法之三；图3d示出了本专利技术实施例所提供的拖拽页面组件时显示对齐线的绘制方法之四；图3e示出了本专利技术实施例所提供的拖拽页面组件时显示对齐线的绘制方法之五；图4示出了本专利技术实施例所提供的拖拽页面组件时显示对齐线的装置。具体实施方式为使本专利技术实施例的目的、技术方案和优点更加清楚，下面将结合本专利技术实施例中附图，对本专利技术实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例仅仅是本专利技术一部分实施例，而不是全部的实施例。通常在此处附图中描述和示出的本专利技术实施例的组件可以以各种不同的配置来布置和设计。因此，以下对在附图中提供的本专利技术的实施例的详细描述并非旨在限制要求保护的本专利技术的范围，而是仅仅表示本专利技术的选定实施例。基于本专利技术的实施例，本领域技术人员在没有做出创造性劳动的前提下所本文档来自技高网...

【技术保护点】
一种拖拽页面组件时显示对齐线的方法，其特征在于，包括：获取创建网页时待进行对齐操作的第一组件，以及与所述第一组件进行对齐的第二组件；确定所述第一组件中的第一边线，以及所述第二组件中的第二边线；将所述第二边线延长作为对齐线呈现。

【技术特征摘要】
1.一种拖拽页面组件时显示对齐线的方法，其特征在于，包括：获取创建网页时待进行对齐操作的第一组件，以及与所述第一组件进行对齐的第二组件；确定所述第一组件中的第一边线，以及所述第二组件中的第二边线；将所述第二边线延长作为对齐线呈现。2.根据权利要求1所述的方法，其特征在于，所述第一组件的第一边线和第二组件中的第二边线垂直对齐；所述第一组件和第二组件的形状相同，所述第一组件的大小和所述第二组件的大小不相同；将所述第二边线延长作为对齐线呈现，包括：确定所述第一边线的端点在设定坐标系中的第一纵坐标的最小值，和所述第一边线对齐的第二边线的端点在设定坐标系中的第二纵坐标的最大值；将所述最小值对应的端点和所述最大值对应的端点连线延长后作为对齐线呈现。3.根据权利要求1所述的方法，其特征在于，所述第一组件的第一边线和第二组件中的第二边线水平对齐；所述第一组件和第二组件的形状相同，所述第一组件的大小和所述第二组件的大小不相同；确定所述第一边线的端点在设定坐标系中的第一横坐标的最小值，和所述第一边线对齐的第二边线的端点在设定坐标系中的第二纵坐标的最大值；将所述最小值对应的端点和所述最大值对应的端点连线延长后作为对齐线呈现。4.根据权利要求2或3所述的方法，其特征在于，所述第一边线包含第一组件的中线，所述第二边线包含第二组件的中线；其中所述中线包含纵向中线和横向中线，所述纵向中线垂直设定坐标系中的水平轴，所述横向中线平行设定坐标系的水平轴。5.根据权利要求1或2所述的方法，其特征在于，还包括：将所述对齐线按照创建网页页面的形状、大小展示。6.一种拖拽页面组件时显示对齐线的装置，其特征在于，包括：获取模...

【专利技术属性】
技术研发人员：刘晨，
申请(专利权)人：中企动力科技股份有限公司，
类型：发明
国别省市：北京;11