You are here:   Blog
Register   |  Login

May 12

Written by: Michael Washington
5/12/2011 5:25 AM  RssIcon

 

Also see: Printing Sql Server Reports (.rdlc) With LightSwitch

With LightSwitch, there is no built in Printing. Here is a method that works. This will also show you how to create a custom template to allow you to print exactly what you want, not just the current screen.

Note: you need Visual Studio Professional (or higher) to create Custom Silverlight Controls.

image

Create a new LightSwitch application called PrintInvoice.

image

Select Create new table.

image

Create a table called Customer.

image

Select New Table.

image

Create a table called Loans.

image

Click the Relationship Button.

image

Select Customer in the Name/To dropdown and click OK.

image

Double-click on Customers in the Solution Explorer.

image

Add a MoneyOwed column to the Customer table.

image

In the Properties for the column, check the Is Computed box, and click the Edit Method link.

 

image

Enter the following code:

    result = (from loans in LoansCollection
                select loans).Sum(X => X.LoanAmount);

 

Save and close the Customer.cs file.

image

When you return to the table, you will see the computed property icon next to the MoneyOwed field

image

Click the Screen Button.

image

Create a List and Details Screen.

image

The Screen editor will show.

image

Hit F5 to build and run the application.

image

Enter some sample data.

Create The Custom Control

image

Select File, then Add, then New project…

image

Create a Silverlight Class Library.

image 

Select Silverlight 4.

image 

The Project will show in the Solution Explorer, right-click on the Class1.cs file and Delete it.

image

Right-click on the Custom Silverlight Controls Project and add New Item…

image

Create a Silverlight User Control called Invoice.xaml.

image

If you have Microsoft Expression Blend installed, you can right-click on the Invoice.xaml file and select Open in Expression Blend…

image

If you get the message above, click Close, it wont affect anything.

image

Go into Assets.

image

Grab a DataGrid.

image

Drop it on the design surface. This will add the needed references to support the DataGrid.

image

Switch to XAMl view .

Change the markup to the following:



<UserControl
    xmlns:System="clr-namespace:System;assembly=mscorlib"
    x:Class="CustomTemplate.Invoice"
    mc:Ignorable="d"
    d:DesignHeight="300" d:DesignWidth="400">
    <StackPanel>
        <Button Content="Print" Name="btnPrint" Click="btnPrint_Click" />
        <Border BorderThickness="1" BorderBrush="#FF504F4F">
 
            <Grid x:Name="LayoutRoot">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="0.02*"/>
                    <ColumnDefinition Width="0.2*"/>
                    <ColumnDefinition Width="0.5*"/>
                    <ColumnDefinition Width="0.1*"/>
                    <ColumnDefinition Width="0.18*"/>
                </Grid.ColumnDefinitions>
                <Grid.RowDefinitions>
                    <RowDefinition Height="0.053*"/>
                    <RowDefinition Height="0.08*"/>
                    <RowDefinition Height="0.533*"/>
                    <RowDefinition Height="0.133*"/>
                    <RowDefinition Height="0.2*"/>
                </Grid.RowDefinitions>
                <sdk:DataGrid ItemsSource="{Binding Screen.LoansCollection, Mode=OneWay}"
            AutoGenerateColumns="False" Grid.Row="2" Grid.Column="1" Grid.ColumnSpan="2" >
                    <sdk:DataGrid.Columns>
                        <sdk:DataGridTextColumn Binding="{Binding LoanReason}" CanUserSort="True" DisplayIndex="0"
                        Header="Loan Reason" MaxWidth="100" MinWidth="50" Visibility="Visible" Width="Auto"/>
                        <sdk:DataGridTextColumn Binding="{Binding LoanAmount, StringFormat=C}" CanUserSort="True" DisplayIndex="1"
                        Header="Loan Amount" MaxWidth="100" MinWidth="50" Visibility="Visible" Width="Auto"/>
                    </sdk:DataGrid.Columns>
                </sdk:DataGrid>
                <TextBlock TextWrapping="Wrap"
                Text="Invoice For:" FontWeight="Bold" Grid.Row="1" VerticalAlignment="Top" HorizontalAlignment="Left" 
                Grid.Column="1" Margin="0,0,5,0"/>
                <TextBlock TextWrapping="Wrap"
                Text="{Binding Screen.Customers.SelectedItem.Name}" Grid.Row="1" Grid.Column="2" Margin="5,0,0,0"
                       HorizontalAlignment="Left" VerticalAlignment="Top"/>
                <TextBlock TextWrapping="Wrap" Text="Date:" FontWeight="Bold" VerticalAlignment="Top"
                       Grid.Column="3" HorizontalAlignment="Left" Margin="4,0,0,0"/>
                <TextBlock x:Name="InvoiceDate" Grid.Column="4" HorizontalAlignment="Left" VerticalAlignment="Top" />
                <Rectangle Grid.ColumnSpan="2" Grid.Column="1" Fill="#FF010108" Height="8" Stroke="Black"
                       VerticalAlignment="Center"/>
                <Rectangle Grid.Column="2" Fill="#FF010108" Height="8" Stroke="Black" VerticalAlignment="Bottom" Grid.Row="3"/>
                <TextBlock TextWrapping="Wrap"
                Text="Total:" FontWeight="Bold" Grid.Row="4" VerticalAlignment="Top" Grid.Column="1"
                 TextAlignment="Right" Margin="0,0,4,0"/>
                <TextBlock Grid.Column="2" Height="16" Grid.Row="4" TextWrapping="Wrap"
            Text="{Binding Screen.Customers.SelectedItem.MoneyOwed, StringFormat=C}"
                       VerticalAlignment="Top" Margin="4,0,0,0"/>
            </Grid>
        </Border>
    </StackPanel>
