風格觸發不同的圖像和邊框背景

我想用不同的邊框背景和不同圖像（每個圖像必須使用不同的背景顏色）如何更改使用StyleTrigger辦呢？（現在它只顯示所有圖像的紅色邊框）風格觸發不同的圖像和邊框背景

<DataTemplate> 
    <Border BorderThickness="1" Width="18" Height="18" CornerRadius="2" BorderBrush="Red" Background="Red"> 
     <Image Width="16" Height="16"> 
      <Image.Style> 
       <Style TargetType="{x:Type Image}"> 
        <Setter Property="Source" Value="{x:Null}" /> 
             <Style.Triggers> 
              <DataTrigger Binding="{Binding RowData.DataContext.my}" Value="High"> 
                <Setter Property="Source" Value="/project;component/Images/High.png" /> 
               </DataTrigger> 
               <DataTrigger Binding="{Binding RowData.DataContext.my}" Value="Medium"> 
                <Setter Property="Source" Value="/project;component/Images/Medium.png" /> 
               </DataTrigger> 
               <DataTrigger Binding="{Binding RowData.DataContext.my}" Value="Low"> 
                <Setter Property="Source" Value="/project;component/Images/Low.png" /> 
               </DataTrigger> 
        </Style.Triggers> 
       </Style> 
      </Image.Style> 
     </Image> 
    </Border> 
</DataTemplate>

謝謝。

來源

2013-10-31 UFO

您已將BorderBrush設置爲圖像邊框的紅色......這就是爲什麼每個圖像都會出現紅色邊框..觸發器只會更新圖像源..不是它的邊框 – Nitin

@nit我想知道我是如何必須使用邊界和圖像的觸發器？ – UFO

喜歡你給圖片的風格..同樣，你將不得不應用風格觸發器的邊界來改變它的BorderBrush和背景 – Nitin

假設你Binding是正確的，你只需要一個類似Style添加到Border更新Background財產並從Border本身Background值：

<DataTemplate> 
    <Border BorderThickness="1" Width="18" Height="18" CornerRadius="2" BorderBrush="Red"> 
     <Border.Style> 
      <Style TargetType="{x:Type Border}"> 
       <Style.Triggers> 
        <DataTrigger Binding="{Binding RowData.DataContext.my}" Value="High"> 
         <Setter Property="Background" Value="Green" /> 
        </DataTrigger> 
        <DataTrigger Binding="{Binding RowData.DataContext.my}" Value="Medium"> 
         <Setter Property="Background" Value="Blue" /> 
        </DataTrigger> 
        <DataTrigger Binding="{Binding RowData.DataContext.my}" Value="Low"> 
         <Setter Property="Background" Value="Red" /> 
        </DataTrigger> 
       </Style.Triggers> 
      </Style> 
     </Border.Style> 
     <Image Width="16" Height="16"> 
      <Image.Style> 
       <Style TargetType="{x:Type Image}"> 
        <Setter Property="Source" Value="{x:Null}" /> 
        <Style.Triggers> 
         <DataTrigger Binding="{Binding RowData.DataContext.my}" Value="High"> 
          <Setter Property="Source" Value="/project;component/Images/High.png" /> 
         </DataTrigger> 
         <DataTrigger Binding="{Binding RowData.DataContext.my}" Value="Medium"> 
          <Setter Property="Source" Value="/project;component/Images/Medium.png" /> 
         </DataTrigger> 
         <DataTrigger Binding="{Binding RowData.DataContext.my}" Value="Low"> 
          <Setter Property="Source" Value="/project;component/Images/Low.png" /> 
         </DataTrigger> 
        </Style.Triggers> 
       </Style> 
      </Image.Style> 
     </Image> 
    </Border> 
</DataTemplate>

試試這個。

來源

2013-10-31 15:45:12 Sheridan

謝里登，圖片沒有背景屬性。這就是問題。 – UFO

對不起，我沒有給予足夠的關注......我們可以設置'Border'的'Background'而不是...我會更新我的答案。 – Sheridan

+1，thanx很多。 – UFO

風格觸發不同的圖像和邊框背景

回答

相關問題