Làm thế nào để thay đổi WPF Rectangle Phong cách Programatically (MVVM) (Noob)

Question

[EDIT] * Tôi đã quên để bao gồm các ngoại lệ trả về có

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

này được bài viết đầu tiên của tôi, tôi đã đã thực hiện rất nhiều tìm kiếm các câu hỏi mà điều này có thể đã được trả lời để không thành công. Tôi là một noob hoàn chỉnh khi nói đến MVVM, Prism, và WPF và tôi đã được ném vào cuối sâu này.

Tôi muốn thay đổi nội dung của 2 hình chữ nhật tùy thuộc vào boolean trong Model (Binding Passed).

nếu thử nghiệm trả về Pass (bool True) thì chúng tôi hiển thị màu xanh cho hình chữ nhật đầu tiên và hình chữ nhật thứ hai sẽ hiển thị UserControl.Resource Style x: Key = "RectanglePass". Nếu thử nghiệm thất bại, sau đó hình chữ nhật đầu tiên là màu đỏ, và hiển thị thứ hai UserControl.Resource Phong cách x: Key = "RectangleFail"

Tôi đã mã XAML sau:

<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> 

ở trên không hoạt động và trả về một ngoại lệ. Nếu tôi thay thẻ chữ nhật thứ hai (rectStatusImg) bằng dòng này;

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

xaml hoạt động và tạo ra kết quả mong đợi! Nhưng tôi muốn gắn nó với Boolean Passed để tôi có thể thay đổi nó theo lập trình.

Tôi thực sự hy vọng tôi có thể giải thích vấn đề của mình tại đây.

Cảm ơn sự giúp đỡ của bạn trước, trang web này luôn là kho báu và giúp đỡ rất nhiều.

Chúc mừng, Simon

Answer 1

xác định hai bàn chải hình ảnh trong tài nguyên của bạn và tạo ra một phong cách của hình chữ nhật với các dữ liệu kích hoạt như

<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> 

và sử dụng nó trong hình chữ nhật như

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

Hope nó giúp.