</UserControl>

image

Change the code in the Invoice.cs file to the following:


using System;
using System.Windows.Controls;
using System.Windows.Printing;
 
namespace CustomTemplate
{
    public partial class Invoice : UserControl
    {
        PrintDocument printInvoice = new PrintDocument();
        public Invoice()
        {
            InitializeComponent();
            InvoiceDate.Text = DateTime.Today.ToShortDateString();
        }
 
        private void btnPrint_Click(object sender, System.Windows.RoutedEventArgs e)
        {   
            printInvoice.PrintPage +=
                new EventHandler<PrintPageEventArgs>(printInvoice_PrintPage);
            printInvoice.Print(String.Format("Invoice Date: {0}", DateTime.Today.ToShortDateString()));
        }
 
        void printInvoice_PrintPage(object sender, PrintPageEventArgs e)
        {
            e.PageVisual = LayoutRoot;
        }
    }
}

Save, and close the pages.

Return to Visual Studio and Build the project.

Note: see Creating A LightSwitch Custom Silverlight Control for more information on creating Silverlight Custom Controls.

 

Consume The Silverlight Custom Control

image

Return to the Screen editor in Visual Studio.

Select the DetailsColumn node, then select Add Layout Item, then select Custom Control.

image

Click the Add Reference Button.

image

Create a Project reference to the CustomTemplate project.

image

You will now be able to select the Invoice control you created.

Leave “Screen” in the “data” Text Box, and click OK.

image

In the Screen editor, click in the Custom Control node.

 image

Clear the Display Name.

image

set the alignment to Stretch.

 

image

Drag the control under the Data Grid.

image

Change the name to Invoice.

image

Hit F5 to run the project.

When you run the project. You will see a Print button that will print the current Invoice.

 

 

Special Thanks

A special thanks to Sheel Shah for explaining how to get a programmatic reference to a Custom Control.

Also see: Microsoft Lightswitch Client Native Printing

 

Download

You can download the code on the Downloads page:

http://lightswitchhelpwebsite.com/Downloads.aspx

44 comment(s) so far...


Gravatar

Re: Printing With LightSwitch

Thanks for posting. This was very interesting.

