DrawingVisual: How to clear a region?

Question

1.00/5 (1 vote)

See more:

Situation: White rectangle is drawn on DrawingVisual.
Goal: Clear a part (geometry) of it to make it transparent.
Windows Forms alternative: Graphics.Clear.
Code:

C#

public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
        visuals = new VisualCollection(this);
        DrawIt();
    }

    VisualCollection visuals;

    void DrawIt()
    {
        DrawingVisual visual = new DrawingVisual();
        using (DrawingContext dc = visual.RenderOpen())
        {
            dc.DrawRectangle(
                Brushes.White, new Pen(),
                new Rect(10, 10, 100, 100));

            dc.DrawRectangle(
                Brushes.Red, new Pen(),
                new Rect(50, 50, 20, 20)); // Remove it
        }
        visuals.Add(visual);
    }

    protected override Visual GetVisualChild(int index)
    {
        return visuals[index];
    }

    protected override int VisualChildrenCount
    {
        get { return visuals.Count; }
    }
}

Posted 14-Jul-15 7:33am

Ziya1995

Updated 3-Aug-15 5:30am

v2

Add a Solution

Comments

Sergey Alexandrovich Kryukov 14-Jul-15 15:42pm

Why would you ever need something like clear? This is just a wrong conception. Just don't draw what you don't want to render. I'm not joking; this is the right approach.
—SA

Ziya1995 15-Jul-15 3:31am

Because of the next goal:
http://www.codeproject.com/Questions/1009148/How-to-make-a-glow-effect-for-a-line-shape
If you know how to solve the problem in a better way, i would be happy to know.

While i am reading your solution.

Sergey Alexandrovich Kryukov 15-Jul-15 7:01am

This is a complicated problem and... ill-posed. There is no such technical thing as "glow". You are going into the field of arts, how to create impression of glowing. If you could described it how it should technically look, we could discuss the implementation, but it also would be not easy. May I ask you: why?
—SA

Ziya1995 15-Jul-15 7:41am

My link has a code which does it.
I also can create it very easy in Windows Forms, because i can clear.
You need to read what i wrote in another thread i linked to to understand.

The principle is simple using StrokeThickness.

While i have not analyzed your first solution, i feel like it has nothing related to my problem.

If you wanna understand, you can check the code in the other thread to see what happens.

> There is no such technical thing as "glow".
Wrong, it is absolutely the certain thing, it is not about some "super" effects, it is about the exact thing i can do in Windows Forms.
If you will read the other thread, you can see WPF used to support it as one function.

Sergey Alexandrovich Kryukov 15-Jul-15 7:56am

All right, it the context of your question it does exist, in that sense. Thank you for the explanation.
—SA

Ziya1995 15-Jul-15 9:44am

If you have read the other thread you can see there was OuterGlowBitmapEffect in WPF to do it, but it is no longer supported in .Net 4.0.
If you have a question, ask, all what i want for now is to solve this problem, if you can or find a way, let me know.

I am gonna check out Opacity Mask.

Sergey Alexandrovich Kryukov 15-Jul-15 11:05am

The MSDN help on OuterGlowBitmapEffect says that you can use non-obsolete BlurEffect instead:
https://msdn.microsoft.com/en-us/library/system.windows.media.effects.outerglowbitmapeffect%28v=vs.110%29.aspx,
https://msdn.microsoft.com/en-us/library/system.windows.media.effects.blureffect%28v=vs.110%29.aspx.

Why BlurEffect does not work? As I already said in my other comment, you need to describe exactly and formally what rendering you want to achieve and what goes wrong.

—SA

Ziya1995 15-Jul-15 11:58am

You can repeat, give all the information out msdn, list all the classes of .Net Framework if you want to, but it will not answer my question, sorry, i don't blame you, it is just a hard way to solve problems in this world.

But as you want i can repeat the same thing in different forms.
Go to:
http://www.codeproject.com/Questions/1009148/How-to-make-a-glow-effect-for-a-line-shape
Read:
"Note: DropShadowEffect and BlurEffect don't work."
Check the code and see what effect i want, because the code results exactly the effect i want, but it has a problem you can read about via the link i gave to you.

You can continue giving me what doesn't solve and that is good, because you also learn it along the way and may be once you will give right solution i hope.

And as you learn it here and if you are still interested, i can help you.
Here is an image:
https://drive.google.com/file/d/0B4MmPdhmZzQAelI2Q21qdmRoZ2s/view?usp=sharing
It is output of the code given on the other thread i linked to.
I have yet to analyze:
1. OpacityMask
2. CombinedGeometry
3. Clip
You can analyze them too to build the needed effect hence solving the problem.

I think i will find a way to solve it just like i solved all other problems.

