Click here to Skip to main content
13,591,670 members
Rate this:
Please Sign up or sign in to vote.
See more:
I created a button template which renders a triangle button. The template contains a number of path items placed within the canvas. When the user clicks the button, an animation is started which, beside other things, rotates one of the paths. The problem is that when the path is rotated parts of it look over the bounds of the button. Setting the ClipToBound="true" on a canvas does not help since the button is a triange and the canvas is not. My question is: How can I set the Canvas.Clip property to a Path which defines the outer border of my button? - something like:

      <Path Width="30" Height="30" Data="..." />

Any idea will be appreciated.

Posted 8-Feb-13 4:53am

1 solution

Rate this: bad
Please Sign up or sign in to vote.

Solution 2

The answer is pretty straightforward: create your instance of Geometry and assign it to the property Canvas.Clip:[^].

Only you have to do it in code, as I guess the geometry is supposed to be modified during run time.

koleraba 8-Feb-13 13:19pm
Thank you for your anwer. I was thinking about clipping the viewbox and placing the whole button template inside the viewbox so when the button is resized everything still works ok. As long I want to clip to a circle or rectangle I can use a simple EllipseGeometry or RectangleGeometry. But my clipping area is a triangle with rounded corners. Since I already have a path that describes that area I thought I would just use that. But the clip property required a PathGeometry and I have a path.
Exactly, you have everything. What's the problem?
koleraba 8-Feb-13 13:40pm
I set the ViewBox.Clip property with the same value I use for Path.Data(of the path that defines my button), but the problem is that now the button is not visible at all.
Well, that could be a bug. I don't know what you are trying to do exactly, but... fill canvas with color, to see where is it actually clipped, play with the size/location of the object; may be it's close, barely behind the clip, use the debugger... this is all just a matter of debugging.

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

  Print Answers RSS
Top Experts
Last 24hrsThis month

Advertise | Privacy | Cookies | Terms of Service
Web01-2016 | 2.8.180618.1 | Last Updated 8 Feb 2013
Copyright © CodeProject, 1999-2018
All Rights Reserved.
Layout: fixed | fluid

CodeProject, 503-250 Ferrand Drive Toronto Ontario, M3C 3G8 Canada +1 416-849-8900 x 100