2013-09-24 20 views
0

我使用ItemsControl爲我的主窗口添加了一些usercontrols。這工作正常,但我想添加一個控件添加到ItemsControl控件。從窗口引用子控件中的網格

我正在使用的代碼從這個線程:Animate Insertions to ItemsControl

這是我的用戶

<UserControl> 

<UserControl.Resources> 
    <converters:CallStatusEnumToBackgroundColor x:Key="CallStatusBackgroundConverter"/> 
    <converters:CallStatusEnumToSelectBackgroundColor x:Key="CallStatusToSelectBackgroundConverter"/> 

    <Style x:Key="WhiteSegoeText" TargetType="{x:Type TextBlock}"> 
     <Setter Property="FontFamily" Value="Segoe UI Semibold" /> 
     <Setter Property="Foreground" Value="{StaticResource AlmostWhite}" /> 
    </Style> 

    <Style x:Key="SelectedColorStyle" TargetType="{x:Type WrapPanel}"> 
     <Style.Triggers> 
      <Trigger Property="IsMouseOver" Value="False"> 
       <Setter Property="Background" Value="{Binding CallStatus, Converter={StaticResource CallStatusBackgroundConverter}}"></Setter> 
      </Trigger> 
      <Trigger Property="IsMouseOver" Value="True"> 
       <Setter Property="Background" Value="{Binding CallStatus, Converter={StaticResource CallStatusToSelectBackgroundConverter}}"></Setter> 
      </Trigger> 
     </Style.Triggers> 
    </Style> 

</UserControl.Resources> 

<UserControl.Background> 
    <SolidColorBrush Color="{Binding CallStatus, Converter={StaticResource CallStatusBackgroundConverter}}"/> 
</UserControl.Background> 

<Grid x:Name="CallGridRoot" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" > 
    <Grid.RenderTransform> 
     <TransformGroup> 
      <ScaleTransform/> 
     </TransformGroup> 
    </Grid.RenderTransform> 

    <Grid.ColumnDefinitions> 
     <ColumnDefinition Width="*"/> 
     <ColumnDefinition Width="45"/> 
     <ColumnDefinition Width="45"/> 
    </Grid.ColumnDefinitions> 
    <TextBlock TextWrapping="Wrap" Text="{Binding CallerName}" Grid.Column="0" 
     Style="{DynamicResource WhiteSegoeText}" FontSize="14" VerticalAlignment="Center" Margin="10,0,0,0"/> 


    <WrapPanel x:Name="AcceptCallPanel" Visibility="Collapsed" Grid.Column="1" VerticalAlignment="Center" Style="{StaticResource SelectedColorStyle}" Margin="0,0,3,0" HorizontalAlignment="Center"> 
     <Viewbox StretchDirection="DownOnly" Stretch="Uniform" > 
      <ContentControl Content="{StaticResource action_call_icon}" HorizontalAlignment="Center" /> 
     </Viewbox> 
    </WrapPanel> 

    <WrapPanel x:Name="PausePanel" Visibility="Collapsed" Grid.Column="1" VerticalAlignment="Center" Style="{StaticResource SelectedColorStyle}" Margin="0,0,3,0" HorizontalAlignment="Center"> 
     <Viewbox StretchDirection="DownOnly" Stretch="Uniform" > 
       <ContentControl Content="{StaticResource status_pause}" VerticalAlignment="Center" /> 
     </Viewbox> 
    </WrapPanel> 

    <WrapPanel x:Name="ResumePanel" Visibility="Collapsed" Grid.Column="1" VerticalAlignment="Center" Style="{StaticResource SelectedColorStyle}" Margin="0,0,3,0" HorizontalAlignment="Center"> 
     <Viewbox StretchDirection="DownOnly" Stretch="Uniform" > 
      <ContentControl Content="{StaticResource resume_call}" VerticalAlignment="Center" /> 
     </Viewbox> 
    </WrapPanel> 

    <WrapPanel x:Name="ClosePanel" Visibility="Visible" Grid.Column="2" VerticalAlignment="Center" Style="{StaticResource SelectedColorStyle}" Margin="0,0,3,0" HorizontalAlignment="Center"> 
     <Viewbox StretchDirection="DownOnly" Stretch="Uniform" > 
      <ContentControl Content="{StaticResource close_call}" VerticalAlignment="Center" /> 
     </Viewbox> 
    </WrapPanel> 
</Grid> 

這是從主窗口中的片段。

<ItemsControl x:Name="CallsForUserContainer" ItemsSource="{Binding callsForUserViewModel.Calls}" Margin="0,10,0,0"> 
     <ItemsControl.ItemTemplate> 
       <DataTemplate> 
        <DataTemplate.Resources> 
         <Storyboard x:Key="ItemAnimation" AutoReverse="False"> 
          <DoubleAnimationUsingKeyFrames Storyboard.TargetName="CallsForUser.CallGridRoot" Storyboard.TargetProperty="(UIElement.Opacity)"> 
           <EasingDoubleKeyFrame KeyTime="0" Value="0" /> 
           <EasingDoubleKeyFrame KeyTime="0:0:0.5" Value="1" /> 
          </DoubleAnimationUsingKeyFrames> 
         </Storyboard> 
        </DataTemplate.Resources> 

        <DataTemplate.Triggers> 
         <EventTrigger RoutedEvent="FrameworkElement.Loaded"> 
          <BeginStoryboard Storyboard="{StaticResource ItemAnimation}" /> 
         </EventTrigger> 
        </DataTemplate.Triggers> 

        <local:CallsForUser/> 
       </DataTemplate> 
     </ItemsControl.ItemTemplate> 
</ItemsControl> 

但是當我運行此我得到了我的動畫的錯誤CallsForUser.CallGridRoot找不到。 如何在動畫中引用我的孩子usercontrol中的網格?

+0

你熟悉[FluidMoveBehavior(http://msdn.microsoft.com/en-us/library/ff723946(V = Expression.40)的.aspx)?它可能會讓你省去所有這些麻煩...... –

+1

只是一個建議,爲什麼不動畫usercontrol的不透明度,而不是內部的網格? – Nitin

回答

1

你可以嘗試使用FluidMoveBehavior代替

你需要兩個引用添加到:

System.Windows.Interactivity

Microsoft.Expression.Interactions

將以下使用語句添加到您的xaml中

xmlns:i="http://schemas.microsoft.com/expression/2010/interactivity" 
    xmlns:ei="http://schemas.microsoft.com/expression/2010/interactions" 

然後,它的使用很簡單,只要:

<ItemsControl x:Name="CallsForUserContainer" ItemsSource="{Binding callsForUserViewModel.Calls}" Margin="0,10,0,0"> 
     <i:Interaction.Behaviors> 
      <ei:FluidMoveBehavior AppliesTo="Children"/> 
     </i:Interaction.Behaviors> 

     <!-- Rest of implementation goes here .... -->   

    </ItemsControl> 

您還可以添加它易於功能使其表現爲你想要的。

你可以找到更多關於它的信息this post

希望這有助於

相關問題