如何直接在图像上绘制？解决像素绘制程序的闪烁问题

嘿，这个闪烁问题我之前在做WPF像素绘图工具的时候也碰到过！你猜得没错——每次重新创建WriteableBitmap再赋值给Image.Source，本质上是让控件重新加载整个图像，这就是闪烁的根源。完全可以直接在同一个图像实例上修改像素，不用每次替换源，具体做法如下：

1. 提前初始化并复用WriteableBitmap实例 #

不要每次绘制都新建WriteableBitmap，而是在程序初始化（比如窗口构造函数）时创建一次，直接绑定到Image控件的Source上：

private WriteableBitmap _drawableBitmap;

public YourMainWindow()
{
    InitializeComponent();
    
    // 从Image控件的初始源获取尺寸信息，创建可写入的Bitmap实例
    var initialSource = (BitmapSource)image.Source;
    _drawableBitmap = new WriteableBitmap(initialSource);
    // 把这个实例绑定到Image，之后就不再修改Source了
    image.Source = _drawableBitmap;
}

2. 修改SetPixel方法，直接操作复用的Bitmap #

现在你的SetPixel方法可以直接对_drawableBitmap的后台缓冲区进行修改，不用每次新建实例：

private void SetPixel(int x, int y, byte r, byte g, byte b, byte a)
{
    // 先做坐标合法性校验，避免越界
    if (x < 0 || x >= _drawableBitmap.PixelWidth || y < 0 || y >= _drawableBitmap.PixelHeight)
        return;

    // WPF的WriteableBitmap默认像素格式是BGRA，所以顺序是b、g、r、a
    byte[] pixelColor = new byte[] { b, g, r, a };
    int stride = _drawableBitmap.PixelWidth * 4; // 每行的字节数（每个像素4字节）
    int pixelOffset = y * stride + x * 4; // 目标像素在缓冲区中的偏移量

    // 锁定缓冲区，避免多线程冲突（如果定时器在UI线程的话，这步也可以简化，但加上更安全）
    _drawableBitmap.Lock();
    try
    {
        // 把颜色数据复制到后台缓冲区
        System.Runtime.InteropServices.Marshal.Copy(pixelColor, 0, _drawableBitmap.BackBuffer + pixelOffset, 4);
        // 标记这个1x1的区域为脏区域，告诉WPF只更新这一小块
        _drawableBitmap.AddDirtyRect(new Int32Rect(x, y, 1, 1));
    }
    finally
    {
        _drawableBitmap.Unlock();
    }
}

3. 额外注意事项 #

• 如果你的定时器是System.Timers.Timer或者System.Threading.Timer，记得要切换到UI线程再调用SetPixel，因为WPF控件只能在UI线程操作。可以用Dispatcher.Invoke来实现：

  // 比如在定时器回调里
  Dispatcher.Invoke(() => SetPixel(x, y, r, g, b, a));
  

• 如果是批量修改像素，可以一次性计算所有脏区域，调用一次AddDirtyRect，这样性能会更好，也能进一步减少闪烁。

这样修改之后，你就只是在同一个图像实例上修改局部像素，WPF只会更新变化的区域，不会重新加载整个图像，闪烁问题应该就能解决了！

内容的提问来源于stack exchange，提问作者TheMadGuy