WPF中如何从Button样式模板绑定到PersonViewModel的属性？

嘿，这个问题其实是WPF数据绑定里很典型的DataContext上下文流转问题，咱们一步步拆解解决：

核心问题分析 #

你的ItemsControl每个Item的DataContext是PersonViewModel，但Button的ContentTemplate默认的DataContext是Button的Content属性——而你现在没给Button设置Content，所以ContentTemplate里的Binding找不到目标属性。咱们有两种简单的解决思路：

方案1：把Button的Content绑定到Item的ViewModel #

直接在ItemTemplate的Button里把Content绑定到当前的DataContext（也就是PersonViewModel），这样ContentTemplate就能直接继承这个上下文：

修改你的ItemsControl.ItemTemplate：

<ItemsControl.ItemTemplate>
    <DataTemplate>
        <!-- 关键：把Content绑定到当前的PersonViewModel -->
        <Button Style="{StaticResource ImageButton}" Content="{Binding}" />
    </DataTemplate>
</ItemsControl.ItemTemplate>

然后在Button样式的ContentTemplate里，直接绑定Visible属性（记得要加布尔转可见性的转换器，因为Visibility是枚举类型）：

<Style x:Key="ImageButton" TargetType="Button">
    <Setter Property="ContentTemplate">
        <Setter.Value>
            <DataTemplate>
                <Grid>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="20" />
                    </Grid.RowDefinitions>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="20" />
                        <ColumnDefinition Width="20" />
                    </Grid.ColumnDefinitions>
                    <!-- 现在直接绑定Visible，再转成Visibility -->
                    <TextBlock Visibility="{Binding Visible, Converter={StaticResource BooleanToVisibilityConverter}}" 
                               Grid.Row="0" Grid.Column="1" />
                </Grid>
            </DataTemplate>
        </Setter.Value>
    </Setter>
</Style>

方案2：用RelativeSource直接获取Button的DataContext #

如果你不想修改Button的Content，可以通过RelativeSource向上查找父级Button，直接获取它的DataContext（也就是PersonViewModel）：

直接修改样式里的TextBlock绑定：

<Style x:Key="ImageButton" TargetType="Button">
    <Setter Property="ContentTemplate">
        <Setter.Value>
            <DataTemplate>
                <Grid>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="20" />
                    </Grid.RowDefinitions>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="20" />
                        <ColumnDefinition Width="20" />
                    </Grid.ColumnDefinitions>
                    <!-- 通过RelativeSource找到Button，取它的DataContext里的Visible属性 -->
                    <TextBlock Visibility="{Binding DataContext.Visible, 
                                                   RelativeSource={RelativeSource AncestorType=Button},
                                                   Converter={StaticResource BooleanToVisibilityConverter}}" 
                               Grid.Row="0" Grid.Column="1" />
                </Grid>
            </DataTemplate>
        </Setter.Value>
    </Setter>
</Style>

必备补充：布尔转可见性转换器 #

不管用哪种方案，你都需要在XAML资源里声明BooleanToVisibilityConverter（WPF内置了这个转换器，直接用就行）：

<Window.Resources>
    <BooleanToVisibilityConverter x:Key="BooleanToVisibilityConverter" />
</Window.Resources>

这个转换器会把true转成Visibility.Visible，false转成Visibility.Collapsed（如果想要转成Hidden，可以自己实现自定义转换器）。

验证小技巧 #

如果绑定出问题，你可以打开WPF的调试输出（Visual Studio的输出窗口，勾选“调试”->“输出”里的WPF绑定跟踪），里面会显示绑定失败的详细原因，帮你快速定位问题。

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