How to rotate image more than once in WPF

Question

I have opened an image with an open file dialog.

image.Source = new BitmapImage(new Uri(ofd.FileName));

Then I want to rotate it as many times as I like and finally save the modified image. The problem is that with code from MSDN:

var biOriginal = (BitmapImage)image.Source;
var biRotated = new BitmapImage();
biRotated.BeginInit();
biRotated.UriSource = biOriginal.UriSource;
biRotated.Rotation = Rotation.Rotate90;
biRotated.EndInit();
image.Source = biRotated;

I can rotate the image, but only one time and I'm not able to save the rotated image.

[Saving a BitmapImage](http://stackoverflow.com/questions/4161359/save-bitmapimage-to-file) and [rotate by angle](http://stackoverflow.com/questions/7309086/rotate-a-bitmapimage) (or repeat your code in a loop if you want more than one rotation) — musefan, May 18 '16 at 16:33
cannot rotate like that due to exception Unable to cast object of type 'System.Windows.Media.Imaging.BitmapImage' to type 'System.Windows.Media.Imaging.TransformedBitmap'. — Bonisek, May 18 '16 at 16:44

score 3 · Accepted Answer · answered May 18 '16 at 17:33

If I am not mistaken, you just need to rotate the image. You can do this by applying a layout transform to Image element in XAML and changing it's (transform's) angle value on button click. Also it looks like you are not following MVVM. If you do, see how simple it is:

View

<Image Source="C:\Users\Public\Pictures\Sample Pictures\Penguins.jpg" 
    HorizontalAlignment="Center" VerticalAlignment="Center" Width="125">
        <Image.LayoutTransform>
            <RotateTransform Angle="{Binding RotateAngle}" />
        </Image.LayoutTransform>
</Image>
<Button Content="Rotate" Command="{Binding RotateCommand}" 
    VerticalAlignment="Bottom" HorizontalAlignment="Center" />

ViewModel

public class ViewModel : BaseViewModel
{
    private ICommand rotateCommand;
    private double rotateAngle;

    public ICommand RotateCommand
    {
        get
        {
            if(rotateCommand == null)
            {
                rotateCommand = new RelayCommand(() => {
                    RotateAngle += 90;
                });
            }

            return rotateCommand;
        }
    }

    public double RotateAngle
    {
        get
        {
            return rotateAngle;
        }

        private set
        {
            if(value != rotateAngle)
            {
                rotateAngle = value;
                OnPropertyChanged("RotateAngle");
            }
        }
    }
}

View Code-behind

ViewModel vm;

public View()
{
    InitializeComponent();
    vm = new ViewModel();
    DataContext = vm;
}

I am assuming you are not absolute beginner in MVVM/WPF and omitted definitions of BaseViewModel (implements INotifyPropertyChanged) and RelayCommand (implements ICommand) as I didn't want to make answer too lengthy. If you are having trouble with these, let me know, I will include them here.

score -1 · Answer 2 · answered May 18 '16 at 17:45

The following code seems to work:

            BitmapImage newImage = new BitmapImage();
        newImage.BeginInit();
        newImage.UriSource = MyImage.UriSource;
        newImage.Rotation = Rotation.Rotate90;
        newImage.EndInit();
        JpegBitmapEncoder encoder = new JpegBitmapEncoder();
        string ImageName = Path.Combine( Environment.GetFolderPath(Environment.SpecialFolder.MyPictures), (Guid.NewGuid() + ".jpg"));
        encoder.Frames.Add(BitmapFrame.Create(newImage));

        using (var filestream = new FileStream(ImageName, FileMode.Create))
            encoder.Save(filestream);
        MyImage = new BitmapImage(new Uri(ImageName));

It creates a new image every time you rotate it of course, if you want to rotate more than once the image and save it only once I haven't found a simple way to make multiple rotations without saving the rotated image.

How to rotate image more than once in WPF

2 Answers2