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

您不需要樣式中的圖像，我也稱其為不好的做法。 Button是ContentPresenter ，所以它的主要目的是“呈現內容”， Content本身可以是任何東西。 另一個控件，圖像字符串或自定義類。 因此，您可以直接將圖像分配給按鈕，而無需在模板中添加Image對象。 如果您的Content不是WPF控件，則WPF需要一些有關如何顯示Content的指導。 因此，您需要告訴他您想要內容如何顯示，這是通過一個精確的Template（一個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>