Geeks With Blogs
Peter Tweed Exploring and explaining the mysteries of .NET
A common and key requirement in business applications is the ability for the user to print the information they are using in the business application. FINALLY – Silverlight 4 Beta delivers this capability.
This blog will show you how to first of all print in Silverlight 4 Beta and then how to print in a useful way!
The code for this blog can be found here and is built with 4 Beta and Visual Studio 2010 Beta.
1.       Create a Silverlight application project with an ASP.NET web project to host it
2.       Add the following XAML to the LayoutRoot grid of the MainPage.xaml file
            <RowDefinition Height="14" />
            <RowDefinition Height="31" />
            <RowDefinition Height="31" />
            <RowDefinition Height="14" />
            <RowDefinition Height="31" />
            <RowDefinition Height="200" />
            <RowDefinition Height="14" />
            <RowDefinition Height="26" />
            <RowDefinition Height="*" />
            <ColumnDefinition Width="88" />
            <ColumnDefinition Width="200" />
            <ColumnDefinition Width="*" />
        <TextBlock Grid.Column="1" Grid.Row="1" Height="23" HorizontalAlignment="Left"  Text="Enter Your Title:" VerticalAlignment="Top" Width="120" />
        <TextBox Grid.Column="1" Grid.Row="2"  HorizontalAlignment="Left" Name="TitleTextBox" Width="200" />
        <TextBlock Grid.Column="1" Grid.Row="4" Height="23" HorizontalAlignment="Left" Name="textBlock1" Text="Enter Your Notes:" VerticalAlignment="Top" Width="120" />
        <TextBox Grid.Column="1" Grid.Row="5"  HorizontalAlignment="Stretch" Name="NotesTextBox" VerticalAlignment="Stretch" TextWrapping="Wrap" VerticalScrollBarVisibility="Auto" AcceptsReturn="True" />
        <Button Content="Print Notes" Grid.Column="1" Grid.Row="7" Height="23" HorizontalAlignment="Right" Margin="0,0,3,0" Name="PrintButton" VerticalAlignment="Top" Width="75" Click="PrintButton_Click" />
This xaml lays out a couple of TextBlocks that capture a title and notes for a user to enter and a button that the user can click to print the information entered for the title and notes.
3.       Add the following using statement to the MainPage.xaml.cs file
using System.Windows.Printing;
4.       Add the following code to the MainPage.xaml.cs file
        private void PrintButton_Click(object sender, RoutedEventArgs e)
            PrintDocument doc = new PrintDocument();
            doc.PrintPage += new EventHandler<PrintPageEventArgs>(doc_PrintPage);
        void doc_PrintPage(object sender, PrintPageEventArgs e)
            e.PageVisual = LayoutRoot;
This code handles the code behind, creates a PrintDocument, defines the event handler that should be called after the print dialog’s OK button is clicked and then displays the print dialog via the Print() method.
The event handler for the PrintPage event is where the content for the print is assigned via the PageVisual attribute on the PrintPageEventArgs object. This can be any UI element. We assign the LayoutRoot element as we want to print our page. At the end of this event handler the content assigned to the PageVisual attribute is printed to the printer chosen by the user in the print dialog.
We are not going to do it here, but if you wanted to print multiple pages, the HasMorePages attribute on the PrintPageEventArgs object should be set to true. This would make the PrintPage event handler execute again where the same thing would be done for the next page.
5.       Run the application , enter a title and some notes and click the print button, select a printer (in my case a PDF writing application) and click OK
I printed to a PDF file so I could see the effect without using paper. Hmmmmm….. The print of the LayoutRoot grid was literal. Notice that the UI is printed as displayed including the scrolled content in the notes TextBlock.
We need to change the printing to be something better for our needs. In my scenario we are going to want to print the notes on a page with the title at the top and the notes displayed below.
6.       Add a user control to the Silverlight solution named PrintingPageTemplate
7.       Add the following attributes to the user control xaml in PrintingPageTemplate.xaml
Width="815" Height="1060"
8.       Add the following xaml to the LayoutRoot grid
                    <GradientStop Color="#FF9DE2F5" Offset="0"></GradientStop>
                    <GradientStop Color="#FF91E1FC" Offset="1"></GradientStop>
                    <GradientStop Color="#FF354EDB" Offset="0.512" />
        <StackPanel VerticalAlignment="Stretch" HorizontalAlignment="Stretch" Margin="10,10,10,10" >
            <Border HorizontalAlignment="Stretch" VerticalAlignment="Stretch" BorderBrush="#FF7CA9EB" CornerRadius="10" BorderThickness="5" Background="White" Height="50" >
                <TextBlock HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Margin="2" TextWrapping="Wrap" Name="TitleTextBlock" FontSize="24" TextAlignment="Center" FontFamily="Lucida Sans Unicode" FontStyle="Italic" >
            <Border HorizontalAlignment="Stretch" VerticalAlignment="Stretch" BorderBrush="#FF7CA9EB" CornerRadius="10" Margin="0,10,0,0" BorderThickness="5" Background="White" Height="950" >
                <TextBlock HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Margin="10" TextWrapping="Wrap" Name="ContentTextBlock">
