Stretching a WPF Canvas Horizontally

Question

How do I make a Canvas Stretch fully Horizontally with variable width? This is the Parent Canvas, so it has no parents, only Children.

XAML Source: it displays in blend http://resopollution.com/xaml.txt

Answer 1

You could use a dock panel to get it to fill the available width. The last item in a dock panel list of controls is automatically stretched to fill the remaining space.

<DockPanel>
   <Canvas />
</DockPanel>

Answer 2

The canvas should do this automatically, unless you are manually setting the height and/or width. What kind of control are you trying to place the canvas on? Can you post your code?

Answer 3

I'm guessing you've tried
canvas.HorizontalAlignment = HorizontalAlignment.Stretch

If this doesn't work, then what you could do is bind the Width and Height properties of the canvas to the ActualWidth and ActualHeight properties of the containing window.

Answer 4

Use a Grid as the top level element in your UI - it'll stretch to fill its container. Then put a Canvas with HorizontalAlignment="Stretch" inside the Grid and it'll behave the way you want.

<Grid xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"&gt;
  <Canvas Background="Blue"/>
</Grid>

That worked for me. The key is your top level UI element. While a Grid fills all available space by default, Canvases take up only as much room as their contents demand.

Answer 5

The problem is that you're specifying the Height and Width. Without these properties, the control may appear to vanish in the designer, but it should size appropriately when you insert the canvas into another control.

If I recall correctly, the next version of WPF will have 'DesignWidth' and 'DesignHeight' properties that allow you to show the control in the designer with a given size without effecting it's measurement when inserted into other controls.