4

我有一个UserControl托管在 Windows 窗体中的表单。在这个UserControl我有一个ToolBar我有各种按钮的地方:

<ToolBar>
   <Button Content="{StaticResource AllGreenIcon}"/>
   <Button Content="{StaticResource AllRedIcon}"/>
   <Button Content="{StaticResource RedRectangle}"/>
   <Button Content="{StaticResource GreenRectangle}"/>
</ToolBar>

在设计器中看起来像这样:

设计器模式下带有按钮的工具栏

问题在于图标由 4 个矩形组成的按钮。在运行时不会为这两个按钮呈现内容。

它在运行时看起来像这样:

运行时的工具栏

的代码AllGreenIcon

<UserControl.Resources>

<Grid x:Key="AllGreenIcon" Height="16" Width="16" Effect="{StaticResource IconDropShadowEffect}">
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="*"/>
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition Height="*"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>
    <ContentControl Content="{StaticResource GreenRectangle}" Margin="0,0,1,1" Grid.Row="0" Grid.Column="0"/>
    <ContentControl Content="{StaticResource GreenRectangle}" Margin="1,0,0,1" Grid.Row="0" Grid.Column="1"/>
    <ContentControl Content="{StaticResource GreenRectangle}" Margin="0,1,1,0" Grid.Row="1" Grid.Column="0"/>
    <ContentControl Content="{StaticResource GreenRectangle}" Margin="1,1,0,0" Grid.Row="1" Grid.Column="1"/>
</Grid>


</UserControl.Resources>

有谁知道我该如何解决这个问题?提前致谢!

4

2 回答 2

1

这个常见问题是由于 WPF(逻辑)要求每个UIElement都有一个父级。在您的情况下,您正在向资源添加一个元素 -GreenRectangle然后您将此元素用作资源中Content的多个ContentControls AllGreenIcon。每次将一个元素连接到可视化树时,它都会更改其父引用,这保证了一个元素在可视化树中只出现一次。GreenRectangle例如,您所有的绿色按钮都将使用相同的元素实例。由于每次GreenRectangle连接到可视化树时,它的父级都会更改,只有使用该GreenRectange资源的最后一个项目才会实际显示该元素。

总之,避免UIElements在资源中声明和使用。您应该使用Styles 和Controltemplates。

注意:在您的解决方案AllGreenIcon中,资源中声明的网格将有相同的问题 - 不能同时在 UI 中的两个不同位置使用。改用 a ContentTemplate

前任:

<Button ContentTemplate="{StaticResource AllGreenIconTemplate}"/>
于 2016-04-12T10:02:24.480 回答
0

我设法通过反复试验找到了解决方案。基本上我所做的就是我用 s 替换了ContentControls 并Rectangle为 s 创建了一个样式Rectangle

<LinearGradientBrush x:Key="GreenLinearGradientBrush" EndPoint="0.5,1" MappingMode="RelativeToBoundingBox" StartPoint="0.5,0">
    <GradientStop Color="#FF00BD22" Offset="1"/>
    <GradientStop Color="#FF218934"/>
</LinearGradientBrush>

<Style x:Key="GreenRectangleStyle" TargetType="{x:Type Rectangle}">
   <Setter Property="Width" Value="16"/>
   <Setter Property="Height" Value="16"/>
   <Setter Property="Fill" Value="{StaticResource GreenLinearGradientBrush}"/>
   <Setter Property="Effect" Value="{StaticResource IconDropShadowEffect}"/>
</Style>

<Grid x:Key="AllGreenIcon" Height="16" Width="16" Effect="{StaticResource IconDropShadowEffect}">
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="*"/>
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition Height="*"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>
    <Rectangle Margin="0,0,1,1" Grid.Row="0" Grid.Column="0" Style="{StaticResource GreenRectangleStyle}"/>
    <Rectangle Margin="1,0,0,1" Grid.Row="0" Grid.Column="1" Style="{StaticResource GreenRectangleStyle}"/>
    <Rectangle Margin="0,1,1,0" Grid.Row="1" Grid.Column="0" Style="{StaticResource GreenRectangleStyle}"/>
    <Rectangle Margin="1,1,0,0" Grid.Row="1" Grid.Column="1" Style="{StaticResource GreenRectangleStyle}"/>
</Grid>

有没有人有更好的解决方案?

编辑:

@Novitchi S 有一个更好的解决方案,根据他的回答,这里是最终版本:

<Style x:Key="GreenRectangleStyle" TargetType="{x:Type Rectangle}">
    <Setter Property="Width" Value="16"/>
    <Setter Property="Height" Value="16"/>
    <Setter Property="Fill" Value="{StaticResource GreenLinearGradientBrush}"/>
    <Setter Property="Effect" Value="{StaticResource IconDropShadowEffect}"/>
</Style>

<DataTemplate x:Key="GreenRectangle">
    <Rectangle  Style="{StaticResource GreenRectangleStyle}"/>
</DataTemplate>

<DataTemplate x:Key="AllGreenIcon">
    <Grid  Height="16" Width="16" Effect="{StaticResource IconDropShadowEffect}">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="*"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>
        <ContentControl ContentTemplate="{StaticResource GreenRectangle}" Margin="0,0,1,1" Grid.Row="0" Grid.Column="0"/>
        <ContentControl ContentTemplate="{StaticResource GreenRectangle}" Margin="1,0,0,1" Grid.Row="0" Grid.Column="1"/>
        <ContentControl ContentTemplate="{StaticResource GreenRectangle}" Margin="0,1,1,0" Grid.Row="1" Grid.Column="0"/>
        <ContentControl ContentTemplate="{StaticResource GreenRectangle}" Margin="1,1,0,0" Grid.Row="1" Grid.Column="1"/>
    </Grid>
</DataTemplate>

. . .

<ToolBar>
    <Button ContentTemplate="{StaticResource AllGreenIcon}"/>
    <Button ContentTemplate="{StaticResource AllRedIcon}"/>
    <Button ContentTemplate="{StaticResource RedRectangle}"/>
    <Button ContentTemplate="{StaticResource GreenRectangle}"/>
</ToolBar>
于 2016-04-12T07:47:10.040 回答