Customizing the Toolbar | ReportViewer for WPF and Silverlight

Customizing the Toolbar

Creating a custom toolbar for C1ReportViewer is very simple. All buttons in the default toolbar have a corresponding Command in the control, so you can create a custom toolbar using only XAML. Here is some sample code using C1Toolbar to create a C1ReportViewer toolbar:

XAML	Copy Code
<Grid x:Name="LayoutRoot"> <Grid.RowDefinitions> <RowDefinition Height="Auto" /> <RowDefinition /> </Grid.RowDefinitions> <c1:C1ToolbarStrip> <c1:C1ToolbarButton Content="First" Command="{Binding FirstPageCommand,ElementName=reportViewer}" /> <c1:C1ToolbarButton Content="Previous" Command="{Binding PreviousPageCommand,ElementName=reportViewer}" /> <ContentPresenter Content="{Binding PageNumber,ElementName=reportViewer}" /> <TextBlock Text="/"/> <ContentPresenter Content="{Binding PageCount,ElementName=reportViewer}" /> <c1:C1ToolbarButton Content="Next" Command="{Binding NextPageCommand,ElementName=reportViewer}" /> <c1:C1ToolbarButton Content="Last" Command="{Binding LastPageCommand,ElementName=reportViewer}" /> <ComboBox SelectedItem="{Binding Zoom,ElementName=reportViewer,Mode=TwoWay}"> <sys:Double>0.5</sys:Double> <sys:Double>1</sys:Double> <sys:Double>1.5</sys:Double> </ComboBox> </c1:C1ToolbarStrip> <c1:C1ReportViewer x:Name="reportViewer" Grid.Row="1" ToolbarVisibility="Collapsed"/> </Grid>

XAML

Copy Code

<Grid x:Name="LayoutRoot">
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto" />
        <RowDefinition />
    </Grid.RowDefinitions>
    <c1:C1ToolbarStrip>
        <c1:C1ToolbarButton
            Content="First"
            Command="{Binding FirstPageCommand,ElementName=reportViewer}" />
        <c1:C1ToolbarButton
            Content="Previous"
            Command="{Binding PreviousPageCommand,ElementName=reportViewer}" />
        <ContentPresenter
            Content="{Binding PageNumber,ElementName=reportViewer}" />
        <TextBlock Text="/"/>
        <ContentPresenter
            Content="{Binding PageCount,ElementName=reportViewer}" />
        <c1:C1ToolbarButton
            Content="Next"
            Command="{Binding NextPageCommand,ElementName=reportViewer}" />
        <c1:C1ToolbarButton
            Content="Last"
            Command="{Binding LastPageCommand,ElementName=reportViewer}" />
        <ComboBox
            SelectedItem="{Binding Zoom,ElementName=reportViewer,Mode=TwoWay}">
            <sys:Double>0.5</sys:Double>
            <sys:Double>1</sys:Double>
            <sys:Double>1.5</sys:Double>
        </ComboBox>
    </c1:C1ToolbarStrip>
    <c1:C1ReportViewer
        x:Name="reportViewer"
        Grid.Row="1"
        ToolbarVisibility="Collapsed"/>
</Grid>

Note how all buttons bind the Command property to a command in C1ReportViewer. Also, you can easily bind to the PageNumber and PageCount properties to display the current page and total number of pages. Finally, a ComboBox is bound to the Zoom property allowing the user to control the zoom factor.

Several additional buttons can be customized using various commands. This is the list of commands:

Command	Description
SaveCommand	Saves the document.
PrintCommand	Prints the document.
FirstPageCommand	Navigates to the first page in the document.
PreviousPageCommand	Navigates to the previous page in the document.
NextPageCommand	Navigates to the next page in the document.
LastPageCommand	Navigates to the last page in the document.
DecreaseZoomCommand	Zooms out of the document.
IncreaseZoomCommand	Zooms into the document.
FindPreviousCommand	Finds the previous instance of the searched text.
FindNextCommand	Finds the next instance of the searched text.

C1PdfViewerToolbar's template also expects ToggleButtons with the following names:

Option	Description
FitWidth	Fits the width of the document to the size of the control.
OnePage	Displays one page.
TwoPages	Displays two pages side-by-side.

To use one of these ToggleButtons, for example TwoPages, inside a custom toolbar scenario, you would need to put the TwoPages ToggleButton inside the C1ReportViewer template. If you are making your own toolbar outside of the control, add a Button and set C1ReportViewer.ViewMode = ViewMode.TwoPages in the click handler.