如何放大 WPF 图像控件中 BitmapSource 的特定区域？

Question

假设我在 WPF Image 控件中有一个 1280x1024 BitmapSource。该图像有一个 100x100 "active" 区域，我希望能够通过单击按钮放大该区域。我想尽可能地缩放，同时保持纵横比并保持所有 "active" 像素可见。这是我的：

XAML:

<DockPanel>
    <Button DockPanel.Dock="Bottom" Content="Zoom" Click="Button_Click" />
    <Border DockPanel.Dock="Top" ClipToBounds="True">
        <Image Name="TheImage" />
    </Border>
</DockPanel>

代码：

private const int WIDTH = 1280;
private const int HEIGHT = 1024;
private const int MIN_X = 100;
private const int MAX_X = 200;
private const int MIN_Y = 100;
private const int MAX_Y = 200;

public MainWindow()
{
    InitializeComponent();

    byte[] image = new byte[WIDTH * HEIGHT];
    for (int y = MIN_Y; y <= MAX_Y; y++)
        for (int x = MIN_X; x <= MAX_X; x++)
            image[y * WIDTH + x] = byte.MaxValue;
    TheImage.Source = BitmapSource.Create(WIDTH, HEIGHT, 96.0, 96.0, PixelFormats.Gray8, null, image, WIDTH);
}

private void Button_Click(object sender, RoutedEventArgs e)
{
    double factor = 1.0 / Math.Max((MAX_X - MIN_X) / (double)WIDTH, (MAX_Y - MIN_Y) / (double)HEIGHT);
    Matrix matrix = Matrix.Identity;
    matrix.ScaleAt(factor, factor, (MIN_X + MAX_X) / 2.0 / WIDTH * TheImage.ActualWidth, (MIN_Y + MAX_Y) / 2.0 / HEIGHT * TheImage.ActualHeight);
    TheImage.RenderTransform = new MatrixTransform(matrix);
}

这是缩放前的样子：

这是缩放后的样子：

看起来缩放量是正确的，但我认为问题在于缩放的中心应该因缩放而移动，但我不确定如何预先考虑到这一点。

Answer 1

想通了。最简单的方法似乎是首先进行平移，使活动区域的中心位于图像的中心，然后以其为中心进行缩放：

private void Button_Click(object sender, RoutedEventArgs e)
{
    double factor = 1.0 / Math.Max((MAX_X - MIN_X) / (double)WIDTH, (MAX_Y - MIN_Y) / (double)HEIGHT);
    Matrix matrix = Matrix.Identity;
    matrix.Translate(0.5 * TheImage.ActualWidth - (MIN_X + MAX_X) / 2.0 / WIDTH * TheImage.ActualWidth, 0.5 * TheImage.ActualHeight - (MIN_Y + MAX_Y) / 2.0 / HEIGHT * TheImage.ActualHeight);
    matrix.ScaleAt(factor, factor, 0.5 * TheImage.ActualWidth, 0.5 * TheImage.ActualHeight);
    TheImage.RenderTransform = new MatrixTransform(matrix);
}

缩放后的截图：

如何放大 WPF 图像控件中 BitmapSource 的特定区域？

How can I zoom in on a certain region of a BitmapSource in a WPF Image control?

wpf

image

bitmapsource

rendertransform