2013-03-08 36 views
3

大家好,我是WPF新手,我已經使用列表視圖呈現爲網格視圖。我有一個圖像列,我通過綁定路徑來設置一個值。現在的問題是我需要根據條件改變圖像的路徑。如果條件爲真,我需要圖像的路徑不同。如果爲false,我將其更改爲另一個路徑。這可以一行一行地完成嗎?以下是我的列表視圖。請幫助動態更改ListView中圖像的路徑

<ListView Name="LstGrd" Margin="0,105,0,138"> 
    <ListView.View> 
     <GridView > 
      <GridViewColumn Header=" Name" Width="120" DisplayMemberBinding="{Binding Path=Name}" /> 
      <GridViewColumn Header=" Address" Width="250" DisplayMemberBinding="{Binding Path=Address}" /> 
      <GridViewColumn Header=" City" Width="50" DisplayMemberBinding="{Binding Path=City}" /> 
      <GridViewColumn Header=" State" Width="75" DisplayMemberBinding="{Binding Path=State}" /> 
      <GridViewColumn Header=" PostalCode" Width="75" DisplayMemberBinding="{Binding Path=PostalCode}" /> 
      <GridViewColumn> 
       <GridViewColumn.CellTemplate> 
        <DataTemplate> 
         <StackPanel Orientation="Horizontal"> 
          <Image Width="16" Name="Test" Height="16" Source="{Binding Path=ImagePath,Mode=TwoWay}"/> 
          <TextBlock Text="Status"/> 
         </StackPanel> 
        </DataTemplate> 
       </GridViewColumn.CellTemplate> 
      </GridViewColumn> 
     </GridView> 
    </ListView.View> 
</ListView> 

回答

2

如果我正確理解你的問題,如果有一些條件,你想改變圖像在變化。我創建了一個你綁定到你的列表視圖的類的虛擬版本,並添加了一個名爲「IsSelected」的屬性來顯示它。

<ListView Name="LstGrd" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"> 
    <ListView.View> 
     <GridView > 
      <GridViewColumn Header=""> 
       <GridViewColumn.CellTemplate> 
        <DataTemplate> 
         <CheckBox IsChecked="{Binding IsSelected}" /> 
        </DataTemplate> 
       </GridViewColumn.CellTemplate> 
      </GridViewColumn> 
      <GridViewColumn Header=" Name" Width="120" DisplayMemberBinding="{Binding Path=Name}" /> 
      <GridViewColumn Header=" Address" Width="250" DisplayMemberBinding="{Binding Path=Address}" /> 
      <GridViewColumn Header=" City" Width="50" DisplayMemberBinding="{Binding Path=City}" /> 
      <GridViewColumn Header=" State" Width="75" DisplayMemberBinding="{Binding Path=State}" /> 
      <GridViewColumn Header=" PostalCode" Width="75" DisplayMemberBinding="{Binding Path=PostalCode}" /> 
      <GridViewColumn> 
       <GridViewColumn.CellTemplate> 
         <DataTemplate> 
         <StackPanel Orientation="Horizontal"> 
          <Image Width="16" Name="Test" Height="16" Source="{Binding Path=ImagePath,Mode=TwoWay}"/> 
          <TextBlock Text="Status"/> 
         </StackPanel> 
         <DataTemplate.Triggers> 
          <DataTrigger Binding="{Binding IsChecked}" Value="True"> 
           <Setter Property="Source" Value="{Binding Path=ImagePath2}" TargetName="Test" /> 
          </DataTrigger> 
         </DataTemplate.Triggers> 
        </DataTemplate> 
       </GridViewColumn.CellTemplate> 
      </GridViewColumn> 
     </GridView> 
    </ListView.View> 
</ListView> 

這裏要注意的是,我添加了一列(這是可選的 - 我只是這樣做,使它更容易演示)。然後,在您的圖像列中,您需要將DataTrigger添加到您的DataTemplate以處理該屬性更改。

這裏只是DataTemplate中:

<DataTemplate> 
    <StackPanel Orientation="Horizontal"> 
     <Image Width="16" Name="Test" Height="16" Source="{Binding Path=ImagePath,Mode=TwoWay}"/> 
     <TextBlock Text="Status"/> 
    </StackPanel> 
    <DataTemplate.Triggers> 
     <DataTrigger Binding="{Binding IsChecked}" Value="True"> 
      <Setter Property="Source" 
        Value="{Binding Path=ImagePath2}" 
        TargetName="Test" /> 
     </DataTrigger> 
    </DataTemplate.Triggers> 
</DataTemplate> 

它的優點在轉換器,因爲它是一個唯一的XAML實現。

+0

只有在綁定到grid.ie後,條件纔會更改。我僅在將圖像默認綁定到網格後才檢查條件。在此方案中將執行此工作(根據條件逐行更改圖像)。如果我聽起來很愚蠢這是新的。 – Karthik 2013-03-08 14:12:35

+0

每個GridViewColumn定義所做的是控制如何顯示特定行中的特定單元格。你正在顯示這個名字,這個地址等等。在DataTemplate的情況下,你正在控制如何在這個單元格中顯示這段數據(即你正在顯示爲你的「Contact」類的這個實例定義的ImagePath) 。 DataTrigger正在做的是檢查此實例的另一個屬性,並使用ImagePath2替換此圖像。所以,是的,它會根據這個條件逐行改變它。 – 2013-03-08 14:17:12

+0

對不起,麻煩你我有另一個問題是什麼時候Datatrigger叫。它只是在數據綁定期間..或者用這種方式我需要更改按鈕上的圖像單擊數據trriger如何在該場景中實現。感謝您的幫助 – Karthik 2013-03-08 14:29:38

0

你應該使用一個轉換器:

<Image Source="{Binding Path = ImagePath, Mode = TwoWay, Converter={StaticResource imageToValidatedImageConv}}" /> 

哪裏imageToValidatedImageConv是定義爲一個資源:<local:ImageToValidatedImageConverter x:Key="imageToValidatedImageConv" />

和你的轉換器類,如:

public class ImageToValidatedImageConverter : IValueConverter 
    { 
     public object Convert(object value, Type targetType, object parameter, CultureInfo culture) 
     { 
      if() 
      { 
       //return image1 
      } 
      else 
      { 
       //return image2 
      } 

     } 

     public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture) 
     { 
      throw new Exception("Cant convert back"); 
     } 
    } 
+0

這可以實現,如果我必須改變按鈕click.Please指南 – Karthik 2013-03-08 14:32:18

+0

不知道我是否按照你假裝。 IValueConverter接口爲您提供了一種將自定義邏輯應用於綁定的方法。如果您打算根據按鈕事件更改圖像,請點擊按鈕,您可以像平常一樣進行操作 – Santux 2013-03-08 14:43:02

+0

您可以請我演示如何在按鈕單擊列表視圖中更改圖像或指向某些文章。謝謝您的支持幫助 – Karthik 2013-03-08 14:46:25