TransformedBitmap

The TransformedBitmap allows you to rotate and scale an image - albeit with some restrictions in that  rotations are limited to 90 degree increments and skews are not supported. You can basically rotate by 90 degrees, flip and scale an image.

To understand how the TransformedBitmap works you need to know that WPF supports the general and more widely used idea of a transform. A transform is essentially a matrix which is applied to a graphic to create a rotation or a scaling. 

The Transform class represents this matrix and there are a range of similar classes that generate particular types of transformation - such as RotateTransformation, ScaleTransformation, SkewTransformation and TransfromTransfromation.

In most cases you can create a set of transforms and apply them to create a completely general transformation of the graphics. In the case of a bitmap there are only a limited range of transformations that can be applied - ScaleTransformation and RotationTransformation with 90 degree rotations.

For example:

TransformedBitmap tbm = 
       new TransformedBitmap();
tbm.BeginInit();
tbm.Source = bmi;
tbm.Transform = new RotateTransform(90);
tbm.EndInit();

This rotates the image by 90 degrees clockwise.

Original and 90 degree rotation

If you enter an angle that isn't a multiple of 90 degrees then you generate an exception.To make sure you use a valid rotation angle you can use the Rotation enumeration.

You can also scale the image and the x and y scaling factors don't have to be the same. For example:

tbm.Transform = 
          new ScaleTransform(0.25,1);

scales the image by 1/4 in the horizontal direction and leaves it unscaled vertically.

.

Original and scaled 1/4 horizontally

By specifying -1 as the scale factor you can create a flip. For example:

tbm.Transform = 
          new ScaleTransform(-1, -1);

flips the image in the x and y axes.

Original and flip

If you use any other transformations they are just ignored.

The reason that the TransformedBitmap class is limited to just these transformations is that the whole of the WPF bitmap system is just a wrapper for  the WIC - Windows Imaging Components and rotate through 90 degrees, scale and flip are the only transformation components it supplies.

Alternatives to Crop and Transform

One alternative to using the CroppedBitmap object has already been discussed - use a clipping path. But you can more generally use a render or layout transformation to display the bitmap in a completely general way.

For example:

image1.RenderTransform = 
       new RotateTransform(45);

will rotate the image by 45 degrees.

A render transform

The only complication is that it isn't the bitmap that is rotated but the image control which displays the bitmap. Notice that the RenderTransform is performed before the control is laid out and LayoutTransform is performed after.

There are also some additional useful alternatives to using the transformation objects. In particular you can use the SourceRectangle and the Rotation property of the BitmapImage class to specify a clipping region and a rotation - again a multiple of 90 degrees.

Another approach to the problem of scaling is to make use of the DecodePixelWidth and/or DecodePixelHeight properties of the BitmapImage class.

If you set these properties then the image will be rescaled as it is loaded. In the case of the JPEG and PNG codecs this resizing is done as part of the download. For other codecs the bitmap is downloaded and then rescaled which is not as efficient.

For example, to load and rescale a JPEG as it is loaded you would use something like:

BitmapImage bmi = new BitmapImage();
bmi.BeginInit();
bmi.UriSource = uri;
bmi.DecodePixelHeight = 100;
bmi.EndInit();

If you only set the DecodePixelHeight then the width is scaled to retain the aspect ratio of the original image.  In the case of JPEG and PNGs this is by far the most efficient way to rescale images.

<ASIN:1430219106>

<ASIN:0470097744>

<ASIN:0979372518>

<ASIN:1590597826>

<ASIN:0596523572>