ASP.NET图片等比例显示的问题
如题。一个固定大小(有初始化大小)的图片框控件要显示图片经常是将图片铺满显示,这样对一些和图片框大小不同比例的图片来说会出现变形,请问我该如何让图片全部显示但让图片保持原比例呢?可以等比例缩放,但不要变形。(类似桌面背景图片的显示方式:平铺、拉伸、居中。我要的是居中效果!)
注:WinForm里面的图片框就有mode模式,里面就能实现这个效果!
PS:缩略图技术试过了,不行,这样只是让图片等比例缩放,显示的时候还是会铺满图片框!
最好有例子,或者代码段,谢谢!
------解决方案--------------------js图片等比缩放
http://www.cnblogs.com/aqiang/archive/2008/05/08/1188728.html
<script language="JavaScript" type="text/javascript">
<!--
function DrawImage(ImgD,FitWidth,FitHeight){
var image=new Image();
image.src=ImgD.src;
if(image.width>0 && image.height>0){
if(image.width/image.height>= FitWidth/FitHeight){
if(image.width>FitWidth){
ImgD.width=FitWidth;
ImgD.height=(image.height*FitWidth)/image.width;
}else{
ImgD.width=image.width;
ImgD.height=image.height;
}
} else{
if(image.height>FitHeight){
ImgD.height=FitHeight;
ImgD.width=(image.width*FitHeight)/image.height;
}else{
ImgD.width=image.width;
ImgD.height=image.height;
}
}
}
}
//-->
</script>
<img src="XXXX" alt="自动缩放后的效果" onload="javascript:DrawImage(this,"200","200");" />
图片外边框
<table width='150' height='150' border='0' cellpadding='0' cellspacing='0' style='border: 1px solid #666666; display:block; width:150px; height:150px;padding:50px;'>
<tr>
<td width='300' height='68' align='center'> </td>
</tr>
</table>
------解决方案--------------------比较简便的asp.net缩略图方法是GetThumbnailImage();
但生成的图片质量不太好.
更多是使用System.Drawing.Graphics的DrawImage()方法来生成缩略图
下面转一个示例代码,注意此例为了追求高质量,在原图与最终缩略图之间,还生成了一个"中间图片",你可以去掉中间图的处理,直接生成缩略图。
System.Drawing.Graphics的DrawImage()很强大,可以实现在原图两边或上下填充像素来保持图片比例,也可以截去原图上下或左右部分像素来实现图片不变形。
还可以设定DrawImage()参数,来选定原图中的指定部分(就好比用鼠标在原图上任意圈选一个方块区域)用于生成缩略图。
可以参考http://msdn.microsoft.com/zh-cn/library/system.drawing.graphics.drawimage(VS.80).aspx
C# code
代码如下:
/// <summary>
/// asp.net上传图片并生成缩略图
/// </summary>
/// <param name="upImage">HtmlInputFile控件</param>
/// <param name="sSavePath">保存的路径,些为相对服务器路径的下的文件夹</param>
/// <param name="sThumbExtension">缩略图的thumb</param>
/// <param name="intThumbWidth">生成缩略图的宽度</param>
/// <param name="intThumbHeight">生成缩略图的高度</param>
/// <returns>缩略图名称</returns>
public string UpLoadImage(HtmlInputFile upImage, string sSavePath, string sThumbExtension, int intThumbWidth, int intThumbHeight)
{
string sThumbFile = "";
string sFilename = "";
if (upImage.PostedFile != null)
{
HttpPostedFile myFile = upImage.PostedFile;
int nFileLen = myFile.ContentLength;
if (nFileLen == 0)
return "没有选择上传图片";
//获取upImage选择文件的扩展名
string extendName = System.IO.Path.GetExtension(myFile.FileName).ToLower();
//判断是否为图片格式
if (extendName != ".jpg" && extendName != ".jpge" && extendName != ".gif" && extendName != ".bmp" && extendName != ".png")
return "图片格式不正确";