Windows應用商店的應用程序：改變GridViewItem的背景上PointerOver

Question

我有一個GridView這就是綁定到下面的模型

class Item 
    { 
    string Title; 
    string ImagePath 
    string ImagePathPressed; 
    } 

其中的ImagePath & ImagePathPressed是路徑的應用程序內的圖像。

現在我想我的網格視圖項目，以改變它的背景，當鼠標在的ImagePath值於在ImagePathPressed

如何實現這一目標是結束了嗎？

Answer 1

OK，我知道了

我實現這樣的控件模板：

<Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="GridViewItem"> 
       <Border x:Name="OuterContainer" Tag={Binding}> 
         <Border.Resources> 
         <!-- Define brush resources for both states--> 
          <ImageBrush x:Key="MouseOverBrush" ImageSource="{Binding Tag.ImagePathPressed, ElementName=OuterContainer}" Stretch="None" /> 
          <ImageBrush x:Key="DefaultBrush" ImageSource="{Binding Tag.ImagePath, ElementName=OuterContainer}" Stretch="None" /> 
         </Border.Resources> 
        <Grid> 
        <VisualStateManager.VisualStateGroups> 
         <VisualStateGroup x:Name="CommonStates"> 
          <VisualState x:Name="Normal"/> 
          <VisualState x:Name="PointerOver"> 
           <Storyboard> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="ReorderHintContent" > 
              <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource MouseOverBrush}" /> 
             </ObjectAnimationUsingKeyFrames> 
           </Storyboard> 
          </VisualState> 
          <VisualState x:Name="Pressed"> 
          . 
          . 
          . 
          <Grid x:Name="ReorderHintContent" Tag="{Binding}" DataContext="{Binding}" > 
          <Grid.Background> 
          <!-- Default background--> 
           <ImageBrush x:Name="BGBrush" ImageSource="{Binding Tag.ImagePath, ElementName=ReorderHintContent}" Stretch="None" Opacity="0" /> 
          </Grid.Background> 

我不得不設置標籤的邊框和網格都以訪問模型的屬性

Answer 2

如果您將這些變量設置爲屬性並在您的類上實現INotifyPropertyChanged會更好。並在您鼠標懸停的GridView的事件來改變的ImagePath到的ImagePathPressed它將反映在的ImagePath的變化。我想你的鼠標懸停事件中，你可以得到哪個項目是你的鼠標指針所在的位置。

Answer 3

在此之後鏈接以獲得指引，落實風格GridViewItem

http://msdn.microsoft.com/en-us/library/windows/apps/jj709915.aspx

你應該實現你的類成員綁定屬性然後實現PointerOver狀態在上面的鏈接準則。 我建議你應該創建兩個圖像（一個爲正常狀態，另一個用於懸停狀態） 例如：

<Setter Property="Template"> 
    <Setter.Value> 
     <ControlTemplate TargetType="GridViewItem"> 
      <Border x:Name="OuterContainer"> 
       <Grid> 
        <Image x:Name="NormalImage" Source="{Binding ImagePath}"/> 
        <Image x:Name="PressImage" Source="{Binding ImagePathPressed}" Opacity="0"/> 
       <VisualStateManager.VisualStateGroups> 
        <VisualStateGroup x:Name="CommonStates"> 
         <VisualState x:Name="Normal"/> 
         <VisualState x:Name="PointerOver"> 
          <Storyboard> 
           <DoubleAnimation Storyboard.TargetName="PressImage" 
               Storyboard.TargetProperty="Opacity" 
               Duration="0" 
               To="1" /> 
          </Storyboard> 
         </VisualState> 
         <VisualState x:Name="Pressed">...