Image resizing when I rotate

[Craig Mellon]

I have an issue with the RADBinaryImage control, basically I'm using .net code behind to rotate the image but on every rotate the image halfs in size, yet if I refresh the page the image comes back to the correct size...if I remove ResizeMode="Fit" property it dosen't half the image size but I need this property set.

My vb.net code:

Try
          Dim p As SmartPortalLibrary.SurveyPhoto = SmartPortalLibrary.SurveyPhoto.GetPhoto(photoId)
          Dim ms As MemoryStream = New MemoryStream(p.PhotoData)
          Dim image As Bitmap = Bitmap.FromStream(ms)
          image.RotateFlip(RotateFlipType.Rotate90FlipNone)
          ms.Close()
          ms.Dispose()
          ms = New IO.MemoryStream
          image.Save(ms, ImageFormat.Jpeg)
          ms.Seek(0, SeekOrigin.Begin)
          p.SetImage(ms.ToArray)
          p = p.Save
          RadBinaryImage1.DataValue = ms.ToArray
          ms.Close()
      Catch ex As Exception
          'lblMsg.Text = "Error Rotating Image: " & ex.Message
          'lblMsg.CssClass = "lblHeaderRed"
      End Try

RADBinaryImage:

<telerik:RadBinaryImage AutoAdjustImageControlSize="true" ResizeMode="Fit" Width="1000px" Height="600px" runat="server" ID="RadBinaryImage1" />

Orginal Image screenshot:
1

When I have rotated the image 180degrees (as you can see it has halfed size!)
2

[Veli]

Hello Craig,

The images you probably wanted to show do not appear. Also, RadBinaryImage seems to work OK with image transformations. Attaching a test page.

Veli
the Telerik team

[Craig Mellon]

The numbers 1 \ 2 in my post are links to the images, please click them :).

Will look at your sample, thanks.

[Veli]

Great :) Can you reproduce this behavior in the test page I sent you, so that we can see if it is RadBinaryImage-related?


Veli
the Telerik team

[Craig Mellon]

Hi Veli,

Ok I replicated your project and again it's rotates fine until I add the following propertys to the control:

<telerik:RadBinaryImage ID="RadBinaryImage1" Width="1000px" Height="600px" AutoAdjustImageControlSize="true" ResizeMode="Fit" runat="server" />

Please add the above propertys to the sample project you sent me and you should see for yourself the the image halfs in size on every rotate click.

Many thanks.

[Craig Mellon]

I had to add the following to the PreRender event (vb.net)

RadBinaryImage1.Width = 1000
RadBinaryImage1.Height = 600
RadBinaryImage1.ResizeMode = BinaryImageResizeMode.Fit
RadBinaryImage1.AutoAdjustImageControlSize = True

For some reason it was losing these settings upon rotation but setting them again on the PreRender has fixed my issue and the image now rotates without losing size.

Thanks anyway.

[Veli]

Hello Craig,

The behavior you are observing with RadBinaryImage is expected. When you set ResizeMode="Fit" RadBinaryImage takes the width and height you have set and tries to adjust them to fit the image dimensions without resizing the image itself. So what happens:

1. You set Width="1000px", Height="600px" initially
2. You pass image data containing an 800x600 image.
3. RadBinaryImage calculates the effective image size and adjust its width to 800px to match the 800x600 pixel dimension

At this point, the image is rendered and RadBinaryImage has Width="800px", Height="600px".

What happens when you postback and rotate the image to the right. The image dimensions become 600x800. So what happens now:

1. RadBinaryImage has a Width="800px" and Height="600px" set from the previous page life cycle.

2. You give it image data containing an 600x800 image.
3. To accommodate this image in the specified binary image dimensions, RadBinaryImage needs to set keep the height of 600px and set a width of 450px! This is done so that a 600x800 image can fit with proportional scaling.

At this point, the image is rendered in 450x600. The new RadBinaryImage dimensions are 450x600. On each rotation, the image will be smaller and smaller because RadBinaryImage has smaller and smaller dimensions to fit the image in. You can notice the image dimensions after the next rotation will be 450x337, and so on.

Resetting the image width and height to 800x600 on every postback works around this behavior and now RadBinaryImage always has an 800x600 pixel area to fit the image in.

Veli
the Telerik team

[Craig Mellon]

Yes that makes perfect sense, thanks for the detailed explanation.