C# 图片浏览上传并形成缩略图

浏览本地图片(支持三种格式：jpg,bmp,gif)，把图片上传到文件夹Photo中，并形成缩略图，存放于文件夹SPhoto中，图片地址保存到数据库中，通过DataList显示图片的缩略图，点击缩略图，可查看其原图。

 

1.前台代码

<form id="form1" runat="server"> <div id="show" style="border: 1px solid black; overflow: auto; width: 688px; height: 274px"> <asp:DataList ID="dlimage" runat="server" RepeatDirection="Horizontal" RepeatColumns="5" Height="200px" Width="661px"> <ItemTemplate> <div style="width: 130px; height: 130px; border: 1px solid gray"> <a href='<%#Eval("Photo")%>' target="_blank"> <asp:Image ID="image" runat="server" ImageUrl='<%# Eval("SPhoto") %>' Width="130px" Height="130px" /> </a> </div> <br /> <asp:Label ID="lblNote" runat="server" Text='<%#Eval("PhotoAbstract")%>'></asp:Label> <br /> <asp:Label ID="lblCreateTime" runat="server" Text='<%#Eval("PhotoCreateTime")%>'></asp:Label> </ItemTemplate> </asp:DataList> </div> <br /> <div> <table style="background-color: #D6DBF7" mce_style="background-color: #D6DBF7"> <tr> <td align="right"> <asp:Label ID="lbPhotoAdd" runat="server" Text="图片："></asp:Label> </td> <td> <asp:FileUpload ID="fudPhoto" runat="server" /> </td> </tr> <tr> <td align="right"> <asp:Label ID="Label2" runat="server" Text="描述："></asp:Label> </td> <td> <asp:TextBox ID="txtPhotoAbstract" runat="server" TextMode="MultiLine" Width="216px" Height="144px"></asp:TextBox> </td> </tr> <tr> <td align="right">   </td> <td> <asp:Button ID="btnUpload" runat="server" Text="上传" OnClick="btnUpload_Click" /> </td> </tr> <tr> <td align="right">   </td> <td> <asp:Label ID="lbMessage" runat="server" Font-Names="华文楷体" Font-Size="Small"></asp:Label> </td> </tr> </table> </div> </form>

2.后台代码

using System; using System.Collections; using System.Configuration; using System.Data; using System.Linq; using System.Web; using System.Web.Security; using System.Web.UI; using System.Web.UI.HtmlControls; using System.Web.UI.WebControls; using System.Web.UI.WebControls.WebParts; using System.Xml.Linq; using System.IO; using System.Drawing; namespace SqlBulkCopyDemo { public partial class test : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) { if(!Page.IsPostBack) Bind(); } #region 图片绑定 private void Bind() { Photo photo = new Photo(); this.dlimage.DataSource = photo.GetPhotoList(3, 3); this.dlimage.DataBind(); this.txtPhotoAbstract.Text = ""; } #endregion #region 上传 protected void btnUpload_Click(object sender, EventArgs e) { //获取FileUpload控件的缓冲区的文件 if (fudPhoto.HasFile) { //获取文件的类型 string fileContentType = fudPhoto.PostedFile.ContentType; string fileName; string fileName_s; string webFilePath; string webFilePath_s; string webFilePath1; string webFilePath_s1; if (fileContentType == "image/bmp" || fileContentType == "image/pjpeg" || fileContentType == "image/gif") { string name = fudPhoto.PostedFile.FileName;//客户端文件路径 FileInfo file = new FileInfo(name); fileName = file.Name; fileName_s = "s_" + file.Name; webFilePath =Server.MapPath("Photo/" + fileName);//服务器端文件路径 webFilePath_s = Server.MapPath("SPhoto/" + fileName_s);//服务器端缩略图路径 //存在数据库中路径 webFilePath1 = "../Photo/" + fileName; webFilePath_s1 = "../SPhoto/" + fileName_s;; //判断文件是否已经上传 if (!File.Exists(webFilePath)) { try { //使用SaveAs方法保存文件 fudPhoto.SaveAs(webFilePath); //生成缩略图方法 MakeThumbnail(webFilePath, webFilePath_s, 130, 130, "Cut"); lbMessage.Text = "提示：文件”" + fileName + "“成功上传，并生成”" + fileName_s + "“缩略图，文件类型为：" + fudPhoto.PostedFile.ContentType + "，文件大小为：" + fudPhoto.PostedFile.ContentLength + "B"; Photo photo = new Photo(); int valbumid = 3; int vPhotoUserID = 3; string vPhotoAbstract = this.txtPhotoAbstract.Text; string vphoto = webFilePath1; string vSPhoto = webFilePath_s1; DateTime vPhotoCreateTime = System.DateTime.Now.ToLocalTime(); photo.Save(valbumid, vPhotoUserID, vPhotoAbstract, vphoto, vSPhoto, vPhotoCreateTime); Bind(); } catch (Exception ex) { lbMessage.Text = "提示：文件上传失败，失败原因：" + ex.Message; } } else { lbMessage.Text = "提示：文件已存在，请重命名后上传"; } } else { lbMessage.Text = "提示：文件类型不符"; } } else { lbMessage.Text = "请选择上传图片！"; } } #endregion /// <summary> /// 生成缩略图 /// </summary> /// <param name="originalImagePath">源图路径（物理路径）</param> /// <param name="thumbnailPath">缩略图路径（物理路径）</param> /// <param name="width">缩略图宽度</param> /// <param name="height">缩略图高度</param> /// <param name="mode">生成缩略图的方式</param> #region 生成缩略图 public static void MakeThumbnail(string originalImagePath, string thumbnailPath, int width, int height, string mode) { //为防止和System.Web.UI.WebControls.Image区别开来，要将命名空间写出来 System.Drawing.Image originalImage = System.Drawing.Image.FromFile(originalImagePath); int towidth = width; int toheight = height; int x = 0; int y = 0; int ow = originalImage.Width; int oh = originalImage.Height; switch (mode) { case "HW": //指定高宽缩放（可能变形） break; case "W": //指定宽，高按比例 toheight = originalImage.Height * width / originalImage.Width; break; case "H": //指定高，宽按比例 towidth = originalImage.Width * height / originalImage.Height; break; case "Cut": //指定高宽裁减（不变形） if (((double)originalImage.Width / (double)originalImage.Height) > ((double)towidth / (double)toheight)) { oh = originalImage.Height; ow = originalImage.Height * towidth / toheight; y = 0; x = (originalImage.Width - ow) / 2; } else { ow = originalImage.Width; oh = originalImage.Width * height / towidth; x = 0; y = (originalImage.Height - oh) / 2; } break; default: break; } //新建一个bmp图片 System.Drawing.Bitmap bitmap = new System.Drawing.Bitmap(towidth, toheight); //新建一个画板 System.Drawing.Graphics g = System.Drawing.Graphics.FromImage(bitmap); //设置高质量插值法 g.InterpolationMode = System.Drawing.Drawing2D.InterpolationMode.High; //设置高质量，低速度呈现平滑程度 g.SmoothingMode = System.Drawing.Drawing2D.SmoothingMode.HighQuality; //清空画布并以透明背景色填充 g.Clear(System.Drawing.Color.Transparent); //在指定位置并且按指定大小绘制原图片的指定部分 g.DrawImage(originalImage, new Rectangle(0, 0, towidth, toheight), new Rectangle(x, y, ow, oh), GraphicsUnit.Pixel); try { //以jpg格式保存缩略图 bitmap.Save(thumbnailPath, System.Drawing.Imaging.ImageFormat.Jpeg); } catch (Exception e) { throw e; } finally { originalImage.Dispose(); bitmap.Dispose(); g.Dispose(); } } #endregion } }

