前段時間,寫了個專門用來縮略和水印圖片的! 后來在實際運用中,發現了好多不足地方,后來對進行了一些優化.
今天整理了一下,算是筆記吧!
這里呢!簡單演示一下,從上傳、剪輯、縮略、水印的整個流程,希望大家多多指出缺點:
這里我是C#MVC3.0進行演示的:
上傳

頁面端:
@using (Html.BeginForm("uploadfile", "template", FormMethod.Post, new { id = "submitform", enctype = "multipart/form-data" }))
{
<input type="file" name="pic"/>
<input type="button" value="提交" onclick="submitformkkk();"/>
}
<script src="/scripts/jquery-1.4.4.min.js" type="text/javascript"></script>
<script src="/scripts/jquery.form.js" type="text/javascript"></script>
<script type="text/javascript">
function submitformkkk() {
$("#submitform").ajaxSubmit({
success: function (responseText) {
$("#photo").attr("src", responseText);
}
});
}
</script>
控制器Action:
public ActionResult Uploadfile()
{
//上傳文件
HttpPostedFileBase hp = Request.Files["pic"];
string waring = ""; //上傳警告信息
string savepath = ImageDealLib.uploadbystream(hp.InputStream, "/images/", out waring);
return Content(savepath);----返回給頁面剪輯圖片使用
}
剪輯圖片

頁面端:
<link href="/scripts/jquery.imgareaselect-0.9.8/css/imgareaselect-default.css" rel="stylesheet" type="text/css" />
<script src="/scripts/jquery-1.4.4.min.js" type="text/javascript"></script>
<script src="/scripts/jquery.imgareaselect-0.9.8/scripts/jquery.imgareaselect.pack.js" type="text/javascript"></script>
<img src="" id="photo" alt="" style=" cursor:move"/> ---->上傳成功后,原圖展示
<img src="" id="photo2" alt=""/> ----->剪輯成功后,效果展示
<script type="text/javascript">
$(document).ready(function () {
$('#photo').imgAreaSelect({
fadeSpeed: 500,
autoHide: false,
handles: true,
persistent: false,
onSelectEnd: function (img, selection) {
var x1, y1, xwidth, yheight, spath;
x1 = selection.x1;
y1 = selection.y1;
xwidth = selection.width;
yheight = selection.height;
picpath = $("#photo").attr("src");
$.post("/template/crop", { x1: x1, y1: y1, width: xwidth, height: yheight, picpath: picpath }, function (url) {
$("#photo2").attr("src", url + "?" + Math.random());
})
}
});
});
</script>
控制器Action:
[HttpPost]
public ActionResult Crop(FormCollection collection)
{
int x1=int.Parse(collection["x1"]);
int y1 = int.Parse(collection["y1"]);
int width = int.Parse(collection["width"]);
int height = int.Parse(collection["height"]);
string picpath = collection["picpath"];
string warning = ""; //剪輯警告信息
string d = ImageDealLib.imgcrop(picpath, "/images/", x1, y1, width, height, ImageDealLib.FileCache.Save, out warning);
return Content(d);
}
為了滿足網站不同尺寸圖片展示需要,提供圖片縮略和水印,假設,經上面2步處理后的圖片保存地址已確定,這里假定為
string savepath
下面進行縮略、水印:

