Question

我有自定义Button，其中包含名为＆＃34; IconBox＆＃34;的ContentControl，其内容取决于触发器：

<Button> 
        <Button.Style>
            <Style TargetType="{x:Type Button}">
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="{x:Type Button}">
                         <Grid>
                          <!-- somethig here ..... -->
                          <ContentControl x:Name="IconBox" HorizontalAlignment="Center" 
                                                        VerticalAlignment="Center"
                                                Visibility="Collapsed" />
                        </Grid>

                        <ControlTemplate.Triggers>
                           <!-- triggers here -->
                        </ControlTemplate.Triggers>
<!-- closing tags ... -->
</Button>

大多数触发器看起来像：

<DataTrigger Binding="{Binding Path=Flag}" Value="icon1">
 <Setter TargetName="IconBox" Property="Visibility" Value="Visible"/>
 <Setter TargetName="IconBox" Property="Style" 
  Value="{DynamicResource icon1}"/>
</DataTrigger>

其中icon1是ControlTemplate ViewBox，其中包含矢量图片。所以它已经知道了。

现在我还需要添加位图图片，其名称包含在新模型的属性中，让我们称之为Image。

所以我想要这样的东西：

<DataTrigger Binding="{Binding Path=Flag}" Value="useImage">
 <Setter TargetName="IconBox" Property="Visibility" Value="Visible"/>
 <Setter TargetName="IconBox" Property="Style" 
  Value="{DynamicResource ImageTemplate}"/>
</DataTrigger>

那么ImageTemplate应该如何？

我已经尝试了下一个：

<Style TargetType="ContentControl" x:Key="ImageTemplate">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="ContentControl">
                    <Viewbox>
                        <Image>
                            <Image.Source>
                                <Binding RelativeSource="{RelativeSource Self}" 
                                         Converter="{StaticResource ImagePathConverter}" 
                                         Path="Image"/>
                            </Image.Source>
                        </Image>
                    </Viewbox>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

但它没有用。为什么呢？

Image包含类似＆＃34; image1.bmp＆＃34;的刺痛，而ImagePathConverter只是添加完整路径 - ＆＃34;％CurrentDir％\ Resources \ image1.bmp＆＃34 ;

转换器内的断点没有命中。至于Image内部的一个吸气剂。我不明白为什么。可能在我的模板或触发器中发生了一些错误？

Canvas内ViewBox的其他触发器工作正常。

虽然当我使用VisualTree在运行时检查此元素属性时，Image getter中的断点命中。

如何在ImageBox中实现图像？

Answer 1

如果您定义DataTemplate：

<DataTemplate x:Key="ImageTemplate">
    <Image Source="{Binding Image, Converter={StaticResource ImagePathConverter}}"/>
</DataTemplate>

...您可以将ContentTemplate的{{1}}设置为此值：

ContentControl

<DataTrigger Binding="{Binding Path=Flag}" Value="useImage"> <Setter TargetName="IconBox" Property="Visibility" Value="Visible"/> <Setter TargetName="IconBox" Property="ContentTemplate" Value="{DynamicResource ImageTemplate}"/> <Setter TargetName="IconBox" Property="Content" Value="{Binding}"/> </DataTrigger>属性应绑定到定义Content属性的对象。

另请注意，您的转换器应返回Image而不是ImageSource：

"Cannot convert string to ImageSource." How can I do this?

如何使用样式动态地将图像内容设置为ContentControl？

1 个答案: