Go homepage(回首页)
Upload pictures (上传图片)
Write articles (发文字帖)

The author:(作者)delv
published in(发表于) 2014/1/24 9:04:05
asp.net2.0推荐一个功能强大的图片选择控件_[Asp.Net教程]

asp.net2.0推荐一个功能强大的图片选择控件_[Asp.Net教程]

















在做网站的时候,很多情况用到图片上传与选择。FreeTextBox控件里用一个图片选择控件,我觉得很好,就单独拿出来用了。
1、建立TestImgSelect网站,建立images文件夹,在images里建立face文件夹用来存放头像,图片如下:














































5.gif







8.gif







9.gif







10.gif




2、建立user文件夹,在里面建立SelectImage.aspx文件和Default.aspx文件
3、SelectImage.aspx代码如下:







<%@ Page Language="C#" AutoEventWireup="true" CodeFile="SelectImage.aspx.cs" Inherits="user_SelectImage" %>




<BR> 选择图片<BR>






















点击浏览后选择图片,再点击上传你的自定义图像

之后在列表中选择你的自定义图像








onclick="UploadImage_onClick">

onclick="DeleteImage_onClick">

关闭























4、SelectImage.aspx.cs代码如下,注意private string DefaultImageFolder = "images\\face";//图片存放路径:







using System;
using System.Data;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;

public partial class user_SelectImage : System.Web.UI.Page
{
private string NoFileMessage = "未选中任何文件";
private string UploadSuccessMessage = "上传成功";
private string NoImagesMessage = "没有图像";
private string NoFolderSpecifiedMessage = "没有文件夹";
private string NoFileToDeleteMessage = "没有文件可删除";
private string InvalidFileTypeMessage = "不合法的文件类型";
private string BigImgmsg = "图片宽度或长度过大!";
private string BigSizemsg = "图片大小过大!";
private string[] AcceptedFileTypes = new string[] { "jpg", "jpeg", "jpe", "gif", "bmp", "png" };

// Configuration
private bool UploadIsEnabled = true;
private bool DeleteIsEnabled = false;
private string DefaultImageFolder = "images\\face";//图片存放路径
protected void Page_Load(object sender, System.EventArgs e)
{
// 在此处放置用户代码以初始化页面
RootImagesFolder.Value = DefaultImageFolder;
CurrentImagesFolder.Value = DefaultImageFolder;
UploadPanel.Visible = UploadIsEnabled;
DeleteImage.Visible = DeleteIsEnabled;

if (!IsPostBack)
{
DisplayImages();
}
}

protected void UploadImage_onClick(object sender, EventArgs e)
{
if (Page.IsValid)
{
if (CurrentImagesFolder.Value != "")
{
if (UploadFile.PostedFile.FileName.Trim() != "")
{
if (IsValidFileType(UploadFile.PostedFile.FileName))
{
if (this.isBigWidthorHeight(UploadFile.PostedFile.InputStream))
{
if (IsBigSize(UploadFile.PostedFile.ContentLength))
{
try
{
string UploadFileName = "";
string UploadFileDestination = "";
UploadFileName = UploadFile.PostedFile.FileName;
UploadFileName = UploadFileName.Substring(UploadFileName.LastIndexOf("\") + 1);
UploadFileDestination = HttpContext.Current.Request.PhysicalApplicationPath;
UploadFileDestination += CurrentImagesFolder.Value;
UploadFileDestination += "\";
UploadFile.PostedFile.SaveAs(UploadFileDestination + UploadFileName);
ResultsMessage.Text = UploadSuccessMessage;
}
catch
{
ResultsMessage.Text = "未能成功上传,有错误发生";
}
}
else
{
ResultsMessage.Text = this.BigSizemsg;
}
}
else
{
ResultsMessage.Text = this.BigImgmsg;
}
}
else
{
ResultsMessage.Text = InvalidFileTypeMessage;
}
}
else
{
ResultsMessage.Text = NoFileMessage;
}
}
else
{
ResultsMessage.Text = NoFolderSpecifiedMessage;
}
}
else
{
ResultsMessage.Text = InvalidFileTypeMessage;

}
DisplayImages();
}

///


/// 图片是否过高或过宽
///

///
///
private bool isBigWidthorHeight(System.IO.Stream Fs)
{
//判断上传图片的大小,过大的话,不让上传
System.Drawing.Image myImage = System.Drawing.Image.FromStream(Fs);
if (myImage.Width > 130 || myImage.Height > 130)
return false;
else
return true;
}

///
/// 图片是否过大
///

///
///
private bool IsBigSize(int imgSize)
{
if (imgSize > 20 * 1024)
return false;
else
return true;
}

///
/// 删除图像
///

///
///
protected void DeleteImage_onClick(object sender, EventArgs e)
{
if (FileToDelete.Value != "" && FileToDelete.Value != "undefined")
{
try
{
string AppPath = HttpContext.Current.Request.PhysicalApplicationPath;
System.IO.File.Delete(AppPath + CurrentImagesFolder.Value + "\" + FileToDelete.Value);
ResultsMessage.Text = "已经删除: " + FileToDelete.Value;
}
catch
{
ResultsMessage.Text = "未能成功删除,有错误发生.";
}
}
else
{
ResultsMessage.Text = NoFileToDeleteMessage;
}
DisplayImages();
}

private bool IsValidFileType(string FileName)
{
string ext = FileName.Substring(FileName.LastIndexOf(".") + 1, FileName.Length - FileName.LastIndexOf(".") - 1);
for (int i = 0; i < AcceptedFileTypes.Length; i++)
{
if (ext.ToLower() == AcceptedFileTypes[i])
{
return true;

}
}
return false;
}


private string[] ReturnFilesArray()
{
if (CurrentImagesFolder.Value != "")
{
try
{
string AppPath = HttpContext.Current.Request.PhysicalApplicationPath;
string ImageFolderPath = AppPath + CurrentImagesFolder.Value;
string[] FilesArray = System.IO.Directory.GetFiles(ImageFolderPath, "*");
return FilesArray;
}
catch
{

return null;
}
}
else
{
return null;
}

}

private string[] ReturnDirectoriesArray()
{
if (CurrentImagesFolder.Value != "")
{
try
{
string AppPath = HttpContext.Current.Request.PhysicalApplicationPath;
string CurrentFolderPath = AppPath + CurrentImagesFolder.Value;
string[] DirectoriesArray = System.IO.Directory.GetDirectories(CurrentFolderPath, "*");
return DirectoriesArray;
}
catch
{
return null;
}
}
else
{
return null;
}
}


public void DisplayImages()
{
string[] FilesArray = ReturnFilesArray();
string[] DirectoriesArray = ReturnDirectoriesArray();
string AppPath = HttpContext.Current.Request.PhysicalApplicationPath;
string AppUrl;

//Get the application's URL
if (Request.ApplicationPath == "/")
AppUrl = Request.ApplicationPath;
else
AppUrl = Request.ApplicationPath + "/";

GalleryPanel.Controls.Clear();
if ((FilesArray == null || FilesArray.Length == 0) && (DirectoriesArray == null || DirectoriesArray.Length == 0))
{
gallerymessage.Text = NoImagesMessage + ": " + RootImagesFolder.Value;
}
else
{
string ImageFileName = "";
string ImageFileLocation = "";

int thumbWidth = 94;
int thumbHeight = 94;

if (CurrentImagesFolder.Value != RootImagesFolder.Value)
{

System.Web.UI.HtmlControls.HtmlImage myHtmlImage = new System.Web.UI.HtmlControls.HtmlImage();
myHtmlImage.Src = AppUrl + "images/ftb/folder.up.gif";
myHtmlImage.Attributes["unselectable"] = "on";
myHtmlImage.Attributes["align"] = "absmiddle";
myHtmlImage.Attributes["vspace"] = "36";

string ParentFolder = CurrentImagesFolder.Value.Substring(0, CurrentImagesFolder.Value.LastIndexOf("\"));

System.Web.UI.WebControls.Panel myImageHolder = new System.Web.UI.WebControls.Panel();
myImageHolder.CssClass = "imageholder";
myImageHolder.Attributes["unselectable"] = "on";
myImageHolder.Attributes["onclick"] = "divClick(this,'');";
myImageHolder.Attributes["ondblclick"] = "gotoFolder('" + RootImagesFolder.Value + "','" + ParentFolder.Replace("\", "\\") + "');";
myImageHolder.Controls.Add(myHtmlImage);

System.Web.UI.WebControls.Panel myMainHolder = new System.Web.UI.WebControls.Panel();
myMainHolder.CssClass = "imagespacer";
myMainHolder.Controls.Add(myImageHolder);

System.Web.UI.WebControls.Panel myTitleHolder = new System.Web.UI.WebControls.Panel();
myTitleHolder.CssClass = "titleHolder";
myTitleHolder.Controls.Add(new LiteralControl("Up"));
myMainHolder.Controls.Add(myTitleHolder);

GalleryPanel.Controls.Add(myMainHolder);

}

foreach (string _Directory in DirectoriesArray)
{

try
{
string DirectoryName = _Directory.ToString();


System.Web.UI.HtmlControls.HtmlImage myHtmlImage = new System.Web.UI.HtmlControls.HtmlImage();
myHtmlImage.Src = AppUrl + "images/ftb/folder.big.gif";
myHtmlImage.Attributes["unselectable"] = "on";
myHtmlImage.Attributes["align"] = "absmiddle";
myHtmlImage.Attributes["vspace"] = "29";

System.Web.UI.WebControls.Panel myImageHolder = new System.Web.UI.WebControls.Panel();
myImageHolder.CssClass = "imageholder";
myImageHolder.Attributes["unselectable"] = "on";
myImageHolder.Attributes["onclick"] = "divClick(this);";
myImageHolder.Attributes["ondblclick"] = "gotoFolder('" + RootImagesFolder.Value + "','" + DirectoryName.Replace(AppPath, "").Replace("\", "\\") + "');";
myImageHolder.Controls.Add(myHtmlImage);

System.Web.UI.WebControls.Panel myMainHolder = new System.Web.UI.WebControls.Panel();
myMainHolder.CssClass = "imagespacer";
myMainHolder.Controls.Add(myImageHolder);

System.Web.UI.WebControls.Panel myTitleHolder = new System.Web.UI.WebControls.Panel();
myTitleHolder.CssClass = "titleHolder";
myTitleHolder.Controls.Add(new LiteralControl(DirectoryName.Replace(AppPath + CurrentImagesFolder.Value + "\", "")));
myMainHolder.Controls.Add(myTitleHolder);

GalleryPanel.Controls.Add(myMainHolder);
}
catch
{
// nothing for error
}
}

foreach (string ImageFile in FilesArray)
{

try
{

ImageFileName = ImageFile.ToString();
ImageFileName = ImageFileName.Substring(ImageFileName.LastIndexOf("\") + 1);
ImageFileLocation = AppUrl;
ImageFileLocation = ImageFileLocation.Substring(ImageFileLocation.LastIndexOf("\") + 1);
//galleryfilelocation += "/";
ImageFileLocation += CurrentImagesFolder.Value;
ImageFileLocation += "/";
ImageFileLocation += ImageFileName;
System.Web.UI.HtmlControls.HtmlImage myHtmlImage = new System.Web.UI.HtmlControls.HtmlImage();
myHtmlImage.Src = ImageFileLocation;
System.Drawing.Image myImage = System.Drawing.Image.FromFile(ImageFile.ToString());
myHtmlImage.Attributes["unselectable"] = "on";
//myHtmlImage.border=0;

// landscape image
if (myImage.Width > myImage.Height)
{
if (myImage.Width > thumbWidth)
{
myHtmlImage.Width = thumbWidth;
myHtmlImage.Height = Convert.ToInt32(myImage.Height * thumbWidth / myImage.Width);
}
else
{
myHtmlImage.Width = myImage.Width;
myHtmlImage.Height = myImage.Height;
}
// portrait image
}
else
{
if (myImage.Height > thumbHeight)
{
myHtmlImage.Height = thumbHeight;
myHtmlImage.Width = Convert.ToInt32(myImage.Width * thumbHeight / myImage.Height);
}
else
{
myHtmlImage.Width = myImage.Width;
myHtmlImage.Height = myImage.Height;
}
}

if (myHtmlImage.Height < thumbHeight)
{
myHtmlImage.Attributes["vspace"] = Convert.ToInt32((thumbHeight / 2) - (myHtmlImage.Height / 2)).ToString();
}


System.Web.UI.WebControls.Panel myImageHolder = new System.Web.UI.WebControls.Panel();
myImageHolder.CssClass = "imageholder";
myImageHolder.Attributes["onclick"] = "divClick(this,'" + ImageFileName + "');";
myImageHolder.Attributes["ondblclick"] = "returnImage('" + ImageFileLocation.Replace("\", "/") + "','" + myImage.Width.ToString() + "','" + myImage.Height.ToString() + "');";
myImageHolder.Controls.Add(myHtmlImage);


System.Web.UI.WebControls.Panel myMainHolder = new System.Web.UI.WebControls.Panel();
myMainHolder.CssClass = "imagespacer";
myMainHolder.Controls.Add(myImageHolder);

System.Web.UI.WebControls.Panel myTitleHolder = new System.Web.UI.WebControls.Panel();
myTitleHolder.CssClass = "titleHolder";
myTitleHolder.Controls.Add(new LiteralControl(ImageFileName + "
" + myImage.Width.ToString() + "x" + myImage.Height.ToString()));
myMainHolder.Controls.Add(myTitleHolder);

//GalleryPanel.Controls.Add(myImage);
GalleryPanel.Controls.Add(myMainHolder);

myImage.Dispose();
}
catch
{

}
}
gallerymessage.Text = "";
}
}
}





5、Default.aspx代码如下,注意document.getElementById("imgFace")是获得页面中的图片控件ImgFace用来显示选择的结果,document.getElementById("hideImgFace").value存放选择图片的路径







<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="user_Default" %>





无标题页






选择头像


onClick="Button1_Click" />


&nbsp;












6、Default.aspx.cs代码如下,测试获得的图片路径,以方便在不同场合用,注意hideImgFace.Value.Replace("/TestImgSelect","..");中TestImgSelect是自己的网站名称







using System;
using System.Data;
using System.Configuration;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;

public partial class user_Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{

}
protected void Button1_Click(object sender, EventArgs e)
{
Label1.Text = "图片路径:"+hideImgFace.Value+"
相对路径:"+hideImgFace.Value.Replace("/TestImgSelect","..");
}
}




7:运行效果如下,点选择头像,会弹出一个选择图片的窗口,双击图片则头像自动更改




来源:CSDN

























If you have any requirements, please contact webmaster。(如果有什么要求,请联系站长)





QQ:154298438
QQ:417480759