Question

我有WPF应用程序，其中有几个按钮，上面没有文本，只有一个基于矢量的图像（使用Path对象），ControlTemplate看起来像这样：

<ControlTemplate x:Key="IconButtonContentTemplate" TargetType="{x:Type ButtonBase}">
    <Grid Background="{Binding Background, RelativeSource={RelativeSource AncestorType={x:Type ButtonBase}, Mode=FindAncestor}}">
        <Path HorizontalAlignment="Center" VerticalAlignment="Center" 
            Width="{Binding ActualWidth, RelativeSource={RelativeSource AncestorType={x:Type ButtonBase}, Mode=FindAncestor}}" 
            Height="{Binding ActualHeight, RelativeSource={RelativeSource AncestorType={x:Type ButtonBase}, Mode=FindAncestor}}"   
            Data="{Binding (components:ImageButtonAttachedProperties.ImagePathData), RelativeSource={RelativeSource AncestorType={x:Type ButtonBase}, Mode=FindAncestor}}"
            Stretch="Uniform" Fill="{Binding Foreground, RelativeSource={RelativeSource AncestorType={x:Type ButtonBase}, Mode=FindAncestor}}" />
    </Grid>

    <ControlTemplate.Triggers>
        <Trigger Property="IsMouseOver" Value="True">
            <Setter Property="Foreground" Value="LightGray" />
        </Trigger>
        <Trigger Property="IsPressed" Value="True">
            <Setter Property="Foreground" Value="LightGray" />
        </Trigger>
        <Trigger Property="IsEnabled" Value="False">
            <Setter Property="Foreground" Value="Gray" />
        </Trigger>
    </ControlTemplate.Triggers>
</ControlTemplate> 


<Style TargetType="{x:Type Button}" x:Key="ClockButtonStyle" BasedOn="{StaticResource IconButtonStyle}">
    <Setter Property="Template" Value="{StaticResource IconButtonContentTemplate}" />
    <Setter Property="Foreground" Value="White" />
    <Setter Property="components:ImageButtonAttachedProperties.ImagePathData" Value="M69.349,65.092C68.714,65.092,68.072,64.925,67.487,64.577L46.294,51.946 46.294,21.239C46.294,19.227 47.925,17.595 49.938,17.595 51.949,17.595 53.581,19.227 53.581,21.239L53.581,47.807 71.217,58.317C72.945,59.348 73.512,61.585 72.483,63.312 71.799,64.457 70.589,65.092 69.349,65.092z M49.938,3.877C24.573,3.877 3.938,24.513 3.938,49.877 3.938,75.241 24.573,95.877 49.938,95.877 75.302,95.877 95.938,75.241 95.938,49.877 95.938,24.513 75.302,3.877 49.938,3.877z M52.876,88.467C52.882,88.395 52.897,88.324 52.897,88.25 52.897,86.615 51.572,85.29 49.937,85.29 48.302,85.29 46.977,86.615 46.977,88.25 46.977,88.324 46.994,88.395 46.999,88.467 27.994,87.032 12.783,71.822 11.349,52.817 11.423,52.822 11.492,52.838 11.567,52.838 13.202,52.838 14.527,51.513 14.527,49.878 14.527,48.243 13.201,46.918 11.567,46.918 11.492,46.918 11.422,46.935 11.349,46.94 12.783,27.933 27.994,12.722 47,11.287 46.995,11.36 46.978,11.43 46.978,11.504 46.978,13.139 48.304,14.464 49.938,14.464 51.572,14.464 52.897,13.138 52.897,11.504 52.897,11.429 52.881,11.36 52.876,11.287 71.882,12.722 87.093,27.932 88.528,46.938 88.455,46.933 88.385,46.916 88.311,46.916 86.676,46.916 85.35,48.242 85.35,49.876 85.35,51.51 86.676,52.836 88.311,52.836 88.385,52.836 88.455,52.82 88.528,52.815 87.094,71.822 71.883,87.032 52.876,88.467z" />
