Question

I have a canvas placed into a grid. And the grid is placed into a border. When I draw some item (a white line for instance) on the canvas, this item lays over the border, so the border is erasing. Does anybody know how I can avoid it? I tried to set margin to the canvas, larger border’s size than the canvas’s one, but nothing helps.

This is my xaml:

<Border BorderThickness="1"  BorderBrush="#333333" Opacity="1" Name="inner_canvas_border">
    <Grid Name="grid1">
        <Canvas Name="Canvas1"HorizontalAlignment="Center" VerticalAlignment="Center" Width="700" Height="450" />
    </Grid>
</Border>

Answer 1

The default value of the ClipToBounds property on the Canvas is false. Set this to true, and that will prevent elements that are outside of the bounds of the Canvas from displaying outside the bounds of the Canvas:

<Border
  BorderThickness="1"
  BorderBrush="#333333"
  Opacity="1"
  Name="inner_canvas_border">
  <Grid
    Name="grid1">
    <Canvas
      Name="Canvas1"
      HorizontalAlignment="Center"
      VerticalAlignment="Center"
      Width="700"
      Height="450"
      ClipToBounds="True" /><!-- This line here -->
  </Grid>
</Border>