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

[Arthur Hsu]

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]

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)sourceWi dth);
nPercentH = ((float)Height/(float)sourceHe ight);

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

int destWidth = (int)(sourceWid th * nPercent);
int destHeight = (int)(sourceHei ght * nPercent);

Bitmap bmPhoto = new Bitmap(Width,
Height, System.Drawing. Imaging.PixelFo rmat.Format24bp pRgb);
bmPhoto.SetReso lution(imgPhoto .HorizontalReso lution,
imgPhoto.Vertic alResolution);

Graphics grPhoto = Graphics.FromIm age(bmPhoto);
grPhoto.Clear(S ystem.Drawing.C olor.White);
grPhoto.Interpo lationMode =
System.Drawing. Drawing2D.Inter polationMode.Hi ghQualityBicubi c;

grPhoto.DrawIma ge(imgPhoto,
new Rectangle(destX ,destY,destWidt h,destHeight),
new Rectangle(sourc eX,sourceY,sour ceWidth,sourceH eight),
GraphicsUnit.Pi xel);

grPhoto.Dispose ();

// delete the previous user's avatar, both *.jpg and *.gif
if( File.Exists( Page.Server.Map Path(Page.Reque st.ApplicationP ath) +
"UserIcons\ \" + EditUser.Userna me + ".jpg") ){
System.IO.File. Delete( Page.Server.Map Path(Page.Reque st.ApplicationP ath)
+ "UserIcons\ \" + EditUser.Userna me + ".jpg" );
}
if( File.Exists( Page.Server.Map Path(Page.Reque st.ApplicationP ath) +
"UserIcons\ \" + EditUser.Userna me + ".gif") ){
System.IO.File. Delete( Page.Server.Map Path(Page.Reque st.ApplicationP ath)
+ "UserIcons\ \" + EditUser.Userna me + ".gif" );
}
return bmPhoto;
}

--
Alex Mueller
"Arthur Hsu" <ah**@vimatech. com> wrote in message
news:%2******** ********@TK2MSF TNGP09.phx.gbl. ..

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]]

Hi Arthur,

Thanks for your posting. If the external image is in your own
application(sit e) 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]

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="my400x200I mage.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(sit e) 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]

Thanks to Alex and Steven. My images are on a remote site :( Maybe I
should think of something else ...

-Arthur

"Steven Cheng[MSFT]" <v-******@online.m icrosoft.com> wrote in message
news:B$******** ******@cpmsftng xa10.phx.gbl...

Hi Arthur,

Thanks for your posting. If the external image is in your own
application(sit e) 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]]

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.)