The FlowDocumentPageViewer control

이전 글에서 좀 더 일반적인 FlowDocument 관련 기술과 함께 FlowDocumentPageViewer에 대해 논의 하였습니다. 이 글에서는 텍스트가 사용 가능한 공간보다 길어지면 스크롤 텍스트를 제공하는 대신 전체 문서를 페이지로 나누는 FlowDocumentPageViewer에 대해 설명할 것입니다.

FlowDocumentPageViewer 컨트롤이 Lorem Ipsum 텍스트를 어떻게 처리하는 지 간단한 예제를 통해 다루도록 하겠습니다.

<Window x:Class="WpfTutorialSamples.Rich_text_controls.FlowDocumentPageViewerSample"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="FlowDocumentPageViewerSample" Height="300" Width="300">
    <Grid>
        <FlowDocumentPageViewer>
            <FlowDocument>
                <Paragraph>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce faucibus odio arcu, luctus vestibulum tortor congue in. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce nec lacinia neque. Donec malesuada, ligula non vestibulum cursus, urna purus pellentesque orci, aliquet accumsan dui velit ac justo. Phasellus sagittis ligula in leo dapibus, vel vestibulum felis mattis. Fusce vitae auctor nibh. Ut sit amet fringilla turpis. Aenean tincidunt feugiat sapien, quis scelerisque enim pretium commodo. Mauris fermentum posuere nulla, vitae fermentum quam malesuada in. Cras ultrices bibendum nulla eu mollis. Sed accumsan pretium magna, non sodales velit viverra id. Sed eu elit sit amet sem ullamcorper rhoncus.</Paragraph>
                <Paragraph>Nulla vitae suscipit tellus. Nunc sit amet tortor fermentum, sollicitudin enim cursus, sagittis lacus. Pellentesque tincidunt massa nisl, nec tempor nulla consequat a. Proin pharetra neque vel dolor congue, at condimentum arcu varius. Sed vel luctus enim. Curabitur eleifend dui et arcu faucibus, sit amet vulputate libero suscipit. Vestibulum ultrices nisi id metus ultrices, eu ultricies ligula rutrum. Phasellus rhoncus aliquam pretium. Quisque in nunc erat. Etiam mollis turpis cursus, sagittis felis vel, dignissim risus. Ut at est nec tellus lobortis venenatis. Fusce elit mi, gravida sed tortor at, faucibus interdum felis. Phasellus porttitor dolor in nunc pellentesque, eu hendrerit nulla porta. Vestibulum cursus placerat elit. Nullam malesuada dictum venenatis. Interdum et malesuada fames ac ante ipsum primis in faucibus.</Paragraph>
            </FlowDocument>
        </FlowDocumentPageViewer>
    </Grid>
</Window>

이제 긴 텍스트가 하단에서 어떻게 잘리고 페이지 사이사이를 탐색할 수 있는지 알 수 있습니다. 이것은 FlowDocumentPageViewer가 할 수 있는 모든 것이 아닙니다. 우리가 창을 더 넓게 만들 경우 어떤 일이 발생하는지 보겠습니다.

텍스트를 무한정 늘리는 대신 FlowDocumentPageViewer는 텍스트를 열로 나누어 줄이 너무 길어지는 것을 방지해 줍니다. 매우 긴 줄이 있는 텍스트는 읽기가 더 어렵기 때문에 가독성도 높아지고 시각적으로 보기에 좋습니다. 당연히 페이지 수 역시 자동으로 조정되어 전체 페이지 수가 5에서 2로 줄어듭니다.

FlowDocument 클래스에는 사용 방법과 시기를 제어할 수 있는 다양한 속성이 있습니다. 그것들을 사용하는 것은 간단하지만 완전한 예제는 이 튜토리얼의 범위를 벗어납니다. 대신 MSDN 에는 몇 가지 속성에 대하여 좋은 예가 있습니다. 자세한 정보는 여기를 참고하세요. How to: Use FlowDocument Column-Separating Attributes

