데이터 그리드 이동 애니메이션 이동

애니메이션을 사용하여 한 그룹에서 다른 그룹으로 그룹화 된 데이터 격자의 행 변환을 표시하는 데 문제가 있습니다. 애니메이션이 발생하지만 행은 뒤에 있으며 다른 행은 새로운 위치로 이동합니다.데이터 그리드 이동 애니메이션 이동

그룹화는 셀 중 하나의 내용에 따라 수행되므로 사용자가 내용을 변경하면 행이 새 그룹으로 이동합니다. 여기에 그리드를 보여줍니다 일부 XAML는 다음과 같습니다

<DataGrid x:Name="dataGrid" AutoGenerateColumns="False" CanUserAddRows="False"> 
    <DataGrid.GroupStyle> 
    <GroupStyle> 
     <GroupStyle.ContainerStyle> 
     <Style TargetType="{x:Type GroupItem}"> 
      <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="{x:Type GroupItem}"> 
       <StackPanel> 
        <TextBlock Text="{Binding Name}"/> 
        <ItemsPresenter /> 
       </StackPanel> 
       </ControlTemplate> 
      </Setter.Value> 
      </Setter> 
     </Style> 
     </GroupStyle.ContainerStyle> 
    </GroupStyle> 
    </DataGrid.GroupStyle> 
    <DataGrid.Columns> 
    <DataGridTextColumn Header="First Name" Binding="{Binding FirstName}"/> 
    <DataGridTextColumn Header="Last Name" Binding="{Binding LastName}"/> 
    <DataGridTextColumn Header="Email" Binding="{Binding Email}"/> 
    <DataGridTemplateColumn Header="Country"> 
     <DataGridTemplateColumn.CellTemplate> 
     <DataTemplate> 
      <TextBlock Text="{Binding Country}"/> 
     </DataTemplate> 
     </DataGridTemplateColumn.CellTemplate> 
     <DataGridTemplateColumn.CellEditingTemplate> 
     <DataTemplate> 
      <TextBox Text="{Binding Country, UpdateSourceTrigger=PropertyChanged}" TextChanged="TextBoxBase_OnTextChanged"/> 
     </DataTemplate> 
     </DataGridTemplateColumn.CellEditingTemplate> 
    </DataGridTemplateColumn> 
    </DataGrid.Columns> 
</DataGrid>

내가 TextChanged 이벤트 핸들러에 떨어져 발사하고있어, 애니메이션을 표시합니다. 코드는 거기 DataGridRow 새로운 그룹의 목표 지점을 찾아, 그리고 애니메이션 할 수있는 방법 호출이 작동

private void Animate(FrameworkElement element, Point target) 
{ 
    if (element != null) 
    { 
    Point sourcePoint = element.PointToScreen(new Point(0, 0)); 
    double yOffset = target.Y - sourcePoint.Y; 

    element.SetValue(Panel.ZIndexProperty, 10); // this doesn't help 
    TranslateTransform translateTransform = new TranslateTransform(); 
    element.RenderTransform = translateTransform; 

    Duration duration = new Duration(TimeSpan.FromSeconds(3)); 
    DoubleAnimation anim = new DoubleAnimation(0, yOffset, duration); 
    translateTransform.BeginAnimation(TranslateTransform.YProperty, anim); 
    } 
}

을하지만, 다른 그룹 아래로 이동 행은 다른 뒤에 가는 표시됩니다 행; 즉 이동하는 행은 그 아래의 다른 행에 의해 숨겨져 있습니다. DataGridRow에 ZIndex를 설정해도 아무 것도하지 않는 것 같습니다. 또한 행 을 위로 이동하면이 올바르게 작동합니다. 이동하는 행이 다른 행 위에 표시됩니다. 또한 TextChanged 이외의 이벤트를 애니메이션으로 실행하려고 시도했지만 (결국 어쨌든해야 할 것으로 예상됩니다) 문제는 아닌 것 같습니다.

감사합니다.

출처

2017-03-09 garzooma

나는 내 질문에 대한 답을 찾았다. 내가 필요한 힌트는 Silverlight post에서 왔습니다. 특히, "모든 목록 항목은 레이어로 배치하려는 경우 형제 여야합니다."라는 줄이 있습니다. 나를 위해 진행된 일은 그룹화 때문에 행이 서로의 형제가 아니 었습니다. 그들은 공통 부모의 직접적인 자녀가 아니 었습니다. 대신 형제 인 행을 포함하는 GroupItem이었습니다. 요소이 DataGridRow입니다

GroupItem groupItem = TryFindParent<GroupItem>(element); 
    groupItem.SetValue(Panel.ZIndexProperty, 10);

이동 될 : 그래서 난 내 애니메이션에() 방법 코드를 추가 할 필요가 있었다.

애니메이션을위한 더 나은 트리거가 필요하지만 적어도 행이 경로를 따라 다른 행 앞에 이동하고 있습니다.

출처

2017-04-04 15:16:06 garzooma

데이터 그리드 이동 애니메이션 이동

답변

관련 문제