CN101478732A - 一种即时通信工具图片显示的方法和装置 - Google Patents

Abstract

本发明实施例公开了一种即时通信工具图片显示的方法和装置，属于计算机领域。方法包括：接收消息中的图片信息，所述信息中携带图片大小；获取图片显示方式和图片容器大小；根据所述图片大小、所述图片容器大小，在图片容器中按照所述图片显示方式显示所述图片。装置包括：接收模块、获取模块和显示模块。本发明实施例提供的方法，能够为IM中的图片显示的区域提供更多的图片显示方式，解决了在IM中图片显示不完整的问题，提高了图片的显示效果和用户的使用体验，也为用户查看浏览图片提供了便利。

Description

一种即时通信工具图片显示的方法和装置

技术领域

本发明涉及计算机领域，特别涉及一种即时通信工具图片显示的方法和装置。

背景技术

随着网络技术的发展，网络即时通讯工具已经成为用户必不可少的通讯工具，不但在平时的休闲娱乐中，而且在用户的工作中得到广泛的使用，因此要求IM(Instant Messaging，即时通信)更人性化的为用户服务。

对于IM，最主要的功能为互通信息。目前，在IM的显示窗口中显示的信息有文本、图片、视频等。其中，在当前的IM显示窗口中，图片显示方式目前主要有：

当图片大小大于图片容器大小时，想查看图片的被遮挡区域，需要拖动滚动条或者拖拽改变容器大小查看；对于滚动条不支持大小不可变的容器，则没有办法查看图片的被遮挡区域。

发明人在实现本发明过程中发现：

目前IM中图片的显示，尤其是大图片的显示还是有一定的缺陷的，用户不能直接查看到大图片的全部，如果想查看被遮挡区域，必须手动改变容器大小或者拖动滚动条，很不方便；对于滚动条不支持大小不可变的容器，如果图片大小大于图片容器大小，则没有办法查看图片的被遮挡区域。

发明内容

为了在IM中完整且丰富的显示图片，本发明实施例提供了一种即时通信工具图片显示的方法和装置。所述技术方案如下：

本发明实施例提供一种IM图片显示的方法，所述方法包括：

接收消息中的图片信息，所述信息中携带图片大小；

获取图片显示方式和图片容器大小；

根据所述图片大小、所述图片容器大小，在图片容器中按照所述图片显示方式显示所述图片。

其中，所述获取图片显示方式，包括：

获取预先设定的图片显示方式；或，获取即时通信工具终端选择的图片显示方式。

其中，所述根据所述图片大小、所述图片容器大小，在所述图片容器中按照所述图片显示方式显示所述图片，包括：

当所述图片大小小于所述图片容器大小时，在所述图片容器中原大小显示所述图片；

当所述图片大小大于所述图片容器大小时，在所述图片容器中自适应显示所述图片。

进一步地，所述当所述图片大小大于所述图片容器大小时，在所述图片容器中自适应显示所述图片，包括：

当所述图片容器类型为支持纵向滚动的容器，则在所述图片容器中按照所述图片容器的宽度自适应显示所述图片；

当所述图片容器类型为支持横向滚动的容器，则在所述图片容器中按照所述容器的长度自适应显示所述图片。

其中，所述根据所述图片大小、所述图片容器大小，在所述图片容器中按照所述图片显示方式显示所述图片，还包括：

当所述图片容器的大小发生变化时，按照所述图片显示方式，在所述图片容器中根据所述图片容器的变化自适应显示所述图片。

相应地，本发明实施例提供一种即时通信工具图片显示的装置，所述装置包括：

接收模块，用于接收消息中的图片信息，所述信息中携带图片大小；

获取模块，用于获取图片显示方式和图片容器大小；

显示模块，用于根据所述接收模块接收的图片大小、所述获取模块获取的图片容器大小，在图片容器中按照所述获取模块获取的图片显示方式显示所述图片。

其中，所述获取模块，包括：

第一获取单元，用于获取预先设定的图片显示方式；

第二获取单元，用于获取即时通信工具终端选择的图片显示方式。

其中，所述显示模块，包括：

第一显示单元，用于当所述图片大小小于所述图片容器大小时，在所述图片容器中原大小显示所述图片；

