When creating a UserControl in WPF, I find it convenient to give it some arbitrary Height and Width values so that I can view my changes in the Visual Studio designer. When I run the control, however, I want the Height and Width to be undefined, so that the control will expand to fill whatever container I place it in. How can I acheive this same functionality without having to remove the Height and Width values before building my control? (Or without using DockPanel in the parent container.)
The following code demonstrates the problem:
<Window x:Class='ExampleApplication3.Window1' xmlns='http://schemas.microsoft.com/winfx/2006/xaml/presentation' xmlns:x='http://schemas.microsoft.com/winfx/2006/xaml' xmlns:loc='clr-namespace:ExampleApplication3' Title='Example' Height='600' Width='600'> <Grid Background='LightGray'> <loc:UserControl1 /> </Grid> </Window>
The following definition of UserControl1 displays reasonably at design time but displays as a fixed size at run time:
<UserControl x:Class='ExampleApplication3.UserControl1' xmlns='http://schemas.microsoft.com/winfx/2006/xaml/presentation' xmlns:x='http://schemas.microsoft.com/winfx/2006/xaml' Height='300' Width='300'> <Grid Background='LightCyan' /> </UserControl>
The following definition of UserControl1 displays as a dot at design time but expands to fill the parent Window1 at run time:
<UserControl x:Class='ExampleApplication3.UserControl1' xmlns='http://schemas.microsoft.com/winfx/2006/xaml/presentation' xmlns:x='http://schemas.microsoft.com/winfx/2006/xaml'> <Grid Background='LightCyan' /> </UserControl>
In Visual Studio add the Width and Height attribute to your UserControl XAML, but in the code-behind insert this
This checks to see if the control is running in Design-mode. If not (i.e. runtime) it will set the Width and Height to NaN (Not a number) which is the value you set it to if you remove the Width and Height attributes in XAML.
So at design-time you will have the preset width and height (including if you put the user control in a form) and at runtime it will dock depending on its parent container.
Hope that helps.