XAML、C# - 绑定到用户创建的控件的属性

Question

如果这个问题不一定有意义，我提前道歉，但我是编程新手。 o_0

我在 Blend 中创建了一个用户定义的 XAML 控件，该控件充当按钮：

<Style x:Key="GeekMDCalc_Button_Std." TargetType="Button">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Button">
                        <Canvas x:Name="canvas" Width="200" Height="200" Background="#FFA09F9F">
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="CommonStates">
                                    <VisualStateGroup.Transitions>
                                        <VisualTransition GeneratedDuration="0:0:0.15"/>
                                    </VisualStateGroup.Transitions>
                                    <VisualState x:Name="Normal"/>
                                    <VisualState x:Name="Pressed">
                                        <Storyboard>
                                            <ColorAnimation Duration="0" To="#FF0CFF00" Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)" Storyboard.TargetName="rectangle" d:IsOptimized="True"/>
                                            <ColorAnimation Duration="0" To="White" Storyboard.TargetProperty="(Panel.Background).(SolidColorBrush.Color)" Storyboard.TargetName="canvas" d:IsOptimized="True"/>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Disabled"/>
                                    <VisualState x:Name="PointerOver">
                                        <Storyboard>
                                            <ColorAnimation Duration="0" To="#FF0CFF00" Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)" Storyboard.TargetName="rectangle" d:IsOptimized="True"/>
                                        </Storyboard>
                                    </VisualState>
                                </VisualStateGroup>
                                <VisualStateGroup x:Name="FocusStates">
                                    <VisualState x:Name="Focused"/>
                                    <VisualState x:Name="PointerFocused"/>
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
                            <Rectangle x:Name="rectangle" Fill="#FFF4F4F5" Height="57" Width="200" Canvas.Top="143"/>
                            <ContentPresenter Height="57" Canvas.Top="143" Width="190" HorizontalAlignment="Center" VerticalAlignment="Bottom" Foreground="Black" Canvas.Left="10"/>
                            <Image x:Name="image" Height="128" Canvas.Left="10" Canvas.Top="10" Width="180"/>
                        </Canvas>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

然后，我在 GridView 中单独添加按钮：

<GridView Grid.ColumnSpan="2" Grid.Column="1" HorizontalAlignment="Left" Grid.Row="2" VerticalAlignment="Top" FontFamily="Global User Interface">
        <Button Content="Emergency" Style="{StaticResource GeekMDCalc_Button_Std.}" FontFamily="DilleniaUPC" FontSize="45.33" FontWeight="Light"/>
        <Button Content="Intensive Care" Style="{StaticResource GeekMDCalc_Button_Std.}" FontFamily="DilleniaUPC" FontSize="45.33" FontWeight="Light"/>
        <Button Content="Internal Med." Style="{StaticResource GeekMDCalc_Button_Std.}" FontFamily="DilleniaUPC" FontSize="45.33" FontWeight="Light"/>
        <Button Content="Surg/Trauma" Style="{StaticResource GeekMDCalc_Button_Std.}" FontFamily="DilleniaUPC" FontSize="45.33" FontWeight="Light"/>
        <Button Content="Renal" Style="{StaticResource GeekMDCalc_Button_Std.}" FontFamily="DilleniaUPC" FontSize="45.33" FontWeight="Light"/>
        <Button Content="Electrolytes" Style="{StaticResource GeekMDCalc_Button_Std.}" FontFamily="DilleniaUPC" FontSize="45.33" FontWeight="Light"/>
        <Button Content="Cardiology" Style="{StaticResource GeekMDCalc_Button_Std.}" FontFamily="DilleniaUPC" FontSize="45.33" FontWeight="Light"/>
        <Button Content="Pediatrics" Style="{StaticResource GeekMDCalc_Button_Std.}" FontFamily="DilleniaUPC" FontSize="45.33" FontWeight="Light"/>
        <Button Content="Neurology" Style="{StaticResource GeekMDCalc_Button_Std.}" FontFamily="DilleniaUPC" FontSize="45.33" FontWeight="Light"/>
        <Button Content="GI" Style="{StaticResource GeekMDCalc_Button_Std.}" FontFamily="DilleniaUPC" FontSize="45.33" FontWeight="Light"/>
        <Button Content="General" Style="{StaticResource GeekMDCalc_Button_Std.}" FontFamily="DilleniaUPC" FontSize="45.33" FontWeight="Light"/>
    </GridView>

我

正在尝试通过将图像绑定到我创建的控件模板中的图像容器来应用背景，但我没有任何运气。我希望这些按钮中的每一个都有单独的背景，我希望在我的代码隐藏中定义这些背景。我尝试搜索了几个小时，但我似乎找不到一种轻松更改我创建的按钮控件的图像源的方法。

感谢您的帮助，以及对新手^_^的耐心

Answer 1

你不需要样式中的图像，我也会称之为不好的做法。按钮是一个ContentPresenter，所以它的主要目的是"呈现内容"，Content本身可以是任何东西;另一个控件、图像、字符串或自定义类。因此，您可以直接将图像分配给按钮，而无需在模板中添加 Image 对象。如果Content不是 WPF 控件，则 WPF 需要一些有关如何显示Content的指导。所以你需要告诉他你想要内容的外观，准确地说，这是用模板完成的，一个DataTemplate。如果你只需要一个图标，这应该就足够

了

<Button>
   <Image Source="SomeIcon"/>
</Button>

如果您需要更多内容作为内容显示，则需要定义一个 DataTemplate，我建议您使用一些 DataBinding 来充分发挥其潜力。这是一个简短的例子：

class MyButtonInfo
{
    public ImageSource Icon{get;set;}
    public string Caption{get;set;}
    public Command Command{get;set;}
}
<DataTemplate x:Key="MyTemplate">
    <StackPanel>
        <Image Source="{Binding Icon}"/>
        <TextBlock Text="{Binding Caption}"/>
    </StackPanel>
</DataTemplate>
<Button Content="{Binding ButtonInfo}" ContentTemplate="{StaticResource MyTemplate}" Command="{Binding Command}">
</Button>