第二显示单元，用于当所述图片大小大于所述图片容器大小时，在所述图片容器中自适应显示所述图片。

进一步地，所述第二显示单元，包括：

第一显示子单元，用于当所述图片容器类型为支持纵向滚动的容器，则在所述图片容器中按照所述图片容器的宽度自适应显示所述图片；

第二显示子单元，用于当所述图片容器类型为支持横向滚动的容器，则在所述图片容器中按照所述容器的长度自适应显示所述图片。

其中，所述显示模块，还包括：

第三显示单元，用于当所述图片容器的大小发生变化时，按照所述图片显示方式，在所述图片容器中根据所述图片容器的变化自适应显示所述图片。

本发明实施例提供的技术方案带来的有益效果是：

本发明实施例提供的方法和装置，既可以按照预定的显示方式在IM聊天窗口中显示图片，也可以根据即时通信工具终端选择的显示方式在IM聊天窗口中显示图片，为IM中的图片显示区域提供更多的图片显示方式，解决了在IM中图片显示不完整和操作不灵活的问题，提高了图片的显示效果和用户的使用体验，也为用户查看浏览图片提供了便利。

附图说明

图1是本发明实施例1提供的方法流程图；

图2是本发明实施例2提供的方法流程图；

图3是本发明实施例3提供的方法流程图；

图4是本发明实施例4提供的装置结构图。

具体实施方式

为使本发明实施例的目的、技术方案和优点更加清楚，下面结合附图对本发明实施方式作进一步地详细描述。

实施例1

本发明实施例提供了一种即时通信工具图片显示的方法，参见图1，该方法包括：

101：接收消息中的图片信息，信息中携带图片大小；

102：获取图片显示方式和图片容器大小；

103：根据图片大小、图片容器大小，在图片容器中按照图片显示方式显示图片。

上述步骤101和102中，也可以先获取图片的显示方式，再接收消息中的图片信息，本发明实施例对其先后顺序不作限制。

其中，获取图片显示方式，包括：

获取预先设定的图片显示方式；或，获取即时通信工具终端选择的图片显示方式。

其中，根据图片大小、图片容器大小，在图片容器中按照图片显示方式显示图片，包括：

当图片大小小于图片容器大小时，在图片容器中原大小显示图片；

当图片大小大于图片容器大小时，在图片容器中自适应显示图片。

进一步地，当图片大小大于图片容器大小时，在图片容器中自适应显示图片，包括：

当图片容器类型为支持纵向滚动的容器，则在图片容器中按照图片容器的宽度自适应显示图片；

当图片容器类型为支持横向滚动的容器，则在图片容器中按照容器的长度自适应显示图片。

其中，根据图片大小、图片容器大小，在图片容器中按照图片显示方式显示图片，还包括：

当图片容器的大小发生变化时，按照图片显示方式，在图片容器中根据图片容器的变化自适应显示图片。

另外，本发明实施例中的图片大小又包括：2进制形式的图片大小如图片大小为2M、像素形式的图片大小如图片的大小为760*840，但其本质没有区别。

本发明实施例提供的方法，既可以按照预定的显示方式在IM聊天窗口中显示图片，也可以根据即时通信工具终端选择的显示方式在IM聊天窗口中显示图片，为IM中的图片显示区域提供更多的图片显示方式，解决了在IM中图片显示不完整和操作不灵活的问题，提高了图片的显示效果和用户的使用体验，也为用户查看浏览图片提供了便利。

实施例2

为了在IM中完整且丰富的显示图片，本发明实施例提供了一种即时通信工具图片显示的方法，其中以在终端的聊天窗口中显示图片为例，对本发明实施例提供的方法进行具体说明。

为了更好的说明本发明实施例提供的方法，首先对IM中图片显示相关的关键性定义进行描述。

(一)图片容器：显示聊天窗口中的图片的容器，按照不同的属性可以分为不同的类型。其中，主要根据拖拽支持和滚动条支持对容器进行分类。

拖拽支持：容器支持拖拽来改变容器大小，当拖拽容器时，根据横向和纵向大小是否可变，图片容器主要分为4类：

