图像处理方法、装置及电子设备与流程

文档序号:27386635发布日期:2021-11-15 21:29阅读:125来源:国知局
图像处理方法、装置及电子设备与流程

1.本技术涉及图像处理领域,特别涉及一种图像处理方法、装置及电子设备。


背景技术:

2.在可穿戴设备等电子设备上显示的图标通常为二维的。用户通过例如点击的操作与电子设备上的图标进行交互,打开图标相应的应用程序。目前,还没有三维图标在电子设备上应用。


技术实现要素:

3.本技术实施例提供了一种图像处理方法、装置及电子设备。
4.第一方面,本技术实施例提供了一种图像处理方法,应用于电子设备,包括:获取至少两个图像单元,至少两个图像单元均为二维图像;获取多层面模型,多层面模型包括至少两层的面模型;将至少两个图像单元分别对应至少两层的面模型进行贴片处理生成一个立体图标。
5.第二方面,本技术实施例提供了一种图像处理装置,包括:获取模块,其配置为获取至少两个图像单元,至少两个图像单元均为二维图像,获取多层面模型,多层面模型包括至少两层的面模型;处理模块,其配置为将至少两个图像单元分别对应至少两层的面模型进行贴片处理生成一个立体图标。
6.第三方面,本技术实施例提供了一种电子设备,包括存储器、处理器及存储在存储器上的计算机程序,处理器执行计算机程序以实现如上方法的步骤。
7.第四方面,本技术实施例提供了一种计算机可读存储介质,其上存储有计算机程序,计算机程序被处理器执行时实现如上方法的步骤。
8.第五方面,本技术实施例提供了一种计算机程序产品,包括计算机程序,计算机程序被处理器执行时实现如上方法的步骤。
9.本技术实施例的图像处理方法能够基于多层面模型将至少两个二维图像转变为一个立体图标,立体图标的形状符合多层面模型的整体形状,立体图标的图像色彩来源于原本的至少两个二维图像,因此该立体图标在视觉上能够被认为是原本的至少两个二维图像的扩展,增强了用户的体验感。
附图说明
10.图1为本技术实施例的图像处理方法的流程图;
11.图2为本技术实施例的图1中步骤s20的一个实施例的流程图;
12.图3为本技术实施例的图1中步骤s10的第一个实施例的流程图;
13.图4为本技术实施例的图1中步骤s10的第二个实施例的流程图;
14.图5为本技术实施例的图像处理方法的一个具体实施例的流程图;
15.图6为本技术实施例的立体图标的结构示意图;
16.图7示出了包括本技术实施例的立体图标的正视图的界面图;
17.图8示出了包括本技术实施例的立体图标的立体图的界面图;
18.图9为本技术实施例的图像处理装置的结构框图;
19.图10为本技术实施例的电子设备的结构框图。
20.附图标记说明
[0021]1‑
顶层;2

中间层;3

底层;4

目标图像;5

