Introduction to the DotPdf Template Page Generator

April 30, 2015 Atalasoft General

The DotPdf Template Page Generator is a tool designed to help you quickly and painlessly lay out PDF templates for use in DotPdf projects. Download the DotPdf Template Page Generator to try out this tutorial.

This tool is in BETA and currently supports a useful, but limited subset of the full DotPdf functionality. However, it can help you get started quickly, and generate either template or C# code that you can use to start your projects.

When you run it, the main toolbar of the application looks like this:
dotpdf-tools.png

From left-to-right:

  1. The “Open Template” button opens a dialog where you can select a PDF template to continue working on or make changes to.
  2. The “Save Template” button opens a dialog that allows you to save your PDF template to disk.
  3. The “Copy Code to Clipboard” button will dynamically generate the equivalent C# code to programmatically create your PDF and copy it to the clipboard. You can paste this into a Visual Studio project.
  4. The “Help” button will take you to this document.

Beneath that is a toolstrip with the tools you can use to add objects to your template, which looks like this:

dotpdf-pdfobj.png

From left-to-right:

  1. The “Rectangle” button allows you to draw a rectangle anywhere on the PDF of any size or fill.
  2. The “TextLine” button allows you to create a line of text anywhere on the PDF.
  3. The “TextBox” button allows you to create a text box anywhere on the PDF. You would use this when you have multiple lines of text in a bound area, and you don’t care how the lines of text are broken. If you need to have the text exactly arranged, it would be better to use text lines.
  4. The “Image” button allows you to embed an image in your PDF, and place and resize it however you’d like.

Underneath that is the “Objects List”, which starts out empty, but looks like this when you have a lot of PDF Objects on your PDF

dotpdf-ObjectList.png

Every object placed on your PDF will be populated in this list. When you click on one, a selection box will be displayed in the Image Viewer, and the properties of that specific object will be displayed in the properties panel beneath this list.

Use the arrows underneath this box to change the ordering of objects, which affects whether they’re drawn over or underneath each other (objects listed first are on top). Delete an object by clicking the ‘X’ icon. Duplicate an object by clicking the last button – this is useful when you’ve set the colors and font of an object and want another one of those elements further down the page.

When you select an object in the list, the Properties pane beneath it will be populated:

dotpdf-Properties.png

Specific properties such as Height or position (designated by Bottom and Left, here) can be precisely adjusted by clicking the property and typing in a new value.

If you use the Name property, you will be able to find this shape programmatically with code later. Also, the Objects List will show this name so that you can easily select it.

Creating an Invoice

We will now step you through the process of creating an invoice.

In general, you will mostly use the tool to lay out sections of the PDF whose position you don’t anticipate changing, such as logo headers, footers with the company contact information, and so on. If the content of the area changes, it is trivial to design sections with fields that can be edited later, such as customer names or invoice dates.

  1. Launch the DotPdf Template Page Generator. You will see a blank page and empty PDF Object list.
  2. Begin generating a template by pressing the Image button in the PDF Objects toolstrip. A dialog should open. Navigate to a logo PNG file and select it (The PNG must be RGB, not indexed in the current BETA). The page will now show the image placed near the upper left.  You can select it with the mouse and move it to where you want it. You can set the Name property of the image to “Logo” so that you can easily recognize it again in the Object List.
  3. Create a TextLine object and use the property manager to replace the default text with your company name. Set the Font to what you want, and set the Name to “CompanyName”. Place it to the right of the logo.
  4. Add two more TextLines, one for your address, and another for your city, state, and zip.
  5. Add one more with the Name “InvoiceNum” and set the Text to “Invoice ###”. At this point, the project looks like this:

    dotpdf-invoice1.png
     
  6. Use rectangles with a solid black fill to create the page dividers. Once you have one horizontally aligned, duplicate it twice and use the property editor to change their vertical position.
  7. If you have big blocks of text that you want to be automatically word-wrapped, use a TextBox.
  8. Save the Template as "InvoiceTemplate.pdf"

Now, using DotPdf you can write code to load this template, fill in an invoice number and save out a new PDF.  Here's the code:

 using (Stream st = File.OpenRead(@"InvoiceTemplate.pdf"))
{
    // Open the invoice and pull out the first page
    PdfGeneratedDocument doc = new PdfGeneratedDocument(null, null, st);
    PdfGeneratedPage page = doc.Pages[0] as PdfGeneratedPage;

    // find the InvoiceNum field and update it with the actual invoice #
    PdfTextLine field = page.DrawingList.Find((p) =>
         { return p.Name == "InvoiceNum"; }) as PdfTextLine;
    field.Text = "Invoice# 2333-ASFD-45443";

    // Save this as a new PDF
    doc.Save(@"invoice-2333-ASFD-45443.pdf");
}

 

About the Author

Atalasoft General

This is a general account for case studies, product information, and articles about the culture of Atalasoft.

Follow on Twitter More Content by Atalasoft General
Previous Article
How to Create a Custom Submittable PDF Form and Capture User Input From It
How to Create a Custom Submittable PDF Form and Capture User Input From It

How to Create a Custom Submittable PDF Form and Capture User Input From...

No More Articles