Working in Layout View

Up to this point you’ve been building a form in Design view to add and edit records in the tblEmployees table. You’ve seen how to start with a blank form and add fields to the grid, position the controls into a two-column layout, and then align the controls both horizontally and vertically. In this section, you’ll follow the same procedure to build an employees form, except this time you’ll use the new Layout view in Access 2007. By performing the same steps in Layout view, you will learn how the new Layout view can significantly reduce the amount of time spent aligning and positioning controls. You’ll also be able to see live data in the tblEmployees table while working with the controls in Layout view.

Click the Blank Form button in the Forms group on the Create tab. A blank form grid appears in Layout view with the Field List window showing on the right side of the screen. The form does not yet have a record source, so you need to bind this form to the tblEmployees table. Click the Property Sheet button in the Tools group on the Arrange tab under Form Layout Tools. Find the Record Source property on either the All or Data tab in 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.

Understanding Control Layouts and Control Anchoring

Now that you have the form bound to the tblEmployees table, you can begin to add the fields to the form grid, as you did previously in Design view, but this time you have left the blank form in Layout view. Open the field list by clicking the Add Existing Fields button in the Controls group on the Format 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.

Earlier in the chapter, you were able to drag a control from the field list and drop it on any part of the form grid in Design view. Let’s try the same step now in Layout view. Drag and drop the EmployeeNumber field from the field list onto the form grid. (It doesn’t matter on what part of the grid you drop the field.) After you release the mouse, you’ll notice that Access places the control in the upper-left corner of the form grid, as shown in Figure 12–12. Notice also that you can see actual data from the table in the text box.

Figure 12–12: Access positions the EmployeeNumber control in the upper-left corner no matter where you drop it on the form grid.

Access applied a control layout to the grid and anchored the EmployeeNumber control in the upper-left corner. Access positioned the Employee Number label 0.25 inch from the top of the form and 0.25 inch from the left side of the form. When you anchor a control in a control layout, Access resizes or moves the control if you resize or move the section in which the control resides. In addition to anchoring controls to the default top left, you can choose to anchor controls at the bottom left, top right, and bottom right. You can also choose to stretch the controls across the top, down the left side, across the bottom, down the right side, and down and across the section. On the Arrange tab, in the Position group, click the Anchoring button to see the nine possible anchoring configurations, as shown in Figure 12–13.

Figure 12–13: Use the anchoring options to select different anchoring positions for your controls.

To see how another anchoring option appears on the form grid, select the EmployeeNumber field, if it isn’t already selected, and then click Stretch Across Top in the Anchoring gallery. You’ll notice that Access increases the width of the EmployeeField so that it extends closer to the right edge of the form. If you close the Field List window, you can see that Access again increases the width of the control. Switch to Form view now by clicking the arrow in the Views group on the Home or Format tab and selecting Form View in the list of available views. Access displays the EmployeeNumber field nearly across the entire top of the form grid, as shown in Figure 12–14. In most cases, a control this wide is not very practical for a simple text field. Return to Layout view, select the EmployeeNumber control, click the Anchoring button in the Position group on the Arrange tab, and change the anchor option back to Top Left.

Figure 12–14: The Stretch Across Top anchoring option produces a very wide control.

If you like, you can try some of the other options, but their names are intuitive. Top Right pins the control in the upper-right corner. Stretch Down expands the control to fill the vertical space on the form. (If you have more than one control stacked in the layout, Access expands them all equally to fill the space.) Stretch Down And Across expands the control to fill the entire space, and so on.

Lining Up Controls

Now that you have the EmployeeNumber field on the grid, let’s add the next field, FirstName, below EmployeeNumber. Click the FirstName field in the field list, drag it onto the form, and drop it just below the EmployeeNumber label and text box, as shown in Figure 12–15. When you have it correctly positioned, Access displays a horizontal I-bar below the EmployeeNumber controls. You’ll notice that Access doesn’t allow you to drop the FirstName field to the right of the EmployeeNumber control. It displays this I-bar only above or below the EmployeeNumber controls.

Figure 12–15: Drag and drop the FirstName field below the EmployeeNumber field.