This xaml defines a gradient background for the user control, defines a TextBlock surrounded by a border for the title and another for the main content where the notes will be displayed.
9.       Add the following properties to the PrintingPageTemplate.xaml.cs file
        public string PageTitle { set { TitleTextBlock.Text = value; } }
        public string PageContent { set { ContentTextBlock.Text = value; } }
10.   Replace the PrintPage event handler in the MainPage.xaml.cs file with the following code
        void doc_PrintPage(object sender, PrintPageEventArgs e)
            PrintingPageTemplate printPage = new PrintingPageTemplate();
            printPage.PageTitle = TitleTextBox.Text;
            printPage.PageContent = NotesTextBox.Text;
            e.PageVisual = printPage;
Instead of printing the LayoutRoot grid, we put assign the title value entered to the property in the PrintingPageTemplate object instantiated (our user control) which assigns it to the title and notes content TextBlocks.
The one thing the PrintPage event handler does not do is calculate how much content should be displayed on the page before the rest is displayed on another page. Feel free to work that in yourself!
11.   Run the application , enter a title and some notes and click the print button, select a printer (again in my case a PDF writing application) and click OK
Congratulations! You have implemented your own styled printing format for your application.
What have we done?
We have implemented printing and defined a styled layout for the printed page.
Using the PrintDocument class we can easily implement printing in a Silverlight 4 Beta application and support the printing needs of the users of the business application.
Posted on Thursday, December 3, 2009 9:40 PM Silverlight | Back to top

Comments on this post: Printing in Silverlight 4 Beta - FINALLY!!!!!

# re: Printing in Silverlight 4 Beta - FINALLY!!!!!
Requesting Gravatar...
Its a very nice content for silverlight beginners.
Left by Amit Sarathe on Feb 04, 2010 12:56 AM

# re: Printing in Silverlight 4 Beta - FINALLY!!!!!
Requesting Gravatar...
How to print without print dialog box?
Left by Jay on Feb 11, 2010 10:39 PM

# re: Printing in Silverlight 4 Beta - FINALLY!!!!!
Requesting Gravatar...

Thanks for the article. It is really simple to understand and implement. Could you please tell me how can we do multiple print pages using custom printing template?
E.g. if ContentTextBlock has more content then its total size, how can we set "HasMorePages" to true?
I have been trying this but not getting any where. Thanks in advance.
Left by Vishal on Jul 07, 2010 7:40 AM

# re: Printing in Silverlight 4 Beta - FINALLY!!!!!
Requesting Gravatar...

Thanks for the article...Can you tell how did you generate a pdf from your silverlight Application in this article??
Left by Vinod on Jul 18, 2010 10:53 PM

# re: Printing in Silverlight 4 Beta - FINALLY!!!!!
Requesting Gravatar...

How to print in silverlight 4 without dialog box popup and to specific printer?
Left by Ganesh Katore on Dec 04, 2010 1:52 PM

# re: Printing in Silverlight 4 Beta - FINALLY!!!!!
Requesting Gravatar...
Hi, thanks for this great article.
#Ganesh Katore, I think there is no way printing without print dialog box in silverlight becuase of security reasons...
Left by Ismail OZER (isozworld) on Feb 11, 2011 6:08 AM

# re: Printing in Silverlight 4 Beta - FINALLY!!!!!
Requesting Gravatar...
But let me tell you a little something: Gone are the days when you simply start a blog and people come flocking by the millions. People need to be able to find you and no, they aren’t going to come looking.
Left by what is forex trading system on Jul 05, 2011 12:46 PM

Your comment:
 (will show your gravatar)

Copyright © PeterTweed | Powered by: