다음을 통해 공유

ScrollViewer 개요

  • 아티클

업데이트: 2007년 11월

사용자 인터페이스 내부의 콘텐츠가 컴퓨터 화면의 표시 영역보다 큰 경우가 종종 있습니다. ScrollViewer 컨트롤은 WPF(Windows Presentation Foundation) 응용 프로그램에서 콘텐츠를 스크롤할 수 있는 편리한 방법을 제공합니다. 이 항목에서는 ScrollViewer 요소를 소개하고 몇 가지 사용 예제를 제공합니다.

이 항목에는 다음과 같은 단원이 포함되어 있습니다.

  • ScrollViewer 컨트롤

  • 물리적 스크롤 및 논리적 스크롤 비교

  • ScrollViewer 요소 정의 및 사용

  • ScrollViewer 스타일 설정

  • 문서 페이지 매김

  • 관련 항목

ScrollViewer 컨트롤

WPF 응용 프로그램에서 스크롤을 활성화하는 미리 정의된 두 가지 요소는 ScrollBar와 ScrollViewer입니다. ScrollViewer 컨트롤은 스크롤 가능한 영역에 다른 표시 가능한 요소를 표시하도록 가로 및 세로 ScrollBar 요소와 콘텐츠 컨테이너(예: Panel 요소)를 캡슐화합니다. 콘텐츠 스크롤에 ScrollBar 요소를 사용하려면 사용자 지정 개체를 빌드해야 하지만, ScrollViewer 요소는 ScrollBar 기능을 캡슐화한 복합 컨트롤이기 때문에 그대로 사용할 수 있습니다.

ScrollViewer 컨트롤은 마우스 명령과 키보드 명령에 모두 응답하며 미리 정의된 증분만큼 콘텐츠를 스크롤하는 다양한 메서드를 정의합니다. ScrollChanged 이벤트를 사용하면 ScrollViewer 상태 변화를 확인할 수 있습니다.

ScrollViewer는 하나의 자식 요소만 가질 수 있으며, 대개 이 자식 요소는 UIElements의 Children 컬렉션을 호스팅할 수 있는 Panel 요소입니다. Content 속성은 ScrollViewer의 단독 자식 요소를 정의합니다.

물리적 스크롤 및 논리적 스크롤 비교

물리적 스크롤은 미리 정의된 물리적 증분(일반적으로 픽셀 단위로 선언된 값)만큼 콘텐츠를 스크롤하는 데 사용됩니다. 논리적 스크롤은 논리 트리에서 다음 항목으로 스크롤하는 데 사용됩니다. 대부분의 Panel 요소에서는 물리적 스크롤이 기본 스크롤 동작입니다. WPF에서는 두 스크롤 형식을 모두 지원합니다.

IScrollInfo 인터페이스

IScrollInfo 인터페이스는 ScrollViewer 또는 파생 컨트롤 내에서 기본 스크롤 영역을 표현합니다. 이 인터페이스는 Panel 요소로 구현할 수 있으며, 물리적 증분이 아니라 논리적 단위로 스크롤해야 하는 스크롤 속성과 메서드를 정의합니다. IScrollInfo의 인스턴스를 파생된 Panel로 캐스팅한 후 해당 스크롤 메서드를 사용하면 자식 컬렉션에서 픽셀 증분이 아닌 다음 논리 단위로 쉽게 스크롤할 수 있습니다. 기본적으로 ScrollViewer 컨트롤은 물리적 단위의 스크롤을 지원합니다.

StackPanel 및 VirtualizingStackPanel은 모두 IScrollInfo를 구현하며 논리적 스크롤을 기본적으로 지원합니다. 논리적 스크롤을 기본적으로 지원하는 레이아웃 컨트롤의 경우에도 ScrollViewer에 호스트 Panel 요소를 래핑하고 CanContentScroll 속성을 false로 설정하면 물리적 스크롤을 사용할 수 있습니다.

다음 코드 예제에서는 IScrollInfo 인스턴스를 StackPanel로 캐스팅한 후 인터페이스에 정의되어 있는 콘텐츠 스크롤 메서드(LineUp 및 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

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

ScrollViewer 요소 정의 및 사용

다음 예제에서는 텍스트와 사각형 몇 개를 포함하는 창에 ScrollViewer를 만듭니다. ScrollBar 요소는 필요한 경우에만 나타납니다. 창 크기를 조정하면 ComputedHorizontalScrollBarVisibility 및 ComputedVerticalScrollBarVisibility 속성 값이 업데이트되어 ScrollBar 요소가 나타나거나 사라집니다.

참고

전체 코드 샘플을 보려면 ScrollViewer 샘플을 참조하십시오.

'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 Border
myScrollViewer.Content = myStackPanel
Me.Content = myScrollViewer

// 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 Border
myScrollViewer.Content = myStackPanel;

// Add the Border as the Content of the Parent Window Object
mainWindow.Content = myScrollViewer;
mainWindow.Show ();


<Page xmlns="https://schemas.microsoft.com/winfx/2006/xaml/presentation"
      xmlns:x="https://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>

ScrollViewer 스타일 설정

Windows Presentation Foundation의 다른 모든 컨트롤과 마찬가지로 ScrollViewer에 스타일을 설정하여 컨트롤의 기본 렌더링 동작을 변경할 수 있습니다. 사용자 지정 스타일이 설정된 ScrollViewer 예제를 보려면 ScrollViewer 스타일 샘플을 참조하십시오. 컨트롤 스타일 설정에 대한 자세한 내용은 스타일 지정 및 템플릿을 참조하십시오.

문서 페이지 매김

문서 콘텐츠의 경우 스크롤 대신 페이지 매김을 지원하는 문서 컨테이너를 선택할 수 있습니다. FlowDocuments는 FlowDocumentPageViewer와 같은 뷰 컨트롤 내부에서 호스팅되도록 디자인된 문서로, 스크롤이 필요 없도록 콘텐츠를 여러 페이지로 분할하는 기능을 지원합니다. DocumentViewer는 일반적인 스크롤을 사용하여 표시 영역 외부에 있는 콘텐츠를 표시하는 FixedDocument 콘텐츠 보기 방법을 제공합니다.

문서 형식 및 프레젠테이션 옵션에 대한 자세한 내용은 Windows Presentation Foundation의 문서를 참조하십시오.

참고 항목

작업

방법: ScrollViewer 만들기

ScrollViewer 스타일 샘플

개념

Windows Presentation Foundation의 문서

ScrollBar ControlTemplate 예제

성능 최적화: 컨트롤

참조

ScrollViewer

ScrollBar

IScrollInfo