After you release the mouse, Access places the FirstName field directly below the EmployeeNumber label and text box controls, as shown in Figure 12–16. Now that you have two controls on the grid, you can really begin to see the advantages of using a control layout. Unlike the Design view exercise you performed at the beginning of this chapter, Access creates label and field controls that exactly match the dimensions of the first label and field controls when you use a control layout. Access positions the new controls directly beneath the EmployeeNumber controls and aligns them vertically.

Figure 12–16: Access sizes all the same types of controls to the same height and width when you use a control layout.

Control layouts help you align and position controls on forms and reports. It might be easier to think of a control layout as being similar to a table in Microsoft Office Word or a spreadsheet in Microsoft Office Excel. When you widen or narrow one control in a column, you change the width of any other controls in that column that are part of that control layout. Likewise, when you increase or decrease the height of a control, you’re changing the height of all the controls in that row.

Access 2007 has two kinds of control layouts-stacked and tabular. In a stacked control layout, Access “stacks” bound controls for different fields in a column and places all the labels down the left side. You can have multiple sets of stacked controls within a section. Any controls (including associated labels) in a stacked layout must all be in one section. In the form you’ve built thus far, Access has placed the employee number and first name controls in a stacked layout in the Detail section. You can tell these controls are in a control layout by noticing the small box with crosshairs just to the left of and slightly above the Employee Number label, previously shown in Figure 12–16.

In a tabular control layout, Access places bound controls horizontally with labels along the top as column headings-much like rows on a spreadsheet. A tabular control layout can include controls in different sections of a form-for example, the labels can appear in a header section and the data controls in the Detail section of the form.

Moving Controls Within a Control Layout

Let’s add the remaining fields onto the form grid now. Click the MiddleName field in the field list, hold down the Shift key, and then click the BirthDate field to highlight the remaining 16 fields. Drag all the controls as a group onto the form grid and drop them just below the FirstName label and text box. After you drop the fields onto the grid, your form should look like Figure 12–17.

Figure 12–17: You can quickly move a group of fields from the field list into a control layout in Layout view.

When you work with a control layout in Layout view, you can save time positioning, moving, and resizing controls. As you can see in Figure 12–17, Access sizes all the labels and text box controls to the same dimensions. When you did this same exercise in Design view at the beginning of the chapter, you needed to perform extra steps to make all the labels the same size, change the widths of the labels to accommodate the caption text, and line up the controls both horizontally and vertically. You also had to swap positions for the IsAdmin check box and label. In the new Layout view, though, Access correctly places the label to the left of the check box, which makes this part of the form creation process much easier and faster.

Note 

If you look closely again at Figure 12–17, you’ll notice a discrepancy with the order of the fields on the form grid. In the initial release of Access 2007, a bug causes the order of fields to be incorrectly positioned on the form grid when you drag and drop a group of controls from the field list. If you compare your field list on the form grid to the order of fields displayed in the field list, you’ll see that the order has been rearranged. To work around this bug, you can drag and drop one field at a time onto the form grid from the field list instead of dragging a group of controls onto the form grid. For now, we’ll keep the incorrect order on the grid so that we can show you another advantage to using control layouts.

When you have controls in a control layout and move them around in Layout view, Access automatically snaps them back into proper horizontal and vertical alignment. To see this feature, let’s change the order of the controls on the form grid to match the display order shown in the field list. Click the MiddleName text box control or label, drag it up toward the top of the form, and drop it just below the FirstName label and text box. When you have it correctly positioned, Access displays a horizontal I-bar below the FirstName controls, as shown in Figure 12–18.

Figure 12–18: Drag the MiddleName label and text box controls into their correct position.

After you release the mouse, Access moves the MiddleName label and text box controls beneath the FirstName controls and moves all the other controls down to make room, as shown in Figure 12–19. Access also lines up all the controls both horizontally and vertically on the form grid. By using a control layout, you can easily move and swap control positions without having to line up the controls.

Figure 12–19: In a control layout, Access repositions controls when you move them around the form grid.

Using the technique you just learned, reposition the remaining fields to match the display order in the field list. Keep the Field List window open during this process so that you can see their correct order.