</Style>

我的问题是在极少数情况下不显示按钮图像（99％的时间）。仍然可以单击该按钮，但是不显示其图像。我不确定是什么原因造成的。将数据绑定到矢量图像上？还是将数据绑定到填充颜色上？

ImageButtonAttachedProperties.ImagePathData 是 System.Windows.Media.Geometry 对象，用于描述矢量图像。

public static class ImageButtonAttachedProperties
{
    public static readonly DependencyProperty ImagePathDataProperty =
        DependencyProperty.RegisterAttached("ImagePathData", typeof(Geometry), typeof(ImageButtonAttachedProperties), new UIPropertyMetadata(null));

    public static Geometry GetImagePathData(DependencyObject obj)
    {
        return (Geometry)obj.GetValue(ImagePathDataProperty);
    }

    public static void SetImagePathData(DependencyObject obj, Geometry value)
    {
        obj.SetValue(ImagePathDataProperty, value);
    }
}

知道我在做什么错吗？

Answer 1

您要将模板元素的所需维度绑定到模板化父对象的 final 维度；这创建了循环依赖。不要那样做。

模板控件的大小（例如您的Button）取决于其模板内容（例如您的Path）的所需大小。如果您使内容的大小取决于模板化父项的大小，那只是在自找麻烦。

如果我不得不猜测，您可能会陷入版式循环中，其中一个版式更新会触发另一版式更新。由于布局更新的计划方式，这些并不总是很明显（也许除了通过查看CPU使用率之外）。我已经看到了这种情况，例如，当“安排”通过使“测量”通过的结果无效时。可见的效果可能是不可预测的：有时出现可以正常工作，直到不起作用为止。

摆脱Width上的Height和Path绑定，并将水平和垂直对齐方式设置为Stretch。

Answer 2

我不确定是什么原因造成的。

在某些点上，ActualWidth或ActualHeight的值（在任何控件上）实际上为零，并且这些属性是只读类型依赖项属性。当控件为Loaded，Measured，Arranged或Rendered时，就会发生这种情况。

按照FrameworkElement.ActualWidth Property

由于ActualWidth是一个计算值，因此您应注意作为一个可能有多个或增量的报告更改布局系统进行各种操作的结果。布局系统可能正在计算子元素所需的度量空间，受到父元素的约束，依此类推。

问题是，某些东西会在您的按钮上发生抖动，导致调整大小，并且您通过捕获零值来赢得彩票。

作为尝试的过程，我提供了一种关于以两种不同方式容纳矢量图像Best way to use a vector image in WPF的答案，并且我使用的示例在可调整大小的窗口中包含3个矢量，据我所知，它们没有flash，但要重画。但是我将高度/宽度设置为stretch。

也许会更改矢量的持有方式？

Answer 3

您应该：

1）删除填充颜色上的数据绑定，以确定是否仍然可以重现该问题。

我不能，以其他方式尝试：

2）删除路径上的数据绑定（使用恒定的路径进行测试），并使用填充色上的数据绑定进行测试。

如果1）和2）无法重现您的问题，请尝试： 3）在填充颜色上使用常量值，在Path上使用数据绑定

如果您能够在1）或2）中重现问题，则现在至少知道问题的根源。 3）情况相同，但更为复杂，因为3）暗示两个数据绑定在某种程度上相互影响...

4）您的问题也有可能被深埋在主题定义中-因此，关闭自定义主题并仅使用泛型主题也是一种测试方法，以了解问题的根源。

5）我还将尝试在“按钮”的背景上布置路径，以查看这在您的问题上是否表现得更好-请参阅本文中的最后一条评论： Image fill the space on the button in WPF

您确实需要发布一个小型演示应用程序才能获得确定性的答案，否则，仅给出显示的摘录，恐怕无法分辨确切的来源

WPF按钮模板中的矢量图像并非始终显示

3 个答案: