locked
Overlay DirectX Content on XAML control

    Question

  • I want to overlay DirectX Content (WinRT Component) over a XAML control in Win 8 metro style app so that XAMl  control and its contents will be visible beneath the DirectX content.

    Approach I) I explored the 3 ways of using Xaml and Direct3D interop.

    (1)  SurfaceImageSource, (2) VirtualSurfaceImageSource (3) SwapChainBackgroundPanel.

    *but in all three of these cases mentioned above, Xaml either comes above the DirectX content(SwapChainBackgroundPanel) or can share part of the screen with directX content (SurfaceImageSource).*

    Approach II) If i use blending it only handles the color blending  and transparency of the objects being rendered on the renderTarget. For example we can render a semi transparent cube on a opaque background.  If i clear the renderTarget with a color where the alpha channel is set to 0.0f. Setting the alpha channel to 0.0f doesn't change the transparency with the code given below.

    const float clearColor[4] = { 0.0f, 0.0f, 0.0f, 0.0f };  
    m_d3dContext->ClearRenderTargetView(m_renderTargetView.Get(), clearColor);

    I know it is possible to overlay xaml over DirectX but is it possible to do it the other way (overlaying DirectX on Xaml)?


    • Edited by mukhe Monday, September 9, 2013 11:35 PM
    Monday, September 9, 2013 11:31 PM

Answers

  • Thanks for reply.

    I found the solution. It is a 2 step process

    Step 1:

    While creating an object of SurfaceImageSource class, it takes 3 arguments, the 3rd argument is for

    opacity on setting it to false will allow support for transparency.

    public SurfaceImageSource(int pixelWidth, int pixelHeight, bool isOpaque);

    Step 2: 

    After this if we clear the 3D rendertarget with transparent color as given below, it will work.

    const float clearColor[4] = { 0.0f, 0.0f, 0.0f, 0.0f };  
    m_d3dContext->ClearRenderTargetView(m_renderTargetView.Get(), clearColor);

    Regards,

    mukhe

    • Marked as answer by mukhe Wednesday, September 11, 2013 5:46 PM
    Wednesday, September 11, 2013 5:45 PM

All replies

  • Hi mukhe,

    Welcome to MSDN forum!

    Please refer this article which maybe is helpful.

    http://blogs.msdn.com/b/windowsappdev/archive/2012/03/15/combining-xaml-and-directx.aspx

    Regards!


    <font color="0099FF">&lt;THE CONTENT IS PROVIDED &quot;AS IS&quot; WITHOUT WARRANTY OF ANY KIND, WHETHER EXPRESS OR IMPLIED&gt;</font><br/> Thanks<br/> MSDN Community Support<br/> <br/> Please remember to &quot;Mark as Answer&quot; the responses that resolved your issue. It is a common way to recognize those who have helped you, and makes it easier for other visitors to find the resolution later.

    Wednesday, September 11, 2013 9:43 AM
    Moderator
  • Thanks for reply.

    I found the solution. It is a 2 step process

    Step 1:

    While creating an object of SurfaceImageSource class, it takes 3 arguments, the 3rd argument is for

    opacity on setting it to false will allow support for transparency.

    public SurfaceImageSource(int pixelWidth, int pixelHeight, bool isOpaque);

    Step 2: 

    After this if we clear the 3D rendertarget with transparent color as given below, it will work.

    const float clearColor[4] = { 0.0f, 0.0f, 0.0f, 0.0f };  
    m_d3dContext->ClearRenderTargetView(m_renderTargetView.Get(), clearColor);

    Regards,

    mukhe

    • Marked as answer by mukhe Wednesday, September 11, 2013 5:46 PM
    Wednesday, September 11, 2013 5:45 PM