Winrt - Modifie la valeur de la propriété dans DataTemplate lorsque vous cliquez sur un élément dans GridView - c #, xaml, exécution Windows, applications Windows-store-winrt-xaml

Dans un projet d'application Windows Store, j'ai ceci GridView, dans le code derrière je lie un List<FileObjects> à sa ItemsSource.

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

et ceux-ci DataTemplate qui sont utilisés en fonction du type de fichier sur l'élément.

        <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}"/>

Je voudrais savoir comment je peux changer le BorderBrush , lorsque je clique sur l'un des éléments de la GridView Par exemple, j'aurais une rangée de 10 icônes, et quand je clique sur l'une d'elles, BorderBrush deviendrait bleu au lieu de transparent.

Réponses:

Une façon dont j'ai fait cela est d'ajouter une propriété nommée "ItemSelected" à votre classe "FileObject".

Ensuite, dans votre gestionnaire GridView_ItemClick, vous devez définir "ItemSelected" sur true pour l'élément sélectionné et false pour tous les autres éléments.

Ajoutez ensuite les éléments suivants dans chaque définition de bordure:

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

* Cet exemple utilise le SDK des comportements, vous devrez donc l'installer si vous ne l'avez pas déjà et référencer l'assembly. Vous devrez également ajouter les éléments suivants à votre fichier xaml:

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