Velocity Reviews > How to keep aspect ratio of image inside an ImageButton control?

# How to keep aspect ratio of image inside an ImageButton control?

Arthur Hsu
Guest
Posts: n/a

 12-07-2004
Hello,

I have an ImageButton that refers to an external image. How can I keep that
image's aspect ratio when I set the ImageButton's size to 120x120?

TIA,

Arthur

Alex
Guest
Posts: n/a

 12-07-2004
You could try something like this...

/// <summary>
/// Crop the image if it is too big.
/// </summary>
/// <param name="bmp"></param>
/// <returns></returns>
protected System.Drawing.Bitmap Crop( System.Drawing.Bitmap bmp ){

System.Drawing.Image imgPhoto = (System.Drawing.Image)bmp;
int Width = 100;
int Height = 100;
int sourceWidth = imgPhoto.Width;
int sourceHeight = imgPhoto.Height;
int sourceX = 0;
int sourceY = 0;
int destX = 0;
int destY = 0;

float nPercent = 0;
float nPercentW = 0;
float nPercentH = 0;

nPercentW = ((float)Width/(float)sourceWidth);
nPercentH = ((float)Height/(float)sourceHeight);

if(nPercentH < nPercentW) {
nPercent = nPercentW;
destY = (int)((Height - (sourceHeight * nPercent))/2);
}
else {
nPercent = nPercentH;
destX = (int)((Width - (sourceWidth * nPercent))/2);
}

int destWidth = (int)(sourceWidth * nPercent);
int destHeight = (int)(sourceHeight * nPercent);

Bitmap bmPhoto = new Bitmap(Width,
Height, System.Drawing.Imaging.PixelFormat.Format24bppRgb) ;
bmPhoto.SetResolution(imgPhoto.HorizontalResolutio n,
imgPhoto.VerticalResolution);

Graphics grPhoto = Graphics.FromImage(bmPhoto);
grPhoto.Clear(System.Drawing.Color.White);
grPhoto.InterpolationMode =
System.Drawing.Drawing2D.InterpolationMode.HighQua lityBicubic;

grPhoto.DrawImage(imgPhoto,
new Rectangle(destX,destY,destWidth,destHeight),
new Rectangle(sourceX,sourceY,sourceWidth,sourceHeight ),
GraphicsUnit.Pixel);

grPhoto.Dispose();

// delete the previous user's avatar, both *.jpg and *.gif
if( File.Exists( Page.Server.MapPath(Page.Request.ApplicationPath) +
"UserIcons\\" + EditUser.Username + ".jpg") ){
System.IO.File.Delete( Page.Server.MapPath(Page.Request.ApplicationPath)
+ "UserIcons\\" + EditUser.Username + ".jpg" );
}
if( File.Exists( Page.Server.MapPath(Page.Request.ApplicationPath) +
"UserIcons\\" + EditUser.Username + ".gif") ){
System.IO.File.Delete( Page.Server.MapPath(Page.Request.ApplicationPath)
+ "UserIcons\\" + EditUser.Username + ".gif" );
}
return bmPhoto;
}

--
Alex Mueller
"Arthur Hsu" <(E-Mail Removed)> wrote in message
news:%23ekiFV\$(E-Mail Removed)...
> Hello,
>
> I have an ImageButton that refers to an external image. How can I keep

that
> image's aspect ratio when I set the ImageButton's size to 120x120?
>
> TIA,
>
> Arthur
>
>

Steven Cheng[MSFT]
Guest
Posts: n/a

 12-07-2004
Hi Arthur,

Thanks for your posting. If the external image is in your own
application(site) or is dynamically generatecd by your self , you can use
GDI+ to adjust the image. As Alex has provided some code snippet on this.
And I think you can also consider using a custom HTTPHandler which return
the image resource dynamically , here is a good tech article discussing on
this:

#Using ASP.NET HTTP Handlers to create a photo album
http://www.microsoft.com/belux/nl/ms...et/httphandler.
mspx

Otherwise, if the image is on a external remote site which can't be
controled by ourselve , we can't do anything on the image since the image
is acutally loaded by the client user's browser when parsing the page( the
<input type=image...> html element output by the asp.net imagebutton
control).

Please feel free to post here if there is anything unclear. Thanks.

Regards,

Steven Cheng
Microsoft Online Support

Get Secure! www.microsoft.com/security
(This posting is provided "AS IS", with no warranties, and confers no
rights.)

Matt Berther
Guest
Posts: n/a

 12-07-2004
Hello Steven Cheng[MSFT],

Hrmm... Setting either the height or the width, but not both works for me.
If you want to maintain the aspect ratio, you need to determine which one
is your starting point. Hence, you can not set both of them and expect your
aspect ratio to be maintained.

<img src="my400x200Image.gif" height="100"> will render the my400x200Image.gif
with a height of 100 and a width of 50 (100/400 = .25 and .25 * 200 = 50).

Going this route saves a bunch of unnecessary code... Let the browser do
the work... :=)

--
Matt Berther
http://www.mattberther.com

> Hi Arthur,
>
> Thanks for your posting. If the external image is in your own
> application(site) or is dynamically generatecd by your self , you can
> use GDI+ to adjust the image. As Alex has provided some code snippet
> on this. And I think you can also consider using a custom HTTPHandler
> which return the image resource dynamically , here is a good tech
> article discussing on this:
>
> #Using ASP.NET HTTP Handlers to create a photo album
> http://www.microsoft.com/belux/nl/ms.../desmet/httpha
> ndler. mspx
>
> Otherwise, if the image is on a external remote site which can't be
> controled by ourselve , we can't do anything on the image since the
> image is acutally loaded by the client user's browser when parsing the
> page( the <input type=image...> html element output by the asp.net
> imagebutton control).
>
> Please feel free to post here if there is anything unclear. Thanks.
>
> Regards,
>
> Steven Cheng
> Microsoft Online Support
> Get Secure! www.microsoft.com/security
> (This posting is provided "AS IS", with no warranties, and confers no
> rights.)

Arthur Hsu
Guest
Posts: n/a

 12-07-2004
Thanks to Alex and Steven. My images are on a remote site Maybe I
should think of something else ...

-Arthur

"Steven Cheng[MSFT]" <(E-Mail Removed)> wrote in message
news:B\$(E-Mail Removed)...
> Hi Arthur,
>
> Thanks for your posting. If the external image is in your own
> application(site) or is dynamically generatecd by your self , you can use
> GDI+ to adjust the image. As Alex has provided some code snippet on this.
> And I think you can also consider using a custom HTTPHandler which return
> the image resource dynamically , here is a good tech article discussing on
> this:
>
> #Using ASP.NET HTTP Handlers to create a photo album
> http://www.microsoft.com/belux/nl/ms...et/httphandler.
> mspx
>
> Otherwise, if the image is on a external remote site which can't be
> controled by ourselve , we can't do anything on the image since the image
> is acutally loaded by the client user's browser when parsing the page( the
> <input type=image...> html element output by the asp.net imagebutton
> control).
>
> Please feel free to post here if there is anything unclear. Thanks.
>
> Regards,
>
> Steven Cheng
> Microsoft Online Support
>
> Get Secure! www.microsoft.com/security
> (This posting is provided "AS IS", with no warranties, and confers no
> rights.)
>

Steven Cheng[MSFT]
Guest
Posts: n/a

 12-08-2004
You're welcome Arthur,

Always feel free to post here. Thanks.

Regards,

Steven Cheng
Microsoft Online Support

Get Secure! www.microsoft.com/security
(This posting is provided "AS IS", with no warranties, and confers no
rights.)