Last at work I had the following request for the application:

“We want a printing mechanism, but the default Internet Explorer printing is not enough. We only want that specific part of the website”.

For the record, the application here is a Silverlight application. The application contains navigation windows that may not be added to the printed version of the control.

And then I started looking at the Printing API. Here you have the possibility to isolate a particular FrameworkElement that you want to print. Hereby it is possible to exclude all the navigation controls from the printed page.

I created a test application that looks like this:

In this example you can see a MainWindow with some buttons and a canvas. In that canvas are some labels and a usercontrol.
The xaml for this Window looks like this:

<grid background="White" x:name="LayoutRoot">
    <button name="btnPrintEverything" click="btnPrintEverything_Click" width="92" verticalalignment="Top" margin="12,12,0,0" horizontalalignment="Left" height="23" content="Everything">
    <button name="btnPrintContent" click="btnPrintContent_Click" width="82" verticalalignment="Top" margin="110,12,0,0" horizontalalignment="Left" height="23" content="content">
    <button name="btnPrintUserControl" click="btnPrintUserControl_Click" width="93" verticalalignment="Top" margin="198,12,0,0" horizontalalignment="Left" height="23" content="UserControl">
    <canvas margin="0,41,0,0" name="cvContent">
        <my:silverlightusercontrol x:name="silverlightUserControl" width="162" height="141" canvas.top="36" canvas.left="135" />
        <sdk:label width="108" height="30" content="Example1" name="label1" canvas.top="6" canvas.left="12" />
        <sdk:label width="108" height="30" content="Example2" name="label2" canvas.top="36" canvas.left="12" />
        <sdk:label width="108" height="30" content="Example3" name="label3" canvas.top="72" canvas.left="12" />
        <sdk:label width="108" height="30" content="Example4" name="label4" canvas.top="108" canvas.left="12" />
        <sdk:label width="108" height="30" content="Example5" name="label5" canvas.top="147" canvas.left="12" />
    </canvas>
</grid>

Now i tried to print 3 versions of this application.

The first version was to print everything on the screen. Here I used the Grid FrameworkElement ‘LayoutRoot’.
The second version was to print the content of the screen (everything expect from the top buttons). Here I used the canvas ‘cvContent’.
And the last version was to print only the userControl (the green part). Here I used the ‘silverlightUserControl’ name.

The code to accomplish this looks like this:

private void btnPrintEverything_Click(object sender, RoutedEventArgs e)
{
    Print("Everything", this.LayoutRoot);
}

private void btnPrintContent_Click(object sender, RoutedEventArgs e)
{
    Print("Conten", this.cvContent);
}

private void btnPrintUserControl_Click(object sender, RoutedEventArgs e)
{
    Print("UserControl", this.silverlightUserControl);
}

private void Print(string documentTitle, FrameworkElement element)
{
    var docToPrint = new PrintDocument();

    docToPrint.PrintPage += (s, args) =>
    {
        args.PageVisual = element;
    };

    docToPrint.Print(documentTitle);
}

The result looks like this (3 versions):