After you reposition all the controls, your form should look like Figure 12–20. You repositioned and aligned the controls in a matter of seconds, whereas this same procedure in Design view could take much longer.

Figure 12–20: All the controls now match the field list display order.

Formatting a Column of Controls

As you might recall from earlier in the chapter, we like to right align our labels and bold the font. When you did this procedure in Design view, you clicked the horizontal ruler at the top of the design area to select all controls in a column. In Layout view, however, you cannot display the horizontal ruler. To select all the label controls in a column, select the Employee Number label and then rest your mouse pointer on the top edge of the label until it changes to a down arrow, as shown in Figure 12–21. When you see the down arrow, click once; Access highlights all the labels in that column. Now click the Bold button in the Font group on the Format tab to change the font in all the label controls to bold. Next, click the Align Text Right button in the Font group to right align all the text in the labels.

Figure 12–21: Select all the labels by resting your mouse pointer on the top edge of the Employee Number label.

You’ll notice that when you change the font to bold, Access increases the width of all the label controls to make sure all the text still fits within the labels. Access then pushes all the text controls to the right to accommodate the wider labels. Here again, you can see how Layout view saves you time compared to doing the same steps in Design view.

Resizing Controls

Now that you have all the labels formatted just the way you want, you should adjust the width of the text box controls. Remember that earlier in the chapter we discussed having three different widths for the various text box controls. Right now, all the text box controls are 3 inches wide, which is much larger than they need to be. Also, we eventually want to have two columns for our fields, so you’ll need to make room for the second column of controls. Let’s start by resizing all the text box controls to the longest length we want to have, 1.5 inches, and then we’ll move the controls into two columns. You’ll have an easier time positioning the controls into two columns when you can see the maximum width of the text box controls. Click the sizing box in the middle of the right edge of the EmployeeNumber text box, and drag the right edge to the left until the control is about 1.5 inches wide. As you drag the control to the left, you’ll immediately notice that Access resizes every other text box as well, as shown in Figure 12–22.

Figure 12–22: When you resize one control in a control layout, all other controls in the same column are also resized.

Now you can see one of the great advantages and disadvantages of using a control layout. If you need to resize all the controls in the same column on a form grid to the same width or height, using a control layout makes this process very simple. However, it is impossible to make individual sizing changes to some of the controls inside a control layout. To resize individual controls, you must remove the control layout applied to the controls. But keep in mind that when you remove the control layout, you lose the timesaving features of moving and positioning the controls should you need to insert additional controls.

Removing a Control Layout

To move eight of your fields into a second column as you did in Design view earlier in this chapter, you need to remove the control layout applied to all the controls on the form grid. Because all the controls are in a stacked layout, Access does not allow you to drag any of the controls into a second column. To remove the control layout, you first need to select all the controls. Click the Employee Number label, and move your pointer to the top edge until it turns into a down arrow. Click, and Access highlights all the labels. Now hold down the Shift key, click the EmployeeNumber text box, and move your mouse to the upper edge of the control until it becomes a down arrow. Click again, and Access highlights all the text box controls as well. Now that all the form controls are selected, on the Arrange tab, in the Control Layout group, click the Remove button, as shown in Figure 12–23.

Figure 12–23: Click the Remove button to remove the control layout applied to the form controls.

Inside Out-Using the Property Sheet to Help Resize Controls 

In Layout view, you cannot display the horizontal ruler across the top of the form grid. When you want to resize a control to a specific height or width in this view, it can be difficult trying to guess exactly the right size when you drag the edges of the control. To make this process easier, first display the Property Sheet window by clicking the Property Sheet button in the Tools group on the Arrange tab. Click either the Format or All tab to display the Height and Width property settings, and then type the new height or width directly on the property sheet to resize the control. You can also click a control and then begin dragging the control edges. After you make an adjustment to the control’s height or width, release the mouse, and notice that Access adjusts these properties on the property sheet. You’ll immediately be able to gauge whether you need to make further adjustments.

