如何以编程方式更改WPF矩形样式(MVVM)(Noob)

时间:2012-12-19 03:31:15

标签: c# wpf xaml mvvm datatrigger

[编辑] *我忘了包含退回的例外

'System.Windows.Style' is not a valid value for property 'Fill' *

这是我的第一篇文章,我已经做了很多寻找可能已经得到回答但没有成功的问题。当谈到MVVM,Prism和WPF时,我是一个完整的菜鸟,我已经被深深地抛在了这一点上。

我希望根据模型中的布尔值(Binding Passed)更改2个矩形的内容。

如果测试返回Pass(bool True),则我们为第一个矩形显示绿色,第二个矩形将显示UserControl.Resource Style x:Key =“RectanglePass”。 如果测试失败,则第一个矩形为红色,第二个显示UserControl.Resource Style x:Key =“RectangleFail”

我有以下xaml代码:

<UserControl x:Class="Integration.Memjet.Aoqc.Views.ProcessResultView"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             mc:Ignorable="d" 
             d:DesignHeight="300" d:DesignWidth="300">

 <UserControl.Resources>
    <Style x:Key="RectangleFail" TargetType="Rectangle">
        <Setter Property="Fill">
            <Setter.Value>
                <VisualBrush>
                    ....
                </VisualBrush>
            </Setter.Value>
        </Setter>
    </Style>
    <Style x:Key="RectanglePass" TargetType="Rectangle">
        <Setter Property="Fill">
            <Setter.Value>
                <VisualBrush>
                    ....
                </VisualBrush>
            </Setter.Value>
        </Setter>
    </Style>
</UserControl.Resources>
<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="60"></RowDefinition>
        <RowDefinition Height="60"></RowDefinition>
        <RowDefinition></RowDefinition>
    </Grid.RowDefinitions>
    <Label VerticalAlignment="Center" HorizontalAlignment="Center" FontSize="20">PASS</Label>
    <Rectangle Name="rectStatus" Grid.Row="1">
        <Rectangle.Style>
            <Style TargetType="{x:Type Rectangle}">
                <Style.Triggers>
                    <DataTrigger Binding="{Binding Passed}" Value="True">
                        <Setter Property="Fill" Value="Green" />
                    </DataTrigger>
                    <DataTrigger Binding="{Binding Passed}" Value="False">
                        <Setter Property="Fill" Value="Red" />
                    </DataTrigger>
                </Style.Triggers>
            </Style>
        </Rectangle.Style>
    </Rectangle>

    <Rectangle Name="rectStatusImg" Width="120" Height="120" Grid.Row="2" >
        <Rectangle.Style>
            <Style TargetType="{x:Type Rectangle}">
                <Style.Triggers>
                    <DataTrigger Binding="{Binding Passed}" Value="True">
                        <Setter Property="Fill" Value="{StaticResource RectanglePass}" />
                    </DataTrigger>
                    <DataTrigger Binding="{Binding Passed}" Value="False">
                        <Setter Property="Fill" Value="{StaticResource RectangleFail}" />
                    </DataTrigger>
                </Style.Triggers>
            </Style>
        </Rectangle.Style>
    </Rectangle>
</Grid>
</UserControl>

以上操作不起作用并返回异常。 如果我要用这一行替换第二个Rectangle标记(rectStatusImg);

<Rectangle Name="rectStatusImg" Style="{StaticResource RectanglePass}" Width="120" Height="120" Grid.Row="2" ></Rectangle>

xaml工作并产生预期的结果!但我希望将它绑定到布尔传递,所以我可以通过编程方式更改它。

我真的希望我能在这里解释我的问题。

感谢您提前的帮助,这个网站一直是宝藏和很大的帮助。

干杯, 西蒙

1 个答案:

答案 0 :(得分:7)

在资源中定义两个可视画笔,并使用数据触发器创建一个矩形样式,如

  <VisualBrush x:Key="FailBrush">Black</VisualBrush>
    <VisualBrush x:Key="PassBrush">Red</VisualBrush>

    <Style x:Key="ColorRectangleStyle" TargetType="Rectangle">
        <Setter Property="Fill" Value="{StaticResource FailBrush}"/>
        <Style.Triggers>
            <DataTrigger Binding="{Binding Passed}" Value="False">
                <Setter Property="Fill" Value="{StaticResource PassBrush}"/>
            </DataTrigger>
        </Style.Triggers>
    </Style>

并在像

这样的矩形中使用它
<Rectangle Name="rectStatusImg" Width="120" Height="120" Grid.Row="2" Style="{StaticResource ColorRectangleStyle}" />

希望它有所帮助。