adding User control / Page to windows xaml programmatically in WPF

Question

I want to switch between my two user controls AddUsers.xaml (user control) and Viewusers.xaml(user Control) programmatically in Window1.xaml (main Window).

I'm trying to switch user controls by Button Event in Window1.xaml.

my Window1. xaml goes like this

 <Window x:Class="SwitchUsers.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="MainWindow" Height="500" Width="525">
<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="100" />
        <RowDefinition Height="400*" />
    </Grid.RowDefinitions>
    <StackPanel Grid.Row="0" >
    <Button Content="Swithc User Control " Height="23" HorizontalAlignment="Right"     Margin="0,40,284,0" Name="btnSwittch" VerticalAlignment="Center" Width="168" />
    </StackPanel>

    <StackPanel Grid.Row="1" >
       <!--Here I want to display  two user controls by switching from button on Top -->            
    </StackPanel>
</Grid> 

I have two User Controls addUser.xaml and viewUser.xaml

addUser. xaml code:

 <UserControl x:Class="SwitchUsers.addUser"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
         xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
         mc:Ignorable="d" 
         d:DesignHeight="300" d:DesignWidth="300" Loaded="UserControl_Loaded">
     <Grid>
    <TextBlock Height="23" HorizontalAlignment="Left" Margin="29,79,0,0"  Name="textBlock1" Text=" Enter Your Name" VerticalAlignment="Top" />
    <TextBlock Height="23" HorizontalAlignment="Left" Margin="29,105,0,0" Name="textBlock2" Text="Enter Your Password" VerticalAlignment="Top" />
    <TextBox Height="23" HorizontalAlignment="Left" Margin="144,76,0,0" Name="txtBxName" VerticalAlignment="Top" Width="120" />
    <TextBox Height="23" HorizontalAlignment="Left" Margin="144,105,0,0" Name="txtBxPassword" VerticalAlignment="Top" Width="120" />
    <Button Content="Log In" Height="23" HorizontalAlignment="Left" Margin="171,160,0,0" Name="btnLogin" VerticalAlignment="Top" Width="93" />
    </Grid>
    </UserControl>

and my second user control viewUser.xaml

  <UserControl x:Class="SwitchUsers.viewUser"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
         xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
         mc:Ignorable="d" 
         d:DesignHeight="300" d:DesignWidth="300">
   <Grid>
    <!--    I hidden  all UI Controls here to keep code short -->    
   </Grid>
</UserControl>

Answer 1

First you need to give your stack panel a name

<StackPanel Name="myStack"  Grid.Row="1" >
</StackPanel>

Then you need something similar to

public partial class MainWindow : Window
{
    private addUser _addUser;
    private viewUser _viewUser;
    private Control _currentUser;

    public MainWindow()
    {
        InitializeComponent();

        _addUser = new addUser();
        _viewUser = new viewUser();
        _currentUser = _viewUser;
        myStack.Children.Add(_currentUser);
    }

    private void button1_Click(object sender, RoutedEventArgs e)
    {
        myStack.Children.Clear();
        if (_currentUser == _addUser)
        {
            _currentUser = _viewUser;
        }
        else
        {
            _currentUser = _addUser;
        }
        myStack.Children.Add(_currentUser);
    }

}