保持UI线程响应能力？

Question

My application is using WPF Control to display many video from Network Cameras.

The summary code is below

public void DisPlayVideoThreadProc()
{   
    while (isDisplayThreadRunning)
    {
        Global.mainWindow.Dispatcher.Invoke(new Action(delegate()
        {
            for (int i = 0; i < numOfCamera; i++)
            {
                BitmapSource img = bitmapQueue[i].Serve(); //Pop the frame from Queue
                ControlDisplay[i].DrawImage(img); //Draw this frame on ControlDisplay[i]
            }
        }));
    }
}

I encountered an problem when the amount of camera is large (> 15 camera), then the UI thread is very slow for user's interaction.

I know the UI thread works heavy when displaying many camera videos. But I don't know how to improve it. Someone can tell me, how to fix this issue.

Many thanks!

Answer 1

Don't draw all camera's in one invoke. This will block the gui thread too long. You'd better call invoke per camera draw. Or atleast in batches of maximum 4.

---

You might bring the Serve() method out of the invoke and store it in a dictionary and update it with a DispatcherTimer.

PSEUDO:

// hold the camera images.
public class CameraImage
{
    public bool Updated {get; set; }
    public BitmapSource Image {get; set; }
}

// cache
private Dictionary<int, CameraImage> _cameraCache = new Dictionary<int, CameraImage>();


// thread method to get the images.
while (isDisplayThreadRunning)
{
    for (int i = 0; i < numOfCamera; i++)
    {
        BitmapSource img = bitmapQueue[i].Serve(); //Pop the frame from Queue
        lock(_cameraCache)
        {
            CameraImage currentCameraImage;
            if(!_cameraCache.TryGetValue(i, out currentCameraImage))
            {
                _cameraCache.Add(i, currentCameraImage = new CameraImage());
            }
            currentCameraImage.Image = img;
            currentCameraImage.Updated = true;
        }
    }
}

// index cycler
private int _index;

// display timer.
public void DispatcherTimeMethod()
{
    lock(_cameraCache)
    {
        CameraImage currentCameraImage;

        if(_cameraCache.TryGetValue(_index, out currentCameraImage))
            if(currentCameraImage.Updated)
            {
                ControlDisplay[_index].DrawImage(currentCameraImage.Image);
                currentCameraImage.Updated = false;
            }
    }

    _index++;
    if(_index >= MAXCAMERAS)
        _index = 0;
}

If the camera's (all together) will generate too many images, it will automatically skip images.

Answer 2

Currently you are updating all your cameras in a single thread, the UI thread. This makes the UI thread always freeze, even if you don't notice it.

What I'd recommend is using Parallel.For to update the camera feeds on (multiple) separate threads, then using the UI dispatcher to update the image on the UI.

Something like this:

while ( isDisplayThreadRunning ) {

        //start a new parallel for loop
        Parallel.For( 0, numOfCamera, num => {
           BitmapSource img = bitmapQueue[i].Serve(); //Pop the frame from Queue

           //draw the new image on the UI thread
           Global.mainWindow.Dispatcher.Invoke(
              new Action( delegate
              {
                 ControlDisplay[i].DrawImage( img ); //Draw this frame on ControlDisplay[i]
              } ) );
        } );

        Thread.Sleep( 50 );//sleep if desired, lowers CPU usage by limiting the max framerate
     }
}