Заполнить WPF-изображение из потока, неправильно масштабируется

Question

public static System.Drawing.Image GetImage() 
{
   // ... returns a System.Drawing.Image 
}

---

public partial class PreviewWindow : Window
{
    private void btnPreview_Click(object sender, RoutedEventArgs e)
    {
        System.Drawing.Image page = GetImage();
        var bitmap = new BitmapImage();

        using (var ms = new MemoryStream())
        {
            page.Save(ms, System.Drawing.Imaging.ImageFormat.Bmp);
            ms.Position = 0;

            bitmap.BeginInit();
            bitmap.CacheOption = BitmapCacheOption.OnLoad;
            bitmap.StreamSource = ms;
            bitmap.EndInit();
        }

        imgPreview.Source = bitmap;
        imgPreview.Stretch = Stretch.UniformToFill;
        imgPreview.StretchDirection = StretchDirection.Both;
    }
}

Я создаю изображение, возвращаю его в окно пользовательского интерфейса как System.Drawing.Image и отображаю предварительный просмотр изображения в компоненте WPF System.Windows.Controls.Image. Это в основном работает.

Проблема в том, что это не масштабирование. Я хочу, чтобы изображение сохраняло правильное соотношение сторон, но сжималось, чтобы соответствовать компоненту изображения (изображение всегда будет больше экрана). Там нет сообщения об ошибке или исключения, но изображение отображается в полном размере, но обрезается в пространство компонента.

Я попытался установить свойства масштабирования в xaml и в коде, как указано выше. Я подозреваю, что это может быть потому, что он загружается из потока, а не из ресурса. Есть ли что-то тонкое, что мне не хватает?

Как создать изображение, которое загружается в компонент WPF Image из масштаба потока, как описано?

Answer 1

Я не совсем уверен, что ты делаешь неправильно, но для меня Stretch.Uniform и StretchDirection. И делаю то, что, как мне кажется, ты просишь.

Я сделал скриншот эта веб-страница для тестирования. Я установил большую толстую красную рамку вокруг элемента управления изображением. Я играл с размерами элемента управления изображением. С этим очень высоким или очень широким я получаю результаты как ниже. Размер изображения изменяется, но соотношение сторон остается тем же, и в результате мы получаем пробелы в элементе управления. Это не обрезано. Если это не то, что вы хотите, так и скажите.

Полный код приведен ниже , это было сделано в. NET Core 3.1, но я сомневаюсь, что это имеет какое-то значение. Вы получите тот же эффект, если вы вытащите границу и поместите размеры Высота и Ширина непосредственно в элемент управления Image, кстати.

C#

public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
    }

    private void btnPreview_Click(object sender, RoutedEventArgs e)
    {
        System.Drawing.Image page = GetImage();
        var bitmap = new BitmapImage();

        using (var ms = new MemoryStream())
        {
            page.Save(ms, System.Drawing.Imaging.ImageFormat.Bmp);
            ms.Position = 0;

            bitmap.BeginInit();
            bitmap.CacheOption = BitmapCacheOption.OnLoad;
            bitmap.StreamSource = ms;
            bitmap.EndInit();
        }

        imgPreview.Source = bitmap;
        imgPreview.Stretch = Stretch.Uniform;
        imgPreview.StretchDirection = StretchDirection.Both;
    }

    public static System.Drawing.Image GetImage()
    {
        return System.Drawing.Image.FromFile("sshot.jpg");
    }
}

XAML:

<Window x:Class="ScalingTest.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:ScalingTest"
        mc:Ignorable="d"
        Title="MainWindow" Height="800" Width="1100">
    <StackPanel Orientation="Vertical">
        <Button x:Name="btnPreview" Content="Preview" HorizontalAlignment="Left" VerticalAlignment="Top" Click="btnPreview_Click"/>
        <Border BorderThickness="3" BorderBrush="Red" Height="500" Width="1050" HorizontalAlignment="Left" VerticalAlignment="Top">
            <Image x:Name="imgPreview" HorizontalAlignment="Left" VerticalAlignment="Top"/>
        </Border>
    </StackPanel>
</Window>