Chapter 12: Customizing a Form

In Chapter 11, “Building a Form,” you created a form from scratch based on the tblCompanies table in the ContactsDataCopy.accdb sample database. You also had a chance to build a simple form on tblProducts using a wizard and to make some modifications in Design view. These forms are functional, but they’re not yet professional grade. In this chapter, you’ll learn how to customize your forms in both Design view and the new Layout view to make them more attractive and useful.

Note 

The examples in this chapter are based on the forms, queries, tables, and data in HousingDataCopy.accdb on the companion CD included with this book. The results you see from the samples in this chapter might not exactly match what you see in this book if you have changed the sample data in the file. Also, all the screen images in this chapter were taken on a Microsoft Windows Vista system with the display theme set to Blue. Your results might look different if you are using a different operating system or a different theme.

Aligning and Sizing Controls in Design View

To learn how to customize a form, switch to the HousingDataCopy.accdb sample database. You need a form to edit and display employee data, and the easiest way to get started is to create a blank form based on the tblEmployees table. On the Create tab, in the Forms group, click the Blank Form button. A blank form grid appears in Layout view with the field list showing on the right side of the screen. Switch to Design view by clicking the small arrow below the View button in the Views group on either the Home tab or the Format contextual tab under Form Layout Tools. Right now the form is unbound-meaning there is no record source-so you need to bind this form to the tblEmployees table. Click the Property Sheet button in the Tools group on the Design tab under Form Design Tools. Find the Record Source property on the All or Data tab of the Property Sheet window for the form, and select tblEmployees from the list of table and query names to bind this form to the tblEmployees table.

Drag down the bottom margin of the Detail section to give yourself some room to work. Click the Arrange contextual tab under Form Design Tools, and make sure Snap To Grid is not selected. (We’re asking you to do this on purpose so you can learn ways to line up and evenly space controls.) Open the field list by clicking the Add Existing Fields button in the Tools group on the Design tab. If the field list displays other tables in the bottom half of the field list, click the Show Only Fields In The Current Record Source link at the bottom of the Field List window to show only the fields in the tblEmployees table. Drag and drop each field from the field list into a vertical column on your form about 1.5 inches from the left edge, beginning with the EmployeeNumber field and ending with the BirthDate field. Your starting point should look something like Figure 12–1. (If you don’t want to do the work yourself to get to this point, you can find this form saved as frmXmplEmployeel in the sample database.)

Figure 12–1: Start to build a form in Design view to display and edit employee data.

Note 

The HousingDataCopy.accdb sample database has a special template form called Normal that has its default control properties set to preserve the sunken and etched special effects. This ensures that you’ll see the default sunken text boxes when you follow the exercises in this chapter, even when you’re running Access on a Windows XP or Windows Vista computer with themed controls enabled. You’ll learn more about creating template forms later in this chapter.

If you threw the form together quickly to help you enter some data (as you did in Chapter 11 to create a simple Companies input form in the ContactsDataCopy.accdb database), it probably doesn’t matter if the form doesn’t look perfect. But all the text boxes except EmailName are the same size, which means some are too large and some are too small to display the data. The long EmailName control looks completely out of place compared to the other controls. Also, the labels are different sizes and not rightaligned. Finally, all the text boxes and labels are out of alignment. If you’re designing the form to be used continuously in an application, it’s worth the extra effort to finetune the design so that it will look professional and be easy to use.

Note 

Even if you follow along precisely with the steps described in this chapter, your results might vary slightly. All the alignment commands are sensitive to your current screen resolution. When your screen driver is set to a high resolution (for example, 1280×1024), the distance between grid points is logically smaller than it is when the screen driver is set to a low resolution (such as 800×600). You should design your forms at the same resolution as the computers that will run your application.

To examine the alignment and relative size of controls on your form, you can open the property sheet in Design view and click various controls. For example, Figure 12–2 shows the property sheets for the EmployeeNumber and the FirstName text box controls. You can see by looking at the values for the Left property (the distance from the left edge of the form) that the EmployeeNumber control is a bit closer to the left margin than is the FirstName control.