(1)全大小可变：当拖拽容器时，容器的横向大小和纵向大小都可以改变。

(2)横向大小可变：当拖拽容器时，仅容器的横向大小支持可变，纵向大小不变化。

(3)纵向大小可变：当拖拽容器时，仅容器的纵向大小支持可变，横向大小不支持变化。

(4)固定大小：容器不支持拖拽，拖拽容器，容器大小不发生变化。

滚动条支持：容器按照滚动条支持属性主要分为以下4类：

(1)全滚动支持：容器既支持横向滚动条，又支持纵向滚动条。

(2)横向滚动条支持：容器仅支持横向滚动条，不支持纵向滚动条。

(3)纵向滚动条支持：容器仅支持纵向滚动条，不支持横向滚动条。

(4)滚动条不支持：容器不支持滚动条。

(二)图片显示：图片在容器中的显示方式按照显示时的大小属性主要分为以下3种：

(1)原大小显示：图片按照图片原大小在容器中显示，不做特殊处理。

(2)自适应显示：图片的大小由容器的大小来缩放，自动缩放到能够完全显示在容器中。

(3)缩略图显示：图片的显示大小固定，不由容器的大小和图片的原大小来决定。

为了在IM的显示窗口中丰富的显示图片，本发明实施例提供了丰富显示的几种组合方案：

为了便于划分容器的类型，本发明实施例中将容器的类型用两个英文符号表示，定义为scroll-sizing。其中，scroll的类型有全滚动支持(all scroll type)用a代替、横向滚动条支持(horizontal scroll type)用h代替、纵向滚动条支持(verticalscroll type)用v代替、滚动条不支持(none-scroll type)用n代替；sizing的类型有全大小可变(all sizing)用a代替、横向大小可变(horizontal sizing)用h代替、纵向大小可变(vertical sizing)用v代替、固定大小用n代替。

根据上述容器的划分，所有的容器类型共有16种组合，参见表1。

表1

 

容器类型	全大小可变	横向大小可变	纵向大小可变	固定大小
					全滚动支持	aa	ah	av	an
横向滚动条支持	ha	hh	hv	hn
					纵向滚动条支持	va	vh	vv	vn
滚动条不支持	na	nh	nv	nn

上述表1根据滚动条支持情况和拖拽支持情况，给出16种容器类型。

为了更丰富显示在IM的显示窗口中显示图片，本发明实施例把容器的类型和图片类型组合起来，并用英文字符表示各个显示方式，定义为scroll-sizing_show。其中，scroll-sizing为容器的类型，如表1中的16种容器类型中的一种；show的类型有原大小显示(normal)用n表示、自适应显示(auto)用a表示、缩略图显示(breviary)用b表示。

将容器类型和图片类型组合后，得到48种图片显示方式，参见表2。

表2

 

容器类型	原大小显示	自适应显示	缩略图显示
				aa	aa_n	aa_a	aa_b
ah	ah_n	ah_a	ah_b
				av	av_n	av_a	av_b
an	an_n	an_a	an_b
				ha	ha_n	hn_a	hn_b
hh	hh_n	hh_a	hh_b
				hv	hv_n	hv_a	hv_b
hn	hn_n	hn_a	hn_b
				va	va_n	va_a	va_b
vh	vh_h	vh_a	vh_b
				vv	vv_h	vv_a	vv_b
vn	vn_h	vn_a	vn_b
				na	na_h	na_a	na_b
nh	nh_h	nh_a	nh_b
				nv	nv_h	nv_a	nv_b
nn	nn_h	nn_a	nn_b

下面本发明实施例结合表1和表2，以在终端的聊天窗口中图片显示方式选择为va_a为例，对本发明实施例提供的方法进行详细说明，参见图2，具体实现过程如下：

201：终端获取消息中的图片信息，所述信息中携带图片属性；

其中，本步骤中，终端获取消息中的图片信息，在此之前终端可以先获取图片的显示方式va_a；也可以在终端获取消息中的图片信息之后，再获取图片的显示方式va_a，本发明实施例对其先后顺序不作限制。

本发明实施例中的终端具体可以为：客户端、用户终端、无线终端以及Web终端。

