Let us pose a simple example where we will see how to create a UserControl and instantiate it declaratively (XAML) and from code (Code-Behind). The application will show a form where the user will be able to enter their name and address. The form will be encapsulated in a UserControl, and this will be instantiated by the Page.

Hands on! We will start from a Silverlight blank project (created in the same way we showed in the previous chapter). The name of this new project will be Chapter2.Sample.Forms, as shown in the following screenshot:

If we break down the chain which defines namespace, we can see four parts:

We are ready to instantiate the control. In order to do this, we add the control within the main layout element. The right way is namespace:control.

<StackPanel x:Name="LayoutRoot" Background="White" Orientation="Vertical" Margin="10" >
  <MyControls:MyControlUCViewx:Name="myControl">
  </MyControls:MyControlUCView>
</StackPanel>

When we execute this, we see the control is instantiated.

Before going to the code file, we need to add a button to the page. At the click of this button, we can add a new instance of our UserControl.

To do this, open the MainPage.XAML file and add the following code, which defines a button in our main layout.

<StackPanel x:Name="LayoutRoot" Background="White" Orientation="Vertical" Margin="10">
  <Button x:Name="btnAddUserControl" Content="Add Control" Width="100" Height="30" Click="btnAddUserControl_Click"/>
</StackPanel>

When we observe the XAML code which defines the button, we see it specifies a function to manage the action when the user clicks. Instead of copying the code, if we write it manually and we write Click, Visual Studio brings us the possibility of creating an event handler automatically (we only need to press Tab or Enter once, and the pop-up helper window is displayed) as shown in the following figure:

Now, we can navigate to the implementation of the event handler by right-clicking on the event and choosing Navigate to Event Handler. Let's add few lines of code to create a new instance of the control MyControlUCView and add it to the object collection in the main layout container:

private void btnAddUserControl_Click(object sender, RoutedEventArgs e)
{
  //Create a new Instance of our User Control
  MyControlUCView myUC = new MyControlUCView();
  //Add the control to the Container of our MainPage
  LayoutRoot.Children.Add(myUC);
}

If we copy the code, the compiler will show an error, as it will not find the definition for MyControlUCView, because it is located in a different namespace. We must add a reference to it via the using clause in the following manner:

using Chapter2.Sample.Forms.Views;

When we execute the previous code, we will be able to see how it instantiates and also shows the control when we press the button.