string warning="";
string suoluepic= ImageDealLib.Resizepic(savepath, ImageDealLib.ResizeType.XY, "/images/", ImageDealLib.ImageType.JPEG, 1280, 800, ImageDealLib.FileCache.Save, out warning);
string waterpic = ImageDealLib.makewatermark(suoluepic, "/images/w.png", ImageDealLib.WaterType.Random, "/images/", ImageDealLib.ImageType.JPEG, ImageDealLib.FileCache.Save, out warning2);
OK,完成! 下面附上核心處理源碼:
commonfun.cs 公用函數

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Web;
using System.IO;
namespace ImgClassLib
{
/// <summary>
/// 公用函數
/// </summary>
public partial class ImageDealLib
{
/// <summary>
/// 根據文件路徑判斷文件是否存在
/// </summary>
/// <param name="filepath">文件路徑</param>
/// <param name="model">返回模式,m:返回map地址不檢查文件是否存在,c:檢測文件是否存在,並返回map地址</param>
/// <param name="mappath">map路徑</param>
/// <returns></returns>
public static bool FileExistMapPath(string filepath, FileCheckModel model, out string mappath)
{
bool checkresult = false;
switch (model)
{
case FileCheckModel.M:
mappath = HttpContext.Current.Server.MapPath(filepath);
checkresult = true;
break;
case FileCheckModel.C:
if (File.Exists(System.Web.HttpContext.Current.Server.MapPath(filepath)))
{
mappath = HttpContext.Current.Server.MapPath(filepath);
checkresult = true;
}
else
{
mappath = null;
checkresult = false;
}
break;
default:
mappath = "";
checkresult = false;
break;
}
return checkresult;
}
/// <summary>
/// 圖片保存類型
/// JPEG:.jpg格式;
/// GIF:.gif格式;
/// PNG:.png格式;
/// </summary>
public enum ImageType
{
JPEG,
GIF,
PNG
}
/// <summary>
/// 水印模式
/// Center:中間;
/// CenterUp:中上;
/// CenterDown:中下;
/// LeftUp:左上;
/// LeftDown:左下;
/// RightUp:右上;
/// RightDown:右下;
/// Random:隨機;
/// </summary>
public enum WaterType
{
Center,
CenterUp,
CenterDown,
LeftUp,
LeftDown,
RightUp,
RightDown,
Random
}
/// <summary>
/// 縮略模式
/// X--按寬度縮放,高着寬比例;
/// Y--按高度縮放,寬着寬比例;
/// XY--按給定mwidth,mheight(此模式mwidth,mheight為必須值)進行縮略;
/// </summary>
public enum ResizeType
{
X,
Y,
XY
}
/// <summary>
/// 文件檢測模式
/// M:不檢測文件是否存在,返回ServerMapPath;
/// C:檢測文件是否存在,返回ServerMapPath;
/// </summary>
public enum FileCheckModel
{
M,
C
}
/// <summary>
/// 原圖文件是否保存
/// Delete:保存
/// Save:不保存,刪除
/// </summary>
public enum FileCache
{
Save,
Delete
}
}
}
imgcrop.cs 圖片剪輯

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Drawing;
namespace ImgClassLib
{
public partial class ImageDealLib
{
public static string lastcroppic = "";//上一張已剪切生成的文件名
public static string diffpicpath = "";//上一張要被剪切的原圖地址
/// <summary>
/// 圖片剪切
/// </summary>
/// <param name="picpath">源圖片文件地址</param>
/// <param name="spath">剪切臨時文件地址</param>
/// <param name="x1">x起始坐標</param>
/// <param name="y1">y起始坐標</param>
/// <param name="width">寬度</param>
/// <param name="height">高度</param>
/// <param name="filecache">源文件處理方式</param>
/// <param name="warning">處理警告信息</param>
/// <returns>剪切圖片地址</returns>
public static string imgcrop(string picpath, string spath, int x1, int y1, int width, int height, FileCache filecache,out string warning)
{
//反饋信息
System.Text.StringBuilder checkmessage = new System.Text.StringBuilder();
//從指定源圖片,創建image對象
string _sourceimg_common_mappath = "";
//檢測源文件
bool checkfile = false;
checkfile = FileExistMapPath(picpath, FileCheckModel.C, out _sourceimg_common_mappath);
System.Drawing.Image _sourceimg_common = null;
System.Drawing.Bitmap _currimg_common = null;
System.Drawing.Graphics _g_common = null;
if (checkfile == true)
{
//從源文件創建imgage
_sourceimg_common = System.Drawing.Image.FromFile(_sourceimg_common_mappath);
//從指定width、height創建bitmap對象
_currimg_common = new System.Drawing.Bitmap(width, height);
//從_currimg_common創建畫筆
_g_common = Graphics.FromImage(_currimg_common);
//設置畫筆
_g_common.CompositingMode = System.Drawing.Drawing2D.CompositingMode.SourceOver;
_g_common.InterpolationMode = System.Drawing.Drawing2D.InterpolationMode.HighQualityBicubic;
_g_common.PixelOffsetMode = System.Drawing.Drawing2D.PixelOffsetMode.Half;
//繪制圖片
_g_common.DrawImage(_sourceimg_common, new Rectangle(0, 0, width, height), new Rectangle(x1, y1, width, height), GraphicsUnit.Pixel);
//保存圖片
string _spath_common_mappath = "";
//判斷是否是對同一張圖片進行剪切
//判斷是否,已更新剪切圖片,防止覆蓋上一張已完成剪切的圖片
spath = string.IsNullOrEmpty(lastcroppic) ? spath + Guid.NewGuid().ToString() + ".jpg" : (diffpicpath == picpath ? lastcroppic : spath + Guid.NewGuid().ToString() + ".jpg");
lastcroppic = spath;
diffpicpath = picpath;
FileExistMapPath(spath, FileCheckModel.M, out _spath_common_mappath);
_currimg_common.Save(_spath_common_mappath, System.Drawing.Imaging.ImageFormat.Jpeg);
//釋放
_sourceimg_common.Dispose();
_currimg_common.Dispose();
_g_common.Dispose();
//處理原文件
int filecachecode = filecache.GetHashCode();
//文件緩存方式:Delete,刪除原文件
if (filecachecode == 1)
{
System.IO.File.Delete(_sourceimg_common_mappath);
}
//返回相對虛擬路徑
warning = "";
return spath;
}
checkmessage.Append("error:未能找到剪切原圖片;");
warning = checkmessage.ToString().TrimEnd(';');
return "";
}
}
}
skeletonize.cs 圖片縮略

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Web;
using System.Drawing;
using System.IO;
namespace ImgClassLib
{
/// <summary>
/// 圖片處理:縮略圖片
/// </summary>
public partial class ImageDealLib
{
/// <summary>
/// 根據指定:縮略寬、高,縮略圖片並保存
/// 返回圖片虛擬路徑,和一個警告信息,可根據此信息獲取圖片合成信息
/// </summary>
/// <param name="picpath">原圖路徑</param>
/// <param name="model">縮略模式[X,Y,XY](默認XY模式)</param>
/// <param name="spath">文件保存路徑(默認跟路徑)</param>
/// <param name="imgtype">圖片保存類型</param>
/// <param name="mwidth">縮略寬度(默認原圖高度)</param>
/// <param name="mheight">縮略高度(默認原圖高度)</param>
/// <param name="filecache">原文件處理方式</param>
/// <param name="warning">處理警告信息</param>
/// <returns>錯誤,返回錯誤信息;成功,返回圖片路徑</returns>
public static string Resizepic(string picpath, ResizeType model, string spath, ImageType imgtype, double? mwidth, double? mheight, FileCache filecache, out string warning)
{
//反饋信息
System.Text.StringBuilder checkmessage = new System.Text.StringBuilder();
//文件保存路徑
spath = string.IsNullOrEmpty(spath) ? "/" : spath;
//縮略寬度
double swidth = mwidth.HasValue ? double.Parse(mwidth.ToString()) : 0;
//縮略高度
double sheight = mheight.HasValue ? double.Parse(mheight.ToString()) : 0;
//從指定源圖片,創建image對象
string _sourceimg_common_mappath = "";
//檢測源文件
bool checkfile = false;
checkfile=FileExistMapPath(picpath,FileCheckModel.C, out _sourceimg_common_mappath);
System.Drawing.Image _sourceimg_common=null;
System.Drawing.Bitmap _currimg_common = null;
System.Drawing.Graphics _g_common = null;
if (checkfile == true)
{
//從源文件創建imgage
_sourceimg_common = System.Drawing.Image.FromFile(_sourceimg_common_mappath);
#region 縮略模式
//縮略模式
switch (model)
{
case ResizeType.X:
#region X模式
//根據給定尺寸,獲取繪制比例
double _width_scale = swidth / _sourceimg_common.Width;
//高着比例
sheight = _sourceimg_common.Height * _width_scale;
#endregion
; break;
case ResizeType.Y:
#region Y模式
//根據給定尺寸,獲取繪制比例
double _height_scale = sheight / _sourceimg_common.Height;
//寬着比例
swidth = _sourceimg_common.Width * _height_scale;
#endregion
; break;
case ResizeType.XY:
#region XY模式
//當選擇XY模式時,mwidth,mheight為必須值
if (swidth < 0 || sheight < 0)
{
checkmessage.Append("error:XY模式,mwidth,mheight為必須值;");
}
#endregion
; break;
default:
#region 默認XY模式
//當默認XY模式時,mwidth,mheight為必須值
if (swidth < 0 || sheight < 0)
{
checkmessage.Append("error:你當前未選擇縮略模式,系統默認XY模式,mwidth,mheight為必須值;");
}
; break;
#endregion
}
#endregion
}
else
{
checkmessage.Append("error:未能找到縮略原圖片," + picpath + ";");
}
if (string.IsNullOrEmpty(checkmessage.ToString()))
{
//創建bitmap對象
_currimg_common = new System.Drawing.Bitmap((int)swidth, (int)sheight);
_g_common = Graphics.FromImage(_currimg_common);
//設置畫筆
_g_common.CompositingMode = System.Drawing.Drawing2D.CompositingMode.SourceOver;
_g_common.InterpolationMode = System.Drawing.Drawing2D.InterpolationMode.HighQualityBicubic;
_g_common.PixelOffsetMode = System.Drawing.Drawing2D.PixelOffsetMode.Half;
//繪制圖片
_g_common.DrawImage(_sourceimg_common, new Rectangle(0, 0, (int)swidth, (int)sheight), new Rectangle(0, 0, _sourceimg_common.Width, _sourceimg_common.Height), GraphicsUnit.Pixel);
//保存圖片
string _spath_common_mappath = "";
//獲取圖片類型的hashcode值,生成圖片后綴名
int extro = imgtype.GetHashCode();
string extend = extro == 0 ? ".jpg" : (extro == 1 ? ".gif" : (extro == 2 ? ".png" : ".jpg"));
//全局文件名
spath = spath + Guid.NewGuid().ToString() + extend;
FileExistMapPath(spath,FileCheckModel.M, out _spath_common_mappath);
switch (imgtype)
{
case ImageType.JPEG: _currimg_common.Save(_spath_common_mappath, System.Drawing.Imaging.ImageFormat.Jpeg); break;
case ImageType.GIF: _currimg_common.Save(_spath_common_mappath, System.Drawing.Imaging.ImageFormat.Gif); break;
case ImageType.PNG: _currimg_common.Save(_spath_common_mappath, System.Drawing.Imaging.ImageFormat.Png); break;
}
//釋放
_sourceimg_common.Dispose();
_currimg_common.Dispose();
_g_common.Dispose();
//處理原文件
int filecachecode = filecache.GetHashCode();
//文件緩存方式:Delete,刪除原文件
if (filecachecode == 1)
{
System.IO.File.Delete(_sourceimg_common_mappath);
}
//返回相對虛擬路徑
warning = "";
return spath;
}
//釋放
if (_sourceimg_common != null)
{
_sourceimg_common.Dispose();
}
if (_currimg_common!=null)
{
_currimg_common.Dispose();
}
if (_g_common != null)
{
_g_common.Dispose();
}
warning = checkmessage.ToString().TrimEnd(';');
return "";
}
}
}
uploadfile.cs 圖片上傳

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.IO;
namespace ImgClassLib
{
/// <summary>
/// 上傳文件
/// </summary>
public partial class ImageDealLib
{
/// <summary>
/// 使用流方式,上傳並保存文件
/// </summary>
/// <param name="s">文件流</param>
/// <param name="savepath">保存文件路徑</param>
/// <param name="warning">處理警告信息,若為空,則處理成功</param>
/// <returns>返回文件保存完整路徑</returns>
public static string uploadbystream(Stream s,string savepath,out string warning)
{
int be = 0;
if (s.Length > 0)
{
MemoryStream ms = new MemoryStream();
while((be=s.ReadByte())!=-1)
{
ms.WriteByte((byte)be);
}
string newpath = savepath+DateTime.Now.ToString("yyyyMMddHHmmss") + ".jpg";
string lastpath="";
FileExistMapPath(newpath,FileCheckModel.M, out lastpath);
FileStream fs=new FileStream(lastpath,FileMode.Create);
ms.WriteTo(fs);
//釋放
ms.Dispose();
fs.Dispose();
warning = "";
return newpath;
}
warning = "error";
return "";
}
}
}
watermark.cs 圖片水印

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Web;
using System.IO;
using System.Drawing;
namespace ImgClassLib
{
/// <summary>
/// 圖片處理:水印圖片
/// </summary>
public partial class ImageDealLib
{
/// <summary>
/// 水印圖片
/// 【如果圖片需要縮略,請使用skeletonize.Resizepic()方法對圖片進行縮略】
/// 返回圖片虛擬路徑,和一個警告信息,可根據此信息獲取圖片合成信息
/// </summary>
/// <param name="picpath">需要水印的圖片路徑</param>
/// <param name="waterspath">水印圖片路徑</param>
/// <param name="watermodel">水印模式</param>
/// <param name="spath">文件保存路徑</param>
/// <param name="imgtype">保存文件類型</param>
/// <param name="filecache">原文件處理方式</param>
/// <param name="warning">處理警告信息</param>
/// <returns>錯誤,返回錯誤信息;成功,返回圖片路徑</returns>
public static string makewatermark(string picpath, string waterspath, WaterType watermodel, string spath, ImageType imgtype,FileCache filecache, out string warning)
{
#region
//反饋信息
System.Text.StringBuilder checkmessage = new System.Text.StringBuilder();
//檢測源文件
string _sourceimg_common_mappath = "";
bool checkfile = false;
//檢測水印源文件
string _sourceimg_water_mappath = "";
bool checkfilewater = false;
checkfile = FileExistMapPath(picpath,FileCheckModel.C, out _sourceimg_common_mappath);
checkfilewater = FileExistMapPath(waterspath, FileCheckModel.C, out _sourceimg_water_mappath);
System.Drawing.Image _sourceimg_common = null;
System.Drawing.Image _sourceimg_water = null;
if (checkfile == true)
{
//從指定源文件,創建image對象
_sourceimg_common = System.Drawing.Image.FromFile(_sourceimg_common_mappath);
}
else
{
checkmessage.Append("error:找不到需要的水印圖片!" + picpath + ";");
}
if (checkfilewater == true)
{
//從指定源文件,創建image對象
_sourceimg_water = System.Drawing.Image.FromFile(_sourceimg_water_mappath);
}
else
{
checkmessage.Append("error:找不到需要水印圖片!" + waterspath + ";");
}
#endregion
#region
if (string.IsNullOrEmpty(checkmessage.ToString()))
{
//源圖寬、高
int _sourceimg_common_width =_sourceimg_common.Width;
int _sourceimg_common_height = _sourceimg_common.Height;
//水印圖片寬、高
int _sourceimg_water_width = _sourceimg_water.Width;
int _sourceimg_water_height =_sourceimg_water.Height;
#region 水印坐標
//水印坐標
int _sourceimg_water_point_x = 0;
int _sourceimg_water_point_y = 0;
switch (watermodel)
{
case WaterType.Center:
_sourceimg_water_point_x = (_sourceimg_common_width - _sourceimg_water_width) / 2;
_sourceimg_water_point_y = (_sourceimg_common_height - _sourceimg_water_height) / 2;
; break;
case WaterType.CenterDown:
_sourceimg_water_point_x = (_sourceimg_common_width - _sourceimg_water_width) / 2;
_sourceimg_water_point_y = _sourceimg_common_height - _sourceimg_water_height;
; break;
case WaterType.CenterUp:
_sourceimg_water_point_x = (_sourceimg_common_width - _sourceimg_water_width) / 2;
_sourceimg_water_point_y = 0;
; break;
case WaterType.LeftDown:
_sourceimg_water_point_x = 0;
_sourceimg_water_point_y = _sourceimg_common_height - _sourceimg_water_height;
; break;
case WaterType.LeftUp:
; break;
case WaterType.Random:
Random r = new Random();
int x_random = r.Next(0, _sourceimg_common_width);
int y_random = r.Next(0, _sourceimg_common_height);
_sourceimg_water_point_x = x_random > (_sourceimg_common_width - _sourceimg_water_width)
? _sourceimg_common_width - _sourceimg_water_width : x_random;
_sourceimg_water_point_y = y_random > (_sourceimg_common_height - _sourceimg_water_height)
? _sourceimg_common_height - _sourceimg_water_height : y_random;
; break;
case WaterType.RightDown:
_sourceimg_water_point_x = _sourceimg_common_width - _sourceimg_water_width;
_sourceimg_water_point_y = _sourceimg_common_height - _sourceimg_water_height;
; break;
case WaterType.RightUp:
_sourceimg_water_point_x = _sourceimg_common_width - _sourceimg_water_width;
_sourceimg_water_point_y = 0;
; break;
}
#endregion
//從源圖創建畫板
System.Drawing.Graphics _g_common = Graphics.FromImage(_sourceimg_common);
//設置畫筆
_g_common.CompositingMode = System.Drawing.Drawing2D.CompositingMode.SourceOver;
_g_common.InterpolationMode = System.Drawing.Drawing2D.InterpolationMode.HighQualityBicubic;
_g_common.PixelOffsetMode = System.Drawing.Drawing2D.PixelOffsetMode.Half;
//繪制水印圖片
_g_common.DrawImage(_sourceimg_water, new Rectangle(_sourceimg_water_point_x, _sourceimg_water_point_y, _sourceimg_water_width, _sourceimg_water_height), new Rectangle(0, 0, _sourceimg_water_width, _sourceimg_water_height), GraphicsUnit.Pixel);
//保存圖片
string _spath_common_mappath = "";
//全局文件名
//獲取圖片類型的hashcode值,生成圖片后綴名
int extro = imgtype.GetHashCode();
string extend = extro == 0 ? ".jpg" : (extro == 1 ? ".gif" : (extro == 2 ? ".png" : ".jpg"));
spath = spath + Guid.NewGuid().ToString() + extend;
FileExistMapPath(spath,FileCheckModel.M, out _spath_common_mappath);
switch (imgtype)
{
case ImageType.JPEG: _sourceimg_common.Save(_spath_common_mappath, System.Drawing.Imaging.ImageFormat.Jpeg); break;
case ImageType.GIF: _sourceimg_common.Save(_spath_common_mappath, System.Drawing.Imaging.ImageFormat.Gif); break;
case ImageType.PNG: _sourceimg_common.Save(_spath_common_mappath, System.Drawing.Imaging.ImageFormat.Png); break;
}
//釋放
_sourceimg_common.Dispose();
_sourceimg_water.Dispose();
_g_common.Dispose();
//處理原文件
int filecachecode = filecache.GetHashCode();
//刪除原文件
if (filecachecode == 1)
{
System.IO.File.Delete(_sourceimg_common_mappath);
}
warning = "";
return spath;
}
#endregion
//釋放
if (_sourceimg_common != null)
{
_sourceimg_common.Dispose();
}
if (_sourceimg_water!=null)
{
_sourceimg_water.Dispose();
}
warning = checkmessage.ToString().TrimEnd(';');
return "";
}
}
}
希望大家多多指正!
【
有些朋友在實際使用中,遇到一些問題,特整理了一下項目工程,並簡單寫了一個demo
里面采用的模式是簡單處理的,如果想盡可能減小WEB空間的占用,
可將頁面的剪輯預覽改為div+css控制坐標及范圍顯示,然后采用縮略、水印一鍵處理的方式,這樣只會保存一張圖片
需要源碼的請貼上郵箱地址,我會盡快處理,或者加博客頭處QQ群文件分享自行下載(IMAGE_LIR2014優化)】
【轉載還是引用一下,本文地址吧,有些網站轉得,本人都看不下去了,雖然不是啥很檔次的東西,相互尊重勞動成果,你說是吧】
工程操作界面及效果預覽:
【2014年初不忙,回頭看看自己曾經寫的代碼,表示很多地方需要優化,以前只能適用於WEB,目前已經優化第一次了在處理部分可以CS適用】