在无ViewModel的WPF XAML UserControl中启用Intellisense

我需要在WPF的XAML UserControl中，不使用ViewModel作为DataContext，而是将UserControl的Code Behind（即UserControl.cs）设置为DataContext，从而在开发过程中通过Intellisense查看属性的智能提示效果。

XAML代码示例 #

<UserControl x:Class="WpfAppNavigationViewControl.NavigationViewControl"
             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" 
             xmlns:local="clr-namespace:WpfAppNavigationViewControl"
             mc:Ignorable="d" 
             d:DesignHeight="450" d:DesignWidth="800"
             <!-- 添加设计时DataContext配置，开启智能提示 -->
             d:DataContext="{d:DesignInstance Type=local:NavigationViewControl, IsDesignTimeCreatable=True}">

    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="200" x:Name="PanelColumn"/>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>

        <!-- 导航面板 -->
        <StackPanel x:Name="NavigationPanel" Background="LightGray">
            <Button Content="Collapse Panel" Click="TogglePanelButton_Click"/>

            <ListView x:Name="NavigationList"
                      ItemsSource="{Binding Path=NavigationItems, RelativeSource={RelativeSource AncestorType=UserControl}}">
                <ListView.ItemTemplate>
                    <DataTemplate>
                        <Grid>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="Auto"/>
                                <ColumnDefinition Width="*"/>
                                <ColumnDefinition Width="Auto"/>
                            </Grid.ColumnDefinitions>
                            <Image Source="{Binding Path=LeftIcon}" Width="16" Height="16" Margin="5"/>
                            <TextBlock Grid.Column="1" Text="{Binding Path=Title}" VerticalAlignment="Center" Margin="5"/>
                            <Image Grid.Column="2" Source="{Binding Path=RightIcon}" Width="16" Height="16" Margin="5"/>
                        </Grid>
                    </DataTemplate>
                </ListView.ItemTemplate>
            </ListView>
        </StackPanel>

        <!-- 主内容区 -->
        <Grid Grid.Column="1">
            <TextBlock Text="Main Content Area" VerticalAlignment="Center" HorizontalAlignment="Center" FontSize="24"/>
        </Grid>
    </Grid>
</UserControl>

后台Code Behind代码示例 #

using System.Windows;
using System.Windows.Controls;
using System.Collections.Generic;

namespace WpfAppNavigationViewControl
{
    /// <summary>
    /// NavigationViewControl.xaml 的交互逻辑
    /// </summary>
    public partial class NavigationViewControl : UserControl
    {
        private bool isPanelCollapsed = false;
        private readonly GridLength expandedWidth = new GridLength(200);
        private readonly GridLength collapsedWidth = new GridLength(50);

        public NavigationViewControl()
        {
            InitializeComponent();
            DataContext = this;
        }

        public static readonly DependencyProperty NavigationItemsProperty = DependencyProperty.Register("NavigationItems",
            typeof(IEnumerable<NavigationItem>), typeof(NavigationViewControl), new PropertyMetadata(null));

        public IEnumerable<NavigationItem> NavigationItems
        {
            get { return (IEnumerable<NavigationItem>)GetValue(NavigationItemsProperty); }
            set { SetValue(NavigationItemsProperty, value); }
        }

        private void TogglePanelButton_Click(object sender, RoutedEventArgs e)
        {
            if (isPanelCollapsed)
            {
                PanelColumn.Width = expandedWidth;
                (sender as Button).Content = "Collapse Panel";
            }
            else
            {
                PanelColumn.Width = collapsedWidth;
                (sender as Button).Content = "Expand Panel";
            }
            isPanelCollapsed = !isPanelCollapsed;
        }
    }

    // 补充NavigationItem类定义，确保绑定有效
    public class NavigationItem
    {
        public string LeftIcon { get; set; }
        public string Title { get; set; }
        public string RightIcon { get; set; }
    }
}

实现智能提示的关键配置 #

要让Intellisense识别UserControl的属性并给出提示，核心是在XAML的UserControl标签中添加设计时DataContext配置：

d:DataContext="{d:DesignInstance Type=local:NavigationViewControl, IsDesignTimeCreatable=True}"

• d:DesignInstance 指定设计时使用的类型，指向当前UserControl类
• IsDesignTimeCreatable=True 允许设计器创建该类实例，从而解析并显示其属性的智能提示

完成配置后，在XAML中编写绑定时，输入{Binding Path=后就能看到NavigationItems等属性的智能提示，达到预期效果。

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