终端接收消息，当包含有图片的消息到达终端，不管何种消息，可能是离线消息，也可能是即时消息、后台系统消息等，本发明实施例对消息的类型不作限制。

终端接收到消息后，首先解析该消息，当解析到该消息中含有图片时，启动拉取图片信息的逻辑。其中，到达终端的消息是代码形式的消息，而图片代码和文本代码是不同的。当终端解析到该消息中有图片代码时，获取图片代码；并根据获取的图片代码，启动拉取图片信息的逻辑，例如可以根据图片代码中的地址到图片服务器中去拉取该图片信息，也可以根据图片代码中的地址从网络中下载该图片信息，对于拉取图片信息的方式本发明实施例不作限制。

其中，终端拉取图片信息后，图片信息中携带的图片属性包括图片的大小、图片格式等信息，本发明实施例中以图片大小为例进行说明。

另外，图片大小又包括：2进制形式的图片大小如图片大小为2M、像素形式的图片大小如图片的大小为760*840，但其本质没有区别。

202：终端按照va_a方式，在终端的聊天窗口中显示该图片；

其中，消息中的图片成功拉取下来后，按照预定的图片显示方式va_a，在终端聊天窗口消息主显示区显示该图片。va_a表示纵向滚动条支持全可变容器中图片的显示方式为自适应显示，当拖拽发生，容器大小发生改变时，图片的大小随容器的大小自动变化大小。此方式可以应用到聊天窗口左侧会话内容显示区，当拖拽聊天窗口时，图片大小自适应到会话内容显示区的宽度，恰好显示完整图片。

由于聊天窗口的主显示区是纵向滚动条支持、全大小可变的容器，所以图片根据当前主显示区的宽度自适应显示，如果图片的大小小于容器的大小，则直接原大小显示图片；如果图片的大小大于容器的大小，则图片根据当前主显示区的宽度自适应调整后再显示。

203：当图片容器大小发生变化时，在聊天窗口中根据容器大小的变化自适应显示该图片。

其中，由于聊天窗口的主显示区是纵向滚动条支持、全大小可变的容器，所以当用户拖拽聊天窗口，聊天窗口的大小会发生变化时，聊天窗口消息主显示区的大小也发生变化。此时，由于设置图片的显示方式是va_a，即自适应显示，图片的大小应该随消息主显示区的大小变化而变化，根据消息主显示区的宽度自适应显示图片。

上述步骤是按照预定的图片显示方式va_a在终端的聊天窗口中显示图片的过程，其中，本发明实施例提供的方法还适用于在终端设置一个用户选择界面，界面中可以提供上述48种图片显示方式；用户可以根据自己的需要，选择在该界面中的任意一种图片显示方式，提高了用户的使用体验。另外，也可以按照预定的图片显示方式在终端的聊天窗口中显示图片，当用户需要改变图片显示方式时，可以再通过终端的用户选择界面任意选择图片的显示方式。

本发明实施例提供的方法，既可以按照预定的va_a方式在IM聊天窗口中显示图片，也可以根据用户在终端选择的显示方式在IM聊天窗口中显示图片，为IM中的图片显示区域提供更多的图片显示方式，解决了在IM中图片显示不完整和操作不灵活的问题，提高了图片的显示效果和用户的使用体验，也为用户查看浏览图片提供了便利。

实施例3

为了在IM中完整且丰富的显示图片，本发明实施例提供了一种即时通信工具图片显示的方法，其中以在终端的聊天记录窗口中图片显示方式选择为vv_a为例，对本发明实施例提供的方法进行详细说明，参见图3，具体实现过程如下：

301：终端获取聊天记录窗口中的图片信息，所述信息中携带该图片属性；

其中，本步骤中，终端获取聊天记录窗口中的图片信息，在此之前终端可以先获取图片的显示方式vv_a；也可以在终端获取聊天记录窗口中的图片信息之后，再获取图片的显示方式vv_a，本发明实施例对其先后顺序不作限制。

本发明实施例中的终端具体可以为：客户端、用户终端、无线终端以及Web终端。

由于终端聊天记录显示区默认是关闭的，所以当要查看聊天记录时，点击聊天窗口上面的聊天记录按钮，展开聊天记录显示区，即图片显示容器。

