WPF技术问询：如何通过UserControl内按钮切换ContentControl内容？

首先直接说结论：没有直接让uc1访问MainWindow中ContentControl的优雅方法，因为这种跨层级的直接访问会导致控件间强耦合，后续代码的维护和扩展都会变得很麻烦。下面给你几个实用的可行方案，按耦合度从高到低排列：

方案1：通过自定义事件实现 #

在uc1中定义一个自定义事件，当按钮点击时触发这个事件，MainWindow订阅该事件后执行内容切换逻辑。这样uc1不需要知道MainWindow的存在，只负责通知“我要切换视图了”，耦合度较低。

uc1.xaml.cs 修改代码： #

public partial class UserControl1 : UserControl
{
    // 定义自定义事件
    public event EventHandler RequestSwitchToUC2;

    public UserControl1()
    {
        InitializeComponent();
    }

    // 按钮点击事件处理
    private void SwitchButton_Click(object sender, RoutedEventArgs e)
    {
        // 触发事件，通知订阅者
        RequestSwitchToUC2?.Invoke(this, EventArgs.Empty);
    }
}

MainWindow.xaml.cs 修改代码： #

public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
        var uc1 = new UserControl1();
        // 订阅uc1的自定义事件
        uc1.RequestSwitchToUC2 += Uc1_RequestSwitchToUC2;
        this.cc.Content = uc1;
    }

    private void Uc1_RequestSwitchToUC2(object sender, EventArgs e)
    {
        // 切换到uc2
        this.cc.Content = new UserControl2();
    }
}

方案2：通过委托实现 #

和事件逻辑类似，但更轻量化，适合简单场景。在uc1中定义一个委托属性，MainWindow将切换逻辑赋值给这个委托，uc1按钮点击时直接调用委托即可。

uc1.xaml.cs 修改代码： #

public partial class UserControl1 : UserControl
{
    // 定义委托类型
    public delegate void SwitchViewDelegate();
    // 委托属性
    public SwitchViewDelegate OnSwitchView { get; set; }

    public UserControl1()
    {
        InitializeComponent();
    }

    private void SwitchButton_Click(object sender, RoutedEventArgs e)
    {
        // 调用委托执行切换逻辑
        OnSwitchView?.Invoke();
    }
}

MainWindow.xaml.cs 修改代码： #

public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
        var uc1 = new UserControl1();
        // 给委托赋值切换逻辑
        uc1.OnSwitchView = () => { this.cc.Content = new UserControl2(); };
        this.cc.Content = uc1;
    }
}

方案3：MVVM模式（推荐） #

这是WPF开发的最佳实践，通过数据绑定实现视图切换，完全解除控件间的耦合。核心是定义一个视图模型（ViewModel），让ContentControl绑定ViewModel中的当前视图属性，uc1通过命令修改该属性，自动触发视图切换。

步骤1：定义基础类（可选但推荐） #

// 实现INotifyPropertyChanged，用于属性变更通知
public class ViewModelBase : INotifyPropertyChanged
{
    public event PropertyChangedEventHandler PropertyChanged;
    protected void OnPropertyChanged(string propertyName)
    {
        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
    }
}

// 实现ICommand，用于绑定按钮命令
public class RelayCommand : ICommand
{
    private readonly Action _execute;
    private readonly Func<bool> _canExecute;

    public RelayCommand(Action execute, Func<bool> canExecute = null)
    {
        _execute = execute ?? throw new ArgumentNullException(nameof(execute));
        _canExecute = canExecute;
    }

    public bool CanExecute(object parameter) => _canExecute?.Invoke() ?? true;
    public void Execute(object parameter) => _execute();
    public event EventHandler CanExecuteChanged
    {
        add => CommandManager.RequerySuggested += value;
        remove => CommandManager.RequerySuggested -= value;
    }
}

步骤2：定义主视图模型 #

public class MainViewModel : ViewModelBase
{
    private object _currentView;
    public object CurrentView
    {
        get => _currentView;
        set
        {
            _currentView = value;
            OnPropertyChanged(nameof(CurrentView));
        }
    }

    public ICommand SwitchToUC2Command { get; }

    public MainViewModel()
    {
        // 初始视图设为uc1
        CurrentView = new UserControl1();
        // 初始化切换命令
        SwitchToUC2Command = new RelayCommand(() => CurrentView = new UserControl2());
    }
}

步骤3：修改MainWindow.xaml #

<Window x:Class="YourNamespace.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:local="clr-namespace:YourNamespace">
    <Window.DataContext>
        <local:MainViewModel />
    </Window.DataContext>
    <Grid>
        <!-- ContentControl绑定CurrentView属性 -->
        <ContentControl Content="{Binding CurrentView}" />
    </Grid>
</Window>

步骤4：修改uc1.xaml，绑定命令 #

<UserControl x:Class="YourNamespace.UserControl1"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
    <Grid>
        <!-- 按钮绑定ViewModel的SwitchToUC2Command -->
        <Button Content="切换到UC2" Command="{Binding DataContext.SwitchToUC2Command, RelativeSource={RelativeSource AncestorType=Window}}" />
    </Grid>
</UserControl>

这个方案虽然代码量稍多，但完全遵循了WPF的设计思想，控件间没有直接依赖，后续扩展更多视图会非常方便。

内容的提问来源于stack exchange，提问作者Kacper Serewis