Übersicht über ScrollViewer

  • Artikel

Der Inhalt einer Benutzeroberfläche ist häufig größer als der Anzeigebereich eines Computerbildschirms. Das ScrollViewer-Steuerelement bietet eine bequeme Möglichkeit zum Scrollen durch Inhalte in Windows Presentation Foundation(WPF)-Anwendungen. In diesem Thema wird das ScrollViewer-Element sowie mehrere Verwendungsbeispiele vorgestellt.

Das ScrollViewer-Steuerelement

Es gibt zwei vordefinierte Elemente, durch die das Scrollen in WPF-Anwendungen möglich ist: ScrollBar und ScrollViewer. Das ScrollViewer-Steuerelement kapselt horizontale und vertikale ScrollBar-Elemente und einen Inhaltscontainer (z.B. ein Panel-Element) ein, um andere sichtbare Elemente in einem durchscrollbaren Bereich anzuzeigen. Sie müssen ein benutzerdefiniertes Objekt erstellen, um das ScrollBar-Element für das Scrollen durch Inhalte verwenden zu können. Sie können jedoch das ScrollViewer-Element alleine verwenden, da es sich dabei um ein zusammengesetztes Steuerelement handelt, das ScrollBar-Funktionalität einschließt.

Das ScrollViewer-Steuerelement reagiert sowohl auf Maus- als auch auf Tastaturbefehle und definiert zahlreiche Methoden, mit denen anhand vordefinierter inkrementeller Werte durch Inhalt gescrollt werden kann. Sie können auch das ScrollChanged-Ereignis verwenden, um eine Änderung an einem ScrollViewer-Zustand zu erkennen.

Ein ScrollViewer kann nur ein untergeordnetes Element haben, in der Regel ein Panel-Element, das eine Children-Sammlung von Elementen hosten kann. Die Content-Eigenschaft definiert das einzige untergeordnete Element des ScrollViewer.

Physisches und logisches Scrollen im Vergleich

Das physische Scrollen wird zum Scrollen durch Inhalt anhand eines vordefinierten physischen Werts verwendet – in der Regel durch einen Wert in Pixel. Das logische Scrollen wird verwendet, um zum nächsten Element in einer logischen Struktur zu scrollen. Das physische Scrollen ist das Standardscrollverhalten für die meisten Panel-Elemente. WPF unterstützt beide Scrolltypen.

Die IScrollInfo-Schnittstelle

Die IScrollInfo-Schnittstelle stellt den wichtigsten Scrollbereich innerhalb eines ScrollViewer oder davon abgeleiteten Steuerelements dar. Die Schnittstelle definiert Scrolleigenschaften und -methoden, die von Panel-Elementen implementiert werden können, die das Scrollen anhand einer logischen Einheit und nicht anhand eines physischen inkrementierten Werts erfordern. Durch das Umwandeln einer Instanz von IScrollInfo in ein abgeleitetes Panel-Objekt und die anschließende Verwendung der Scrollmethoden können Sie ganz praktisch zur nächsten logischen Einheit in einer untergeordneten Auflistung scrollen, statt einen inkrementierten Pixelwert verwenden zu müssen. Das ScrollViewer-Steuerelement unterstützt standardmäßig das Scrollen um physische Einheiten.

StackPanel und VirtualizingStackPanel implementieren IScrollInfo und unterstützen die logische Bildlauferstellung sowohl als auch systemeigene Unterstützung. Für Layoutsteuerelemente mit nativer Unterstützung des logischen Scrollens können Sie dennoch das physische Scrollen erreichen, indem Sie das Panel-Hostelement mit einem ScrollViewer umschließen und die CanContentScroll-Eigenschaft auf false setzen.

Im folgenden Codebeispiel wird veranschaulicht, wie eine Instanz von IScrollInfo in ein StackPanel-Objekt umgewandelt wird und von der Schnittstelle definierte Methoden zu Scrollen von Inhalten (LineUp und LineDown) verwendet werden.

private void spLineUp(object sender, RoutedEventArgs e)
{
    ((IScrollInfo)sp1).LineUp();
}
private void spLineDown(object sender, RoutedEventArgs e)
{
    ((IScrollInfo)sp1).LineDown();
}

Private Sub spLineUp(ByVal sender As Object, ByVal args As RoutedEventArgs)

    CType(sp1, IScrollInfo).LineUp()
End Sub
Private Sub spLineDown(ByVal sender As Object, ByVal args As RoutedEventArgs)

    CType(sp1, IScrollInfo).LineDown()
End Sub

Definieren und Verwenden eines ScrollViewer-Elements

In folgendem Beispiel wird ein ScrollViewer in einem Fenster erstellt, das Text und ein Rechteck enthält. ScrollBar-Elemente erscheinen nur, wenn sie erforderlich sind. Wenn Sie die Größe des Fensters ändern, erscheinen und verschwinden die ScrollBar-Elemente aufgrund der geänderten Werte der ComputedHorizontalScrollBarVisibility- und ComputedVerticalScrollBarVisibility-Eigenschaften.


// Create the application's main window
mainWindow = gcnew System::Windows::Window();
mainWindow->Title = "ScrollViewer Sample";

// Define a ScrollViewer
myScrollViewer = gcnew ScrollViewer();
myScrollViewer->HorizontalScrollBarVisibility = ScrollBarVisibility::Auto;

// Add Layout control
myStackPanel = gcnew StackPanel();
myStackPanel->HorizontalAlignment = HorizontalAlignment::Left;
myStackPanel->VerticalAlignment = VerticalAlignment::Top;

TextBlock^ myTextBlock = gcnew TextBlock();
myTextBlock->TextWrapping = TextWrapping::Wrap;
myTextBlock->Margin = System::Windows::Thickness(0, 0, 0, 20);
myTextBlock->Text = "Scrolling is enabled when it is necessary. Resize the Window, making it larger and smaller.";

Rectangle^ myRectangle = gcnew Rectangle();
myRectangle->Fill = Brushes::Red;
myRectangle->Width = 500;
myRectangle->Height = 500;

// Add child elements to the parent StackPanel
myStackPanel->Children->Add(myTextBlock);
myStackPanel->Children->Add(myRectangle);

// Add the StackPanel as the lone child of the ScrollViewer
myScrollViewer->Content = myStackPanel;

// Add the ScrollViewer as the Content of the parent Window object
mainWindow->Content = myScrollViewer;
mainWindow->Show();



// Create the application's main window
mainWindow = new Window ();
mainWindow.Title = "ScrollViewer Sample";

// Define a ScrollViewer
myScrollViewer = new ScrollViewer();
myScrollViewer.HorizontalScrollBarVisibility = ScrollBarVisibility.Auto;

// Add Layout control
myStackPanel = new StackPanel();
myStackPanel.HorizontalAlignment = HorizontalAlignment.Left;
myStackPanel.VerticalAlignment = VerticalAlignment.Top;

TextBlock myTextBlock = new TextBlock();
myTextBlock.TextWrapping = TextWrapping.Wrap;
myTextBlock.Margin = new Thickness(0, 0, 0, 20);
myTextBlock.Text = "Scrolling is enabled when it is necessary. Resize the Window, making it larger and smaller.";

Rectangle myRectangle = new Rectangle();
myRectangle.Fill = Brushes.Red;
myRectangle.Width = 500;
myRectangle.Height = 500;

// Add child elements to the parent StackPanel
myStackPanel.Children.Add(myTextBlock);
myStackPanel.Children.Add(myRectangle);

// Add the StackPanel as the lone child of the ScrollViewer
myScrollViewer.Content = myStackPanel;

// Add the ScrollViewer as the Content of the parent Window object
mainWindow.Content = myScrollViewer;
mainWindow.Show ();



'Define a ScrollViewer.
Dim myScrollViewer As New ScrollViewer
myScrollViewer.HorizontalScrollBarVisibility = ScrollBarVisibility.Auto

'Add Layout control.
Dim myStackPanel As New StackPanel
myStackPanel.HorizontalAlignment = System.Windows.HorizontalAlignment.Left
myStackPanel.VerticalAlignment = System.Windows.VerticalAlignment.Top

Dim myTextBlock As New TextBlock
myTextBlock.TextWrapping = TextWrapping.Wrap
myTextBlock.Margin = New Thickness(0, 0, 0, 20)
myTextBlock.Text = "Scrolling is enabled when it is necessary. Resize the Window, making it larger and smaller."

Dim myRectangle As New Rectangle
myRectangle.Fill = Brushes.Red
myRectangle.Width = 500
myRectangle.Height = 500

'Add child elements to the parent StackPanel.
myStackPanel.Children.Add(myTextBlock)
myStackPanel.Children.Add(myRectangle)

'Add the StackPanel as the lone child of the ScrollViewer
myScrollViewer.Content = myStackPanel

'Add the ScrollViewer as the Content of the parent Window object
Me.Content = myScrollViewer

<Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
      WindowTitle="ScrollViewer Sample">
  <ScrollViewer HorizontalScrollBarVisibility="Auto">
    <StackPanel VerticalAlignment="Top" HorizontalAlignment="Left">
      <TextBlock TextWrapping="Wrap" Margin="0,0,0,20">Scrolling is enabled when it is necessary. 
      Resize the window, making it larger and smaller.</TextBlock>
      <Rectangle Fill="Red" Width="500" Height="500"></Rectangle>
    </StackPanel>
  </ScrollViewer>
</Page>

Formatieren eines ScrollViewer-Elements

Wie alle Steuerelemente in Windows Presentation Foundation können Sie das ScrollViewer-Objekt formatieren, um das Standardrenderingverhalten des Steuerelements zu ändern. Weitere Informationen zum Formatieren von Steuerelementen finden Sie unter Erstellen von Formaten und Vorlagen.

Umbrechen von Dokumenten

Als Alternative zum Scrollen können Sie für Dokumentinhalte einen Dokumentcontainer auswählen, der Umbrechen unterstützt. FlowDocument wird für Dokumente verwendet, die für das Hosten innerhalb eines Anzeigesteuerelements entworfen wurden, wie z.B. FlowDocumentPageViewer, das das seitenübergreifende Umbrechen von Inhalt unterstützt, sodass das Scrollen nicht mehr benötigt wird. DocumentViewer bietet eine Lösung zum Anzeigen von FixedDocument-Inhalt. In dieser Lösung wird das herkömmliche Scrollen zum Anzeigen von Inhalten außerhalb der Reichweite des Anzeigebereichs verwendet.

Weitere Informationen zu Dokumentformaten und Präsentationsoptionen finden Sie unter Dokumente in WPF.

Weitere Informationen