画布扩展方法、装置、存储介质及终端制造方法及图纸

本申请实施例公开了一种画布扩展方法、装置、存储介质及终端，接收针对画布的移动指令，按照移动指令对应的移动方向移动承载画布的容器，画布包括第一边缘和第三边缘，视口包括第二边缘和第四边缘，第一边缘与第三边缘平行，第二边缘与第四边缘平行，第一边缘与第二边缘位于移动方向的同一侧，第三边缘与第四边缘位于移动方向的反方向的同一侧，画布至少包括相邻的第一区域和第二区域；当第一边缘与第二边缘重合时，触发将第一区域的第一内容绘制为第二内容，将第二区域的第二内容绘制为第三内容，并将容器沿着反方向移动至第三边缘与第四边缘重合的位置。采用本申请实施例，实现了绘图应用的画布无限扩展以进行无限绘图的功能。能。能。

【技术实现步骤摘要】
画布扩展方法、装置、存储介质及终端


[0001]本申请涉及计算机
，尤其涉及一种画布扩展方法、装置、存储介质及终端。

技术介绍

[0002]通常需要使用画笔等功能在会议协作白板等web绘图应用或者web绘图功能上绘制内容，但仅仅是屏幕大小的绘制范围，不能满足用户需求。为了扩大绘制范围，实现无线画布的效果，一种方式为，使用尽可能大的画布，例如，如图1所示，视口是屏幕上用于显示web绘图应用的区域，使用5倍视口大小的画布，视口位于画布的正中心，通过移动画布，计算偏移量，根据该偏移量使得视口中展示出画布上不同位置的内容，从而实现了画布扩展的功能。但实现画布大小的扩展需要增加画布尺寸，当每次渲染或者绘制时，都需要先清空无限画布上所有内容，并且重新渲染，从而导致了随着画布变大，清除和重绘面积增加，导致画布在重新绘制图形数据时，延迟大，卡顿现象明显。在另一种方式为，使用与视口大小相同的画布(单倍画布)，如图2所示，在每次移动画布时，都需要重新计算各个点的位置，并重新绘制画布上的内容，达到画布扩展功能。由于每次移动画布，都会进行画布的清除，以及重新绘制的操作，当画布中的数据量多时，重绘的时间变长，甚至卡顿，并且每次移动都会触发重绘，效率低，可扩展性差。

技术实现思路

[0003]本申请实施例提供了一种画布扩展方法、装置、存储介质及终端，实现了绘图应用的画布无限扩展以进行无限绘制图形的功能，渲染快，效率高，并且重绘频次低，可扩展性好。技术方案如下：
[0004]第一方面，本申请实施例提供了一种画布扩展方法，应用于第一终端，第一终端安装有web绘图应用，画布是web绘图应用的用于承载绘制内容的区域，容器用于承载画布，视口是第一终端的屏幕上用于显示web绘图应用的区域，画布的第一长度为视口的第二长度的第一预设倍数，画布的第一宽度为视口的第二宽度的第二预设倍数，第一预设倍数和第二预设倍数均大于1，接收针对画布的移动指令，按照移动指令对应的移动方向移动承载画布的容器，画布包括第一边缘和第三边缘，视口包括第二边缘和第四边缘，第一边缘与第三边缘平行，第二边缘与第四边缘平行，第一边缘与第二边缘位于移动方向的同一侧，第三边缘与第四边缘位于移动方向的反方向的同一侧，画布至少包括相邻的第一区域和第二区域，第一区域绘制第一内容，第二区域绘制第二内容；
[0005]当第一边缘与第二边缘重合时，触发将第一区域的第一内容绘制为第二内容，将第二区域的第二内容绘制为第三内容，并将容器沿着反方向移动至第三边缘与第四边缘重合的位置。
[0006]第二方面，本申请实施例提供一种计算机存储介质，所述计算机存储介质存储有多条指令，所述指令适于由处理器加载并执行上述的方法步骤。
[0007]第三方面，本申请实施例提供一种终端，可包括：处理器和存储器；其中，所述存储器存储有计算机程序，所述计算机程序适于由所述处理器加载并执行上述的方法步骤。
[0008]在本申请实施例中，第一终端安装有web绘图应用，画布是web绘图应用的用于承载绘制内容的区域，容器用于承载画布，视口是第一终端的屏幕上用于显示web绘图应用的区域，画布的第一长度为视口的第二长度的多数，画布的第一宽度为视口的第二宽度的多倍，通过接收针对画布的移动指令，按照移动指令对应的移动方向移动承载画布的容器，当画布的第一边缘与视口的第二边缘重合时，触发将画布的第一区域的第一内容绘制为第二内容，将画布的第二区域的第二内容绘制为第三内容，并将容器沿着反方向移动至画布的第三边缘与视口的第四边缘重合的位置。通过web技术并采用合适尺寸的画布，实现了绘图应用的画布无限扩展以进行无限绘制图形的功能，相对大尺寸的画布，渲染快，效率高，不会出现卡顿，通常用户无感，体验佳。相对小尺寸的画布，重绘频次低，带来了极高的维护性，可扩展性好。
附图说明
[0009]为了更清楚地说明本申请实施例或现有技术中的技术方案，下面将对实施例或现有技术描述中所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图仅仅是本申请的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他的附图。
[0010]图1是本申请实施例提供的一种5倍画布的举例示意图；
[0011]图2是本申请实施例提供的一种单倍画布的举例示意图；
[0012]图3是本申请实施例提供的终端的结构示意图；
[0013]图4是本申请实施例提供的操作系统和用户空间的结构示意图；
[0014]图5是图3中安卓操作系统的架构图；
[0015]图6是本申请实施例提供的一种2倍画布的举例示意图；
[0016]图7是本申请实施例提供的一种画布扩展方法的流程示意图；
[0017]图8a是本申请实施例提供的一种画布边缘与视口边缘的举例示意图；
[0018]图8b是本申请实施例提供的另一种画布边缘与视口边缘的举例示意图；
[0019]图9是本申请实施例提供的一种画布移动前的举例示意图；
[0020]图10是本申请实施例提供的一种画布移动后的举例示意图；
[0021]图11是本申请实施例提供的另一种画布扩展方法的流程示意图；
[0022]图12是本申请实施例提供的一种原点与定位点的相对位置的举例示意图；
[0023]图13是本申请实施例提供的一种演讲者模式下画布移动效果的举例示意图；
[0024]图14是本申请实施例提供的一种画布扩展装置的结构示意图；
[0025]图15是本申请实施例提供的一种画布扩展装置的结构示意图。
具体实施方式
[0026]下面将结合本申请实施例中的附图，对本申请实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例仅仅是本申请一部分实施例，而不是全部的实施例。基于本申请中的实施例，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他
实施例，都属于本申请保护的范围。
[0027]在本申请的描述中，需要理解的是，术语“第一”、“第二”等仅用于描述目的，而不能理解为指示或暗示相对重要性。在本申请的描述中，需要说明的是，除非另有明确的规定和限定，“包括”和“具有”以及它们任何变形，意图在于覆盖不排他的包含。例如包含了一系列步骤或单元的过程、方法、系统、产品或设备没有限定于已列出的步骤或单元，而是可选地还包括没有列出的步骤或单元，或可选地还包括对于这些过程、方法、产品或设备固有的其他步骤或单元。对于本领域的普通技术人员而言，可以具体情况理解上述术语在本申请中的具体含义。此外，在本申请的描述中，除非另有说明，“多个”是指两个或两个以上。“和/或”，描述关联对象的关联关系，表示可以存在三种关系，例如，A和/或B，可以表示：单独存在A，同时存在A和B，单独存在B这三种情况。字符“/”一般表示前后关联对象是一种“或”的关系。
[0028]请参考图3，其示出了本申请一个示例性实施例提供的终端的结构方框图。所述终端可以为交互智能平板、手机、电脑、平板本文档来自技高网...