IM客户端获取聊天记录窗口中的图片时，首先启动拉取图片的逻辑，其过程参见实施例2，这里不再赘述。

其中，终端拉取图片信息后，图片信息中携带的图片属性包括图片的大小、图片格式等信息，本发明实施例中以图片大小为例进行说明。

另外，图片大小又包括：2进制形式的图片大小如图片大小为2M、像素形式的图片大小如图片的大小为760*840，但其本质没有区别。

302：终端按照vv_a方式，在终端的聊天记录窗口中显示该图片；

其中，消息中的图片成功拉取下来后，按照预定的图片显示方式vv_a，在终端聊天记录窗口消息主显示区显示。vv_a表示纵向滚动条支持纵向大小可变容器中图片的显示方式为自适应显示，因为拖拽发生时，容器的横向大小不变，所以生成的图片自适应大小完整显示后，拖拽时大小并不用变化。此方式可以应用到聊天窗口右侧聊天记录显示区，当初始化显示区时，大小显示不全的图片，自适应缩放到显示区，显示完整图片。

由于聊天记录窗口的主显示区是纵向滚动条支持纵向大小可变的容器，所以图片根据当前主显示区的宽度自适应显示，如果图片的大小小于容器的大小，则直接原大小显示图片；如果图片的大小大于容器的大小，则图片根据当前主显示区的宽度自适应调整后再显示。

303：当图片容器大小发生变化时，在聊天记录窗口中根据容器大小的变化自适应显示该图片。

其中，由于聊天记录窗口的主显示区是纵向滚动条支持、纵向大小可变的容器，所以当用户拖拽聊天记录窗口，聊天记录窗口的纵向大小会发生变化时，聊天记录窗口消息主显示区的大小也发生变化。此时，由于设置图片的显示方式是vv_a，即自适应显示，图片的大小应该随消息主显示区的大小变化而变化，根据消息主显示区的宽度自适应显示图片。

上述步骤是按照预定的图片显示方式vv_a在终端的聊天记录窗口中显示图片的过程，其中，本发明实施例提供的方法还适用于在终端设置一个用户选择界面，界面中可以提供表2所示的48种图片显示方式；用户可以根据自己的需要，在该界面中选择任意一种图片显示方式。另外，也可以按照预定的图片显示方式在终端的聊天窗口中显示图片，当用户需要改变图片显示方式时，可以再通过终端的用户选择界面任意选择图片的显示方式。

本发明实施例提供的方法，既可以按照预定的vv_a方式在IM聊天记录窗口中显示图片，也可以根据用户在终端选择的显示方式在IM聊天记录窗口中显示图片，为IM中的图片显示区域提供更多的图片显示方式，解决了在IM中图片显示不完整和操作不灵活的问题，提高了图片的显示效果和用户的使用体验，也为用户查看浏览图片提供了便利。

实施例4

本发明实施例提供一种IM图片显示的装置，参见图4，该装置包括：

接收模块401，用于接收消息中的图片信息，信息中携带图片大小；

获取模块402，用于获取图片显示方式和图片容器大小；

显示模块403，用于根据接收模块401接收的图片大小、获取模块402获取的图片容器大小，在图片容器中按照获取模块获取的图片显示方式显示图片。

上述接收模块401和获取模块402中，也可以先通过获取模块402获取图片的显示方式，再通过接收模块401接收消息中的图片信息，本发明实施例对其先后顺序不作限制。

其中，获取模块402，包括：

第一获取单元，用于获取预先设定的图片显示方式；

第二获取单元，用于获取即时通信工具终端选择的图片显示方式。

其中，显示模块403，包括：

第一显示单元，用于当图片大小小于图片容器大小时，在图片容器中原大小显示图片；

第二显示单元，用于当图片大小大于图片容器大小时，在图片容器中自适应显示图片。

进一步地，第二显示单元，包括：

第一显示子单元，用于当图片容器类型为支持纵向滚动的容器，则在图片容器中按照图片容器的宽度自适应显示图片；

第二显示子单元，用于当图片容器类型为支持横向滚动的容器，则在图片容器中按照容器的长度自适应显示图片。

其中，显示模块403，还包括：

