Hands-On Lab Getting Started with Office 2010 Development Lab version: 1.0.0 Last updated: 2/23/2011
CONTENTS OVERVIEW... 3 Starting Materials 3 EXERCISE 1: CUSTOMIZING THE OFFICE RIBBON IN OFFICE... 4 Task 1 Add items to an existing ribbon... 4 Exercise 1 Verification... 6 EXERCISE 2: BUILDING A WORD 2010 ADD-IN... 7 Task 1 Create a new Word 2010 Addin... 7 EXERCISE 3: USING THE VISUAL STUDIO 2010 RIBBON DESIGNER... 10 Task 1 Create a new Ribbon... 10 Exercise 3 Verification... 14 SUMMARY... 16 APPENDIX... 16 No Items 16
Overview In this lab exercise, you will build a small add-in for Word 2010. You will make use of the data-binding capabilities of WPF combined with the SharePoint Client API. You will make use of new C#\Visual Basic language features to make calls into the object model easier. Objectives In this lab you will: Learn to customize the Office ribbon within Office Learn to build and debug a simple Word 2010 Add-in Learn to add a ribbon to your add-in using the ribbon designer System Requirements You must have the following items to complete this lab: Microsoft Windows Vista SP1 or Microsoft Windows Server 2008 (64-bit) Microsoft Office Professional Plus 2010 (32-bit or 64-bit) Microsoft Visual Studio 2010 Exercises This Hands-On Lab is comprised of the following exercises: 1. Customizing the Office Ribbon in Office 2. Building a Word 2010 Add-in 3. Using the Visual Studio 2010 Ribbon designer Estimated time to complete this lab: 30 minutes. Starting Materials This Hands-On Lab includes the following starting materials. Visual Studio solutions. The lab provides a Source folder. The lab instructions assume that you installed the training kit to the default location, C:\Office2010DeveloperTrainingKit\.
Note: Inside the lab s Source folder, you will find a Solution folder containing an end solution with the completed lab exercise. Exercise 1: Customizing the Office Ribbon in Office In this exercise you will use the built in ribbon customization functionality to build your own ribbon. Task 1 Add items to an existing ribbon In this task, you will extend the existing Home ribbon by adding Document View controls and a custom macro button. 1. In Word 2010, add Document Views to the View ribbon tab a. Open Office Word 2010 b. Right click the Home ribbon tab and select Customize the ribbon c. In the Word Options dialog, select All Tabs from the Choose commands from drop down list d. Expand the View node in the left hand side tree view e. Drag the Document Views node into the right hand side tree view inside the Home item Figure 1 Customized Ribbon
f. Click OK to close the dialog 2. Create a new Macro to generate random text. a. Switch to the View ribbon tab b. Click the Macros -> Record Macro button c. In the Record Macro dialog box, name the macro LoremIpsum. d. Choose Document1 (document) in the Store macro in drop down list e. Click OK to start recording f. Type the following into the document but do not hit the Enter key Word =lorem(3,3) g. In the Macros ribbon button, choose Stop Recording 3. Attach the new Macro to a ribbon button a. Right click the ribbon and select Customize the ribbon b. Select Macros in the Choose command from drop down list c. Select Home in the right side tree view and click New Group d. Rename New Group to Custom Macros using the Rename button e. Drag the Project.NewMacros.LoremIpsum item into the new group Figure 2 Customized Ribbon with Macro
f. Rename the new macro button Lorem Ipsum g. Click OK to save the changes Exercise 1 Verification In order to verify that you have correctly performed all steps of exercise 1, proceed as follows: Test the Macro Test your modifications to verify the Document View group and the new Macro buttons are visible on the ribbon in Word 2010. 1. Switch to the Home ribbon tab and verify the first group is Document Views 2. Find the Lorem Ipsum button and click it to verify it is working correctly. Press Enter following =lorem(3,3) and three paragraphs will be inserted. You can continue to click the macro button and Enter for more paragraphs. Figure 3 Custom Publishing Ribbon 3. When you are done close Word 2010
Exercise 2: Building a Word 2010 Add-in In this exercise you will use the built in ribbon customization functionality to build your own ribbon. Task 1 Create a new Word 2010 Addin In this task, you will create a simple Word 2010 add-in that displays a message box when it is loaded. 1. Open Visual Studio 2010 and create a new Word 2010 Add-in a. Start Visual Studio 2010 by clicking the Visual Studio icon on the taskbar b. Click the File -> New -> Project menu item c. In the New Project dialog, select Visual C#\Visual Basic -> Office -> 2010 template category d. Select the Word 2010 Add-in project template e. Enter a Name of Word2010AddIn and set the location to C:\Office2010DeveloperTrainingKit\Labs\GettingStarted\Source\[language]\Starte r f. Uncheck the Create directory for solution check box g. Click OK to create the new project Figure 4(a)
Figure 4(b) New Word 2010 Add-in 2. Add the code to display a message box when the add-in loads a. In the Solution Explorer double click ThisAddIn.cs(ThisAddIn.vb in case of VB) b. Add the following using statements to the file C# using System.Windows.Forms; Visual Basic Imports System.Windows.Forms c. Locate the ThisAddIn_Startup method and add the code to display a message box C# private void ThisAddIn_Startup(object sender, System.EventArgs e) { MessageBox.Show("Add-in is starting up"); } Visual Basic Private Sub ThisAddIn_Startup(ByVal sender As Object, ByVal e As System.EventArgs) MessageBox.Show("Add-in is starting up")
End Sub 3. Set a breakpoint and start the debugger a. Locate the ThisAddIn_Startup method in the ThisAddIn class b. Place a breakpoint on the first line of the function. Figure 5(a) Figure 5(b) Setting breakpoint c. Start the debugger by pressing F5 d. Wait for the add-in start and stop on the breakpoint Figure 6(a) Figure 6(b) Breakpoint hit e. Continue running by pressing F5 and verify the message box is displayed
Figure 7 Add-in startup message box Note: Office Add-ins support debugging directly from Visual Studio 2010 4. When you are done cleanup and remove the add-in a. Close Word 2010 b. In the Solution Explorer, right click Word2010AddIn and click Clean Note: The Clean option deletes a temporary add-in registration that allows Visual Studio to quickly register the add-in for development purposes Exercise 3: Using the Visual Studio 2010 Ribbon Designer In this exercise you will use the Ribbon designer in Visual Studio 2010 to add a custom ribbon to Word 2010. Task 1 Create a new Ribbon In this task, you will create a new Publishing ribbon using the Ribbon designer. 1. Add a new Ribbon item to the project a. In the Solution Explorer, right click Word2010AddIn and click Add > New Item
b. Select the Office template on the left hand side c. Choose an item of type Ribbon (Visual Designer) d. Name the new item Ribbon.cs(Ribbon.vb in case of VB) and click Add Figure 8(a) Figure 8(b) Add New Ribbon Dialog 2. Rename the ribbon tab and group in the designer a. Right click the tab in the designer and select Properties
b. In the Properties window set the Label to Publishing and the (Name) to tabpublishing c. In the designer, select the group named group1 d. In the Properties window set the Label to Formats and the (Name) to grpformats 3. Add a PDF button to the Formats group a. Drag a button from the Toolbox into the Formats group Note: If the Toolbox is not visible select View -> Toolbox in the menu b. In the Properties window set the Label to PDF and the (Name) to btnpdf c. Set the ControlSize to RibbonControlSizeLarge d. Click the button in the Image property e. In the Select Resource dialog, select Local resource and click Import f. Choose C:\Office2010DeveloperTrainingKit\Labs\GettingStarted\Source\[language]\Starte r\pdf.png g. Click OK to select the image Figure 9 PDF Button in the Designer 4. Add an XPS button to the Formats group a. Use the same procedure as above except use XPS in the Label and (Name) and choose xps.png instead of pdf.png
Figure 10 PDF and XPS Button in the Designer 5. Add code to publish the document to both buttons a. Double click the PDF button in the designer to generate a handler in code b. Switch back to the designer and double click the XPS button to generate a second handler c. In the code, enter the following using statements C# using System.IO; using Word = Microsoft.Office.Interop.Word; Visual Basic Imports System.IO Imports Word = Microsoft.Office.Interop.Word d. In the btnpdf_click method use the following code to export the current document to the desktop as a PDF. C# string desktopfolder = Environment.GetFolderPath(Environment.SpecialFolder.Desktop); string filename = "QuickExport.pdf"; Globals.ThisAddIn.Application.ActiveDocument.ExportAsFixedFormat( Path.Combine(desktopFolder, filename), Word.WdExportFormat.wdExportFormatPDF, OpenAfterExport: true); Visual Basic Dim desktopfolder As String = Environment.GetFolderPath(Environment.SpecialFolder.Desktop) Dim filename As String = "QuickExport.pdf" Globals.ThisAddIn.Application.ActiveDocument.ExportAsFixedFormat(Path.Co mbine(desktopfolder, filename), Word.WdExportFormat.wdExportFormatPDF, OpenAfterExport:= True) e. Use this code in btnxps_click to export the current document to the desktop as an XPS. C#
string desktopfolder = Environment.GetFolderPath(Environment.SpecialFolder.Desktop); string filename = "QuickExport.xps"; Globals.ThisAddIn.Application.ActiveDocument.ExportAsFixedFormat( Path.Combine(desktopFolder, filename), Word.WdExportFormat.wdExportFormatXPS, OpenAfterExport: true); Visual Basic Dim desktopfolder As String = Environment.GetFolderPath(Environment.SpecialFolder.Desktop) Dim filename As String = "QuickExport.xps" Globals.ThisAddIn.Application.ActiveDocument.ExportAsFixedFormat(Path.Co mbine(desktopfolder, filename), Word.WdExportFormat.wdExportFormatXPS, OpenAfterExport:= True) Note: The ExportAsFixedFormat method has many parameters not provided. C#\VB.Net 4.0 requires only the necessary parameters. Exercise 3 Verification In order to verify that you have correctly performed all steps in the above exercise, proceed as follows: Test the Add-in Test your add-in by creating a new document and enter some text. Once you are ready to publish your document, switch to the Publishing tab and choose export to PDF or XPS. If a PDF or XPS file appears on the desktop, your add-in worked. 1. From the Debug menu, choose Start Debugging. 2. Once Word 2010 has loaded and you have dismissed the message box, enter some content into the document.
Figure 11 Custom Publishing Ribbon 3. Switch to the Publishing ribbon tab 4. Click the PDF and the XPS buttons to export the documents in both formats 5. When the files load in their respective viewers, verify the contents are accurate Figure 12 XPS Viewer 6. When you are done cleanup and remove the add-in a. Close Word 2010 b. In the Solution Explorer, right click Word2010AddIn and click Clean
Summary In this exercise you learned how to customize Office 2010 application using a combination of built in functionality and custom Add-ins. These concepts form the foundation for customizations in Office. If the customizations needed can be performed without code they are more accessible to non-developers. In the case where more advanced customizations are needed Visual Studio 2010 provides a development environment allowing developers the control they need. Appendix No Items No Appendix content