3.所用到的Photo类

 

 

using System; using System.Data; using System.Configuration; using System.Web; using System.Web.Security; using System.Web.UI; using System.Web.UI.HtmlControls; using System.Web.UI.WebControls; using System.Web.UI.WebControls.WebParts; using System.Data.SqlClient; using System.Text; /// <summary> ///Photo 的摘要说明 /// </summary> public class Photo { public Photo() { // //TODO: 在此处添加构造函数逻辑 // } string connectionString = "Data Source=(local); Initial Catalog=Blog;User ID=sa;Password=sa; Persist Security Info=False"; #region 获取照片信息 public DataTable GetPhotoList(int userId, int albumId) { using (SqlConnection conn = new SqlConnection(connectionString)) { string sql = "select PhotoAbstract,SPhoto,Photo,PhotoCreateTime from Blog_Photo where PhotoUserID=" + userId + " and AlbumID=" + albumId; DataSet ds = new DataSet(); try { SqlDataAdapter sda = new SqlDataAdapter(sql, conn); sda.Fill(ds, "0"); } catch (Exception ex) { HttpContext.Current.Response.Write("<mce:script language=/"/"><!-- window.alert(/"" + ex.Message.ToString() + "/"); // --></mce:script>"); } return ds.Tables[0]; } } #endregion #region 保存照片信息 public void Save(int vAlbumID, int vPhotoUserID, string vPhotoAbstract, string vPhoto, string vSPhoto, DateTime vPhotoCreateTime) { SqlConnection conn = new SqlConnection(connectionString); conn.Open(); string sql = "insert into Blog_Photo (AlbumID,PhotoUserID,PhotoAbstract,Photo,SPhoto,PhotoCreateTime) " + " values('" + vAlbumID + "','" + vPhotoUserID + "','" + vPhotoAbstract + "','" + vPhoto + "','" + vSPhoto + "','" + vPhotoCreateTime + "')"; SqlCommand cmd = new SqlCommand(sql, conn); try { cmd.ExecuteNonQuery(); } catch (Exception ex) { HttpContext.Current.Response.Write("<mce:script language=/"/"><!-- window.alert(/"" + ex.Message.ToString() + "/"); // --></mce:script>"); } finally { conn.Close(); } } #endregion #region 删除照片信息 public void Delete(int vPhotoID) { SqlConnection conn = new SqlConnection(connectionString); conn.Open(); string sql = "delete from Blog_Photo where PhotoID=" + vPhotoID; SqlCommand cmd = new SqlCommand(sql, conn); try { cmd.ExecuteNonQuery(); } catch (Exception ex) { HttpContext.Current.Response.Write("<mce:script language=/"/"><!-- window.alert(/"" + ex.Message.ToString() + "/"); // --></mce:script>"); } finally { conn.Close(); } } #endregion }

注：

（1）Photo文件夹和SPhoto文件夹的创建

 

 

（2）所用数据库表

 

（3）效果图