want to clip a canvas as a mouse is dragged on the edge of it

 

So this is common request in apps these days.

Here’s the code that someone at silverlight.net forums posted. I’ve copied it here cause it’s a good simple snippet of code

XAML


<Canvas Canvas.Left="0" Canvas.Top="200">
  <Rectangle Width="300" Height="400" Fill="Black" Cursor="Hand" MouseLeftButtonUp="ChangeClip"/>
  <Canvas.Clip >
  <RectangleGeometry x:Name="ClipRect" Rect='0, 0, 300, 400' />
  </Canvas.Clip>
  </Canvas>


Javascript


 function ChangeClip(sender, args)
{
  var clip = sender.findName("ClipRect");
  clip["Rect"]="0, 0, 300, 100";}