日期:2014-05-17  浏览次数:20606 次

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'>&nbsp;</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 "图片格式不正确";