Figure 12–2: You can see in the Property Sheet windows for the EmployeeNumber and FirstName text box controls that the two controls are not aligned vertically.

You could move around the form and adjust controls so that they fit your data. You could painstakingly enter values for each control’s Left property to get all controls in a column to line up exactly and then set the Top property (defining the distance from the top of the Detail section) for controls that you want to appear in a row. You could also adjust the values for the Width and Height properties so that controls and labels are the same width and height where appropriate. Fortunately, there are easier ways to make all these adjustments.

Sizing Controls to Fit Content

One adjustment you might want to make on this employees form is to bold the font for all the labels. Remember from the previous chapter that you can click the horizontal ruler at the top of the design area to select all controls in a column, so do this to select all the label controls on the left. You can then hold down the Shift key and click the Administrator? label that’s not in the column to include it in your selection. Click the Bold button in the Font group on the Design tab to change the font in all selected controls.

Inside Out-Setting Selection Options 

If you think you’ll select multiple controls often, you might want to experiment with an option setting that governs how you can select controls with your mouse pointer. Click the Microsoft Office Button, click Access Options, and then click the Object Designers category in the Access Options dialog box. Under Forms/Reports, when you select the Partially Enclosed option, the selection box you draw with your mouse needs to touch only part of a control to select it. If you select the Fully Enclosed option, the selection box must contain the entire control in order for the control to be selected. Fully Enclosed is most useful for complex forms with many controls that are close to each other so that you don’t have to worry about inadvertently selecting controls that you touch but don’t fully enclose with the selection box.

However, now that you have changed the font, the label controls are no longer large enough to display all the characters, as shown in Figure 12–3. Notice, for example, that the last two letters and the colon in the Employee Number label appear clipped off. Also, although all the text boxes and the combo box appear high enough to adequately display the data in the default Tahoma 8-point font, they’re actually too small.

Figure 12–3: With the bold font, the label controls are no longer large enough to fit the caption text.

Microsoft Office Access 2007 has a command called Size To Fit that sizes label controls to fit the width of the caption text in the label. This command also ensures that text boxes and combo boxes are tall enough to display your data using the font size you’ve selected. You can, if you like, select all the controls so that you can resize them all at once. You can click the Select All button in the Controls group on the Design tab to highlight all the controls on your form. To select a specific group of controls, click the first one and then hold down the Shift key as you click each additional control that you want to select. You can also drag the mouse pointer across the form-as long as you don’t start dragging while you are on a control-and the mouse pointer will delineate a selection box. (If you start by clicking a control and then attempt to delineate other controls by dragging, you’ll only move the control.) Any controls that are inside the selection box when you release the mouse button will be selected. You can also select all controls in a vertical or a horizontal band by making the rulers visible (click the Ruler button in the Show/Hide group on the Arrange tab) and then dragging the mouse along the top or side ruler.

Inside Out-Sizing Individual Controls 

You can “size to fit” any individual control or label by clicking the control to select it and then double-clicking any of its sizing handles.

After you select the controls you want, on the Arrange tab, in the Size group, click the Size To Fit command. The Detail section should now look something like that shown in Figure 12–4. (You cannot see the entire Employee Number label because the right end of it is hidden under the EmployeeNumber text box.)

Figure 12–4: After clicking the Size To Fit command, you can see all the text in the labels.

Inside Out-Limitations in Use of the Size To Fit Command 

The Size To Fit command works very well to set the height of labels, text boxes, and combo boxes based on the font you have chosen. It also does a reasonable job setting the width of labels based not only on the font but also on the characters you have specified in the Caption property. However, it’s not perfect, so you should be aware of the following:

• When a label contains a long caption and has a large font that is bold or italic or both, the result of the Size To Fit command is often not wide enough. You will have to adjust the width manually.

• The Size To Fit command does not adjust the width of a text box or combo box because it cannot predict in advance how many characters might need to be displayed from the Control Source property. You must specifically set the width based on the data you expect the control to display.