第三显示单元，用于当图片容器的大小发生变化时，按照图片显示方式，在图片容器中根据图片容器的变化自适应显示图片。

另外，本发明实施例中的图片大小又包括：2进制形式的图片大小如图片大小为2M、像素形式的图片大小如图片的大小为760*840，但其本质没有区别。

本发明实施例提供的装置，既可以按照预定的显示方式在图片容器中显示图片，也可以根据即时通信工具终端选择的显示方式在图片容器中显示图片，为IM中的图片显示区域提供更多的图片显示方式，解决了在IM中图片显示不完整和操作不灵活的问题，提高了图片的显示效果和用户的使用体验，也为用户查看浏览图片提供了便利。

本发明实施例可以利用实现，相应的程序可以存储在可读取的存储介质中，例如，路由器的硬盘、缓存或光盘中。

以上所述仅为本发明的较佳实施例，并不用以限制本发明，凡在本发明的精神和原则之内，所作的任何修改、等同替换、改进等，均应包含在本发明的保护范围之内。

Claims (10)

1、一种即时通信工具图片显示的方法，其特征在于，所述方法包括：

接收消息中的图片信息，所述信息中携带图片大小；

获取图片显示方式和图片容器大小；

根据所述图片大小、所述图片容器大小，在图片容器中按照所述图片显示方式显示所述图片。

2、如权利要求1所述的方法，其特征在于，所述获取图片显示方式，包括：

获取预先设定的图片显示方式；或，获取即时通信工具终端选择的图片显示方式。

3、如权利要求1所述的方法，其特征在于，所述根据所述图片大小、所述图片容器大小，在所述图片容器中按照所述图片显示方式显示所述图片，包括：

当所述图片大小小于所述图片容器大小时，在所述图片容器中原大小显示所述图片；

当所述图片大小大于所述图片容器大小时，在所述图片容器中自适应显示所述图片。

4、如权利要求3所述的方法，其特征在于，所述当所述图片大小大于所述图片容器大小时，在所述图片容器中自适应显示所述图片，包括：

当所述图片容器类型为支持纵向滚动的容器，则在所述图片容器中按照所述图片容器的宽度自适应显示所述图片；

当所述图片容器类型为支持横向滚动的容器，则在所述图片容器中按照所述容器的长度自适应显示所述图片。

5、如权利要求1所述的方法，其特征在于，所述根据所述图片大小、所述图片容器大小，在所述图片容器中按照所述图片显示方式显示所述图片，还包括：

当所述图片容器的大小发生变化时，按照所述图片显示方式，在所述图片容器中根据所述图片容器的变化自适应显示所述图片。

6、一种即时通信工具图片显示的装置，其特征在于，所述装置包括：

接收模块，用于接收消息中的图片信息，所述信息中携带图片大小；

获取模块，用于获取图片显示方式和图片容器大小；

显示模块，用于根据所述接收模块接收的图片大小、所述获取模块获取的图片容器大小，在图片容器中按照所述获取模块获取的图片显示方式显示所述图片。

7、如权利要求6所述的装置，其特征在于，所述获取模块，包括：

第一获取单元，用于获取预先设定的图片显示方式；

第二获取单元，用于获取即时通信工具终端选择的图片显示方式。

8、如权利要求6所述的装置，其特征在于，所述显示模块，包括：

第一显示单元，用于当所述图片大小小于所述图片容器大小时，在所述图片容器中原大小显示所述图片；

第二显示单元，用于当所述图片大小大于所述图片容器大小时，在所述图片容器中自适应显示所述图片。

9、如权利要求8所述的装置，其特征在于，所述第二显示单元，包括：

第一显示子单元，用于当所述图片容器类型为支持纵向滚动的容器，则在所述图片容器中按照所述图片容器的宽度自适应显示所述图片；

第二显示子单元，用于当所述图片容器类型为支持横向滚动的容器，则在所述图片容器中按照所述容器的长度自适应显示所述图片。

10、如权利要求6所述的装置，其特征在于，所述显示模块，还包括：

第三显示单元，用于当所述图片容器的大小发生变化时，按照所述图片显示方式，在所述图片容器中根据所述图片容器的变化自适应显示所述图片。

Images