VisualStateアニメーションのContentPresenterの子にアクセスする

Question

私は以下のGridViewを使用していて、内部に3つの要素を持つItemTemplateを持っています。

今私がしたいのは、GridViewItemからPointerOverのMyTextBlock不透明度をアニメートすることです。

<GridView x:Name="MyList" ItemContainerStyle="{StaticResource GridViewItemContainerStyle}" ItemsSource="{Binding MyList}"> 
<GridView.ItemTemplate> 
    <DataTemplate> 
     <Grid> 
      <Grid.RowDefinitions> 
       <RowDefinition Height="200" /> 
       <RowDefinition Height="3" /> 
       <RowDefinition Height="80" /> 
      </Grid.RowDefinitions> 
      <Image Grid.Row="0" Source="{Binding Url}" /> 
      <ProgressBar Grid.Row="1" IsIndeterminate="True" /> 
      <TextBlock Name="MyTextBlock" Opacity="0" Text="Test" /> 
     </Grid> 
    </DataTemplate> 
</GridView.ItemTemplate> 
</GridView> 

ItemContainerStyleはこのようなものです。問題は、ContentPresenterの中にあるので、ここからStoryboard.TargetName="MyTextBlock"でMyTextBlockにアクセスできません。 ContentPresenter内の要素のvisualstateアニメーションを実行するにはどうすればよいですか？

<Style TargetType="GridViewItem" x:Key="GridViewItemContainerStyle"> 
     ... 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="GridViewItem"> 
        <Grid x:Name="ContentBorder" Control.IsTemplateFocusTarget="True" RenderTransformOrigin="0.5,0.5">       
         <VisualStateManager.VisualStateGroups> 
          <VisualStateGroup x:Name="CommonStates"> 
           <VisualState x:Name="Normal"> 
            <Storyboard> 
             <PointerUpThemeAnimation Storyboard.TargetName="ContentPresenter" /> 
            </Storyboard> 
           </VisualState> 
           <VisualState x:Name="PointerOver"> 
            <Storyboard> 
             <DoubleAnimation Storyboard.TargetName="BorderRectangle" Storyboard.TargetProperty="Opacity" Duration="0" To="1" /> 
            </Storyboard> 
           </VisualState> 
          </VisualStateGroup> 
         </VisualStateManager.VisualStateGroups> 
         <Rectangle x:Name="BorderRectangle" Fill="{ThemeResource SystemControlHighlightListAccentLowBrush}" Opacity="0" /> 
         <ContentPresenter x:Name="ContentPresenter" ContentTransitions="{TemplateBinding ContentTransitions}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" Margin="{TemplateBinding Padding}" /> 
        </Grid> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 

---

編集： 私は、次のTargetPropertyを使用してみましたが、それはただ単にTextBlockそれの内部全体ContentPresenter の不透明度を設定していません。

<DoubleAnimation Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="(TextBlock.Opacity)" Duration="0" To="1" /> 

Answer 1

問題は、それがのContentPresenter内なので、私はここからStoryboard.TargetName = "MyTextBlock" とMyTextBlockにアクセスすることはできません。 ContentPresenter内の要素のvisualstateアニメーションを行うにはどうすればよいですか？

あなたはDataTemplateを（PointerEnteredとPointerExited）内の2 visualstatesを追加することができます。

<GridView x:Name="MyList" Grid.Row="1" ItemContainerStyle="{StaticResource GridViewItemContainerStyle}" > 
     <GridView.ItemTemplate> 
      <DataTemplate> 
       <Grid PointerExited="Grid_PointerExited" PointerEntered="Grid_PointerEntered"> 
        <VisualStateManager.VisualStateGroups> 
         <VisualStateGroup> 
          <VisualState x:Name="PointerEntered"> 
           <Storyboard> 
            <DoubleAnimation Storyboard.TargetName="MyTextBlock" Storyboard.TargetProperty="Opacity" Duration="0" To="1" /> 
           </Storyboard> 
          </VisualState> 
          <VisualState x:Name="PointerExited"> 
           <Storyboard> 
            <DoubleAnimation Storyboard.TargetName="MyTextBlock" Storyboard.TargetProperty="Opacity" Duration="0" To="0" /> 
           </Storyboard> 
          </VisualState> 
         </VisualStateGroup> 
        </VisualStateManager.VisualStateGroups> 
        <Grid.RowDefinitions> 
         <RowDefinition Height="200" /> 
         <RowDefinition Height="3" /> 
         <RowDefinition Height="80" /> 
        </Grid.RowDefinitions> 
        <Image Grid.Row="0" Source="{Binding Url}" /> 
        <ProgressBar Grid.Row="1" IsIndeterminate="True" /> 
        <TextBlock Grid.Row="2" Name="MyTextBlock" Opacity="0" Text="Test" /> 
       </Grid> 
      </DataTemplate> 
     </GridView.ItemTemplate> 
</GridView> 

そしてstoryboardスタート得るためにGrid.PointerEnteredとGrid.PointerExitedイベントに次のコードを使用：

private void Grid_PointerExited(object sender, PointerRoutedEventArgs e) 
{ 
    Grid grid = sender as Grid; 
    var visualStateGroups = VisualStateManager.GetVisualStateGroups(grid); 
    var visualStateGroup = visualStateGroups[0]; 
    visualStateGroup.States[1].Storyboard.Begin(); 
} 

private void Grid_PointerEntered(object sender, PointerRoutedEventArgs e) 
{ 
    Grid grid = sender as Grid; 
    var visualStateGroups = VisualStateManager.GetVisualStateGroups(grid); 
    var visualStateGroup = visualStateGroups[0]; 
    visualStateGroup.States[0].Storyboard.Begin(); 
} 

Answer 2

DataTemplateをどこからでも来ることができます（App Resource、Window Resource、Local Resource、Cod e）ので、独自のNameScopeを使用します。

Namescopeの問題のためMyTextBlockを使用できません。したがって、DataTemplateの一部としてVisualStatesを定義するのが最適です。