• The Size To Fit command does not work for list boxes. When you switch to Form view and your list box row source contains enough rows to fill the list box, you might find that you see only part of a row at the bottom. (You’ll see only the top part of the characters.) You must switch back and forth between Design view and Form view, adjusting the height of the control manually so that it displays complete rows.

Switch to Form view, and scroll through several of the records to get an idea of which controls aren’t wide enough to display the data from the table and which ones could be narrower. You could painstakingly resize each control to exactly fit what you see in the sample data, but this is a bad idea for two reasons:

• The data is a sample of only 16 records, so new data you enter later might be much longer in some fields. You should size the fields that aren’t long enough to be 25 percent to 50 percent wider than what you think you need right now.

• A form that has a hodgepodge of a dozen or more different control widths won’t make for a very visually pleasing design. You should pick two or three standard widths to use, even if some of the controls end up being wider than necessary.

You can logically group the text box controls and the combo box control in this form into three separate lengths, as follows:

• Short   EmployeeNumber, DepartmentID, and StateOrProvince

• Medium   FirstName, MiddleName, LastName, Password, PostalCode, HomePhone, WorkPhone, and BirthDate

• Long   EmailName, OfficeLocation, Photo, Address, City, and Country

Note 

The Photo field in tblEmployees is a text field containing the name of the picture file. In Chapter 20, “Automating Your Application with Visual Basic,” you’ll learn how to load the file into an image control using Visual Basic code to display the picture. Also, although you can resize the check box control, the size of the graphic image inside the control doesn’t change.

You can make the necessary adjustments by leaving the medium-length fields as they are and adjusting the fields in the other two groups. Switch back to Design view now so that you can begin resizing the controls. First, select the EmployeeNumber control and then hold down the Shift key while you select the DepartmentID and StateOrProvince controls. Next, click the sizing box in the middle of the right edge of one of the controls, and drag the right edge to the left until all three controls are about half their original sizes. Now, click the EmailName control, and resize this control to about half of its original width. Next, click the OfficeLocation control, and hold down the Shift key while you select the Photo, Address, City, and Country controls. Click the sizing box in the middle of the right edge of one of these controls, and drag the edge right until all three controls are about 50 percent bigger than their original sizes. Your layout should now look something like Figure 12–5.

Figure 12–5: The form for employee data has controls sized to better fit the data.

Before you go on, you might want to save the form and name it frmEmployees. You can find the form at this stage saved as frmXmplEmployee2 in the sample database.

Adjusting the Layout of Controls

You could have also used the Form Wizard and selected Columnar as the layout to get a jump-start on your employees form. That wizard lays out controls in two columns, without any regard to clusters of fields that might work well lined up side by side. Also, the wizard would put only two controls in the right column, which would make the form look lopsided. Setting up two columns to edit this data is probably a good idea to better use the screen space that is wider than it is tall, but by doing it yourself, you can choose which fields go in which column. For example, you might want to place the work-related fields (EmailName, Department, WorkPhone, OfficeLocation, Password, and IsAdmin) in one column, and place the personal fields (Address, City, StateOrProvince, PostalCode, Country, HomePhone, BirthDate, and Photo) in another.

To adjust your sample employees form in this way, follow these steps:

1. Stretch the Detail section to about 6. inches wide to give yourself some room to work.

2. Select as a group the Address, City, StateOrProvince, PostalCode, Country, and HomePhone controls, and move them into a new column on the right. You’re going to end up with two fewer controls in the right column than in the left, so line up the Address control opposite the MiddleName control.

3. Grab the Photo control, and move it under HomePhone opposite Password.

4. Select the WorkPhone control, and move it into the space vacated by Photo.

5. Move the BirthDate control under Photo and across from IsAdmin (the Administrator check box).

6. Grab the lower edge of the Detail section, and shrink the section so that it’s now wider than it is high.

7. Select the Employee Number label, grab the positioning handle in the upperleft corner, and move the label to the left out from under the EmployeeNumber text box.

When you’re done, you should have a form design that looks something like the one shown in Figure 12–6. Now you’re ready to fine-tune your form using alignment and control-size adjustments.

Figure 12–6: The employees form has the controls arranged into columns that make sense.

