Winrt - 單擊GridView中的項目時更改DataTemplate中的屬性的值

Question

在Windows應用商店應用項目中，我有這GridView，在代碼後面，我將List<FileObjects>綁定到它的ItemsSource。

<GridView x:Name="filesIcons" ItemTemplateSelector="{StaticResource FileTemplateSelector}" Grid.Column="3" ItemClick="GridView_ItemClick" HorizontalContentAlignment="Right" HorizontalAlignment="Right" IsItemClickEnabled="True" SelectionMode="Single" /> 

和這些DataTemplate根據項目上的文件類型使用。

 <DataTemplate x:Key="pdfTemplate"> 
     <Border x:Name="IconBorder" Width="83" BorderBrush="Transparent" BorderThickness="5" CornerRadius="2" Margin="0,10,0,0" > 
      <Image Width="83" Source="ms-appx:///Images/Meetings/FileTypes/pdf.png" ></Image> 
     </Border> 
    </DataTemplate> 

    <DataTemplate x:Key="docTemplate"> 
     <Border x:Name="IconBorder" Width="83" BorderBrush="Transparent" BorderThickness="5" CornerRadius="2" Margin="0,10,0,0" > 
      <Image Width="83" Source="ms-appx:///Images/Meetings/FileTypes/word.png" ></Image> 
     </Border> 
    </DataTemplate> 

    <DataTemplate x:Key="xlsTemplate"> 
     <Border x:Name="IconBorder" Width="83" BorderBrush="Transparent" BorderThickness="5" CornerRadius="2" Margin="0,10,0,0" > 
      <Image Width="83" Source="ms-appx:///Images/Meetings/FileTypes/excel.png" ></Image> 
     </Border> 
    </DataTemplate> 

    <DataTemplate x:Key="imgTemplate"> 
     <Border x:Name="IconBorder" Width="83" BorderBrush="Transparent" BorderThickness="5" CornerRadius="2" Margin="0,10,0,0" > 
      <Image Width="83" Source="ms-appx:///Images/Meetings/FileTypes/image.png" ></Image> 
     </Border> 
    </DataTemplate> 

    <DataTemplate x:Key="txtTemplate"> 
     <Border x:Name="IconBorder" Width="83" BorderBrush="Transparent" BorderThickness="5" CornerRadius="2" Margin="0,10,0,0" > 
      <Image Width="83" Source="ms-appx:///Images/Meetings/FileTypes/text.png" ></Image> 
     </Border> 
    </DataTemplate> 

    <DataTemplate x:Key="pptTemplate"> 
     <Border x:Name="IconBorder" Width="83" BorderBrush="Transparent" BorderThickness="5" CornerRadius="2" Margin="0,10,0,0" > 
      <Image Width="83" Source="ms-appx:///Images/Meetings/FileTypes/text.png" ></Image> 
     </Border> 
    </DataTemplate> 



    <local:FileTemplateSelector x:Key="FileTemplateSelector" 
           pdf="{StaticResource pdfTemplate}" 
           doc="{StaticResource docTemplate}" 
           xls="{StaticResource xlsTemplate}" 
           img="{StaticResource imgTemplate}" 
           ppt="{StaticResource pptTemplate}" 
           txt="{StaticResource txtTemplate}"/> 

我想知道我可以改變BorderBrush屬性，當我點擊GridView 項目之一，例如，我將有10一個圖標，當我點擊他們的一個BorderBrush會去藍色而不是透明。

Answer 1

我這樣做的一種方法是將一個名爲「ItemSelected」的屬性添加到「FileObject」類中。

然後在您的GridView_ItemClick處理程序中，您需要將所選項目的「ItemSelected」設置爲true，對所有其他項目設置false。

然後添加下面的每個邊界定義中：

  <i:Interaction.Behaviors> 
       <core:DataTriggerBehavior Binding="{Binding ItemSelected}" Value="False"> 
        <core:ChangePropertyAction PropertyName="BorderBrush" Value="Transparent"> 
        </core:ChangePropertyAction> 
       </core:DataTriggerBehavior> 
       <core:DataTriggerBehavior Binding="{Binding ItemSelected}" Value="True"> 
        <core:ChangePropertyAction PropertyName="BorderBrush" Value="Blue"> 
        </core:ChangePropertyAction> 
       </core:DataTriggerBehavior> 
      </i:Interaction.Behaviors> 

*本例使用行爲SDK，所以你需要安裝它，如果你不已經擁有了它，並引用程序集。您還需要將以下內容添加到您的xaml文件中：

xmlns:i="using:Microsoft.Xaml.Interactivity" 
xmlns:core="using:Microsoft.Xaml.Interactions.Core"