Question

问题： 我想在XAML中创建一个按钮模板，我将图像源绑定到内容呈现器内容框或任何类似的内容。

解决方案的必需参数： 据我所知，对于标准按钮，我可以在按钮上添加堆叠面板或网格，将图像插入到所述容器中并将其称为一天。但是，我不是Windows'chrome'外观的粉丝，也不是蓝色鼠标，点击和聚焦效果的粉丝。我正在尝试做的是创建一个新的按钮模板（编辑默认按钮模板的副本并删除chrome容器），该模板具有基本模板的功能，可以选择在添加更多按钮时更改图像。 / p>

我尝试过的事情及其结果：

<Button x:Name="btn">
    <StackPanel>
        <Image source="imgsource.png"/>
    </StackPanel>
</Button>

结果：具有按钮效果。如果没有别的可能，可以退回但我不喜欢它。

<Setter Property="Template">
    <Setter.Value>
        <ControlTemplate TargetType="{x:Type Button}">
            <Border x:Name="bContainer" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" HorizontalAlignment="{TemplateBinding HorizontalAlignment}" Height="{TemplateBinding Height}" VerticalAlignment="{TemplateBinding VerticalAlignment}" Width="{TemplateBinding Width}">
                <Grid x:Name="gBody" Background="#FF3C3C3C"/>
            </Border>
            <ControlTemplate.Triggers>
                <Trigger Property="IsKeyboardFocused" Value="true"/>
                <Trigger Property="ToggleButton.IsChecked" Value="true"/>
                <Trigger Property="IsEnabled" Value="false">
                    <Setter Property="Foreground" Value="#ADADAD"/>
                </Trigger>
            </ControlTemplate.Triggers>
        </ControlTemplate>
    </Setter.Value>
</Setter>    

<Button Style="{DynamicResource ButtonStyle}">
    <Grid>
        <Image Source="imgsource.png"/>
    </Grid>
</Button>

结果：图像未显示。我认为这是由于按钮自定义模板，但我对此的了解有限，所以我没有深入研究。

<Setter Property="Template">
    <Setter.Value>
        <ControlTemplate TargetType="{x:Type Button}">
            <Border x:Name="bContainer" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" HorizontalAlignment="{TemplateBinding HorizontalAlignment}" Height="{TemplateBinding Height}" VerticalAlignment="{TemplateBinding VerticalAlignment}" Width="{TemplateBinding Width}">
                <Image x:Name="iImage" Source="{Binding Content, RelativeSource={RelativeSource TemplatedParent}}" HorizontalAlignment="Left" Height="16" VerticalAlignment="Top" Width="16"/>
            </Border>
            <ControlTemplate.Triggers>
                <Trigger Property="IsKeyboardFocused" Value="true"/>
                <Trigger Property="ToggleButton.IsChecked" Value="true"/>
                <Trigger Property="IsEnabled" Value="false">
                    <Setter Property="Foreground" Value="#ADADAD"/>
                </Trigger>
            </ControlTemplate.Triggers>
        </ControlTemplate>
    </Setter.Value>
</Setter>    

<Button Style="{DynamicResource ButtonStyle}">
    <Grid>
        <Image Source="imgsource.png"/>
    </Grid>
</Button>

结果：只有在输入图像的完整路径时才会显示图像。我不确定我是否正确，但在部署程序时这不会导致问题吗？

Answer 1

我对你的第三个例子感到惊讶 - 即使是完整的道路。一眼就看出它似乎不应该起作用。您的第二次尝试已结束，但您没有将该按钮的内容绑定到的网站。

看看你的按钮：

<Button Style="{DynamicResource ButtonStyle}">
    <Grid>
        <Image Source="imgsource.png"/>
    </Grid>
</Button>

Grid是Content（网格不是必需的 - 您可以将Image放在那里）。查看您的模板，您可以看到其中没有任何内容可以获取内容。尝试将内容演示者添加到模板中：

<Setter Property="Template">
    <Setter.Value>
        <ControlTemplate TargetType="{x:Type Button}">
            <Border x:Name="bContainer" 
                    BorderBrush="{TemplateBinding BorderBrush}" 
                    BorderThickness="{TemplateBinding BorderThickness}" 
                    HorizontalAlignment="{TemplateBinding HorizontalAlignment}" 
                    Height="{TemplateBinding Height}" 
                    VerticalAlignment="{TemplateBinding VerticalAlignment}" 
                    Width="{TemplateBinding Width}">
                <ContentPresenter x:Name="contentPresenter"
                                  Focusable="False"
                                  HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                  Margin="{TemplateBinding Padding}"
                                  RecognizesAccessKey="True"
                                  SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"
                                  VerticalAlignment="{TemplateBinding VerticalContentAlignment}" />
            </Border>
            <ControlTemplate.Triggers>
                <Trigger Property="IsKeyboardFocused" 
                         Value="true"/>
                <Trigger Property="ToggleButton.IsChecked" 
                         Value="true"/>
                <Trigger Property="IsEnabled" 
                         Value="false">
                    <Setter Property="Foreground" 
                            Value="#ADADAD"/>
                </Trigger>
            </ControlTemplate.Triggers>
        </ControlTemplate>
    </Setter.Value>
</Setter>

绑定ImageSource可在DesignTime上更改

1 个答案: