前言
需求源自项目中的一些应用,比如相册功能,通常用户上传相片后我们都会针对该相片再生成一张缩略图,用于其它页面上的列表显示。随便看一下,大部分网站基本都是将原图等比缩放来生成缩略图。但完美主义者会发现一些问题,比如显示排版时想让相片缩略图列表非常统一、整齐、和美观,比如要求每张缩略图大小固定为120 x 90且不拉伸变形怎么办?再比如用户头像如何让缩略图比原图更清晰?或是如何在上传的图片下加一个半透明的logo水印?
ok,本文根据自己的项目代码描述以上问题的解决方案,全部基于.net framework类库完成,代码中包含了c#图片处理的一些基础知识,与大家分享,个人能力有限,不足之处还请及时指正。
提高缩略图清晰度
(原图200*200,12.3k)(处理后80*80,17.7k)
之前一直认为缩略图不可能比原图清晰,直到某天一位产品的同事给我看某网站的效果。于是开始寻找.net下实现代码,仔细观察缩略图确实比原图更清晰了一些,但代价是缩略图文件比原图更大,所以如果你想让一张占满显示器屏幕的超大图片更清晰,那么图片占用空间和网络流量就必需考虑了,如果是互联网应用,建议缩略图在200像素以内的使用该方法。当然如果哪位有更好的代码即能让图片文件大小变化不大又让图片更清晰还请分享。
图片裁剪
(原图256*192)(裁剪要求100*100)
(原图256*192)(裁剪要求90*120)
(原图256*192)(裁剪要求120*90)
(原图146*256)(裁剪要求100*100)
(原图146*256)(裁剪要求90*120)
(原图146*256)(裁剪要求120*90)
算法:以原图中心作为裁剪中心,最大范围的对原图进行裁剪,然后对裁剪结果等比缩放。
图片水印
仅演示了效果,如需要变更字体、水印透明度、位置等可自行在代码或方法中扩展。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
|
using system; using system.collections.generic; using system.text; using system.io; using system.drawing; using system.drawing.drawing2d; using system.drawing.imaging; namespace wujian.common { /// <summary> /// 图片处理 /// http://www.cnblogs.com/wu-jian/ /// /// 吴剑 2011-02-20 创建 /// 吴剑 2012-08-08 修改 /// </summary> public class image { #region 正方型裁剪并缩放 /// <summary> /// 正方型裁剪 /// 以图片中心为轴心,截取正方型,然后等比缩放 /// 用于头像处理 /// </summary> /// <remarks>吴剑 2012-08-08</remarks> /// <param name="fromfile">原图stream对象</param> /// <param name="filesaveurl">缩略图存放地址</param> /// <param name="side">指定的边长(正方型)</param> /// <param name="quality">质量(范围0-100)</param> public static void cutforsquare(system.io.stream fromfile, string filesaveurl, int side, int quality) { //创建目录 string dir = path.getdirectoryname(filesaveurl); if (!directory.exists(dir)) directory.createdirectory(dir); //原始图片(获取原始图片创建对象,并使用流中嵌入的颜色管理信息) system.drawing.image initimage = system.drawing.image.fromstream(fromfile, true ); //原图宽高均小于模版,不作处理,直接保存 if (initimage.width <= side && initimage.height <= side) { initimage.save(filesaveurl, system.drawing.imaging.imageformat.jpeg); } else { //原始图片的宽、高 int initwidth = initimage.width; int initheight = initimage.height; //非正方型先裁剪为正方型 if (initwidth != initheight) { //截图对象 system.drawing.image pickedimage = null ; system.drawing.graphics pickedg = null ; //宽大于高的横图 if (initwidth > initheight) { //对象实例化 pickedimage = new system.drawing.bitmap(initheight, initheight); pickedg = system.drawing.graphics.fromimage(pickedimage); //设置质量 pickedg.interpolationmode = system.drawing.drawing2d.interpolationmode.highqualitybicubic; pickedg.smoothingmode = system.drawing.drawing2d.smoothingmode.highquality; //定位 rectangle fromr = new rectangle((initwidth - initheight) / 2, 0, initheight, initheight); rectangle tor = new rectangle(0, 0, initheight, initheight); //画图 pickedg.drawimage(initimage, tor, fromr, system.drawing.graphicsunit.pixel); //重置宽 initwidth = initheight; } //高大于宽的竖图 else { //对象实例化 pickedimage = new system.drawing.bitmap(initwidth, initwidth); pickedg = system.drawing.graphics.fromimage(pickedimage); //设置质量 pickedg.interpolationmode = system.drawing.drawing2d.interpolationmode.highqualitybicubic; pickedg.smoothingmode = system.drawing.drawing2d.smoothingmode.highquality; //定位 rectangle fromr = new rectangle(0, (initheight - initwidth) / 2, initwidth, initwidth); rectangle tor = new rectangle(0, 0, initwidth, initwidth); //画图 pickedg.drawimage(initimage, tor, fromr, system.drawing.graphicsunit.pixel); //重置高 initheight = initwidth; } //将截图对象赋给原图 initimage = (system.drawing.image)pickedimage.clone(); //释放截图资源 pickedg.dispose(); pickedimage.dispose(); } //缩略图对象 system.drawing.image resultimage = new system.drawing.bitmap(side, side); system.drawing.graphics resultg = system.drawing.graphics.fromimage(resultimage); //设置质量 resultg.interpolationmode = system.drawing.drawing2d.interpolationmode.highqualitybicubic; resultg.smoothingmode = system.drawing.drawing2d.smoothingmode.highquality; //用指定背景色清空画布 resultg.clear(color.white); //绘制缩略图 resultg.drawimage(initimage, new system.drawing.rectangle(0, 0, side, side), new system.drawing.rectangle(0, 0, initwidth, initheight), system.drawing.graphicsunit.pixel); //关键质量控制 //获取系统编码类型数组,包含了jpeg,bmp,png,gif,tiff imagecodecinfo[] icis = imagecodecinfo.getimageencoders(); imagecodecinfo ici = null ; foreach (imagecodecinfo i in icis) { if (i.mimetype == "image/jpeg" || i.mimetype == "image/bmp" || i.mimetype == "image/png" || i.mimetype == "image/gif" ) { ici = i; } } encoderparameters ep = new encoderparameters(1); ep.param[0] = new encoderparameter(system.drawing.imaging.encoder.quality, ( long )quality); //保存缩略图 resultimage.save(filesaveurl, ici, ep); //释放关键质量控制所用资源 ep.dispose(); //释放缩略图资源 resultg.dispose(); resultimage.dispose(); //释放原始图片资源 initimage.dispose(); } } #endregion #region 自定义裁剪并缩放 /// <summary> /// 指定长宽裁剪 /// 按模版比例最大范围的裁剪图片并缩放至模版尺寸 /// </summary> /// <remarks>吴剑 2012-08-08</remarks> /// <param name="fromfile">原图stream对象</param> /// <param name="filesaveurl">保存路径</param> /// <param name="maxwidth">最大宽(单位:px)</param> /// <param name="maxheight">最大高(单位:px)</param> /// <param name="quality">质量(范围0-100)</param> public static void cutforcustom(system.io.stream fromfile, string filesaveurl, int maxwidth, int maxheight, int quality) { //从文件获取原始图片,并使用流中嵌入的颜色管理信息 system.drawing.image initimage = system.drawing.image.fromstream(fromfile, true ); //原图宽高均小于模版,不作处理,直接保存 if (initimage.width <= maxwidth && initimage.height <= maxheight) { initimage.save(filesaveurl, system.drawing.imaging.imageformat.jpeg); } else { //模版的宽高比例 double templaterate = ( double )maxwidth / maxheight; //原图片的宽高比例 double initrate = ( double )initimage.width / initimage.height; //原图与模版比例相等,直接缩放 if (templaterate == initrate) { //按模版大小生成最终图片 system.drawing.image templateimage = new system.drawing.bitmap(maxwidth, maxheight); system.drawing.graphics templateg = system.drawing.graphics.fromimage(templateimage); templateg.interpolationmode = system.drawing.drawing2d.interpolationmode.high; templateg.smoothingmode = system.drawing.drawing2d.smoothingmode.highquality; templateg.clear(color.white); templateg.drawimage(initimage, new system.drawing.rectangle(0, 0, maxwidth, maxheight), new system.drawing.rectangle(0, 0, initimage.width, initimage.height), system.drawing.graphicsunit.pixel); templateimage.save(filesaveurl, system.drawing.imaging.imageformat.jpeg); } //原图与模版比例不等,裁剪后缩放 else { //裁剪对象 system.drawing.image pickedimage = null ; system.drawing.graphics pickedg = null ; //定位 rectangle fromr = new rectangle(0, 0, 0, 0); //原图裁剪定位 rectangle tor = new rectangle(0, 0, 0, 0); //目标定位 //宽为标准进行裁剪 if (templaterate > initrate) { //裁剪对象实例化 pickedimage = new system.drawing.bitmap(initimage.width, ( int )system.math.floor(initimage.width / templaterate)); pickedg = system.drawing.graphics.fromimage(pickedimage); //裁剪源定位 fromr.x = 0; fromr.y = ( int )system.math.floor((initimage.height - initimage.width / templaterate) / 2); fromr.width = initimage.width; fromr.height = ( int )system.math.floor(initimage.width / templaterate); //裁剪目标定位 tor.x = 0; tor.y = 0; tor.width = initimage.width; tor.height = ( int )system.math.floor(initimage.width / templaterate); } //高为标准进行裁剪 else { pickedimage = new system.drawing.bitmap(( int )system.math.floor(initimage.height * templaterate), initimage.height); pickedg = system.drawing.graphics.fromimage(pickedimage); fromr.x = ( int )system.math.floor((initimage.width - initimage.height * templaterate) / 2); fromr.y = 0; fromr.width = ( int )system.math.floor(initimage.height * templaterate); fromr.height = initimage.height; tor.x = 0; tor.y = 0; tor.width = ( int )system.math.floor(initimage.height * templaterate); tor.height = initimage.height; } //设置质量 pickedg.interpolationmode = system.drawing.drawing2d.interpolationmode.highqualitybicubic; pickedg.smoothingmode = system.drawing.drawing2d.smoothingmode.highquality; //裁剪 pickedg.drawimage(initimage, tor, fromr, system.drawing.graphicsunit.pixel); //按模版大小生成最终图片 system.drawing.image templateimage = new system.drawing.bitmap(maxwidth, maxheight); system.drawing.graphics templateg = system.drawing.graphics.fromimage(templateimage); templateg.interpolationmode = system.drawing.drawing2d.interpolationmode.high; templateg.smoothingmode = system.drawing.drawing2d.smoothingmode.highquality; templateg.clear(color.white); templateg.drawimage(pickedimage, new system.drawing.rectangle(0, 0, maxwidth, maxheight), new system.drawing.rectangle(0, 0, pickedimage.width, pickedimage.height), system.drawing.graphicsunit.pixel); //关键质量控制 //获取系统编码类型数组,包含了jpeg,bmp,png,gif,tiff imagecodecinfo[] icis = imagecodecinfo.getimageencoders(); imagecodecinfo ici = null ; foreach (imagecodecinfo i in icis) { if (i.mimetype == "image/jpeg" || i.mimetype == "image/bmp" || i.mimetype == "image/png" || i.mimetype == "image/gif" ) { ici = i; } } encoderparameters ep = new encoderparameters(1); ep.param[0] = new encoderparameter(system.drawing.imaging.encoder.quality, ( long )quality); //保存缩略图 templateimage.save(filesaveurl, ici, ep); //templateimage.save(filesaveurl, system.drawing.imaging.imageformat.jpeg); //释放资源 templateg.dispose(); templateimage.dispose(); pickedg.dispose(); pickedimage.dispose(); } } //释放资源 initimage.dispose(); } #endregion #region 等比缩放 /// <summary> /// 图片等比缩放 /// </summary> /// <remarks>吴剑 2012-08-08</remarks> /// <param name="fromfile">原图stream对象</param> /// <param name="savepath">缩略图存放地址</param> /// <param name="targetwidth">指定的最大宽度</param> /// <param name="targetheight">指定的最大高度</param> /// <param name="watermarktext">水印文字(为""表示不使用水印)</param> /// <param name="watermarkimage">水印图片路径(为""表示不使用水印)</param> public static void zoomauto(system.io.stream fromfile, string savepath, system. double targetwidth, system. double targetheight, string watermarktext, string watermarkimage) { //创建目录 string dir = path.getdirectoryname(savepath); if (!directory.exists(dir)) directory.createdirectory(dir); //原始图片(获取原始图片创建对象,并使用流中嵌入的颜色管理信息) system.drawing.image initimage = system.drawing.image.fromstream(fromfile, true ); //原图宽高均小于模版,不作处理,直接保存 if (initimage.width <= targetwidth && initimage.height <= targetheight) { //文字水印 if (watermarktext != "" ) { using (system.drawing.graphics gwater = system.drawing.graphics.fromimage(initimage)) { system.drawing.font fontwater = new font( "黑体" , 10); system.drawing.brush brushwater = new solidbrush(color.white); gwater.drawstring(watermarktext, fontwater, brushwater, 10, 10); gwater.dispose(); } } //透明图片水印 if (watermarkimage != "" ) { if (file.exists(watermarkimage)) { //获取水印图片 using (system.drawing.image wrimage = system.drawing.image.fromfile(watermarkimage)) { //水印绘制条件:原始图片宽高均大于或等于水印图片 if (initimage.width >= wrimage.width && initimage.height >= wrimage.height) { graphics gwater = graphics.fromimage(initimage); //透明属性 imageattributes imgattributes = new imageattributes(); colormap colormap = new colormap(); colormap.oldcolor = color.fromargb(255, 0, 255, 0); colormap.newcolor = color.fromargb(0, 0, 0, 0); colormap[] remaptable = { colormap }; imgattributes.setremaptable(remaptable, coloradjusttype.bitmap); float [][] colormatrixelements = { new float [] {1.0f, 0.0f, 0.0f, 0.0f, 0.0f}, new float [] {0.0f, 1.0f, 0.0f, 0.0f, 0.0f}, new float [] {0.0f, 0.0f, 1.0f, 0.0f, 0.0f}, new float [] {0.0f, 0.0f, 0.0f, 0.5f, 0.0f}, //透明度:0.5 new float [] {0.0f, 0.0f, 0.0f, 0.0f, 1.0f} }; colormatrix wmcolormatrix = new colormatrix(colormatrixelements); imgattributes.setcolormatrix(wmcolormatrix, colormatrixflag. default , coloradjusttype.bitmap); gwater.drawimage(wrimage, new rectangle(initimage.width - wrimage.width, initimage.height - wrimage.height, wrimage.width, wrimage.height), 0, 0, wrimage.width, wrimage.height, graphicsunit.pixel, imgattributes); gwater.dispose(); } wrimage.dispose(); } } } //保存 initimage.save(savepath, system.drawing.imaging.imageformat.jpeg); } else { //缩略图宽、高计算 double newwidth = initimage.width; double newheight = initimage.height; //宽大于高或宽等于高(横图或正方) if (initimage.width > initimage.height || initimage.width == initimage.height) { //如果宽大于模版 if (initimage.width > targetwidth) { //宽按模版,高按比例缩放 newwidth = targetwidth; newheight = initimage.height * (targetwidth / initimage.width); } } //高大于宽(竖图) else { //如果高大于模版 if (initimage.height > targetheight) { //高按模版,宽按比例缩放 newheight = targetheight; newwidth = initimage.width * (targetheight / initimage.height); } } //生成新图 //新建一个bmp图片 system.drawing.image newimage = new system.drawing.bitmap(( int )newwidth, ( int )newheight); //新建一个画板 system.drawing.graphics newg = system.drawing.graphics.fromimage(newimage); //设置质量 newg.interpolationmode = system.drawing.drawing2d.interpolationmode.highqualitybicubic; newg.smoothingmode = system.drawing.drawing2d.smoothingmode.highquality; //置背景色 newg.clear(color.white); //画图 newg.drawimage(initimage, new system.drawing.rectangle(0, 0, newimage.width, newimage.height), new system.drawing.rectangle(0, 0, initimage.width, initimage.height), system.drawing.graphicsunit.pixel); //文字水印 if (watermarktext != "" ) { using (system.drawing.graphics gwater = system.drawing.graphics.fromimage(newimage)) { system.drawing.font fontwater = new font( "宋体" , 10); system.drawing.brush brushwater = new solidbrush(color.white); gwater.drawstring(watermarktext, fontwater, brushwater, 10, 10); gwater.dispose(); } } //透明图片水印 if (watermarkimage != "" ) { if (file.exists(watermarkimage)) { //获取水印图片 using (system.drawing.image wrimage = system.drawing.image.fromfile(watermarkimage)) { //水印绘制条件:原始图片宽高均大于或等于水印图片 if (newimage.width >= wrimage.width && newimage.height >= wrimage.height) { graphics gwater = graphics.fromimage(newimage); //透明属性 imageattributes imgattributes = new imageattributes(); colormap colormap = new colormap(); colormap.oldcolor = color.fromargb(255, 0, 255, 0); colormap.newcolor = color.fromargb(0, 0, 0, 0); colormap[] remaptable = { colormap }; imgattributes.setremaptable(remaptable, coloradjusttype.bitmap); float [][] colormatrixelements = { new float [] {1.0f, 0.0f, 0.0f, 0.0f, 0.0f}, new float [] {0.0f, 1.0f, 0.0f, 0.0f, 0.0f}, new float [] {0.0f, 0.0f, 1.0f, 0.0f, 0.0f}, new float [] {0.0f, 0.0f, 0.0f, 0.5f, 0.0f}, //透明度:0.5 new float [] {0.0f, 0.0f, 0.0f, 0.0f, 1.0f} }; colormatrix wmcolormatrix = new colormatrix(colormatrixelements); imgattributes.setcolormatrix(wmcolormatrix, colormatrixflag. default , coloradjusttype.bitmap); gwater.drawimage(wrimage, new rectangle(newimage.width - wrimage.width, newimage.height - wrimage.height, wrimage.width, wrimage.height), 0, 0, wrimage.width, wrimage.height, graphicsunit.pixel, imgattributes); gwater.dispose(); } wrimage.dispose(); } } } //保存缩略图 newimage.save(savepath, system.drawing.imaging.imageformat.jpeg); //释放资源 newg.dispose(); newimage.dispose(); initimage.dispose(); } } #endregion #region 其它 /// <summary> /// 判断文件类型是否为web格式图片 /// (注:jpg,gif,bmp,png) /// </summary> /// <param name="contenttype">httppostedfile.contenttype</param> /// <returns></returns> public static bool iswebimage( string contenttype) { if (contenttype == "image/pjpeg" || contenttype == "image/jpeg" || contenttype == "image/gif" || contenttype == "image/bmp" || contenttype == "image/png" ) { return true ; } else { return false ; } } #endregion } //end class } |
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持服务器之家。
原文链接:http://www.cnblogs.com/wu-jian/archive/2011/02/21/1959382.html