图片编辑中的图片显示控制方法及装置与流程

本发明涉及计算机应用技术领域，尤其涉及一种图片编辑中的图片显示控制方法及装置。

背景技术：

随着计算机应用技术的飞速发展，各种图片编辑应用程序应运而生，通过图片编辑应用程序中简单实用的图片编辑功能，即可使用户轻松制作出各种效果的图片，目前已受到广大用户的追捧。

在现有的图片编辑应用程序中，通常会预设多种不同类型的模板，供用户选择，以在用户选取待编辑的图片和模板后，将待编辑的图片显示于模板的显示区域中。而在图片的显示过程中，由于用户选取的模板的显示区域的尺寸和图片的尺寸并不总是恰好相等，为了使得图片适配于显示区域，一般做法就是直接选取图片的中间区域，并将其显示于模板的显示区域，但这可能会导致模板的显示区域中展示给用户看的内容未必是图片中的重要内容。

此外，用户经常会根据需要对模板的显示区域的范围进行调整，例如，拖动显示区域中的右边界，以使显示区域的范围变大。在显示区域的范围发生变化之后，为了使之前的图片能够再次适配变化了的显示区域，一般做法则是顺沿拖动方向将图片中未显示部分继续展示给用户看。同样的，这也可能导致模板的显示区域中展示给用户看的内容未必是图片中的重要内容。

如上所述，现有的图片编辑中的图片显示过程中还存在着图片显示的准确性不够的问题。

技术实现要素：

基于此，有必要提供一种能够提高图片显示的准确性的图片编辑中的图片显示控制方法。

此外，还有必要提供一种能够提高图片显示的准确性的图片编辑中的图片显示控制装置。

为了解决上述技术问题，本发明所采用的技术方案为：

一种图片编辑中的图片显示控制方法，包括：载入获取到的待编辑的图片；在载入的所述图片中进行主体区域的识别；在预设的模板中嵌入所述图片；及居中显示所述主体区域于所述模板的显示区域，并根据嵌入的所述图片与显示区域的适配状态动态调整所述图片，以自适应地使得所述图片与显示区域适配。

一种图片编辑中的图片显示控制装置，包括：载入模块，用于载入获取到的待编辑的图片；识别模块，用于在载入的所述图片中进行主体区域的识别；嵌入模块，用于在预设的模板中嵌入所述图片；及适配模块，用于居中显示所述主体区域于所述模板的显示区域，并根据嵌入的所述图片与显示区域的适配状态动态调整所述图片，以自适应地使得所述图片与显示区域适配。

与现有技术相比，本发明具有以下有益效果：

通过对载入的待编辑的图片进行主体区域的识别，并将该待编辑的图片嵌入预设的模板中，在模板的显示区域中将识别到的主体区域居中显示，并根据嵌入的图片与显示区域的适配状态动态调整图片，以自适应地使得图片与显示区域适配。也就是说，通过主体区域的居中显示与自适应地对图片进行动态调整，使得模板的显示区域中显示的图片即为包含了重要内容的图片，从而避免了现有技术中模板的显示区域中展示给用户看的内容未必是图片中的重要内容的问题，进而有效地提高了图片显示的准确性，提升了用户的体验。

附图说明

图1为一实施例的图片编辑中的图片显示控制方法的流程图；

图2为另一实施例的图片编辑中的图片显示控制方法的流程图；

图3为一实施例的侦听得到触发显示区域中边界拖动的操作，通过操作调整显示区域的范围的示意图；

图4为图2中按照边界拖动的拖动方向，触发移动边界所在的最长边，并形成模板各显示区域的新布局的示意图；

图5为图2中按照边界拖动的拖动方向，触发移动边界所在的最长边，并形成模板各显示区域的新布局的示意图；

图6为图2中按照边界拖动的拖动方向，触发移动边界所在的最长边，并形成模板各显示区域的新布局的示意图；

图7为图1中根据嵌入的所述图片与显示区域的适配状态动态调整所述图片的方法流程图；

图8为图7中适配状态为显示区域的相对两边界超出图片的示意图；

图9为图7中以居中显示的主体区域的中心位置为基准，放大图片的示意图；

图10为一实施例的图片编辑中的图片显示控制系统的结构框图；

