图片模糊到清晰的展示方式

时间:2023-01-25 19:28:57

现在很多web应用在加载大图片时都有从模糊到清晰的加载效果,查看了一些资料,发现都是用了缩略图的形式来实现的。先做一张小的缩略图,在显示的时候先显示缩略图再拉伸到相应的位置,然后再用ajax加载大图片。

这样又会延伸出另外一个问题,缩略图比例如何设定,这个可以好好讨论一下。下面是其中的一种实现方法:

客户端上传到服务器端的图片已经在客户端做了一次处理,保证宽和高最大值不会超过960px,我们对图片做两种大小的缩略图,小的保证宽高不超过160px,中等缩略图保证宽高不超过640px;如果原图就小于160,则原图,小缩略图和中缩略图都是原图,如果图片范围在160到640之间,则原图和中缩略图是一致的,小缩略图要处理。

def scale(t,size=(50,50)):
(w,h) = size
if 'm' == t:
limit = 640
elif 's' == t:
limit = 160

if w >= h and w >= limit:
scale = float(w) / limit
elif h >= limit:
scale = float(h) / limit
else:
scale = 1

return scale

t为标记是处理中等还是小缩略图的标记,size为原图的w,h为元组。返回scale是缩放比例,如果scale为1,则缩略图为原图,否则调用下面方法获取新的图片w,h

def resize(scale,size=(50,50)):
(w,h) = size
resize = (int(w / scale),int(h /scale))
return resize

返回的resize是缩略图的宽高,如果是使用python的PIL库,直接image.resize(resize)就可以获取新的图片。