立体图标
具体实施方式
[0022]
此处参考附图描述本技术的各种方案以及特征。
[0023]
应理解的是,可以对此处申请的实施例做出各种修改。因此,上述说明书不应该视为限制,而仅是作为实施例的范例。本领域的技术人员将想到的在本技术的范围和精神内的其他修改包含在说明书中并且构成说明书的一部分的附图示出了本技术的实施例,与上面给出的对本技术的大致描述以及下面给出的对实施例的详细描述一起用于解释本技术的原理。
[0024]
通过下面参照附图对给定为非限制性实例的实施例的优选形式的描述,本技术的这些和其它特性将会变得显而易见。
[0025]
还应当理解,尽管已经参照一些具体实例对本技术进行了描述,但本领域技术人员能够确定地实现本技术的很多其它等效形式。
[0026]
当结合附图时,鉴于以下详细说明,本技术的上述和其他方面、特征和优势将变得更为显而易见。
[0027]
此后参照附图描述本技术的具体实施例;然而,应当理解,所申请的实施例仅仅是本技术的实例,其可采用多种方式实施。熟知和/或重复的功能和结构并未详细描述以避免不必要或多余的细节使得本技术模糊不清。因此,本文所申请的具体的结构性和功能性细节并非意在限定,而是仅仅作为权利要求的基础和代表性基础用于教导本领域技术人员以实质上任意合适的详细结构多样地使用本技术。
[0028]
本说明书可使用词组“在一种实施例中”、“在另一个实施例中”、“在又一实施例中”或“在其他实施例中”等,其均可指代根据本技术的相同或不同实施例中的一个或多个。
[0029]
图像处理方法包括:获取至少两个图像单元,至少两个图像单元均为二维图像;基于预设模型,将至少两个图像单元进行立体化处理,生成至少两个图像单元对应的立体图标。
[0030]
预设模型可以基于图像单元的具体内容、不同图像单元之间的关联关系和/或所需的立体图标5的目标形态等来预先设定。针对于图像单元的具体内容构建的预设模型,其可以包括针对购物类应用的图标设置一种预设模型,针对社交类应用的图标设置另一种预设模型。针对于不同图像单元之间的关联关系构建的预设模型,其可以包括如果不同图像单元是根据一个目标图像4划分出来,可以设置一种预设模型;如果不同图像单元是直接获取的,可以设置另一种预设模型。针对所需的立体图标5的目标形态构建的预设模型,其可以与桌面背景风格对应,如果桌面背景是风景类,对应一种预设模型,如果桌面背景是人物类,对应另一种预设模型。预设模型可以是长方体模型,立体五角星模型,多层面模型等。当利用图像对长方体模型进行贴片处理时,可以对长方体模型的六个面分别进行贴片处理,
形成的立体图标5整体呈长方体状。当利用图像对立体五角星模型进行贴片处理时,可以对立体五角星模型的所有表面分别进行贴片处理,形成的立体图标5整体呈立体五角星状。在同一个桌面显示系统中,例如手机的桌面显示系统或者增强现实眼镜的桌面显示系统,为了保证桌面显示系统的显示风格统一,一般选用一种预设模型。对至少两个图像单元进行立体化处理,生成至少两个图像单元对应的立体图标5,可以是将至少两个图像单元对预设模型进行贴片处理得到立体图标5。其中,预设模型是立体模型。立体模型是有厚度的。
[0031]
对至少两个图像单元进行立体化处理,生成至少两个图像单元对应的立体图标5,还可以是将至少两个图像单元分别进行立体化处理得到每个图像单元对应的立体图像,再基于预设模型中各模块的位置将至少两个立体图像对应放置在各模块的位置组合成立体图标5。将至少两个图像单元分别进行立体化处理可以是将两个图像单元进行拉伸得到有厚度的立体图像。其中,预设模型可以是立体模型,也可以是平面模型。预设模型中各模块的位置是已知的。当预设模型是立体模型时,预设模型的各模块的位置和朝向是已知的,至少两个立体图像按照位置和朝向放置在对应的模块处。当预设模型是平面模型时,预设模型的各模块的位置是已知的,至少两个立体图像按照位置放置在对应的模块处,至少两个立体图像按照相同的朝向或者本身的朝向放置在对应的模块处。
[0032]
通过基于预设模型对至少两个图像单元分别进行立体化处理得到立体图标5。该立体图标5来源于至少两个图像单元,因此在视觉效果上能够被用户看作是至少两个图像单元的衍生,而不会被看作是与图像单元没有关联的图标。提高了视觉效果,提升了用户的体验感。
[0033]
计算单元可以基于预设模型对获取到的至少两个图像单元进行立体化处理,得到相应的立体图标5,从而可以将该立体图标5再传输给可穿戴设备,从而现实在可穿戴设备的显示界面中。
[0034]
立体图标5可以指向应用程序。例如,通过点击立体图标5打开对应的应用程序。立体图标5还可以指向功能按键。例如,通过悬停在立体图标5上显示对应的功能按键的调节界面。具体地,可以是通过悬停在表示亮度的功能按键的立体图标5上,电子设备显示对应的调节亮度的界面,进而通过滑动操作调节电子设备的亮度。又例如,通过点击立体图标5,切换对应的功能按键的功能。具体地,可以是点击表示重新排列界面的功能按键的立体图标5,电子设备上显示重新排列界面后的视图。
[0035]
图像单元为图像处理方法实施例需要处理的对象,其可以为多种类型的图像,如应用程序的二维图标、用户的输入图像等。每个图像单元均为二维图像,基于预设模型将多个图像单元分别进行处理后可以形成相对应的立体图标。可以分别对每个图像单元进行处理,利用每个处理结果对预设模型进行贴片处理,能够形成至少两个图像单元对应的立体图标。其中,预设模型整体是立体模型,从而形成的图标是立体图标5。
[0036]
举例说明,基于三个不同的图像单元来构建相对应的立体图标。其中,三个不同的图像单元可以是相互独立的图片。因此,可以基于预设模型(该预设模型为预先基于所需的立体图标的目标形态等来预先设定)来分别对每个图像单元进行三维处理,具体将每个图像单元按照预设模型进行贴片处理,将三个图像单元贴片到预设模型上,形成一个相对应的立体图标。当然,也可以通过将一个目标图像4划分为三个不同的图像单元来获得图像单元,其中,目标图像4为二维图像。然后再基于预设模型,将至少两个图像单元进行立体化处
理,生成至少两个图像单元对应的立体图标。具体的立体化处理步骤也与上面描述的步骤相似。
[0037]
该图像处理方法能够将二维图像转变为相对应的三维的立体图标5,由于得到的立体图标5来源于原本的二维图像,因此该立体图标5在视觉上能够被认为是原本的二维图像的扩展,同时也增加了图标的美感,提高了用户的体验感。
[0038]
下面,结合附图对本实施例的图像处理方法进行更加详细地说明。如图1所示,本技术实施例的图像处理方法,该方法可以应用在电子设备上。
[0039]
该方法包括以下步骤:
[0040]
s10,获取至少两个图像单元,至少两个图像单元均为二维图像。
[0041]
作为二维图像的图像单元可以为多种不同类型的图像,如应用程序的图标,自定义图形,用户输入图像,从目标位置获取的图像等。而获取至少两个图像单元的步骤可以根据该图像单元的类型和存储位置来具体实施。
[0042]
电子设备为与可穿戴设备连接的计算单元,计算单元可以是手机,可穿戴设备可以是增强现实眼镜、虚拟现实眼镜或混合现实眼镜。一种情况是,计算单元接收到可穿戴设备发送的操作指令,并在计算单元中获取存储的至少两个图像单元。也可以是用户根据实际需要在电子设备的存储器中查找到至少两个图像单元并选定至少两个图像单元。另一种情况是,计算单元可以基于指令从自身的存储器中查找目标图像4,并对目标图像4进行划分获取该至少两个图像单元。例如,可以根据与目标图像4相对应的应用程序,来从存储器中获取到目标图像4。
[0043]
还有另一种情况是,计算单元可以基于指令从自身的存储器中查找到至少两个目标图像4,并对其中一个目标图像4不进行处理,对剩余的目标图像4进行切分处理,切分处理后的图像单元和不进行处理的图像单元形成至少两个图像单元。
[0044]
获取多层面模型,多层面模型包括至少两层的面模型。
[0045]
多层面模型是多层相互间间隔一定距离的面模型。其中,如果多层面模型包括三层以及三层以上的面模型时,多层之间相互间隔的距离可以是相同的,也可以是不同的。如果面模型是对称的,多层的面模型的中心点位于一条直线上。如果面模型是非对称的,多层的面模型的中心区域大致位于一条直线上。面模型是平面模型时,面模型垂直于这条直线或者面模型的切面垂直于这条直线。面模型是立体模型时,面模型的用于贴片处理的面垂直于这条直线或者切面垂直于这条直线。沿着这条直线,多层面模型的用于贴片处理的面的面积逐渐变化。从顶层面模型到底层面模型的方向上,下面的面模型的用于贴片处理的面的面积大于与其相邻的上面的面模型的用于贴片处理的面的面积。多层面模型整体是立体模型。多层面模型可以包括同样类型的面模型,也可以包括不同类型的面模型。面模型的不同类型可以是平面模型,或者立体模型。面模型的不同类型还可以是不同形状的面模型。对于形状来说,面模型可以是凹形的面模型或者凸形的面模型或者长方体的面模型。凹形的面模型或者凸形的面模型可以是平面模型,也可以是立体模型。长方体的面模型是立体模型,当长方体的面模型变为长方形的面模型后,没有厚度,变为平面模型。通过利用不同的多层面模型,可以对相同的至少两个图像单元处理为不同的立体图标5,满足用户的多样的需求。为了使得立体图标5的立体效果好,可以将多层面模型的底层面模型确定为凹形。用户看向立体图标5时,底层呈碗状,更有立体效果。
[0046]
例如,多层面模型包括两层面模型,两层面模型分别是底层面模型和顶层面模型。底层面模型呈凹形,其本身为立体模型,具有厚度。顶层面模型呈薄长方体模型(长方体的长度方向和宽度方向大于厚度方向,长方体的长度方向和宽度方向至少是厚度方向的尺寸的20倍),其本身为立体模型,具有厚度。底层面模型的凹面朝向顶层面模型的长度方向和宽度方向所在的面。顶层面模型的尺寸可以小于底层面模型的尺寸,从顶层面模型到底层面模型的方向看,可以看到顶层面模型和未被顶层面模型遮盖的底层面模型的部分。
[0047]
s20,将至少两个图像单元分别对应至少两层的面模型进行贴片处理生成一个立体图标5。
[0048]
例如,将两个图像单元分别对应两层的面模型进行贴片处理,其中一个图像单元贴片在其中一层的面模型,另一个图像单元贴片在另一层的面模型,贴片处理后形成一个立体图标5。例如,至少两层的面模型是三层的面模型,两个图像单元分别贴片在靠外的两层面模型上形成立体图标5。
[0049]
在一些实施例中,至少两个图像单元的尺寸不相等。贴片处理形成的立体图标5的各层的尺寸也不相等。立体图标5的各层可以按照从尺寸小到尺寸大的顺序排列。
[0050]
在一个实施例中,将至少两个图像单元分别对至少两层的面模型进行贴片处理生成一个立体图标,如图2所示,包括:
[0051]
s210,基于至少两层的面模型和至少两个图像单元的尺寸确定至少两个图像单元之间的位置关系。
[0052]
多层面模型内部是有确定的位置关系的,位置关系涵盖了面模型的表面参数信息以及多个面模型之间的位置参数信息。至少两个图像单元是没有位置关系的,可以根据多层面模型内部的位置关系和至少两个图像单元的尺寸确定至少两个图像单元之间的位置关系。例如,两个图像单元分别是图像单元a和图像单元b。图像单元a的尺寸小于图像单元b的尺寸。图像单元a的面积可以小于图像单元b的面积。多层面模型包括顶层面模型和底层面模型。把图像单元a对应到顶层面模型,把图像单元b对应到底层面模型,则确定了图像单元a和图像单元b得到位置关系。具体地,可以基于多层面模型的位置关系对各个图像单元进行标注,从而能够使用该标注来对图像单元进行后续处理。
[0053]
本实施例中需要确定至少两个图像单元之间的位置关系,而预设模型中的多层面模型是具有位置关系的,基于多层面模型和至少两个图像单元的尺寸可以确定至少两个图像单元之间的位置关系。多层面模型可以根据用户的操作指令确定,从而满足用户不同需求。
[0054]
s220,将至少两个图像单元按照位置关系进行贴片处理,以使至少两个图像单元形成立体图标5。
[0055]
根据位置关系将至少两个图像单元分别贴在对应的面模型的一面上,至少两个图像单元在至少两个面模型的朝向是相同的。例如,多层面模型包括顶层面模型和底层面模型。顶层面模型和底层面模型都是立体模型。顶层面模型是长方体面模型,底层面模型是凹形面模型。分别将一个图像单元贴在长方体面模型上,将另一个图像单元贴在凹形面模型的凹面上,形成立体图标5。贴在顶层面模型和底层面模型的两个图像单元朝向相同,从而用户在看立体图标5时,可以看到顶层面模型上的一个图像单元和底层面模型上的另一个图像单元。由于顶层面模型上的一个图像单元会遮挡部分底层面模型上的另一个图像单
元,一般是会遮挡底层面模型上的另一个图像单元的中心区域,所以用户如果正对立体图标5时,用户实际看到的是顶层面模型上的一个图像单元和底层面模型上的另一个图像单元的周围部分的结果。如果多层面模型包括的至少两个面模型是平面模型时,分别将至少两个图像单元按照至少两个面模型的形状贴在至少两个面模型的位置处,形成立体图标5,不需要考虑具体贴在面模型的哪个表面上。例如,多层面模型包括第一凹形平面模型和第二凹形平面模型,第一凹形平面模型和第二凹形平面模型朝向相同,两个凹形平面模型的尺寸不相同。可以将两个图像单元分别按照两个凹形平面模型的形状参数和位置参数贴在两个凹形平面模型上得到立体图标5。如果多层面模型包括的至少两个面模型既有平面模型也有立体模型,则需要分别按照平面模型和立体模型处理。
[0056]
在一个实施例中,多层面模型包括的面模型的数量不小于图像单元的数量。在多层面模型的面模型的数量等于图像单元的数量时,将每个图像单元分别对每个面模型进行贴片处理。在多层面模型的面模型的数量大于图像单元的数量时,将一个图像单元对底层的面模型进行贴片处理以及将剩余的图像单元分别对靠顶层的面模型进行贴片处理。例如,当多层面模型的面模型的数量为5个时,图像单元的数量为3个时,将1个图像单元对底层面模型进行贴片处理,将另外2个图像单元对靠顶层的2个面模型进行贴片处理,中间的2个面模型不进行贴片。这样形成的立体图标5的立体效果更好。
[0057]
在本技术的一个实施例中,方法还包括以下步骤:
[0058]
存储至少两个图像单元以及至少两个图像单元之间的位置关系;或者,存储形成的立体图标5。
[0059]
具体来说,将多个图像单元以及多个图像单元之间的位置关系进行存储,从而在生成立体图标5时可以将其直接调出使用。例如,将上述信息存储在存储器中,当用户需要再次将相同至少两个图像单元(二维图像)转化为立体图标5并进行显示时,可以直接调用已经存储的多个图像单元以及多个图像单元之间的位置关系,从而基于上述信息能够快速生成相对应的立体图标5。根据多个图像单元之间的位置关系可以确定多个图像单元的内容分别具体渲染的位置,从而可以直接生成立体图标5。
[0060]
类似地,在前一次对至少两个图像单元进行立体化处理后,生成的立体图标也可以进行存储。具体地,可以存储立体图标5的位置和像素点之间的对应关系,从而可以直接调用存储的立体图标5,有效节省系统资源。
[0061]
在本技术的一个实施例中,如图3所示,获取至少两个图像单元,包括以下步骤:
[0062]
s110,获取目标图像4,目标图像4为二维图像。
[0063]
可以是响应第一用户操作,获取目标图像4对应的应用程序的安装信息。基于安装信息,获取目标图像4。
[0064]
例如,第一用户操作为用户通过增强现实眼镜对手机进行启动应用程序的操作,手机基于该操作获取应用程序对应的安装信息。目标图像4位于应用程序的安装信息中,例如,目标图像4为应用程序的二维图标。应用程序安装成功后生成相关的安装信息,该安装信息中包含了二维图标的相关内容,如具体的图标内容,安装位置等。基于该安装信息可以从相应的安装位置获取到该目标图像4。例如,对于利用安卓系统的电子设备,可以在packagemanager类别中获取到该应用程序的icon(二维图标)。
[0065]
还可以从存储器中获取预先存储的目标图像。
[0066]
s120,基于目标图像4中的颜色块,将目标图像4进行拆分以获取至少两个待处理图像单元,其中,待处理图像单元具有同一颜色或多个相似颜色。
[0067]
电子设备上的二维图标向着极简化设计是一种趋势,目前越来越多的二维图标是由不同的颜色块构成的。可以基于颜色块对目标图像4进行拆分形成相应的至少两个图像单元。在拆分的过程中,可以对目标图像4进行遍历,利用图像轮廓识别的算法确定目标图像4上相同颜色或相似颜色的颜色块的区域的轮廓。相似颜色指的是像素点的rgb通道的各数值在预定阈值范围内。在对目标图像4进行拆分时,可以根据确定的轮廓对目标图像4进行切割。切割后的某些待处理图像单元可能是不规则形状,这是由于二维图标的设计风格就是通过颜色块的形状来决定的,这样的待处理图像单元的形状也会体现在最终的立体图标5上,保留原来的设计风格。切割后的某些待处理图像单元会有缺口,这是由于二维图标中的颜色块是嵌套在一起的,嵌套在颜色块内部的另一颜色块被切割走后,留下的颜色块的内部就形成了缺口。待处理图像单元的缺口可以通过后续的步骤进行处理。
[0068]
s130,将具有缺口的待处理图像单元进行修补得到图像单元,以使图像单元具有完整的外观面。
[0069]
可以对具有缺口的待处理图像单元进行修补,例如对缺口填充。对缺口进行填充时,可以根据待处理图像单元的所有像素点的颜色平均值进行填充;也可以根据待处理图像单元的边界的像素点的颜色进行填充。这样形成的立体图标5,当用户从不同角度观看立体图标5时,不会看到缺口,立体效果更好。对于没有缺口的待处理图像可以不对其进行修补,直接作为图像单元进行后续的立体化处理。
[0070]
待处理图像单元中的缺口的位置可能位于待处理图像单元的边缘,也可能位于待处理图像单元的中部。缺口被填补后,形成的图像单元具有完整的外观面。
[0071]
以图6为例,举例说明。目标图像是youtube的二维图标,其包括3个颜色块。通过进行上面描述的步骤的处理可以得到具有完整的外观面的3个图像单元。3个图像单元分别是面积最小的三角形的图像单元、面积中等的长方形的图像单元和面积最大的正方形的图像单元。将3个图像单元基于多层面模型进行贴片处理,具体地,将正方形的图像单元贴在位于底层3的底层面模型上,将长方形的图像单元贴在位于中间层2的中间面模型上,将三角形的图像单元贴在位于顶层1的顶层面模型上。最终形成的立体图标5是基于三层的面模型形成的。在对二维图标进行拆分的过程中,形成3个与各个颜色块相对应的待处理图像单元。其中,三角形的图像单元是没有缺口的,因此不需要进行s130步骤。而长方形的图像单元和正方形的图像单元是进行过s130的修补步骤处理的。
[0072]
在本技术的一个实施例中,如图4所示,获取至少两个图像单元,还包括以下步骤:
[0073]
s140,获取目标图像4,目标图像4为二维图像。步骤s140的处理方式与步骤s110相同,在此不再赘述。
[0074]
s150,基于预设蒙版将目标图像4切割为位于中心区域的第一部分和围绕第一部分的第二部分。
[0075]
有的二维图标作为目标图像4,不容易识别到轮廓,或者识别到轮廓后最终形成的图像单元的效果不好。对于这样的二维图标还可以通过蒙版的方式处理。预设蒙版的形状可以多样的,例如圆角正方形。预设蒙版用于切割选框的外部内容和选框的内部内容。基于预设蒙版将目标图像4切割为位于中心区域的第一部分和围绕第一部分的第二部分。其中,
第一部分的形状与预设蒙版的形状相同。
[0076]
s160,将第二部分进行修补使修补后的第二部分具有完整的外观面。
[0077]
第二部分的中心区域是有缺口的,并且这个缺口与第一部分的形状是一致的。需要对第二部分的缺口进行修补,具体的修补操作包括对缺口的填充,可以利用缺口边界的颜色或者单一纯色对缺口进行填充。第一部分作为一个图像单元,修补后的第二部分作为另一图像单元。
[0078]
在一个实施例中,获取至少两个图像单元,包括:获取背景图像作为第一图像单元以及目标图像4,背景图像和目标图像4均为二维图像;基于预设蒙版将目标图像4切割出位于中心区域的部分作为第二图像单元。预设蒙版的形状可以是圆角正方形,利用预设蒙版将目标图像4的中心区域切割出来作为第二图像单元。基于多层面模型,将第一图像单元贴在多层面模型的底层面模型上,将第二图像单元贴在多层面模型的顶层面模型上,从而形成立体图标5。这种处理方式比较简单,如果对桌面上的多个应用程序显示的多个立体图标5保持一种设计风格时,可以将多个立体图标5的背景选定为一个,形成不同立体图标5的不同第二图像单元是不同的,可以用于区分多个应用程序。
[0079]
在上面描述的实施例中,如果多层面模型不是背景图像的情况下,还可以额外增加背景图像作为一个图像单元,将背景图像贴到多层面模型的底层面模型上,其他图像单元贴在靠顶层的面模型上。或者,如果多层面模型不是背景图像的情况下,还可以额外增加背景图像作为一个图像单元,这个图像单元替换原来的多个图像单元中最靠底层的一个,这时,背景图像贴到多层面模型的底层面模型上,除了原来的多个图像单元中最靠底层的一个之外,其他的图像单元还按照之前的方式进行贴片处理。
[0080]
在本技术的一个实施例中,如图5所示,图像处理方法还包括:
[0081]
s30,获取目标图像4在电子设备上的显示位置。
[0082]
具体的,二维图标作为目标图像与应用程序相关联,目标图像可以在电子设备的显示屏上显示,具有相应的显示位置,例如显示在桌面的左上角。电子设备能够获取应用程序的相关信息,进而确定目标图像在电子设备上的显示位置。
[0083]
s40,将目标图像4转变为立体图标并渲染在显示位置处。
[0084]
例如,目标图像原本在电子设备的桌面的左上角显示,用户点击该二维图标用于启动应用程序时,电子设备接收到该第一用户操作,获取目标图像4的显示位置,并且根据前述的图像处理方法的步骤对目标图像4进行处理得到立体图标5,进而将立体图标5渲染在显示位置。该立体图标5的显示位置可以处于桌面的左上角,替换了原来的二维图标,该立体图标5是二维图标转换来的,两者是有关联的,不会影响用户使用应用程序,立体图标的显示效果更加符合用户的审美需求。
[0085]
下面,结合一个具体实施例对上述的处理步骤进行详细的说明。该使用场景可以是对应用程序的二维图标进行立体化处理从而形成相应的立体图标5。
[0086]
在电子设备安装或启动应用程序时,确定立体图标要显示的位置,例如确定需要将随后生成的立体图标5显示在屏幕的左上角。如果电子设备的操作系统为安卓系统,则可以在安卓系统的packagemanager类别获取到应用程序的icon(二维图标),例如,获取youtube的二维图标。根据二维图标中的颜色块(可以利用图像轮廓识别算法对像素点的rgb值进行遍历,设定阈值),将其划分成如下的待处理图像单元:带长方形缺口的红色方
形、带三角形缺口的白色长方形和红色三角形。然后分别对有带长方形缺口的红色方形、带三角形缺口的白色长方形分别进行填充,具体的填充方式可以是,使用各个待处理图像单元中缺口周围的像素点的颜色进行填充,进而得到完整的红色方形、完整的白色长方形。
[0087]
调用预设模型中的多层面模型对红色三角形、完整的白色长方形和完整的红色方形进行立体化处理。多层面模型包括三层面模型,底层面模型是凹形的立体模型,顶层面模型和中间面模型均是长方体的立体模型。参考图8,将完整的红色方形贴在底层面模型的凹面上,将完整的白色长方形贴在中间面模型的与底层面模型的凹面朝向相同的一面上,将红色三角形贴在顶层面模型的与底层面模型的凹面朝向相同的一面上。形成的立体图标5包括位于底层3的完整的红色方形面,位于中间层2的完整的白色长方形面,以及位于顶层1的红色三角形。在对立体模型的面模型贴片处理时,可以将面模型的侧壁也进行贴片处理,这样用户从侧面看立体图标5时,效果会更好。对面模型的侧壁进行贴片处理可以是对相应的图像单元的边界的像素点提取颜色并贴在面模型的侧壁上。
[0088]
获取二维图标在屏幕中的显示位置后,渲染立体图标5在屏幕中的显示位置替代原来的的二维图标。
[0089]
在本技术的一个实施例中,图像处理方法还包括以下步骤:基于对立体图标的用户操作,增大显示在立体图标5上的至少两个图像单元之间的间距,和/或使显示在立体图标5上的至少两个图像单元发生偏转。
[0090]
具体地,结合图7和图8,用户可以对生成的立体图标5进行操作,例如对立体图标5进行悬停操作。电子设备接收到用户操作后,将原本静止的立体图标进行形态的变换,从而生成动态效果。电子设备在接收到用户操作时,可以增加立体图标中至少两个图像单元(分别贴在多层面模型上的图像内容)之间的间距,使得立体图标的顶层更靠近用户,形成一个动态效果。在一个实施例中,从底层到顶层的方向上,两个相邻的图像单元之间的间距变化逐渐变大。沿底层到顶层的方向作为指定方向,底层的图像单元朝向指定方向变大的距离小于与底层相邻的图像单元朝向指定方向变大的距离,顶层的图像单元朝向指定方向变大的距离最大。一般情况下,用户是从指定方向的相反方向观看立体图标5,所以电子设备接收到针对立体图标5的悬停的用户操作后,立体图标5朝向用户运动,用户能感知到立体图标5的变化。例如,对立体图标5进行悬停操作,沿底层到顶层的方向,位于立体图标的底层、中间层和顶层的三个图像单元按等差数列的运动距离进行运动。在例如虚拟现实设备、增强现实设备或混合现实设备等的电子设备中,立体图标5可以被放置在固定的位置处,当佩戴这些电子设备的用户从不同角度观看立体图标5时,可以像在真实世界观察立体物体时一样看到立体图标5的不同角度。
[0091]
此外,电子设备在接收到针对立体图标5的不同区域的悬停操作时,还可以驱使立体图标5的多个图像单元进行偏转。例如,悬停在立体图标5的靠右的位置时,立体图标5朝左偏转,悬停在立体图标5的靠左的位置时,立体图标5朝右偏转,方便用户观看立体图标5。立体图标5进行偏转可以是显示在立体图标5上的所有图标单元按照相同的角度发生偏转,从而形成了立体图标5的动态变化,立体效果增强。当然,图像单元之间的间距拉大以及图像单元进行偏转可以同时进行,也可以各自分别进行,从而满足用户的多种需要。
[0092]
本技术实施例还提供了一种图像处理装置,可以应用于电子设备中,如图9所示,包括获取模块和处理模块。获取模块配置为获取至少两个图像单元,至少两个图像单元均
为二维图像;获取多层面模型,多层面模型包括至少两层的面模型。处理模块配置为将至少两个图像单元分别对应至少两层的面模型进行贴片处理生成一个立体图标。
[0093]
在本技术的一个实施例中,处理模块进一步配置为:基于至少两层的面模型和至少两个图像单元的尺寸确定至少两个图像单元之间的位置关系;将至少两个图像单元按照位置关系进行贴片处理,以使至少两个图像单元形成立体图标5。
[0094]
在本技术的一个实施例中,图像处理装置还包括存储模块,其配置为:存储至少两个图像单元以及至少两个图像单元之间的位置关系;或者,
[0095]
存储形成的立体图标5。
[0096]
在本技术的一个实施例中,获取模块进一步配置为:获取目标图像4,目标图像4为二维图像;基于目标图像4中的颜色块,将目标图像4进行拆分以获取至少两个待处理图像单元,其中,待处理图像单元具有同一颜色或多个相似颜色;将具有缺口的待处理图像单元进行修补得到图像单元,以使图像单元具有完整的外观面。
[0097]
在本技术的一个实施例中,获取模块进一步配置为:根据待处理图像单元的像素点的颜色平均值进行填充;或者,根据待处理图像单元的边界的像素点的颜色进行填充。
[0098]
在本技术的一个实施例中,获取至少两个图像单元,获取模块进一步配置为:获取目标图像4,所述目标图像4为二维图像;基于预设蒙版将目标图像4切割为位于中心区域的第一部分和围绕第一部分的第二部分;将第二部分进行修补使修补后的第二部分具有完整的外观面。
[0099]
在本技术的一个实施例中,其中,获取至少两个图像单元,获取模块进一步配置为:获取目标图像4,目标图像4为二维图像;获取背景图像作为第一图像单元,背景图像为二维图像;基于预设蒙版将目标图像4切割出位于中心区域的部分作为第二图像单元。
[0100]
在本技术的一个实施例中,处理模块进一步配置为:获取目标图像4在电子设备上的显示位置;将目标图像4转变为立体图标5并渲染在显示位置处。
[0101]
在本技术的一个实施例中,处理模块进一步配置为:基于对立体图标5的用户操作,增大显示在立体图标5上的至少两个图像单元之间的间距,和/或使显示在立体图标5上的至少两个图像单元发生偏转。
[0102]
本技术实施例还提供了一种电子设备,如图10所示,包括存储器、处理器及存储在存储器上的计算机程序,上述处理器执行计算机程序以实现如上的信息处理方法的步骤。
[0103]
本技术实施例还提供了一种计算机可读存储介质,其上存储有计算机程序,该计算机程序被处理器执行时实现如上的信息处理方法的步骤。
[0104]
本技术实施例还提供了一种计算机程序产品,包括计算机程序,该计算机程序被处理器执行时实现如上的信息处理方法的步骤。
[0105]
以上实施例仅为本技术的示例性实施例,不用于限制本技术,本技术的保护范围由权利要求书限定。本领域技术人员可以在本技术的实质和保护范围内,对本技术做出各种修改或等同替换,这种修改或等同替换也应视为落在本技术的保护范围内。
当前第1页1 2 
网友询问留言 已有0条留言
  • 还没有人留言评论。精彩留言会获得点赞!
1