图11为另一实施例的图片编辑中的图片显示控制系统的结构框图；

图12为一实施例的适配模块的结构框图；

图13为本发明各实施例所提供的一种客户端的结构示意图。

具体实施方式

体现本发明特征与优点的典型实施方式将在以下的说明中详细叙述。应理解的是本发明能够在不同的实施方式上具有各种的变化，其皆不脱离本发明的范围，且其中的说明及图示在本质上是当作说明之用，而非用以限制本发明。

如前所述，为了提高图片显示的准确性，使得模板的显示区域中展示给用户看的内容包含有图片中的重要内容，特提出了一种图片编辑中的图片显示控制方法。该方法可依赖于计算机程序，该计算机程序将运行在客户端之上。

请参阅图1，在一实施例中，一种图片编辑中的图片显示控制方法，包括以下步骤：

步骤110，载入获取到的待编辑的图片。

待编辑的图片的获取途径可以是对待编辑的图片进行扫描，也可以是从媒体库预先存储的图片中选取，还可以是直接对外界事物进行拍摄。

本实施例中，载入获取到的待编辑的图片由客户端实现，以利于载入的图片能够在该客户端上完成图片编辑中的图片显示控制。

其中，客户端可以是用于图片编辑的软件客户端，例如，图片编辑应用程序，也可以是用于图片编辑的网页客户端，例如，图片编辑网站。

步骤130，在载入的图片中进行主体区域的识别。

主体区域指的是图片中的重要内容，例如，一张人物图片，其中的主体区域应为该人物。

进一步地，若主体区域识别成功，主体区域将通过客户端进行记录，以便于后续图片编辑过程中主体区域的显示；若主体区域识别失败，客户端将侦听得到用户在载入的图片中触发的手动调节操作，通过该手动调节操作辅助客户端进行主体区域的识别，直至主体区域识别成功。

通过识别载入的图片中的主体区域，将有利于更好地向用户展示图片中的重要内容，从而提高图片显示的准确性。

步骤150，在预设的模板中嵌入图片。

模板是指构成图片的显示区域的固定格式，由客户端预先设置。客户端预设的模板的类型是多种多样的，以更好地供用户选择。

例如，单拼模板中仅包含一个显示区域；双拼模板中则包含两个显示区域，该两个显示区域既可以是上下拼接，也可以是左右拼接；以此类推，多拼模板则是由多个显示区域按照不同的拼接方式拼接组成。

在用户选定预设的模板之后，图片将通过客户端被嵌入预设的模板中，以进一步地显示在模板的显示区域中。

步骤170，居中显示主体区域于模板的显示区域，并根据嵌入的图片与显示区域的适配状态动态调整图片，以自适应地使得图片与显示区域适配。

由于嵌入的图片的尺寸并不总是恰好等于模板的显示区域的尺寸，而图片的主体区域表示的是图片中的重要内容，因此，在图片嵌入预设的模板之后，通过在模板的显示区域中居中显示主体区域，即使得主体区域的中心位置对齐模板的显示区域的中心位置，以此保证了主体区域即图片中的重要内容能够优先地向用户展示。

如果嵌入了图片的模板不能完整地显示出主体区域，或者模板中仍然存在未有图片显示的显示区域，客户端将需要根据图片中未显示部分对未有图片显示的显示区域进行填充，以使图片与显示区域适配。

具体地，相对模板的显示区域的边界而言，按照图片中未显示部分进行划分，图片与显示区域的适配状态包括：图片与显示区域宽高适配、主体区域超出显示区域、显示区域的相对两边界超出图片、以及显示区域的任一边界超出图片。

其中，第一种属于图片与显示区域适配，即模板的显示区域的所有边界均未超出图片，此时客户端不对图片作为；后三种均属于图片与显示区域不适配，要么是主体区域显示不完整，要么是模板中的相对两侧存在未有图片显示的显示区域，要么是模板中的任一侧存在未有图片显示的显示区域，此时客户端需要对图片进行自适应地动态调整，直至图片与显示区域适配。