“Snapping” Controls to the Grid

It’s a good idea to design your form so that all the controls are spaced evenly down the form and all controls in a column line up. One way that you might find convenient to do this is to take advantage of the grid. If you enable Snap To Grid in the Control Layout group on the Arrange tab, when you move any control, its upper-left corner “snaps” to the nearest grid point. You can use this feature to help you line up controls both horizontally and vertically.

You can adjust the density of the grid by changing the Grid X, and Grid Y properties in the property sheet of the form. Be sure that the property sheet is open (Alt+Enter for a shortcut), and then select Form in the Selection Type list near the top of the Property Sheet window. For this example, set the Grid X, and Grid Y properties to 16 (0.0625 inch between grid points). This works well for the default 8-point Tahoma font because the “sized to fit” text boxes will be 0.17 inch high. You can place these text boxes every 0.25 inch (four grid points) down the form, which leaves adequate space between the controls. This reduced density also makes it easier to see the grid points so that you can move controls close to the point you want. You could set Grid X, and Grid Y to 4, but that reduces flexibility for placing your controls.

The fastest way to snap all controls to the grid is to click Select All in the Controls group on the Design tab and then click the To Grid button in the Control Alignment group on the Arrange tab. The result might look something like that shown in Figure 12–7.

Figure 12–7: This is how your employees form should look after you “snap” the controls to the grid.

Inside Out-What’s the Difference Between Snap To Grid in Control Layout and To Grid in Control Alignment? 

When you enable Snap To Grid, Access aligns the upper-left corner of a control to the grid when you move the control. When you select a control and click To Grid, Access immediately moves that control’s upper-left corner to the nearest grid point. The difference is with Snap To Grid, you’re moving the control, and with To Grid, Access moves the control for you.

If you want to position each control individually, enable Snap To Grid by making sure it is selected in the Control Layout group on the Arrange tab. (The button appears highlighted and raised when it is active.) Click each text box, combo box, or check box control, and drag it vertically to positions every 0.25 inch (every fourth grid point) down the grid. When you release the mouse button, you’ll see the upper-left corner of the control “snap” to the nearest grid point. As you saw in the previous chapter, when you select and move a control that has an attached label, Office Access 2007 moves the control and its label as a unit. If you previously moved a label up or down independent of its attached control by using the positioning handle in the upper-left corner, you might need to select either the control or its label and use the positioning handle again to realign each label and associated control.

Note 

For a simple form with a few controls, Snap To Grid works well to help you line up controls. For more complex forms, using the commands in the Control Alignment group produces a better result. Read the next section to learn about these commands.

Snapping to the grid can help you spread the controls apart to make them easier to work with. You’ll see in the next few steps that it’s easy to line them all up properly.

Lining Up Controls

You now have your controls spaced down the form, but they might not be equally spaced, and they probably aren’t aligned vertically and horizontally. These problems are easy to fix. First, if your form ended up looking like the sample in Figure 12–7 with one or more pairs of controls touching, you need to create some more space by moving down the bottom controls in each column. First, click the IsAdmin check box at the bottom of the first column to select it, and press the Down Arrow once for each pair of touching controls. (We needed to move the control down two rows of dots in our sample.) Do the same, if necessary, to the BirthDate control at the bottom of the second column. Next, select all the text box controls and the check box control in the first column. You can do this by clicking the first text box control (not its associated label) and then holding down the Shift key as you click each of the remaining controls in the column. Or you can click the ruler above the controls. On the Arrange tab, in the Position group, click the Make Vertical Spacing Equal button. Finally, choose all the text box controls and the combo box control in the second column, and click the Make Vertical Spacing Equal button again.

Now you’re ready to line up the labels. To get started, select all the labels in the left column except the label for the IsAdmin check box. (You can do this the same way you selected all the data-bound controls in a column.) When you have selected them, your form should look something like the one shown in Figure 12–8. Notice that Access also shows large positioning handles in the upper-left corners of all the related controls but no sizing handles.

Figure 12–8: The employees form has a column of labels selected.

