/ / Winrt: cambie el valor de la propiedad en DataTemplate al hacer clic en un elemento en GridView: c #, xaml, windows-runtime, windows-store-apps, winrt-xaml

Winrt: cambie el valor de la propiedad en DataTemplate al hacer clic en un elemento en GridView: c #, xaml, windows-runtime, windows-store-apps, winrt-xaml

En un proyecto de aplicación de la tienda de Windows tengo este GridView, en codigo detras me ato un List<FileObjects> a su ItemsSource.

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

y estos DataTemplate que se utilizan en función del tipo de archivo en el elemento.

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

Me gustaría saber cómo puedo cambiar el BorderBrush propiedad, cuando hago clic en uno de los elementos en el GridView Por ejemplo, tendría una fila de 10 iconos, y cuando hice clic en uno de ellos, BorderBrush Iría azul en lugar de transparente.

Respuestas

2 para la respuesta № 1

Una forma en que he hecho esto es agregar una propiedad llamada "ItemSelected" a su clase "FileObject".

Luego, en su controlador GridView_ItemClick, debe configurar "ItemSelected" en verdadero para el elemento seleccionado y falso para todos los demás elementos.

Luego agregue lo siguiente dentro de cada definición de borde:

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

* Este ejemplo utiliza el SDK de comportamientos, por lo que deberá instalarlo si aún no lo tiene y hacer referencia al ensamblaje. También deberá agregar lo siguiente a su archivo xaml:

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