【技术保护点】

【技术特征摘要】
1.一种画布扩展方法，其特征在于，应用于第一终端，所述第一终端安装有web绘图应用，画布是所述web绘图应用的用于承载绘制内容的区域，容器用于承载所述画布，视口是所述第一终端的屏幕上用于显示所述web绘图应用的区域，所述画布的第一长度为所述视口的第二长度的第一预设倍数，所述画布的第一宽度为所述视口的第二宽度的第二预设倍数，所述第一预设倍数和所述第二预设倍数均大于1，所述方法包括：接收针对所述画布的移动指令，按照所述移动指令对应的移动方向移动承载所述画布的容器，所述画布包括第一边缘和第三边缘，所述视口包括第二边缘和第四边缘，所述第一边缘与所述第三边缘平行，所述第二边缘与所述第四边缘平行，所述第一边缘与所述第二边缘位于所述移动方向的同一侧，所述第三边缘与所述第四边缘位于所述移动方向的反方向的同一侧，所述画布至少包括相邻的第一区域和第二区域，所述第一区域绘制第一内容，所述第二区域绘制第二内容；当所述第一边缘与所述第二边缘重合时，触发将所述第一区域的所述第一内容绘制为所述第二内容，将所述第二区域的所述第二内容绘制为第三内容，并将所述容器沿着所述反方向移动至所述第三边缘与所述第四边缘重合的位置。2.根据权利要求1所述的方法，其特征在于，所述方法还包括：在协同模式下，获取所述移动指令对应的偏移量，所述偏移量包括水平偏移量以及垂直偏移量；将所述偏移量发送至第二终端，所述偏移量用于指示所述第二终端重绘所显示的画布内容。3.根据权利要求2所述的方法，其特征在于，所述获取所述移动指令对应的偏移量，包括：以所述画布中任一顶点为坐标原点，以所述视口中任一顶点为定位点；获取所述定位点与所述坐标原点之间的偏移量。4.根据权利要求2所述的方法，其特征在于，所述将所述偏移量发送至第二终端，包括：基于长连接将所述偏移量发送至第二终端。5.根据权利要求1所述的方法，其特征在于，所述方法还包括：在协同模式下，接收第二终端发送的偏移量，所述偏移量包括水平偏移量以及垂直偏移量；基于所述偏移量重绘所显示的画布内容。6.根据权利要求5所述的方法，其特征在于，所述接收第二终端发送的偏移量，包括：接收第二终端发送的移动指令，获取所述移动指令携带的偏移量。7.根据权利要求5所述的方法，其特征在于，所述基于所述偏移量...

【专利技术属性】
技术研发人员：王达昇，
申请(专利权)人：广州视臻信息科技有限公司，
类型：发明
国别省市：