By megafluffles on   8/24/2010 5:38 PM
Gravatar

Re: Printing With LightSwitch

Okay Michael, you are killing us here :) We're already sleepless from playing with custom controls and now you throw this at us. Maybe we should wait for the book? LOL

Keep 'em coming!

Cheers

By Paul on   8/25/2010 8:40 AM
Gravatar

Re: Printing With LightSwitch

@Paul - I hear you on the 'sleepless' part. You have to practically tear yourself away from the computer because LighSwitch is so much fun.

By Michael Washington on   8/25/2010 8:41 AM
Gravatar

Re: Printing With LightSwitch

Really great article.
I cannot make this work with vb.net though.

I cannot make the Button_Execute method a Partial Private Sub as I get the following error:
Method 'Button_Execute' cannot be declared 'Partial' because only one method 'Button_Execute' can be marked 'Partial'.

Any way around this?

By Andy James on   9/8/2010 10:25 AM
Gravatar

Re: Printing With LightSwitch

@Andy James - Sorry no experience with this using VB :(

By Michael Washington on   9/8/2010 10:26 AM
Gravatar

Re: Printing With LightSwitch

Thanks Michael, really appreciate the work you're doing with Lightswitch. I've bookmarked your blog.

By Pascal Mettey on   9/11/2010 5:58 AM
Gravatar

Re: Printing With LightSwitch

Hi There,I have an Image field in the database for the business' logo. I would like to insert the logo on to the invoice. How would I go about binding the image in the database on to an image control in the silverlight user control? Below is the code for my invoice. Thank You in Advance.

By Pieter van der Linde on   9/28/2010 4:15 AM
Gravatar

Re: Printing With LightSwitch

@Pieter van der Linde - I'm sorry but I do not have any example code, but I suspect that all you need to do is use a Silverlight image control. You will want to post a question on the LightSwitch forums.

By Michael Washington on   9/28/2010 4:18 AM
Gravatar

Re: Printing With LightSwitch

Andy, The problem is that you don't need to add partial keyword in VB. For C#, it is must. That's why always go from the designer to the code so you get the right stubs generated automatically for you.

By Prem on   10/8/2010 2:56 PM
Gravatar

Re: Printing With LightSwitch

One tiny addition: If you set the custom control to not visible (uncheck IsVisible in the properties pane) the UserControl won't display in the form, but will display when being printed. This hint is for all those mere mortals (tm) out there... I'm sure Michael's already figured this out.

Michael,
Excellent posts.

By tchichester@eps-software.com on   10/8/2010 2:56 PM
Gravatar

Re: Printing With LightSwitch

@tchichester - I did not know that. Thanks.

By Michael Washington on   10/8/2010 2:57 PM
Gravatar

Re: Printing With LightSwitch

Thanks for this walkthrough. The only problem I am having is that I cannot print grids that are longer than 1 page. It just prints one page and cuts everything off. Is there any way to print multiple pages using this method ? Thanks.

By Shane Ledford on   11/11/2010 12:44 PM
Gravatar

Re: Printing With LightSwitch

@Shane Ledford - You can try:
silverlightreport.codeplex.com/
or:
slreportlibrary.codeplex.com/
or:
silverlightreporting.codeplex.com/

By Michael Washington on   11/11/2010 12:50 PM
Gravatar

Re: Printing With LightSwitch

After looking at those sites and others literally all day I can't find a way to do multipage printing using a custom control and binding to screen data.

It seems like a very data reliant process, and no one is using data in the same way that I am with screen data.

I'm brand new to Silverlight, learning it as a need with Lightswitch, any help on multipage printing using this method would be greatly appreciated.

By Shane Ledford on   11/12/2010 2:21 PM
Gravatar

Re: Printing With LightSwitch

@Shane Ledford - I woud just use the method here:
lightswitch.adefwebserver.com/Blog/tabid/61/EntryId/11/Printing-Sql-Server-Reports-rdlc-With-LightSwitch.aspx

By Michael Washington on   11/12/2010 2:21 PM
Gravatar

Re: Printing With LightSwitch

Thanks for posting this article, it helped me in making printable pages.

I want to know how do I change default currency symbol ($) based on local culture?

By Kundan on   11/22/2010 12:39 PM
Gravatar

Re: Printing With LightSwitch

@Kundan - Sorry I do not know off hand. However, this method uses a normal Silverlight control, so if you Bing/Google you can apply any solution you find for a normal Silverlight control.

By Michael Washington on   11/22/2010 12:40 PM
Gravatar

Re: Printing With LightSwitch

I have an Image field in the database for the business' logo. I would like to insert the logo on to the invoice. How would I go about binding the image in the database on to an image control in the silverlight user control? Below is the code for my invoice.

By Gross loan on   12/2/2010 5:12 AM
Gravatar

Re: Printing With LightSwitch

@Gross loan - I do not have any examples. You will want to go to social.msdn.microsoft.com/Forums/en-us/lightswitchgeneral/threads for help.

By Michael Washington on   12/2/2010 5:16 AM
Gravatar

Re: Printing With LightSwitch

I couldn't agree with you anymore. You read my mind fully.*_*

By chaussure basket on   12/5/2010 9:00 PM
Gravatar

Re: Printing With LightSwitch

i am new in programming I need to print the invoice but have not been tested with another report like codeplex
or something similar and vb

regards

By Maria on   3/14/2011 5:53 PM
Gravatar

Re: Printing With LightSwitch

This printing works fine if the App is intended for desktop deployment. But if you choose a Web Deployment that printing will not work and complain that only a user can invoke a dialog. Is there a way to print when the Lighswitch application is a Web Application?

By Craig on   7/26/2011 10:18 AM
Gravatar

Re: Printing With LightSwitch

@Craig - There is but I don't have any examples.

By Michael Washington on   7/27/2011 7:35 PM
Gravatar

Re: Printing With LightSwitch

I am also needing the ability to print from a web application. Any headway on this?

By Jason on   8/16/2011 2:32 PM
Gravatar

Re: Printing With LightSwitch

@Jason - Because there are so many commecial LightSwitch printing solutions, I do not know of anyone who is working on this, at least not me :)

