Overzicht van ScrollViewer

Artikel
12/17/2024

Inhoud binnen een gebruikersinterface is vaak groter dan het weergavegebied van een computerscherm. Het besturingselement ScrollViewer biedt een handige manier om het scrollen van inhoud in WPF-toepassingen (de Windows Presentation Foundation) mogelijk te maken. In dit onderwerp wordt het ScrollViewer-element geïntroduceerd en vindt u verschillende gebruiksvoorbeelden.

Het besturingselement ScrollViewer

Er zijn twee vooraf gedefinieerde elementen waarmee u kunt schuiven in WPF-toepassingen: ScrollBar en ScrollViewer. Het ScrollViewer besturingselement bevat horizontale en verticale ScrollBar elementen en een inhoudscontainer (zoals een Panel element) om andere zichtbare elementen in een schuifbaar gebied weer te geven. U moet een aangepast object maken om het ScrollBar-element te kunnen gebruiken voor het schuiven van inhoud. U kunt het ScrollViewer element echter zelf gebruiken omdat het een samengesteld besturingselement is dat ScrollBar functionaliteit inkapselt.

Het ScrollViewer besturingselement reageert op zowel muis- als toetsenbordopdrachten en definieert talloze methoden waarmee inhoud kan worden gescrold door vooraf bepaalde stappen. U kunt de gebeurtenis ScrollChanged gebruiken om een wijziging in een ScrollViewer status te detecteren.

Een ScrollViewer kan slechts één kind hebben, meestal een Panel element dat een Children verzameling elementen kan bevatten. De eigenschap Content definieert het enige kind van de ScrollViewer.

Fysiek versus logisch schuiven

Fysiek schuiven wordt gebruikt om inhoud te schuiven op basis van een vooraf bepaalde fysieke toename, meestal door een waarde die wordt gedeclareerd in pixels. Logisch schuiven wordt gebruikt om naar het volgende item in de logische structuur te schuiven. Fysiek schuiven is het standaard scrollgedrag voor de meeste Panel elementen. WPF ondersteunt beide typen scrollen.

De IScrollInfo-interface

De IScrollInfo-interface vertegenwoordigt het belangrijkste schuifgebied binnen een ScrollViewer of afgeleid besturingselement. De interface definieert schuifeigenschappen en -methoden die kunnen worden geïmplementeerd door Panel elementen waarvoor schuiven per logische eenheid is vereist, in plaats van door een fysieke verhoging. Het casten van een exemplaar van IScrollInfo naar een afgeleide Panel en het vervolgens gebruiken van de scrollmethoden is een handige manier om naar de volgende logische eenheid in een onderliggende verzameling te scrollen, in plaats van per pixelverhoging. Het besturingselement ScrollViewer ondersteunt standaard scrollen met fysieke parameters.

StackPanel en VirtualizingStackPanel implementeren beide IScrollInfo en bieden ondersteuning voor logisch schuiven. Voor indelingsbesturingselementen die systeemeigen ondersteuning bieden voor logische scrolling, kunt u nog steeds fysieke scrolling bereiken door eerst het hostelement Panel in een ScrollViewer te verpakken en vervolgens de eigenschap CanContentScroll in te stellen op false.

In het volgende codevoorbeeld ziet u hoe u een instantie van IScrollInfo omzet naar een StackPanel en hoe u de interface-gedefinieerde scrollmethoden voor inhoud (LineUp en LineDown) gebruikt.

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

Een ScrollViewer-element definiëren en gebruiken

In het volgende voorbeeld wordt een ScrollViewer gemaakt in een venster met tekst en een rechthoek. ScrollBar elementen worden alleen weergegeven wanneer ze nodig zijn. Wanneer u het formaat van het venster wijzigt, worden de ScrollBar-elementen weergegeven en verdwijnen deze elementen vanwege bijgewerkte waarden van de eigenschappen ComputedHorizontalScrollBarVisibility en ComputedVerticalScrollBarVisibility.


// 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>

Een ScrollViewer stylen

Net als alle besturingsonderdelen in Windows Presentation Foundation kan de ScrollViewer worden gestyled om het standaardweergavegedrag van het besturingsonderdeel te wijzigen. Zie Styling and Templatingvoor meer informatie over het stylen van besturingselementen.

Documenten pagineren

Voor documentinhoud is een alternatief voor scrollen het kiezen van een documentcontainer die paginering ondersteunt. FlowDocument is bedoeld voor documenten die zijn ontworpen om te worden gehost in een weergavebeheer, zoals FlowDocumentPageViewer, dat ondersteuning biedt voor het pagineren van inhoud op meerdere pagina's, waardoor u niet hoeft te schuiven. DocumentViewer biedt een oplossing voor het weergeven van FixedDocument inhoud, die gebruikmaakt van traditioneel schuiven om inhoud buiten het gebied van het weergavegebied weer te geven.

Zie Documenten in WPF-voor meer informatie over documentindelingen en presentatieopties.

Delen via