按类型改变 xaml 模板

Question

下面是一段 DataTemplate，它定义了一条用于联系客户的命令（带图像的按钮）。目前是为电话联系人定义的，还有几个命令，所以我想将它重用于其他类型的联系方式（电子邮件等）

它和它背后的视图模型的设计方式，只有两件事需要改变才能做到这一点：

1. ContactCommand 按钮的图像和工具提示
2. 整个最后一个按钮

似乎最可重用的方法是让整个按钮本身成为一个 DataTemplate，并在本文底部定义一个 DataType，但我不知道原始 DataTemplate 将如何使用它。尽管听起来很有希望，但我也从未使用过 DataTemplateSelector。

最好的方法是什么？代码看起来如何？

干杯，
浆果

当前数据模板

<DataTemplate x:Key="TelecomNumbersControlCommands">

    <DataTemplate.Resources>

        <!-- Image Style -->
        <Style TargetType="{x:Type Image}">
            <Setter Property="Height" Value="16" />
            <Setter Property="Width" Value="16" />
        </Style>

    </DataTemplate.Resources>

    <StackPanel Orientation="Horizontal" Margin="5,0,5,0">

        <Button Command="{Binding AddCommand}" >
            <Image Source="{resx:Resx Key=Img_Simplicio_Add, ResxName=Presentation.Resources.MasterDetail}" />
            <Button.ToolTip>
                <TextBlock>
                    <TextBlock.Text>
                        <resx:Resx Key="Subject_AddNew_ToolTip" BindingPath="SubjectVm.DisplayName" ResxName="Presentation.Resources.MasterDetail"/>
                    </TextBlock.Text>
                </TextBlock>
            </Button.ToolTip>
        </Button>

        <Button Command="{Binding ContactCommand}" >
            <Image Source="{resx:Resx Key=Img_Telephone, ResxName=Smack.Parties.Presentation.Resources.PartyDetailView}" />
            <Button.ToolTip>
                <TextBlock>
                    <TextBlock.Text>
                        <resx:Resx Key="ContactCommand_Telephone_Tooltip" BindingPath="SelectedVm" ResxName="Smack.Parties.Presentation.Resources.PartyDetailView"/>
                    </TextBlock.Text>
                </TextBlock>
            </Button.ToolTip>
        </Button>

        </Button>

        <Button Command="{Binding SetDefaultAreaCodeCommand}" >
            <Image Source="{resx:Resx Img_Widget, ResxName=Presentation.Resources.MasterDetail}" />
            <Button.ToolTip>
                <TextBlock>
                    <TextBlock.Text>
                        <resx:Resx Key="Subject_Settings" BindingPath="SubjectVm.DisplayName" ResxName="Presentation.Resources.MasterDetail"/>
                    </TextBlock.Text>
                </TextBlock>
            </Button.ToolTip>
        </Button>

        ...

    </StackPanel>

</DataTemplate>

给瑞秋

带有隐式数据模板的修订按钮

<Button Command="{Binding ContactCommand}" >
    <Button.Resources>
        <DataTemplate DataType="{x:Type CmTypes:TelecomNumberPcmShellVm}">
            <Image Source="{resx:Resx Key=Img_Telephone, ResxName=Presentation.Resources.PartyDetailView}" >
                <Image.ToolTip>
                    <TextBlock>
                        <TextBlock.Text>
                            <resx:Resx 
                                Key="ContactCommand_Telephone_Tooltip" 
                                BindingPath="SelectedVm" ResxName="Presentation.Resources.PartyDetailView"/>
                        </TextBlock.Text>
                    </TextBlock>
                </Image.ToolTip>
            </Image>
        </DataTemplate>
    </Button.Resources>
        <DataTemplate DataType="{x:Type CmTypes:EmailPcmShellVm}">
            <Image Source="{resx:Resx Key=Img_Email, ResxName=Presentation.Resources.PartyDetailView}" >
                <Image.ToolTip>
                    <TextBlock>
                        <TextBlock.Text>
                            <resx:Resx 
                                Key="ContactCommand_Email_Tooltip" 
                                BindingPath="SelectedVm" ResxName="Presentation.Resources.PartyDetailView"/>
                        </TextBlock.Text>
                    </TextBlock>
                </Image.ToolTip>
            </Image>
        </DataTemplate>
</Button>

Object Model

public class PcmShellVm<TCm> : SatelliteViewModel<Party, HashSet<PartyContactMechanism>> 
    where TCm : ContactMechanism
{
    // commands...
}

public class TelephoneNumberPcmShellVm : PcmShellVm<Telephone>
{
    ...
}

public class EmailPcmShellVm : PcmShellVm<Email>
{
    ...
}

对象模型

public class PcmShellVm<TCm> : SatelliteViewModel<Party, HashSet<PartyContactMechanism>> 
    where TCm : ContactMechanism
{
    // commands...
}

public class TelephoneNumberPcmShellVm : PcmShellVm<Telephone>
{
    ...
}

public class EmailPcmShellVm : PcmShellVm<Email>
{
    ...
}

Answer 1

您在最后一个代码块中的DataTemplate 不起作用，因为您将DataTemplate 放入Button.Content。如果你把它放在<Button.Resources> 中，它应该可以工作，前提是Button.Content 的类型是CmTypes:TelecomNumberPcmShellVm

此外，您需要切换到Image.ToolTip 以向图像添加工具提示，因为Button.ToolTip 不是您的DataTemplate 的有效属性

<Button Command="{Binding ContactCommand}">
    <Button.Resources>
        <DataTemplate DataType="{x:Type CmTypes:TelecomNumberPcmShellVm}">
            <Image Source="{resx:Resx Key=Img_Telephone, ResxName=Presentation.Resources.PartyDetailView}">
                <Image.ToolTip>
                    <TextBlock>
                        <TextBlock.Text>
                            <resx:Resx Key="ContactCommand_Telephone_Tooltip" 
                                       BindingPath="SelectedVm" 
                                       ResxName="Presentation.Resources.PartyDetailView"/>
                        </TextBlock.Text>
                    </TextBlock>
                </Image.ToolTip>
            </Image>
        </DataTemplate>
    </Button.Resources>
</Button>

如果您确实想设置Button.ToolTip 而不是Image.ToolTip，那么您可能需要在Button.Style 中的DataTrigger 中设置它。通常对于这种情况，我有一个返回 typeof(value) 的转换器，所以我的 DataTrigger 看起来像这样：

<DataTrigger Binding="{Binding Converter={StaticResource ObjectToTypeConverter}}" 
             Value="{x:Type CmTypes:TelecomNumberPcmShellVm}">
    <Setter Property="ToolTip" ... />
</DataTrigger>

这也可用于设置Button.ContentTemplate，而不是使用如上所示的隐式数据模板。