By Michael Washington on   8/16/2011 2:34 PM
Gravatar

Problem with custom control

Hi

I have some experience in SQL and ASP.NET web forms, but I am new to Silverlight and obviously LightSwitch as well.

I have followed the entire tutorial, but did not succeeded at the very end. Main problems I had were related to custom control.
When you "Add Reference" in Add Custom Control window you write:

"Create a Project reference to the CustomTemplate project."

when I choose the appropriate CustomTemplate from within Projects tab and click "ok" I do not see it on top of the list. Actually I do not see any of the Microsoft.LightSwitch.... classes. My list starts from System.Windows
Does it mean I have not installed some extension. My LightSwitch application is installed on top of VS 2010 Pro version.

Also. I do not have Expression Blend installed on my machine. I just copied the .xaml code and replaced the original one while following tutorial. Can it influence onto the final result?

Cheers for help in advance

Bartosz

By Bartosz on   8/23/2011 4:29 AM
Gravatar

Re: Printing With LightSwitch

@Bartosz - Please download the attached code and see if it works for you. If you have further problems please post to the forums on this site.

By Michael Washington on   8/23/2011 4:30 AM
Gravatar

Re: Printing With LightSwitch

I pulled down the code for this example and I am getting an null expection printInvoice.Print(String.Format("{0}", this.Customers.SelectedItem.Name));

I am also getting the same error in my own program where I followed this example.

I am using VS2010 with Lightswtich installed.

Any ideas on how to resolve this would be fantastic.

Andrew

By Andrew_77 on   12/19/2011 7:46 AM
Gravatar

Re: Printing With LightSwitch

@Andrew_77 - You will get that error if a Customer is not selected first.

By Michael Washington on   12/19/2011 8:49 AM
Gravatar

Re: Printing With LightSwitch