通过如上所述的过程，将使得客户端能够准确地于模板的显示区域中显示图片的主体区域，并随着显示区域的范围或者图片发生的变化（例如，显示区域的范围变大，或者，更换后的图片变小等等）而能够自适应地动态调整图片，实现模板的显示区域中图片的动态显示，保证模板的显示区域中展示给用户看的内容即包含有图片中的重要内容，从而有效提高了图片显示的准确性，使得图片显示效果更好，提升了用户的体验。

在一实施例中，步骤170之后，如上所述的方法还包括以下步骤：

侦听得到触发显示区域中边界拖动的操作，以通过操作调整显示区域的范围。

显示区域的范围是有限的，若需要改变显示区域的范围，客户端将侦听得到触发显示区域中边界拖动的操作，通过该操作即可对显示区域的范围进行调整，使得显示区域的范围发生变化。

需要说明的是，用户触发的该操作可以是仅拖动显示区域中的其中一边界触发的，也可以是拖动显示区域的其中一角触发的，此时将是同时拖动显示区域中的相邻两边界。

如图3所示，在模板中，通过用户向右拖动显示区域中的右边界所触发的操作310，向右调整显示区域，使得显示区域的范围增加。

进一步地，在显示区域的范围发生变化之后，在保证主体区域居中显示的前提下，图片与显示区域的适配状态可能也相应地发生了变化，因此，模板的显示区域中将自适应地触发图片的动态调整，以使图片与显示区域能够再次适配。

无论是初次进行图片与显示区域的自适应适配，还是后续由于显示区域的范围或者图片发生了变化而触发的二者之间的再次自适应适配，均执行步骤170的过程，以实现动态变化的显示区域中图片的动态显示。

值得一提的是，为了实现动态变化的显示区域中图片的动态显示，若预设的模板发生变化，则是执行步骤150至步骤170的过程。

请参阅图2，在一实施例中，模板包括触发了边界拖动的显示区域和周边的至少一其他显示区域。

本实施例中，客户端预设的模板是由多个显示区域按照不同的拼接方式拼接组成的，因此，当其中一显示区域通过触发了边界拖动来改变自身范围时，势必会影响与其相邻的周边的其他显示区域的范围发生变化。

进一步地，步骤170之后，如上所述的方法还包括以下步骤：

步骤210，按照边界拖动的拖动方向，触发移动边界所在的最长边，并在操作停止时使最长边停留在当前位置。

步骤230，停留的最长边与模板中各显示区域中相邻的边界重新相交，形成模板中各显示区域的新布局。

边界所在的最长边可以是边界自身，也可以是由多个显示区域的边界共同组成。无论何种情况，最长边被触发移动之后，最长边两侧的显示区域的范围都将发生变化，从而形成模板中各显示区域的新布局。

如图4所示，边界所在最长边450由多个显示区域的边界共同组成时，按照边界411拖动的拖动方向430，边界411所在的最长边450被触发沿拖动方向430移动，其他与最长边450不相邻的边界412及相应的顶点A、B、C则保持不动。

在操作停止时，形成停留在当前位置的最长边470。该停留的最长边470与模板中各显示区域相邻的边界413、414、415重新相交，分别形成新的顶点D、E、F，以此形成模板中各显示区域的新布局，即显示区域1、2、3的范围增加，显示区域4、5的范围减少。

如图5所示，边界所在的最长边511即为边界511时，按照边界511拖动的拖动方向530，边界511所在的最长边511被触发沿拖动方向530移动，其他与最长边511不相邻的边界及相应的顶点则保持不动。

在操作停止时，形成停留在当前位置的最长边550。该停留的最长边550与模板中各显示区域相邻的边界512重新相交，形成新的顶点G，以此形成模板中各显示区域的新布局，即显示区域6的范围增加，显示区域7的范围减少。

值得一提的是，本实施例中，边界的拖动是有极限的。如图6所示，当边界610所在的最长边610沿拖动方向630拖动，在边界610拖动至与边界650之间的距离达到预设的最小宽度时，边界610则无法继续沿拖动方向630拖动。

进一步地，在其他显示区域的范围发生变化之后，在保证主体区域居中显示的前提下，图片与其他显示区域的适配状态同样可能相应地发生了变化，因此，模板的其他显示区域中也将触发图片的动态调整，以自适应地使得图片与其他显示区域能够再次适配，即通过执行步骤170的过程，实现动态变化的显示区域中图片的动态显示。

