Le Contrôle FlowDocumentPageViewer

Dans l'article précédent, nous avons abordé le FlowDocumentScrollViewer, ainsi que d'autres techniques plus générales liées au FlowDocument. Dans cet article, nous allons nous concentré sur le FlowDocumentPageViewer, qui, à la place d'offrir uniquement un scroll text quand le texte est plus long que l'espace disponible, va diviser le document entier en pages. Cela permet de naviguer de page en page, ce rapprochant plus d'une expérience de lecture d'un livre.

Nous allons commencer avec un exemple simple, où l'on peut voir comment le FlowDocumentPageViewer gère notre texte de teste 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>

Remarquez comment le long texte est coupé, ainsi que la possibilité de naviguer entre les pages, dans la partie basse. Et ce n'est pas tout ce que le FlowDocumentPageViewer peut faire ... regardez ce qui se passe quand on élargit la fenêtre:

Au lieu d'élargir le texte indéfiniment, le FlowDocumentPageViewer divise le texte en colonne, pour empêcher les lignes d'être trop longues. En plus d'être visuellement plaisant , cela augmente également la lisibilité, es textes avec de très longues lignes étant plus dur à lire. Le compteur de page est ajusté automatiquement, passant le nombre de pages de 5 à 2.

La classe FlowDocument a un grand nombre de propriétés qui permettent de contrôler comment et quand elles sont utilisés. Les utiliser est simple, mais un exemple complet est trop avancé dans le cadre de ce tutoriel. A la place, jetez un œil à cet article, où plusieurs de ces propriétés sont utilisées dans un exemple: How to: Use FlowDocument Column-Separating Attributes.

Recherche

Comme vous le verrez dans le chapitre suivant, le FlowDocumentReader wrapper supporte la recherche par défault, avec les contrôles de recherches dans la barre d'outils ect. Néanmoins, les trois FlowDocument wrappers en lecture, qui seront abordés dans ce tutoriel supporte la recherche également. Cela doit juste être manuellement invoqué pour les deux premiers (FlowDocumentScrollViewer et FlowDocumentScrollViewer).

Les trois viewers supportent le raccourcie clavier Ctrl+F pour commencer une recherche, mais si on veut que cela soit accessible avec un bouton par exemple, il suffit d'appeler la méthode Find(). Voici un exemple:

<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();
		}
	}
}

Un simple appuie sur le bouton dédié Search ou l'utilisation du raccourcie (Ctrl+F) donne la fonctionnalité de recherche au FlowDocumentPageViewer. Comme mentionné précédemment, cela marche pour le FlowDocumentScrollViewer ainsi que pour le FlowDocumentPageViewer (le FlowDocumentPageReader a un bouton de recherche par défaut), mais vérifier bien que le cadrant de recherche a assez de place horizontalement dans la barre d'outils , sinon, il ne sera pas visible quand vous appellerez la commande Find()!