使用 mvvm 从 Image Control 获取加载的 Image答案

【问题标题】：Get the loaded Image from Image Control using mvvm使用 mvvm 从 Image Control 获取加载的 Image
【发布时间】：2018-06-03 18:34:45
【问题描述】：

我在检索 WPF 图像控件中显示的图像时遇到问题

<Image x:Name="img" RenderTransformOrigin="0.5, 0.5" Source="{Binding ImageSource, Source={x:Static vm:ItemProvider.instance}, UpdateSourceTrigger=PropertyChanged}" >
                                            <Image.RenderTransform>
                                                <RotateTransform CenterX="0" CenterY="0" Angle="{Binding ElementName=ScrollBar, Path=Value}" />
                                            </Image.RenderTransform>

                                        </Image>

我使用Scrollbar旋转图像

我想检索它，如控件所示

这就是我将图像加载到图像控件的方式

        private byte[] _ImageSource;
        public byte[] ImageSource
        {
            get { return _ImageSource; }
            set
            {
                _ImageSource = value;
                RaisePropertyChanged("ImageSource");
            }
        }

我试图通过获取ImageSource 来检索图像控件中显示的图像，但它们并不相同。我将图像旋转 90 度。但是加载时返回的图片是一样的。

但是使用后面的代码我可以像这样访问图像

img.Source 然后我将源转换为字节数组

【问题讨论】：

请注意，在 ImageSource Binding 上设置 UpdateSourceTrigger=PropertyChanged 是没有意义的。完全没有效果。

标签： c# wpf image mvvm

【解决方案1】：

旋转 Image 元素绝不会旋转其 Source 属性中的 ImageSource。

要创建旋转的 ImageSource，请使用 TransformedBitmap:

var sourceBitmap = new BitmapImage();

using (var stream = new MemoryStream(ImageSource))
{
    sourceBitmap.BeginInit();
    sourceBitmap.CacheOption = BitmapCacheOption.OnLoad;
    sourceBitmap.StreamSource = stream;
    sourceBitmap.EndInit();
}

// This should be another view model property that the Slider is bound to.
// Only multiples of 90 degrees are valid values.
var rotationAngle = 90d;

var rotation = new RotateTransform(rotationAngle);

var rotatedBitmap = new TransformedBitmap(sourceBitmap, rotation);

为避免每次转换都必须创建新的源位图，您应该将 ImageSource 属性的类型从 byte[] 更改为 ImageSource。

要将其写回到另一个byte[]，请使用BitmapEncoder 类之一，例如PngBitapEncoder.

【讨论】：

嗨克莱门斯。但是使用代码，图像只能以 90 度的增量旋转。但是我需要从滑块到 360 的任何值。在我的情况下我该如何解决？或者我使用 ImageMagick 之类的库。但是用户的电脑速度很慢。谢谢。
我的印象是您确实想这样做，因为您写道“我将图像旋转 90 度”。无论如何，您也可以将旋转后的 Image 元素渲染为 RenderTargetBitmap。
你可以分享一些代码吗？我不能让它工作。我无法将 RotateTransform 转换为 byte[] 我尝试搜索 RenderTargetBitmap 但输出不是我所期望的。
“输出不是我所期望的”。那么你期望什么？您应该知道当您旋转除 90° 的倍数之外的任何东西时，您希望结果看起来如何。输出位图是矩形的，因此您要么切掉部分，要么将部分留空。