define a custom style to a ListViewItem in a universal app - win-universal-app

Question

I am trying to set this Style to my ListViewItems when the Mouse hover on them:
I have modified the Style from the App.xaml file but this doesn't solve my problem
<SolidColorBrush x:Key="ListViewItemPointerOverBackgroundThemeBrush" Color="#d9d7ec" />
Then,I did a Style when Mouse hover on it,but this either doesn't work
<Style x:Key="listItemmenuStyle"
TargetType="Button">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ListViewItem">
<Grid>
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="CommonStates">
<VisualState x:Name="Normal"/>
<VisualState x:Name="PointerOver">
<Storyboard>
<ColorAnimation Duration="0" To="#d9d7ec" Storyboard.TargetProperty="(Rectangle.Fill).(SolidColorBrush.Color)" Storyboard.TargetName="listItem1" />
<ColorAnimation Duration="0" To="#393185" Storyboard.TargetProperty="(ListViewItem.Foreground).(SolidColorBrush.Color)" Storyboard.TargetName="Content1" />
</Storyboard>
</VisualState>
<VisualState x:Name="Pressed">
<Storyboard>
<ColorAnimation Duration="0" To="#d9d7ec" Storyboard.TargetProperty="(Rectangle.Fill).(SolidColorBrush.Color)" Storyboard.TargetName="listItem1" />
<ColorAnimation Duration="0" To="#393185" Storyboard.TargetProperty="(ListViewItem.Foreground).(SolidColorBrush.Color)" Storyboard.TargetName="Content1" />
</Storyboard>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<Grid>
<Rectangle x:Name="listItem1" Stroke="Transparent" Fill="Transparent" Margin="0"/>
<ContentPresenter x:Name="Content1"/>
</Grid>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
and this is How I apply this Style to the ListView:
<ListView Style="{Binding Color, Source={StaticResource listItemmenuStyle}}">
<ListView.ItemTemplate >
<DataTemplate>
<StackPanel HorizontalAlignment="Left" Orientation="Horizontal">
<TextBlock x:Name="day" Text="{Binding Path=day}" Foreground="#797978"></TextBlock>
</StackPanel>
</DataTemplate>
</ListView.ItemTemplate >
</ListView
Please How can I modify the Style to have a ListviewItem like the image above
thanks for help
Update:
I tried this solution,and it changed the Background color of ListViewItem when I hover,but I get always a problem in defining the Foreground Color when I hover on every ListViewItem,even with change of the PointerOverForeground color propeerty:
<ListView.ItemContainerStyle>
<Style TargetType="ListViewItem">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ListViewItem">
<ListViewItemPresenter
FocusSecondaryBorderBrush="#d9d7ec"
PlaceholderBackground="#d9d7ec"
PointerOverBackground="#d9d7ec"
PointerOverForeground="#342d65"
SelectedBackground="#d9d7ec"
SelectedForeground="#d9d7ec"
SelectedPointerOverBackground="#342d65"
HorizontalContentAlignment="Stretch"
VerticalContentAlignment="Center"
Foreground="#342d65"
/>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</ListView.ItemContainerStyle>

Answer 1

Don't set Foreground color same as PointerOverForeground color, you can't distinguish the color when you hover on an item. I think you should set different colors for Foreground and PointerOverForeground. According to your image, maybe Foreground should be set to Gray:
<ListView Name="myList">
<ListView.ItemContainerStyle>
<Style TargetType="ListViewItem">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ListViewItem">
<ListViewItemPresenter
FocusSecondaryBorderBrush="#d9d7ec"
PlaceholderBackground="#d9d7ec"
PointerOverBackground="#d9d7ec"
PointerOverForeground="#342d65"
SelectedBackground="#d9d7ec"
SelectedForeground="#342d65"
SelectedPointerOverBackground="#d9d7ec"
HorizontalContentAlignment="Stretch"
VerticalContentAlignment="Center"
Foreground="Gray" />
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</ListView.ItemContainerStyle>
</ListView>