Searching

다음 챕터에서 보게 되겠지만 FlowDocumentReader wrapper는 도구 모음의 검색 컨트롤과 모든 기능을 사용하여 모든 검색을 할 수 있습니다. 하지만 이 튜토리얼에서는 FlowDocument wrapper는 FlowDocumentScrollViewer 와 FlowDocumentPageViewer 수동으로 호출해서 사용하는 검색 만을 다룹니다.

세 가지 뷰어는 모두 Ctrl+F 단축키를 이용하여 검색이 가능하지만 버튼 컨트롤 같은곳에서 접근하고자 한다면 Find() 메서드를 불러와야 한다. 아래 예제는 이를 보여준다.

<Window x:Class="WpfTutorialSamples.Rich_text_controls.FlowDocumentSearchSample"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="FlowDocumentSearchSample" Height="300" Width="580">
    <DockPanel>
        <WrapPanel DockPanel.Dock="Top">
            <Button Name="btnSearch" Click="btnSearch_Click">Search</Button>
        </WrapPanel>
        <FlowDocumentPageViewer Name="fdViewer">
            <FlowDocument>
                <Paragraph>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce faucibus odio arcu, luctus vestibulum tortor congue in. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce nec lacinia neque. Donec malesuada, ligula non vestibulum cursus, urna purus pellentesque orci, aliquet accumsan dui velit ac justo. Phasellus sagittis ligula in leo dapibus, vel vestibulum felis mattis. Fusce vitae auctor nibh. Ut sit amet fringilla turpis. Aenean tincidunt feugiat sapien, quis scelerisque enim pretium commodo. Mauris fermentum posuere nulla, vitae fermentum quam malesuada in. Cras ultrices bibendum nulla eu mollis. Sed accumsan pretium magna, non sodales velit viverra id. Sed eu elit sit amet sem ullamcorper rhoncus.</Paragraph>
                <Paragraph>Nulla vitae suscipit tellus. Nunc sit amet tortor fermentum, sollicitudin enim cursus, sagittis lacus. Pellentesque tincidunt massa nisl, nec tempor nulla consequat a. Proin pharetra neque vel dolor congue, at condimentum arcu varius. Sed vel luctus enim. Curabitur eleifend dui et arcu faucibus, sit amet vulputate libero suscipit. Vestibulum ultrices nisi id metus ultrices, eu ultricies ligula rutrum. Phasellus rhoncus aliquam pretium. Quisque in nunc erat. Etiam mollis turpis cursus, sagittis felis vel, dignissim risus. Ut at est nec tellus lobortis venenatis. Fusce elit mi, gravida sed tortor at, faucibus interdum felis. Phasellus porttitor dolor in nunc pellentesque, eu hendrerit nulla porta. Vestibulum cursus placerat elit. Nullam malesuada dictum venenatis. Interdum et malesuada fames ac ante ipsum primis in faucibus.</Paragraph>
            </FlowDocument>
        </FlowDocumentPageViewer>
    </DockPanel>
</Window>

using System;
using System.Windows;

namespace WpfTutorialSamples.Rich_text_controls
{
	public partial class FlowDocumentSearchSample : Window
	{
		public FlowDocumentSearchSample()
		{
			InitializeComponent();
		}

		private void btnSearch_Click(object sender, RoutedEventArgs e)
		{
			fdViewer.Find();
		}
	}
}

Search버튼이나 키보드 단축키(Ctrl+F)를 누르기만 하면 FlowDocumentPageViewer에서 검색 기능을 사용할 수 있습니다. 앞에서 언급하였듯이 이것은 FlowDocumentScrollViewer와 FlowDocumentPageViewer 에서 작동합니다. (FlowDocumentPageReader는 기본적으로 검색 버튼을 가지고 있다), 하지만 검색 박스는 툴바 상의 충분한 공간을 가져야 함을 명심해야 합니다. 그렇지 않으면 Find() 명령을 호출할 때 보이지 않게 됩니다.