How do I change the contents of a UserControl by using a button on another UserControl?

Since I already have a response using code-behind, I'll give a solution using MVVM.

The property you want to fill in is called "content". We must connect it to a ViewModel property that will represent the UserControl. First let's create a ViewModel:

public class ViewModel : INotifyPropertyChanged
{
    //Implementacao do INotifyPropertyChanged 
    public event PropertyChangedEventHandler PropertyChanged;

    private UserControl controle;
    public UserControl Controle
    {
       get { return controle; }
       set
       {
          controle = value;
          OnPropertyChanged("Controle");
       }
    }

    public List<UserControlModel> Controle { get; set; } //Lista dos UserControls

    public Command<string> MudarControle { get; set; } 

    public ViewModel()
    {
        Controles = new List<UserControlModel>();
        //Preencher lista aqui;
        MudarControle = new Command<string>(Alterar);            
    }

    protected void Alterar(string UserControl)
    {
        //Simplifiquei, mas aqui vai uns testes para saber se o controle existe mesmo na lista
        Controle = Controles.FirstOrDefault(c => c.Nome == UserControl);
    }
}

Now we've created our model:

public class UserControlModel
{
    public string Nome { get; set; }
    public UserControl Controle { get; set; }

    public UserControlModel() { }

    public UserControlModel(string nome, UserControl user)
    {
        Nome = nome;
        Controle = user;
    }
}

And now just call the Bindings:

In your MainWindow class:

public partial class MainWindow : Window
{

    public MainWindow()
    {
        InitializeComponent();
        DataContext = new ViewModel();
    }
}

And the xaml:

<ContentControl Content="{Binding Controle.Controle}"/>

Note that here is the menu button that will fill the ContentControl

<Button Content="Item1" Height="50" Width="100" Command="{Binding MudarControle}" CommandParameter="Item1"/>

Here is a very simplistic example where the buttons are already preset in the menu, but changing this code to both sides of the grid change according to the context is quite simple. It follows the same mechanics. If you are in doubt on how to implement the command class, take a look at this link:

link

A simple way to resolve without MVVM is through the use of delegate and event .

MainWindow.xaml

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="100" />
        <RowDefinition Height="*" />
    </Grid.RowDefinitions>

    <local:Menu Grid.Row="0" OnUserControlAlterado="Menu_OnUserControlAlterado" />

    <ContentControl x:Name="ContentArea" Grid.Row="1">
        <local:HomePage />
    </ContentControl>
</Grid>

MainWindow.cs

public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
    }

    private void Menu_OnUserControlAlterado(UserControl control)
    {
        ContentArea.Content = control;
    }
}

Menu.xaml

 <StackPanel Orientation="Horizontal">
    <Button x:Name="BotaoHome" Content="Home" Height="50" Width="100" Click="BotaoHome_Click" />
    <Button x:Name="BotaoListaUsuarios" Content="Lista Usuários" Height="50" Width="100" Click="BotaoListaUsuarios_Click"/>
 </StackPanel>

Menu.cs

public partial class Menu : UserControl
{
    public Menu()
    {
        InitializeComponent();
    }

    public delegate void UserControlAlterado(UserControl control);
    public event UserControlAlterado OnUserControlAlterado;

    private void BotaoHome_Click(object sender, RoutedEventArgs e)
    {
        OnUserControlAlterado?.Invoke(new HomePage());
    }

    private void BotaoListaUsuarios_Click(object sender, RoutedEventArgs e)
    {
        OnUserControlAlterado?.Invoke(new ListaUsuarios());
    }
}