如前所述，图片与显示区域的适配状态包括：图片与显示区域宽高适配、主体区域超出显示区域、显示区域的相对两边界超出图片、以及显示区域的任一边界超出图片。

在主体区域居中显示于模板的显示区域的前提下，按照图片与显示区域适配状态的不同，根据嵌入的图片与显示区域的适配状态动态调整图片的步骤也会有所区别，现结合图7至图9对该步骤加以说明如下。

在一实施例中，适配状态为主体区域超出显示区域710，根据嵌入的图片与显示区域的适配状态动态调整图片的步骤包括以下步骤：

步骤171，以居中显示的主体区域的中心位置为基准，缩小主体区域。

本实施例中，无论是初次适配，还是在显示区域的范围或者图片变化之后的再次适配，在主体区域居中显示于模板的显示区域之后，若该居中显示的主体区域超出了显示区域，为了保证模板中向用户展示的图片中包含有图片中的重要内容，即主体区域，将以主体区域的中心位置为基准，对超出的主体区域进行缩小，以使缩小后的主体区域能够适配于显示区域。

在一实施例中，适配状态为显示区域的相对两边界超出图片730，根据嵌入的图片与显示区域的适配状态动态调整图片的步骤包括以下步骤：

步骤173，以居中显示的主体区域的中心位置为基准，放大图片。

例如，显示区域与图片适配即显示区域被嵌入的图片完全填充之后，若继续向下拖动显示区域中的下边界，由于竖直方向上的图片在此之前已完整地显示于显示区域中，基于此，模板中将出现未有图片显示的显示区域（如图8中阴影填充框所示）。

此时，客户端将主体区域的中心位置与显示区域的中心位置对齐，在主体区域居中显示于模板的显示区域的前提下，在显示区域的相对两边界中，上下边界（图8中粗体实线所示）均超出主体区域居中显示的图片（图8中虚线所示），即适配状态为显示区域的相对两边界超出图片730，此时，将基于居中显示的主体区域的中心位置，对图片进行放大，使得放大的图片能够适配于显示区域，如图9所示。

通过如上所述过程，在主体区域居中显示的前提下，使得缩放的图片能够适配于显示区域，由此保证了模板的显示区域中所展示的内容包含了图片中的重要内容，提高了图片显示的准确性，使得图片的显示效果更好，提升了用户的体验。

在一实施例中，适配状态为显示区域的任一边界超出图片750。

可以理解，本实施例中，显示区域的任一边界超出图片750可以是显示区域中仅其中一边界超出图片的情况，也可以是显示区域中任意相邻的两边界超出图片的情况，而不包括显示区域中相对两边界超出图片的情况。

进一步地，根据嵌入的图片与显示区域的适配状态动态调整图片的步骤包括以下步骤：

步骤175，相对显示区域的该任一边界，得到图片中未显示部分。

当适配状态为显示区域的任一边界超出图片750，即表示模板中相对显示区域的该任一边界的一侧存在未有图片显示的显示区域，此时，客户端为了对未有图片显示的显示区域进行填充，将相对显示区域的该任一边界，判断是否能够得到图片中未显示部分。

若能够得到图片中未显示部分，则进入步骤177，通过客户端以图片中未显示部分对未有图片显示的显示区域进行填充。

若得不到图片中未显示部分，即表示图片已完整地显示于模板的显示区域中，此时，以居中显示的主体区域的中心位置为基准，对图片进行放大，使得客户端以放大的图片对未有图片显示的显示区域进行填充。

步骤177，将图片中未显示部分向显示区域的该任一边界移动。

在相对显示区域的该任一边界得到图片中未显示部分之后，通过将图片中未显示部分向显示区域的该任一边界移动，使得未有图片显示的显示区域被移动的图片填充，以此自适应地使得图片与显示区域适配。

通过如上所述过程，图片移动之后，图片中未显示部分相应地移动进入显示区域，主体区域也将随之移动，虽然移动的主体区域不再居中显示，但是移动的图片与显示区域适配后，使得模板的显示区域中向用户展示的内容中包含了图片中更多的内容，由此保证了图片显示的准确性，提升了用户的体验。