The labels will look best if their right edges align. You have two choices at this point. If you turn off the Snap To Grid command, you can have Access align all the labels with the label whose right edge is farthest to the right, even if that edge is between dots on the grid. If you leave Snap To Grid on, you can have Access align the labels with the label farthest to the right and then snap the entire group to the nearest grid point.

Note 

For this example, we left Snap To Grid turned on, but you can try it both ways to see which gives you the best result. Try it with Snap To Grid on, and then click the Undo button on the Quick Access Toolbar and try it with Snap To Grid turned off.

When you’re ready to align the selected labels on your form, on the Arrange tab, in the Control Alignment group, click the Align Right button. While you’re at it, click the Align Text Right button in the Font group on the Design tab to align the captions to the right edges of all the label controls. Click outside the design area to select the form, which will cancel the selection of the labels. Your form should look similar to the one shown in Figure 12–9.

Figure 12–9: The labels from Figure 12–8 are right-aligned.

To further improve the alignment of the controls on the employees form (assuming your form now looks like Figure 12–9), do the following:

1. The EmployeeNumber text box is a bit too far to the left. Click the control to select it, then click the positioning handle in the upper-left corner, and finally drag the control to the right. If you still have Snap To Grid turned on, it should line up with the FirstName control.

2. Select the EmployeeNumber, FirstName, MiddleName, LastName, EmailName, DepartmentID, OfficeLocation, WorkPhone, Password, and IsAdmin controls. Click the Align Left button in the Control Alignment group on the Arrange tab.

3. Select the labels in the right column and right align them. Also click the Align Text Right button in the Font group on the Design tab to align the captions to the right edge of the label controls.

4. In our sample, the labels in the right column end up a bit too close to the related data controls. Fixing this is a bit tricky. Select the longest label (State/Province), grab its positioning handle in the upper-left corner, and drag it left one row of dots. Grab the sizing handle in the middle of the right edge, and expand the label size until it snaps to one row of dots away from the StateOrProvince text box. Now, select all the labels again, align them left, and then align them right. Note that by first setting the right edge of the longest label and then aligning all the labels first to the left, the longest label is now assured to protrude farthest to the right. Thus, when the labels are all aligned right again, they line up with the new right offset of the longest label.

5. We like all our labels to appear to the left of the related control, so click the Administrator? label to select it, grab its positioning handle in the upper-left corner, and drag it to the left of the IsAdmin check box. If you still have Snap To Grid turned on and you do this carefully, the label should line up vertically with the other labels in the column and horizontally with the check box. While you’re at it, click the Align Text Right button in the Font group on the Design tab. If you like, click the Administrator? label, and add a colon to the end of the text.

6. Close up the bottom of the Detail section a bit so that you have the same amount of space below the bottom control as you do above the top control.

After you complete these steps, your form should look something like the one shown in Figure 12–10.

Inside Out-Moving Controls in a Horizontal or Vertical Plane 

If you want to move one or more controls only horizontally or only vertically, hold down the Shift key as you select the control (or the last control in a group) that you want to move, and then drag either horizontally or vertically. When Access detects movement either horizontally or vertically, it “locks” the movement and won’t let the objects stray in the other axis. If you inadvertently start to drag horizontally when you mean to move vertically (or vice versa), click the Undo button, and try again. Moving controls in this way is especially useful when you have Snap To Grid turned off.

Figure 12–10: The controls and labels are aligned horizontally and vertically.

If you switch to Form view, you can see the result of your work as shown in Figure 12–11. Click the Save button on the Quick Access Toolbar to save this form. Name the form frmEmployeesDesignView, and then close the form. You can also find this form saved as frmXmplEmployee3 in the sample database.

Figure 12–11: This is your employees form with controls aligned and sized.

Inside Out-Using the Auto Resize Property 

Forms have an Auto Resize property. If you set this property to Yes and you are using multiple-document interface mode with overlapping windows, Access sizes the Form window to exactly fit the form. Note that Access won’t automatically resize a form in that case if you’ve switched from Design view to Form view. You can set the Auto Center property to Yes to center the Form window in the current Access workspace if you are using overlapping windows.