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

Discussion in 'ASP .Net' started by Arthur Hsu, Dec 7, 2004.

  1. Arthur Hsu

    Arthur Hsu Guest

    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
     
    Arthur Hsu, Dec 7, 2004
    #1
    1. Advertising

  2. Arthur Hsu

    Alex Guest

    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.HorizontalResolution,
    imgPhoto.VerticalResolution);

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

    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" <> wrote in message
    news:%23ekiFV$...
    > 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, Dec 7, 2004
    #2
    1. Advertising

  3. 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/msdn/community/columns/desmet/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], Dec 7, 2004
    #3
  4. Arthur Hsu

    Matt Berther Guest

    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/msdn/community/columns/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.)
     
    Matt Berther, Dec 7, 2004
    #4
  5. Arthur Hsu

    Arthur Hsu Guest

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

    -Arthur

    "Steven Cheng[MSFT]" <> wrote in message
    news:B$...
    > 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/msdn/community/columns/desmet/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.)
    >
     
    Arthur Hsu, Dec 7, 2004
    #5
  6. 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.)
     
    Steven Cheng[MSFT], Dec 8, 2004
    #6
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. =?Utf-8?B?RGF2aWQgV2hpdGNodXJjaC1CZW5uZXR0?=

    Newbie: Image button aspect ratio

    =?Utf-8?B?RGF2aWQgV2hpdGNodXJjaC1CZW5uZXR0?=, Nov 6, 2004, in forum: ASP .Net
    Replies:
    5
    Views:
    1,254
    Scott M.
    Nov 7, 2004
  2. mharness
    Replies:
    0
    Views:
    449
    mharness
    Sep 28, 2006
  3. trint
    Replies:
    1
    Views:
    433
    =?Utf-8?B?UGFnZSBCcm9va3M=?=
    Apr 27, 2007
  4. David Whitchurch-Bennett

    * NEWBIE ** ImageButton Aspect Ratio

    David Whitchurch-Bennett, Nov 5, 2004, in forum: ASP General
    Replies:
    1
    Views:
    167
    Ray Costanzo [MVP]
    Nov 5, 2004
  5. Andrew Poulos

    Resizing image while maintaining aspect ratio

    Andrew Poulos, Mar 31, 2009, in forum: Javascript
    Replies:
    2
    Views:
    125
    Thomas 'PointedEars' Lahn
    Apr 1, 2009
Loading...

Share This Page