Sergey Alexandrovich Kryukov 15-Jul-15 12:23pm

Who told you I'm trying to give you an answer? No, or not yet. If I had the answer, I would post it as a formal answer. Who told you I want to repeat the same text? I already read it. It's amazing how demanding you can be.

But you know, I'm starting to understand the problem of transparency. My question is: did you try to use semi-transparent colors on your shape? I mean it: not using transparency on any UI element, but using transparent color, that is, the color with alpha channel? And then apply the blur.

It's possible that old glow effect automatically added transparency, and blur does not do it.

Another solution would be creation of your own effect: class MyOwnEffect : System.Windows.Media.Effects.Effect {/* ... */}.

—SA

Ziya1995 15-Jul-15 13:19pm

> It's amazing how demanding you can be.
In fact i am pretty shocked WPF does not support such a simple function (it is GUI framework) out of box despite it used to support it some time ago.

DropShadowEffect and BlurEffect are not same things, i tried them and they don't result the same effect i can get even in Windows Forms.
Now i am learning those 3 ones.
When i find solution, i post it.

Sergey Alexandrovich Kryukov 15-Jul-15 15:36pm

I also don't understand why this particular effect was deprecated, but probably I just don't know enough. I was talking about your demand to the communication to the members of this site.

How about my questions/suggestions? First of all, using alpha channel. BlurEffect could be the closest candidate, but I'm doubtful about DropShadow.

—SA

hannibal smith 13-Oct-21 5:17am

Can I ask you an advice, since I'm using drawingVisual for building a realtime lines chart app, and I have 2 questin:
1-you say that draw and the clear is wrong concept, but so how can I update the chart that I have jut drawed?
2-Can you check my question please? https://www.codeproject.com/Questions/5315071/Drawingvisual-mouseevent-iusse
Regards.

2 solutions

Solution 1

This can be rendered in different ways. I would suggest the following: define some Geometry of non-rectangular shape and assign the instance to the property System.Windows.Media.Visual.VisualClip:
https://msdn.microsoft.com/en-us/library/system.windows.media.visual.visualclip%28v=vs.110%29.aspx[^].

Say, if you want a transparent round hole in your Visual, create an instance of Geometry with the hole in it:
https://msdn.microsoft.com/en-us/library/system.windows.media.geometry%28v=vs.110%29.aspx[^].

You can use derived classes like System.Windows.Media.PathGeometry or System.Windows.Media.StreamGeometry to defined geometry based on some arbitrary path or StreamGeometryContext:
https://msdn.microsoft.com/en-us/library/system.windows.media.pathgeometry%28v=vs.110%29.aspx[^],
https://msdn.microsoft.com/en-us/library/system.windows.media.streamgeometrycontext%28v=vs.110%29.aspx[^].

—SA

Posted 14-Jul-15 9:52am

Sergey Alexandrovich Kryukov

Updated 20-Jul-15 4:04am

v3

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Ziya1995 · Accepted Answer · 2015-08-03T05:28:00

1. Create 2 geometries - a drawing area and an area to clear.
2. Use PushClip of DrawingContext to clip the combined geometry of the first 2 ones combined by Exclude mode.
Warning: Use GetOutlinedPathGeometry()! Operations may be done without it too, but it will get more artifacts with complex geometries, if you don't use it. Artifacts will appear by anyway, but much more less than without GetOutlinedPathGeometry().

C#

public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
        visuals = new VisualCollection(this);
        DrawIt();
    }

    VisualCollection visuals;

    void DrawIt()
    {
        DrawingVisual visual = new DrawingVisual();
        using (DrawingContext dc = visual.RenderOpen())
        {
            RectangleGeometry rect1 = new RectangleGeometry();
            rect1.Rect = new Rect(10, 10, 100, 100);

            RectangleGeometry rect2 = new RectangleGeometry();
            rect2.Rect = new Rect(50, 50, 20, 20); // Removed it

            Geometry geom1 = rect1.GetOutlinedPathGeometry();
            Geometry geom2 = rect2.GetOutlinedPathGeometry();

            //Geometry combined1 = new CombinedGeometry(GeometryCombineMode.Exclude, rect1, rect2); // Not recommended
            Geometry combined2 = new CombinedGeometry(GeometryCombineMode.Exclude, geom1, geom2);

            dc.PushClip(combined2);

            dc.DrawRectangle(
                Brushes.White, new Pen(),
                new Rect(10, 10, 100, 100));
        }
        visuals.Add(visual);
    }

    protected override Visual GetVisualChild(int index)
    {
        return visuals[index];
    }

    protected override int VisualChildrenCount
    {
        get { return visuals.Count; }
    }
}