Adding a User Control to Your Project

1. Right-click the project in Solution Explorer, point to Add, and click User Control.

2. In the Add New Item dialog box, select User Control, leave the default name of UserControl1.vb, and then click OK.

This adds a class to your project called UserControll.vb. The class has a code view and a design view. By default, the user control appears in Visual Studio in design view. You can then add controls and set their properties in this view.

3. Resize the user control so that its Width is 210, and its Height is 320.

4. Add a Button to the top of the user control, and change the Text property to Select Graphics. Then change the Size property to 170, 23.

5. Add a PictureBox control to the document, and change the Size property to 170, 118. Then set the BorderStyle property to FixedSingle. Also change the SizeMode property to Stretchlmage.

6. Add two LinkLabels above the PictureBox—one to the far left, and one to the far right. Change the Text property of the left LinkLabel control to Previous, and change the Text property of the right LinkLabel control to Next.

7. Add a TextBox control below the PictureBox, and change the Multiline property to True. Then change its Size property to 170, 62.

8. Add a Button control below the PictureBox control, and change its Text property to Insert.

9. Add a FolderBrowserDialog to the form. When you do this, the control is added to the component tray at the bottom of the designer.

Your finished user control should resemble the one in Figure 8.12.

You can add code to the Click event handler of Button1 that displays the File Browser dialog box, creates a collection of file names for each file in the chosen directory that has a .jpg or .bmp extension, and then populates the PictureBox with the first graphic in the collection. Doubleclick Button1 to change to code view, and place your cursor within the button's Click event handler. Next, add the code in Listing 8.9 to the UserControl1 class. Be sure to add the variable declarations outside the Click event handler.

Figure 8.12. Adding Windows Forms controls to a user control

Listing 8.9. Populating a PictureBox control with graphics

Dim FileList As New Collection Dim current As Integer = 1

Private Sub Button1_Click(ByVal sender As System.Object, _ ByVal e As System.EventArgs) Handles Button1.Click

' Remove any graphics currently in the PictureBox control. FileList.Clear()

Me.FolderBrowserDialog1 = New _


Dim folderName As String

Dim result As DialogResult = _


folderName = FolderBrowserDialog1.SelectedPath Dim sFile As String

If (result = DialogResult.OK) Then

' Loop through all files in selected directory and add ' graphics to the FileList collection. For Each sFile In System.IO.Directory.GetFiles( _ folderName)

Dim FileInfo As New System.IO.FileInfo(sFile)

If FileInfo.Extension = ".bmp" Or _ FileInfo.Extension = ".jpg" Then

FileList.Add(FileInfo.FullName, FileInfo.Name)

End If


' If items exist in FileList collection, add the ' first one to the PictureBox control. If FileList.Count = 0 Then

Me.PictureBox1.Image = Nothing


Me.PictureBox1.ImageLocation = FileList(current) End If

End If

End Sub

Next, add code to the Click event handler of the LinkLabel controls, as shown in Listing 8.10. This code checks the location of the current graphic within the FileList collection and moves to (and displays) the next or previous graphic.

Listing 8.10. Navigating through a FileList collection to change the graphic displayed

Private Sub LinkLabel1_LinkClicked(ByVal sender As _ System.Object, ByVal e As _

System.Windows.Forms.LinkLabelLinkClickedEventArgs) _ Handles LinkLabel1.LinkClicked

If current > 1 Then

Me.PictureBox1.ImageLocation = FileList.Item( _

End Sub

Private Sub LinkLabel2_LinkClicked(ByVal sender As _ System.Object, ByVal e As _

System.Windows.Forms.LinkLabelLinkClickedEventArgs) _ Handles LinkLabel2.LinkClicked

If current < FileList.Count Then

Me.PictureBox1.ImageLocation = FileList.Item( _

End Sub

Now you can add code that will insert two things into the header of the Word document whenever the Insert button on the user control is clicked: the selected picture, along with any text that was typed into the text box. Add the code in Listing 8.11 to the button's Click event handler in the UserControl1 class.

Listing 8.11. Inserting text and a graphic into a document's first-page header

Private Sub Button2_Click(ByVal sender As System.Object, _ ByVal e As System.EventArgs) Handles Button2.Click

If Me.PictureBox1.ImageLocation = "" Then

MsgBox("Please select a graphic to insert.") Exit Sub End If

If Me.TextBox1.Text = "" Then

MsgBox("Please add text for the header.") Exit Sub End If

Globals.ThisDocument.PageSetup. _

DifferentFirstPageHeaderFooter = True

Globals.ThisDocument.Sections(1).Headers( _

Word.WdHeaderFooterIndex.wdHeaderFooterFirstPage). _ Range.Tables(1).Cell(1, 2).Range.Text = Me.TextBox1.Text

If Globals.ThisDocument.Sections(1).Headers( _

Word.WdHeaderFooterIndex.wdHeaderFooterFirstPage) _ .Range.InlineShapes.Count > 0 Then

Globals.ThisDocument.Sections(1).Headers( _

Word.WdHeaderFooterIndex.wdHeaderFooterFirstPage) _ .Range.InlineShapes(1).Delete()

End If

Globals.ThisDocument.Sections(1).Headers( _

Word.WdHeaderFooterIndex.wdHeaderFooterFirstPage). _ Range.InlineShapes.AddPicture( _

Me.PictureBox1.ImageLocation).Range.Style = _ Globals.ThisDocument.Styles("Graphic")

End Sub

Now you can reuse the code for creating the menu items that you used in Listing 8.7. This time, you'll need to change the code in the CreateLogo_Click event handler so that it contains the code in Listing 8.12. The CreateLogo_Click event handler is in the ThisDocument class.

Listing 8.12. Displaying the user control on a Windows Form control when a menu item is clicked

Private Sub CreateLogo_Click(ByVal Ctrl As

Microsoft.Office.Core.CommandBarButton, ByRef _ CancelDefault As Boolean) Handles CreateLogo.Click

Dim myWinForm As New Windows.Forms.Form Dim myUserControl As New UserControl1

With myWinForm

.Controls.Add(myUserControl) .AutoSizeMode = AutoSizeMode.GrowAndShrink .AutoSize = True .Show() End With

End Sub

When you press F5 to run the code, you will be presented with a dialog box. You select a folder that contains graphics files (.jpg or .bmp) and then scroll through the graphics by clicking the Previous and Next LinkLabels. Next, you add any desired first-page header text and click Insert. The letterhead will resemble the one in Figure 8.13.

Figure 8.13. Adding a logo and text to a first-page header

When you click the Insert button, the logo and text are inserted. If you click the Select Graphics button again, you can change the directory and then load new graphics into the dialog box. In the next section, we show you how easy it is to reuse the user control and corresponding code to display the user interface on the task pane.

0 0

Post a comment