Win2D: Correct usage of CanvasVirtualControl

Question

I want to draw the mandelbrot-set taken from the Win2D-Example-Gallery and tweak it a little.

At first I had all my code to generate the mandelbrot inside the CreateResources-Method of CanvasAnimatedControl, but due to performance issues I went on to do it using shaders (HLSL or PixelShaderEffect) and CanvasVirtualControl:

public PixelShaderEffect _effectMandel;
CanvasVirtualImageSource _sdrc;

public async Task CreateResources(CanvasVirtualControl sender)
{
    _sdrc = new CanvasVirtualImageSource(sender, new Size(_width, _height));
    var arr = await FileHelper.ReadAllBytes("Shaders/Mandelbrot.bin");
    if (arr != null)
    {
        _effectMandel = new PixelShaderEffect(arr);

        using (CanvasDrawingSession drawingSession = sender.CreateDrawingSession(new Rect(0,0,_width,_height)))
        {
            drawingSession.DrawImage(_effectMandel);
        }
    }
}

When I run the application, I get a System.Runtime.InteropServices.COMException right in the using section and the 'App.g.i.cs' file opens up telling me:

The shader code I use is this:

// Copyright (c) Microsoft Corporation. All rights reserved.
//
// Licensed under the MIT License. See LICENSE.txt in the project root for license information.


// This shader has no input textures.
// It generates a mandelbrot fractal.

#define D2D_INPUT_COUNT 0
#define D2D_REQUIRES_SCENE_POSITION

#include "d2d1effecthelpers.hlsli"


float scale;
float2 translate;

static const float4 tapOffsetsX = float4(-0.25,  0.25, -0.25, 0.25);
static const float4 tapOffsetsY = float4(-0.25, -0.25,  0.25, 0.25);

static const int iterations = 100;


D2D_PS_ENTRY(main)
{
    float2 pos = D2DGetScenePosition().xy;

    // Improve visual quality by supersampling inside the pixel shader, evaluating four separate
    // versions of the fractal in parallel, each at a slightly different position offset.
    // The x, y, z, and w components of these float4s contain the four simultaneous computations.
    float4 c_r = (pos.x + tapOffsetsX) * scale + translate.x;
    float4 c_i = (pos.y + tapOffsetsY) * scale + translate.y;

    float4 value_r = 0;
    float4 value_i = 0;

    // Evalulate the Mandelbrot fractal.
    for (int i = 0; i < iterations; i++)
    {
        float4 new_r = value_r * value_r - value_i * value_i + c_r;
        float4 new_i = value_r * value_i * 2 + c_i;

        value_r = new_r;
        value_i = new_i;
    }

    // Adjust our four parallel results to range 0:1.
    float4 distanceSquared = value_r * value_r + value_i * value_i;

    float4 vectorResult = isfinite(distanceSquared) ? saturate(1 - distanceSquared) : 0;

    // Resolve the supersampling to produce a single scalar result.
    float result = dot(vectorResult, 0.25);

    if (result < 1.0 / 256)
        return 0;
    else
        return float4(result, result, result, 1);
}

If you know why this happens, please answer. Thanks!

Probably because the file you loaded is not a compiled FX shader? Check out http://stackoverflow.com/questions/1938514/pixel-shader-effect-examples — Berin Loritsch, Dec 08 '16 at 00:52
@BerinLoritsch I updated my question and provided the shader code from Microsoft. I now followed the example provided here https://microsoft.github.io/Win2D/html/M_Microsoft_Graphics_Canvas_Effects_PixelShaderEffect__ctor.htm but also it didn't work. — Manticore, Dec 08 '16 at 01:12
It's been a while since I've written shader code, the biggest issues I had was making sure the binary is what I expected. I don't think the compiled shader code is 32/64bit sensitive. Also, make sure you clean all the object files (the `.g.i.cs` file is a generated source file). You may have to restart Visual Studio as well. — Berin Loritsch, Dec 08 '16 at 01:18
Turned out I had to activate my debugging settings as mentioned on http://stackoverflow.com/questions/4281425/how-to-avoid-a-system-runtime-interopservices-comexception and now I can see the following error message: `CreateDrawingSession cannot be called before the RegionsInvalidated event has been raised.` — Manticore, Dec 08 '16 at 01:22
I had my code in the wrong section. I did not know that I manually had to setup a Timer and invalidate the canvas. Now I do and it works fine. — Manticore, Dec 08 '16 at 12:47

score 4 · Accepted Answer · answered Dec 08 '16 at 12:54

I needed to setup a Timer to regularly invalidate the canvas and get 60fps. I had another look into the Microsoft Examples and finally worked it out using this code:

DispatcherTimer timer;
internal void Regions_Invalidated(CanvasVirtualControl sender, CanvasRegionsInvalidatedEventArgs args)
{
    // Configure the Mandelbrot effect to position and scale its output. 
    float baseScale = 0.005f;
    float scale = (baseScale * 96 / sender.Dpi) / (helper._modifiers[1] / 1000f);
    var controlSize = baseScale * sender.Size.ToVector2() * scale;
    Vector2 translate = (baseScale * sender.Size.ToVector2() * new Vector2(-0.5f,-0f));

    _effectMandel.Properties["scale"] = scale;
    _effectMandel.Properties["translate"] = (Microsoft.Graphics.Canvas.Numerics.Vector2)translate;
#endif

    // Draw the effect to whatever regions of the CanvasVirtualControl have been invalidated.
    foreach (var region in args.InvalidatedRegions)
    {
        using (var drawingSession = sender.CreateDrawingSession(region))
        {
            drawingSession.DrawImage(_effectMandel);
        }
    }

    // start timer for fps
    this.timer = new DispatcherTimer();
    int fps = 60;
    this.timer.Interval = new TimeSpan(0, 0, 0, 0, 100 / fps);
    this.timer.Tick += timer_Tick;
    this.timer.Start();
}

private void timer_Tick(object sender, object e)
{
    this.timer.Stop();
    _canvas.Invalidate();
}

Hope this is helpful to someone.

Can use CanvasAnimatedControl – lindexi Dec 13 '18 at 02:35 — lindexi, Dec 13 '18 at 02:35

Win2D: Correct usage of CanvasVirtualControl

1 Answers1