Search This Blog

Tuesday, November 19, 2013

FlowDocumentPageViewer WPF Example

WPF > Documents > FlowDocumentPageViewer

FlowDocumentPageViewer shows content in a page at a time in view mode.  It is fixed to a particular viewing mode.

Components:
  • Content Area
  • Toolbar
  • Page Navigation Controls
  • Zoom Controls
  • Search - The user can use the Ctr+F keyboard shortcut
Example:


<Window
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:NumericTextBox="clr-namespace:NumericTextBox;assembly=NumericTextBox" x:Class="WpfApplication3.MainWindow"
        Title="MainWindow" Height="400" Width="600">
    <FlowDocumentPageViewer Margin="10" BorderBrush="Black" BorderThickness="1">
        <FlowDocument ColumnWidth="400" IsOptimalParagraphEnabled="True" IsHyphenationEnabled="True">
            <Section FontSize="12">
                <Paragraph>
                    <Bold>Paragraph bold</Bold>
                   fdgfdgfdsggggggggggggg  sgflkklgf  gf s fgiohiohiofhds gfd gfgoihiw4hrior3    fgreretretretre rrtreretertrererererererererere
                    rrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrr
                    tttttttttttttttttttttttttttttttttttttyyyyyyyyyyyyyy
                    ytuyutyutyuytuytuuuuuuuuuuuuuuuuuuuuuuuu
                    uytuyuytutyutyutyutyuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuu
                    <Figure Width="140" Height="50" Background="GhostWhite" HorizontalAnchor="PageLeft" HorizontalOffset="300" VerticalOffset="20">
                        <Paragraph FontStyle="Italic" TextAlignment="Left" Background="Beige" Foreground="DarkGreen">
                           Figure is here
                        </Paragraph>
                    </Figure>
                </Paragraph>
             </Section>
            <Section>
                <Paragraph>Sales
                <Floater    HorizontalAlignment="Left">
                    <Table>
                    <Table.Resources>
                        <!-- Style for header/footer rows. -->
                        <Style x:Key="headerFooterRowStyle" TargetType="{x:Type TableRowGroup}">
                            <Setter Property="FontWeight" Value="DemiBold"/>
                            <Setter Property="FontSize" Value="16"/>
                            <Setter Property="Background" Value="LightGray"/>
                        </Style>
                        <!-- Style for data rows. -->
                        <Style x:Key="dataRowStyle" TargetType="{x:Type TableRowGroup}">
                            <Setter Property="FontSize" Value="12"/>
                            <Setter Property="FontStyle" Value="Italic"/>
                        </Style>
                    </Table.Resources>
                    <Table.Columns>
                        <TableColumn/>
                        <TableColumn/>
                        <TableColumn/>
                        <TableColumn/>
                    </Table.Columns>
                    <!-- This TableRowGroup hosts a header row for the table. -->
                    <TableRowGroup Style="{StaticResource headerFooterRowStyle}">
                        <TableRow>
                            <TableCell/>
                            <TableCell>
                                <Paragraph>Puma</Paragraph>
                            </TableCell>
                            <TableCell>
                                <Paragraph>Adidas</Paragraph>
                            </TableCell>
                            <TableCell>
                                <Paragraph>Nike</Paragraph>
                            </TableCell>
                        </TableRow>
                    </TableRowGroup>
                    <!-- This TableRowGroup hosts the main data rows for the table. -->
                    <TableRowGroup Style="{StaticResource dataRowStyle}">
                        <TableRow>
                          <TableCell>
                                <Paragraph Foreground="Blue">Blue</Paragraph>
                            </TableCell>
                            <TableCell>
                                <Paragraph>1</Paragraph>
                            </TableCell>
                            <TableCell>
                                <Paragraph>2</Paragraph>
                            </TableCell>
                            <TableCell>
                                <Paragraph>3</Paragraph>
                            </TableCell>
                        </TableRow>
                        <TableRow>
                            <TableCell>
                                <Paragraph Foreground="Red">Red</Paragraph>
                            </TableCell>
                            <TableCell>
                                <Paragraph>1</Paragraph>
                            </TableCell>
                            <TableCell>
                                <Paragraph>2</Paragraph>
                            </TableCell>
                            <TableCell>
                                <Paragraph>3</Paragraph>
                            </TableCell>
                        </TableRow>
                        <TableRow>
                            <TableCell>
                                <Paragraph Foreground="Green">Green</Paragraph>
                            </TableCell>
                            <TableCell>
                                <Paragraph>1</Paragraph>
                            </TableCell>
                            <TableCell>
                                <Paragraph>2</Paragraph>
                            </TableCell>
                            <TableCell>
                                <Paragraph>3</Paragraph>
                            </TableCell>
                        </TableRow>
                    </TableRowGroup>
                   <!-- This TableRowGroup hosts a footer row for the table. -->
                    <TableRowGroup Style="{StaticResource headerFooterRowStyle}">
                        <TableRow>
                            <TableCell>
                                <Paragraph>Total</Paragraph>
                            </TableCell>
                            <TableCell>
                                <Paragraph>3</Paragraph>
                            </TableCell>
                            <TableCell>
                                <Paragraph>6</Paragraph>
                            </TableCell>
                            <TableCell>
                                        <Paragraph>12</Paragraph>
                                    </TableCell>
                        </TableRow>
                    </TableRowGroup>
                </Table>
</Floater>
                </Paragraph>
            </Section>
        </FlowDocument>
    </FlowDocumentPageViewer>
</Window>