Now that you’ve removed the control layout, you can move and resize any controls independently. You need to move eight fields into a new column to the right of the existing column. To select all of these controls as a group, hold down the Shift key, and then click both the label and the text box for the following fields-Photo, Address, City, StateOrProvince, PostalCode, Country, HomePhone, and BirthDate. After you have all these controls selected, move your mouse onto the middle of one of the controls until it becomes double-sided crosshairs. Now drag the controls as a group to the right and line up the top control even with the MiddleName controls before releasing the mouse, as shown in Figure 12–24. Make sure to leave a little extra room between the two columns. (You don’t have to be perfectly precise in this move because you’re still going to move things around.)

Figure 12–24: Drag the selected controls into a new column.

After you drop the controls in the second column, your form should look like Figure 12–25. The two columns of controls now have large gaps between the various controls because Access kept the original relative distance between the controls when you moved them as a group. Earlier in this chapter you saw how to fill these missing gaps in Design view by dragging the controls around and then aligning them to existing controls. You could follow the same procedure here in Layout view, but let’s use control layouts to save some extra steps.

Figure 12–25: The controls are now separated into two columns, but you still need to move and align them.

Placing Controls into a Control Layout

If you select all the controls on the form grid and apply them again to a stacked control layout, Access aligns all the controls to the left edge of the form, essentially undoing the work you just did in the preceding step. If, however, you create a new control layout for each column of controls, you can still use the features of control layouts. Select all the controls in the left column by holding down the Shift key and then clicking each label and text box (include the IsAdmin check box as well). Next, click the Stacked button in the Control Layout group on the Arrange tab, as shown in Figure 12–26.

After you click the Stacked button, you’ll notice that Access snaps the three label and field controls near the bottom of the form grid up next to the other controls. Access aligns them perfectly both horizontally and vertically with one click.

Figure 12–26: Click the Stacked button to apply a control layout to the controls on the left side of the form grid.

If you look at Figure 12–27, you’ll notice that Access 2007 aligned all the label captions back to the left. In a stacked control layout, this is the default, so you’ll need to change this to right-aligned. (Notice, however, that placing the controls back into a control layout did not remove the bold font from the labels.) Click the Employee Number label, rest your mouse pointer on the top edge of the label until the cursor changes to a down arrow, and then click to highlight all the label controls. Click the Align Text Right button in the Font group on the Format tab to right align the labels.

Figure 12–27: Access aligns all the controls on the left side of the form after you apply control layout.

Now you need to apply a control layout to the controls on the right side of the form grid. Select each label and text box on the right side of the form, and then click the Stacked button in the Control Layout group on the Arrange tab. Access brings all the label and field controls on the right side up to the Photo controls and aligns them horizontally and vertically. Access again changes all the label captions to be left-aligned, so highlight the labels, and right align them as you did previously. After you make these changes, your form should look like Figure 12–28. You can see how quick and easy it is to align controls when you use control layouts.

Figure 12–28: Each column of controls is now within its own stacked control layout.

Now that you have applied a control layout to each column, you should check to make sure that the controls from both columns line up together. Depending upon where you moved the controls to the right side of the form, they could be a little higher or lower than the respective controls on the left side. Because each group of controls is in a control layout, if you move one control, they all move together. To align all the controls vertically, select the MiddleName and Photo controls, and then on the Arrange tab, in the Control Alignment group, click the Top button, as shown in Figure 12–29.

Figure 12–29: Use the commands in the Control Alignment group to align both control layouts together.

Note 

In our test form, we used the Top button to bring the controls up on the right side of the form into alignment with the controls on the left side. If you placed the controls in the right column higher on the form, you might need to select the Birth Date and Work Phone controls and use the Bottom button to bring your controls in the right column down to align them.

Adding Some Space with Control Padding

All your controls from both sides of the form are now aligned vertically, but they seem to be too close together. Earlier in the chapter, you adjusted the space between the controls by using the grid properties and snapping the controls to the grid. You can also adjust the spacing between the controls by using the control padding commands. Control padding adjusts the amount of space between the controls on the form.

