wpf - 如何在 WPF Image 控件中放大 BitmapSource 的某个区域？

Question

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

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);
}

缩放后的截图：