I have selected a customer other than the default when the application opens (John). So, I click on Jane or Tim then click on Print Invoice and I get the error. I clicked into the Name field and get the error, I select one of the records in the grid and get the error. I have selected everything possible in this screen and no luck.

Thanks - Andrew

By Andrew_77 on   12/20/2011 5:45 AM
Gravatar

Re: Printing With LightSwitch

While in debugger, I followed the object chain and there is a valid selected item of Jane, Tim, or John depending on which Customer I selected. I am using Windows 7, Visual Studio 2010 w/ LightSwtich Installed. I am wondering if there isn't something going on with the PrintDocument object and something not being set and this is throwing the null exepction error.

By Andrew_77 on   12/20/2011 6:26 AM
Gravatar

Re: Printing With LightSwitch

@Andrew_77 - I suspect Silverlight 5 may have changed some things. I will update this article next week with new code.

By Michael Washington on   12/20/2011 6:44 AM
Gravatar

Re: Printing With LightSwitch

The code has been updated.

By Michael Washington on   12/21/2011 6:39 AM
Gravatar

Re: Printing With LightSwitch

Great article Michael

Have you tried setting the page to legal and the orientation to landscape, then print the report ?

Seems like the page setting are not passed to the print driver forcing the user to select the page type and orientation every time that a report is run, I'm told that this is a SL problem.

Have you experienced this and if so how did you work around it ?

By TerryH on   1/5/2012 10:19 AM
Gravatar

Re: Printing With LightSwitch

@TerryH - I have not heard of that problem before now... so, sorry I have no answer :(

By Michael Washington on   1/5/2012 10:37 AM
Gravatar

Re: Printing With LightSwitch

@Bartosz - did you find a solution to your problem? as I am having the same issue

By Martin Arr on   1/6/2012 6:00 AM
Gravatar

Re: Printing With LightSwitch

i think this is a good resouce, thanks for the info on printing with lightswitch, very useful to me and my staff.

By printing on   1/8/2012 10:37 AM
Gravatar

Re: Printing With LightSwitch

Hi Michael

Excellent!
This gives me valuable advice on how I can print from a light switch application.

Even though I still do not understand everything right now, thank you very much!

By Urs Gloor on   1/20/2012 3:23 AM
Gravatar

Re: Printing With LightSwitch

Thanks for this walkthrough, what if i want to send the documant directly to the defulat printer without selecting the printer from the print dialog box.

Best Regards

By Abu Shabab on   2/28/2012 7:32 AM
Gravatar

Re: Printing With LightSwitch

Hi Michael,

Great post, thank you.

Do you know how to set a page margin for this? The above Silverlight print control seems to print right to the edge of the page.

By Daniel on   5/8/2012 7:05 PM
Gravatar

Re: Printing With LightSwitch

Thanks for your help

I tried this code and used to work fine but now when i try to print the application show un exception about security
and user should open dialog by himself !!

any sol.

best regards

By Naser on   10/26/2012 10:26 AM
Gravatar

Re: Printing With LightSwitch

@Naser - That is probably a popup blocker on the web browser. I know of no way to get past pop up blockers.

By Michael Washington on   10/26/2012 10:27 AM
Gravatar

Re: Printing With LightSwitch

Hi Michael,

I have a problem, when trying to Add the reference i can select the check box but the reference won't show up in the following screen. I suspect it could be caused by an extension or so.
Do you have any idea of what is going on?

By James Restrepo on   10/29/2013 12:23 PM
Gravatar

Re: Printing With LightSwitch

@James Restrepo - This tutorial is old. Things probably changed with Silverlight 5.

By Michael Washington on   10/29/2013 12:23 PM

Your name:
Gravatar Preview
Your email:
(Optional) Email used only to show Gravatar.
Your website:
Title:
Comment:
Security Code
CAPTCHA image
Enter the code shown above in the box below
Add Comment   Cancel 

Microsoft Visual Studio is a registered trademark of Microsoft Corporation / LightSwitch is a registered trademark of Microsoft Corporation