Wie man FlipView mit sich langsam bewegenden Überschriften macht? UWP

Question

Wie man eine Ansicht wie auf dem Screenshot macht? Wenn Sie es zum nächsten Element ziehen, bewegt sich die Kopfzeile ebenfalls, aber langsamer als der Inhalt und ändert die Farbe.

Answer 1

Die FlipView nicht Eigenschaft stellt Header zu setzen. Wie @Archana sagte, können Sie Pivot verwenden. Es gibt eine offizielle Probe von GitHub, die die Pivot verwendet. Dieses Beispiel zeigt, wie Sie ein Pivot Steuerelement in Ihrer UWP-Anwendung verwenden.

Sie können die Header in der PivotItem einstellen. Die Kopfzeile und das Element sind verknüpft, sodass sich das Element sofort ändert, wenn sich die Kopfzeile ändert. Im Gegenteil, der Header ändert sich sofort, wenn sich der Artikel ändert. Wie ich weiß, gibt es keine Methode, um das Erscheinen des Headers zu verzögern.

Sie können die Farbe des Textes in der ausgewählten Kopfzeile ändern. Sie können den TextBlock zum Inhalt PivotItem.Header hinzufügen. Und Sie können das Ereignis SelectionChanged in Pivot hinzufügen.

Zum Beispiel:

<Pivot Name="MyPivot" SelectionChanged="ListView_SelectionChanged"> 
    <PivotItem> 
     <PivotItem.Header> 
      <TextBlock Foreground="White" Text="Hello" /> 
     </PivotItem.Header> 
     <TextBlock>When headers are in 'Dynamic' mode, hovering a mouse over the pivot headers will show mouse flippers for easy tab switching 
     </TextBlock> 
    </PivotItem> 
    <PivotItem> 
     <PivotItem.Header> 
      <TextBlock Foreground="White" Text="Keyboard Support" /> 
     </PivotItem.Header> 
     <TextBlock> 
     <Run>Pivot now supports the following keyboard behaviors</Run><LineBreak /> 
     <Run> * While the HeaderPanel is focused:</Run><LineBreak /> 
     <Run> * * Left, Right, Ctrl+PgUp, Ctrl+PgDown: Changes the currently selected PivotItem</Run><LineBreak /> 
     <Run> * * Down: Sets focus in the content area</Run><LineBreak /> 
     <Run> * While the Content area is focused:</Run><LineBreak /> 
     <Run> * * Ctrl+PgUp, Ctrl+PgDown: Changes the currently selected PivotItem</Run> 
     </TextBlock> 
    </PivotItem> 
</Pivot> 

In Code hinter:

private void MyPivot_SelectionChanged(object sender, SelectionChangedEventArgs e) 
{ 
    foreach (PivotItem pivotItem in MyPivot.Items) 
    { 
     if (pivotItem == MyPivot.Items[MyPivot.SelectedIndex]) 
     { 
      ((TextBlock)pivotItem.Header).Foreground = new SolidColorBrush(Windows.UI.Color.FromArgb(255, 255, 255, 255)); 
     } 
     else 
     { 
      ((TextBlock)pivotItem.Header).Foreground = new SolidColorBrush(Windows.UI.Color.FromArgb(115, 123, 120, 130)); 
     } 
    } 
}