此外，值得一提的是，无论初次适配，还是后续显示区域的范围或者图片变化后的再次适配，若客户端在对齐主体区域的中心位置与模板的显示区域的中心位置，即使得主体区域居中显示于模板的显示区域时，模板的显示区域均已被嵌入的图片完全填充，此时，图片与显示区域的适配状态为图片与显示区域宽高适配，则客户端不再对嵌入的图片进行任何的动态调整，而是直接将模板的显示区域中嵌入的图片展示给用户。

请参阅图10，在一实施例中，一种图片编辑中的图片显示控制装置，包括：载入模块810、识别模块830、嵌入模块850及适配模块870。

其中，载入模块810用于载入获取到的待编辑的图片。

识别模块830用于在载入的图片中进行主体区域的识别。

嵌入模块850用于在预设的模板中嵌入图片。

适配模块870用于居中显示主体区域于模板的显示区域，并根据嵌入的图片与显示区域的适配状态动态调整图片，以自适应地使得图片与显示区域适配。

在一实施例中，如上所述的装置还包括：侦听模块，用于侦听得到触发显示区域中边界拖动的操作，以通过操作调整显示区域的范围。

请参阅图11，在一实施例中，如上所述的装置还包括：移动模块910及相交模块930。

其中，移动模块910用于按照边界拖动的拖动方向，触发移动边界所在的最长边，并在操作停止时使最长边停留在当前位置。

相交模块930用于停留的最长边与模板中各显示区域中相邻的边界重新相交，形成模板中各显示区域的新布局。

请参阅图12，在一实施例中，适配状态为主体区域超出显示区域，适配模块870包括：缩小单元871，用于以居中显示的主体区域的中心位置为基准，缩小主体区域。

请参阅图12，在一实施例中，适配状态为显示区域的相对两边界超出图片，适配模块870包括：放大单元873，用于以居中显示的主体区域的中心位置为基准，放大图片。

请参阅图12，在一实施例中，适配状态为显示区域的任一边界超出图片，适配模块870包括：获取单元875及移动单元877。

其中，获取单元875，用于相对显示区域的该任一边界，得到图片中未显示部分。

移动单元877，用于将图片中未显示部分向显示区域的该任一边界移动。

请参阅图13，图13是本发明实施例提供的一种客户端1200的结构示意图。上述实施例中的由客户端所执行的步骤均可以基于该图中所示的客户端的结构。

该客户端1200可因配置或者性能的不同而产生较大的差异，其包括：电源1210、接口1230、至少一存储介质1250、以及至少一中央处理器（CPU ，Central Processing Units）1270。

具体地，电源1210用于为客户端1200上的各硬件设备提供工作电压。

接口1230包括至少一有线或无线网络接口1231、至少一串并转换接口1233、至少一输入输出接口1235以及至少一USB接口1237等，用于与外部设备通信。

存储介质1250作为资源存储的载体，可以是随机存储介质、磁盘或者光盘等，其上所存储的资源包括操作系统1251、应用程序1253及数据1255等，存储方式可以是短暂存储或者永久存储。其中，操作系统1251用于管理与控制客户端1200上的各硬件设备以及应用程序1253，以实现中央处理器1270对海量数据1255的计算与处理，其可以是Windows ServerTM、Mac OS XTM、UnixTM、LinuxTM、FreeBSDTM等。应用程序1253是基于操作系统1251之上完成至少一项特定工作的计算机程序，其可以包括至少一模块（图示未示出），每个模块都可以分别包含有对客户端1200的一系列操作指令。数据1255可以是存储于磁盘中的图片等。

中央处理器1270可以包括一个或多个以上的处理器，并设置为通过总线与存储介质1250通信，用于计算与处理存储介质1250中的海量数据1255。

通过中央处理器1270读取存储介质1250中存储的一系列操作指令，并基于存储介质1250上的操作系统1251在客户端1200上执行，进而使得上述实施例的全部或者部分步骤可以通过在客户端上运行相关的计算机程序来完成。

上述内容，仅为本发明的较佳实施例，并非用于限制本发明的实施方案，本领域普通技术人员根据本发明的主要构思和精神，可以十分方便地进行相应的变通或修改，故本发明的保护范围应以权利要求书所要求的保护范围为准。