一种图片处理方法和装置的制造方法_2

文档序号:9261727阅读:来源:国知局
[0030]根据本申请的一个实施例,可以对交互图层设置“关联图层”这样一个字段。根据接收的交互请求中携带的待关联的图片图层的标识,在该字段中记录该标识,如图片图层的序号。
[0031]在步骤103,根据在交互图层中输入的图片数据,更新交互图层所关联的图片图层中的图片数据。
[0032]具体而言,由于在图片图层的顶层添加了交互图层,可以接收用户在交互图层的操作请求。并且,在步骤102,该交互图层已经与需要调整的图片相对应的图片图层相关联,因此,可以通过接收用户在交互图层输入的图片数据,如调整后的大小、调整后的中心点坐标、旋转后的角度等,来调整与交互图层所关联的图片图层中的图片数据。
[0033]根据本申请的一个实施例,根据在交互图层中输入的图片数据,更新交互图层所关联的图片图层中的图片数据的步骤可以进一步包括:监听用户对交互图层的操作,以获取输入的图片数据;以及根据输入的图片数据更新与所交互图层所关联的图片图层中的图片数据。
[0034]具体地,在交互图层设置监听,以监听用户的操作事件(如触摸、鼠标点击、键盘按键等输入设备触发的操作事件)。当确定操作的目标(调整大小、调整中心点坐标或旋转)后,可以根据操作的起始和终止位置之间的距离、位置的变化差值、角度的变化差值等,计算操作后的大小、中心点坐标、角度等数据,该数据即为用户输入的图片数据。
[0035]在获取的输入的图片数据后,可以通过交互图层与所关联图层的关联关系,找到所关联的图层,并且将该图片图层中的图片数据更新为所获取的用户输入的图片数据。
[0036]根据用户输入的图片数据,可以重新绘制该图片图层,重新绘制后的图片图层中的图片具有用户输入的图片数据,从而达到更新图片图层中的图片的目的。同时,也可以实时向用户呈现与交互图层所关联的图片图层中的图片数据调整后的效果。
[0037]另外,用户在交互图层进行操作时,为了实时向用户呈现对交互图层中的交互提示的操作效果,步骤103可以进一步包括:根据输入的图片数据重新生成交互图层中的交互提示。
[0038]需要说明的是,对交互图层的监听是持续不断的(时间维度上的持续),每次监听到有事件发生,就根据该事件所对应的输入的图片数据,更新交互图层所关联的图片图层中的图片数据。
[0039]另外,需要说明的是,上述步骤101至103描述了如何通过交互图层更新某一图片图层中的图片数据的过程。当完成对某一图片图层中的图片数据的更新后,可以基于来自用户的结束交互的请求,去除交互图层。当再次接收到启动交互的请求时,可以再次执行步骤101至103,以满足用户对各图片图层中的图片数据进行调整的需要。
[0040]在步骤104,根据更新后的图片数据对各图片图层中的图片进行合成。
[0041]具体而言,当接收到对各图片图层中的图片数据进行合成的合成请求时,可以依次读取每个图片图层中更新后的图片数据,然后,在新建的图层中,可以由底向上,依次绘制各图片图层中的图片,并且在绘制时,上面图层覆盖下面图层,,同时,擦除原各图片图层,从而获取处理后的图片。
[0042]优选地,在根据在交互图层中输入的图片数据,更新交互图层所关联的图片图层中的图片数据的步骤之后,在根据更新后的图片数据对各图片图层中的图片进行合成的步骤之前,取消对交互图层的监听。
[0043]优选地,在根据在交互图层中输入的图片数据,更新交互图层所关联的图片图层中的图片数据的步骤之后,在根据更新后的图片数据对各图片图层中的图片进行合成的步骤之前,可以去除交互图层。
[0044]至此,描述了根据本申请一个实施例的图片处理方法100的流程图。本实施例的方法100通过根据接收的交互请求在多个图片图层的顶层添加交互图层;根据交互请求中携带的待关联图片图层的标识,将交互图层与标识所对应的图片图层进行关联;根据在交互图层中输入的图片数据,更新交互图层所关联的图片图层中的图片数据;以及根据更新后的图片数据对各图片图层中的图片进行合成。与现有技术相比,该方法100可以在叠加多个图片的基础上,通过用户在顶层的交互图层进行操作,调整各图片图层中的图片数据,同时可以实时呈现用户对图片数据调整后的效果,并且可以在无需引入其他后端服务支持的情况下,在浏览器中直接合成图片。
[0045]图2a至图2c示意性地示出了根据本申请的一个实施例的图片处理方法的实际操作过程。
[0046]其中,图2a是根据本申请一个实施例的图片处理方法的示意图。如图2a所示,在浏览器中以叠加方式添加3个图片图层,分别为图片图层A、图片图层B和图片图层C每个图片图层中绘制有一张图片。在顶层添加交互图层D,并且指定图片图层A为待关联的图片图层,使交互图层D与图片图层A相关联。在交互图层D中,根据图片图层A的图片数据,绘制交互提示。
[0047]图2b是根据图2a的图片处理方法的操作过程中的用户界面的示意图。如图2b所示,图片图层A、图片图层B和图片图层C叠加而置,用户可对顶层的交互图层进行操作,如触摸、鼠标点击、键盘按键等。通过在交互图层进行操作可以通过交互图层与所关联图层的关联关系,以在交互图层输入的图片数据更新所关联的图片图层的图片数据。
[0048]例如,当用户需要对图片图层A中的图片进行调整时,可以指定该图片图层A,使交互图层与其相关联,然后基于交互图层D中的交互提示进行所需操作,如触摸、鼠标点击、键盘按键等。用户对交互图层的每一次操作都对应一个输入的图片数据,通过将所关联的图片图层A的图片数据更新为该用户输入的数据,可以重新绘制图片图层A中的图片,从而完成对图片图层A中的图片的调整。当完成对图片图层A中的图片数据进行调整后,取消对交互图层的监听,并且移除交互图层D。根据上述方法,用户可以对图片图层B和/或图片图层C中的图片数据进行调整。在用户的操作过程中,可以实时看到对所关联图片图层中的图片数据调整后的效果,并且也可以实时看到交互图层中的交互提示在用户操作后的效果。另外,在用户的操作过程中,交互图层始终位于顶层,其中的交互提示可以完整的呈现给用户,由于其不会被其他图层覆盖,因此不会影响用户的操作体验。
[0049]图2c是根据图2a的图片处理方法的合成后的图片的示意图。如图2c所示,当用户对需要进行调整的图片的图片数据完成调整后,可以通过发出合成请求,例如点击“获取合成图片”,使图片图层A、图片图层B和图片图层C中的图片进行合成操作,从而在浏览器中直接获取合成后的图片。
[0050]图3是根据本申请一个实施例的图片处理装置300的框图。
[0051]如图3所示,装置300包括:添加模块310,用于根据接收的交互请求在多个图片图层的顶层添加交互图层;关联模块320,用交互请求中携带的待关联图片图层的标识,将交互图层与标识所对应的图片图层进行关联;更新模块330,用于根据在交互图层中输入的图片数据,更新交互图层所关联的图片图层中的图片数据;以及合成模块340,用于根据更新后的图片数据,对各图片图层中的图片进行合成。
[0052]根据本申请的一个实施例,每个图片图层规格相同。
[0053]根据本申请的一个实施例,添加模块3
当前第2页1 2 3 
网友询问留言 已有0条留言
  • 还没有人留言评论。精彩留言会获得点赞!
1