How to draw lines into an SurfaceImageSource during Pen input (DirectX, Direct2D, SwapChainBackgroundPanel)


  • Hello,

    since we have to use DirectX to realize dynamic drawings in XAML, we try develop a C++ control that should be used within a complex xaml tree (SurfaceImageSource). This control has to intercept pen input and draw lines accordingly to this.

    The documentation of SurfaceImageSource provides this remarks:

    "This class is a display area for DirectX interoperation whereby DirectX content can draw within an otherwise XAML-composed UI. One consideration for a SurfaceImageSource is that while it can incorporate the DirectX content, the rendering cycle is still XAML-centric. This means that when the content changes, this will push a change notification to the Windows Runtime XAML layout/render logic and the render happens using the UI thread. The consequence of this is that all the other app UI uses this thread too, and too many DirectX draws thus can result in latency or poor responsiveness. If you anticipate a high number of redraws for your DirectX content, and you intend to display that content full-screen without any surrounding XAML UI, you probably should use the SwapChainBackgroundPanel technique instead. For more info on how to draw to a SurfaceImageSource, including sample code, see DirectX and XAML interop."

    Question 1.

    Is it possible to realize the described functionality using SurfaceImageSource? Doing first test we saw that updates takes part after SurfaceImageSourceNative.EndDraw(). Is it possible to reuse the already drawn lines calling _SurfaceImageSourceNative->BeginDraw(_drawingBounds, &_dxgiSurface, &_surfaceOffset);? Could you please provide an axample if yes?

    Question 2.

    If it is not a good idea to use SurfaceImageSource and the usage of SwapChainBackgroundPanel is a better one. Can you confirm that this panel has to be the root of the entire app? Or is it possible to use this panel somethere within a xaml tree? Or if not, can it be used as a separate page where the app can navigate to? If yes, could you also please provide an example?

    Thank you very much in advance



    Tuesday, June 19, 2012 9:50 AM


  • Hi Alexander.jenne,

    I have used this SurfaceImageSource class to use with Direct2D.

    In my case I used this for a XAML image control and I drawn with Direct2D to a XAML control

    So I have referred the following article for implementing this


    • SurfaceImageSource – which is good for mostly static scenes that get drawn into an Image control
    • VirtualSurfaceImageSource – which is similar to SurfaceImageSource, but allows to work with surfaces larger than the size of the screen – perhaps for working with high resolution photos or maps
    • SwapChainBackgroundPanel – which can be used for high performance graphics with almost the same level of control you would otherwise get if you created a solely DirectX-driven app or game

    It really helps to get the idea..





    Wednesday, June 20, 2012 6:30 PM

All replies