Access 2007 has four settings for control padding-None, Narrow (the default), Medium, and Wide. Let’s change the control padding around all the controls from Narrow to Medium. Select all the controls on the grid by clicking the Employee Number label, moving the mouse pointer over the top edge until it becomes a down arrow, and then clicking once to highlight all the labels in that column. Hold down the Shift key, and do the same procedure for the EmployeeNumber text box, the Photo label, and the Photo text box. After you have all the controls on the form grid selected, click Control Padding in the Control Layout group on the Arrange tab, and then click Medium, as shown in Figure 12–30.

Figure 12–30: Change the control padding from Narrow to Medium to increase the space between the controls.

Inside Out-Selecting All Controls in a Control Layout 

You can quickly select all the controls in a specific control layout by clicking one of the controls and then clicking the small box with crosshairs just to the left of and slightly above the first control in the control layout.

After you click the Medium button, Access increases the padding around all the controls so that they are spaced further apart, as shown in Figure 12–31. You’ll notice, however, that the controls from the two separate control layouts don’t quite line up. This is easy to fix using the techniques you learned previously-select the MiddleName and Photo controls, and click the Bottom button in the Control Alignment group on the Arrange tab. Access moves down all the controls on the right side of the form to line up with the controls on the left side.

Figure 12–31: You now have more space between the controls after increasing the control padding.

Completing the Form

Your form is now looking very similar to the employees form you created in Design view at the beginning of the chapter. The last steps you need to take are to resize the columns to the different widths and move two fields. You need to move the WorkPhone controls above the Password controls and move the Photo controls between the HomePhone and BirthDate controls. Click the WorkPhone label or text box, and drag and drop them just below the OfficeLocation label and text box. Access moves the Password and IsAdmin controls down to allow space for the WorkPhone controls. Similarly, click the Photo label or text box, and drag and drop them just below the HomePhone label and text box. Access moves all the other controls on the right side of the form up to allow space for the Photo controls. All your controls are now positioned correctly and match the layout of the form you previously created in Design view.

In “Resizing Controls,” you learned you cannot have different widths and heights for controls contained within a control layout. To individually resize the text boxes, you must remove both control layouts. The control layouts served their purpose in helping you position and align the controls, but they have now reached the limits of their usefulness. To remove the control layout for the controls on the left side of the form, click one of the controls in that group, and then click the small box with crosshairs (just to the left of and slightly above the Employee Number label) to highlight all the controls. Next, click the Remove button in the Control Layout group on the Arrange tab. Remove the control layout for the controls on the right side of the form by following the same steps. You can now resize each label or text box independently.

The text boxes you want to be the longest-EmailName, OfficeLocation, Photo, Address, City, and Country-are already at the correct width, so you need to resize only the remaining text boxes. Let’s first resize the text box controls that should be the shortest. Click the EmployeeNumber text box, hold down the Shift key, and then click the DepartmentID and StateOrProvince text box controls. Next, click the sizing box in the middle of the right edge of the StateOrProvince text box, and drag the right edge to the left until the control is about 0.5 inch wide, as shown in Figure 12–32.

Figure 12–32: Resize the EmployeeNumber, DepartmentID, and StateOrProvince text boxes to a smaller width.

Now you need to resize the following fields to about 1 inch-FirstName, MiddleName, LastName, Password, PostalCode, HomePhone, WorkPhone, and BirthDate. Select them all by clicking each one while holding down the Shift key, and then drag the right edge of one of the text boxes to the left until the text boxes are about 1 inch wide.

If you switch to Form view, you can see the result of your work, as shown in Figure 12–33. You have now seen how to create the same basic employees form in both Design view and Layout view. Click the Save button on the Quick Access Toolbar to save this form. Name the form frmEmployeesLayoutView, and then close it. You can also find this form saved as frmXmplEmployeeLayout in the sample database.

Figure 12–33: You now have a good, basic employees form created entirely in Layout view.

Inside Out-When to Use Layout View 

Layout view for forms works best for positioning, aligning, and resizing controls. In Layout view, you can see live data in the controls, which makes resizing controls to fit their contents very easy. However, Layout view does have limitations. You cannot, for example, use most of the tools available in the Controls group that you see for a form in Design view. You also cannot see any of the form sections when you display a form in Layout view. This can make it difficult to position controls within specific sections. We’ve found that using both Design view and Layout view increases our productivity.