Home > Designing and creating solutions > Editing objects, layout parts, and the layout background > Formatting objects, layout parts, and the layout background > Formatting button bars

Formatting button bars

You can format the appearance of button bars and their components, including the border, label, and fill options. The choices you make for color, line style, and fill affect all buttons.

Note  Your formatting changes are saved on the current layout only. To save changes as a style that can be applied to other button bars, see Creating and working with styles for layout objects, parts, and the layout background. Or, to save changes to a theme, see Saving a layout theme.

To format a button bar:

1.	In Layout mode, choose the layout from the Layout pop-up menu, then select the button bar.

Tip  To select the button bar, click the outside edge until the handles appear on all sides.

2.	Click Inspector in the layout bar, then click Appearance.

3.	Choose Button Bar, Button Bar: Dividers, Button Bar: Segment, or Button Bar: Icon from the object type list (near the top of the Appearance tab).

Note  Not all options are available for all components.

 

To	Do this
Change the line style and color of the button bar’s border	Choose Button Bar from the object type list, then choose the line style and color in the Graphic area. See Setting the fill, line style, and borders for objects, layout parts, and the layout background.
Change the appearance and size of the button bar’s dividers	Choose Button Bar: Dividers from the object type list. In the Graphic area, select a line type, size, and color. See Setting the fill, line style, and borders for objects, layout parts, and the layout background.
Change the format of the label text (for all segments)	Choose Button Bar: Segment from the object type list. Then, do one of the following:  • Choose options in the Text area of the Inspector.  • Use the text options in the formatting bar. If you don’t see the formatting bar, click Formatting in the layout bar. See Formatting text.
Set the horizontal and vertical alignment of the label text and icon (for all segments)	Choose Button Bar: Segment from the object type list. In the Paragraph area, set the horizontal and vertical alignment. Spacing between the label and the icon is preserved; the label’s font size determines the spacing. Labels that have multiple lines of text use the entire width of the button. Use the Paragraph area to set the line spacing.
Add an outer shadow to the button bar	Choose Button Bar from the object type list. In the Advanced Graphic area, select Outer Shadow. Then click to change effects for the shadow. See Adding shadows and padding to layout objects.
Add an inner shadow to the button bar’s segments	Choose Button Bar: Segment from the object type list. In the Advanced Graphic area, select Inner Shadow. Then click to change effects for the shadow. See Adding shadows and padding to layout objects.
Add padding between label text or icon and the edge of the segment	Choose Button Bar: Segment from the object type list. In the Advanced Graphic area, for Padding, specify values (in points) for Left, Right, Top, and Bottom. See Adding shadows and padding to layout objects.
Add padding between button bar dividers	Choose Button Bar: Dividers from the object type list. In the Advanced Graphic area, specify values for Top, and Bottom for a horizontal button bar, or specify values for Left and Right for a vertical button bar.
Change the color of the button bar’s segments	Choose Button Bar: Segment from the object type list, then choose a display state. In the Graphic area, select the color and line type. See Specifying the display state for an object.
Change the color of the label icon	Choose Button Bar: Icon from the object type list, then select a display state (from the second list in the Appearance tab). In the Graphic area, choose a color. You can change the fill color of the provided icons. However, for custom icons in .svg format, changing the fill color in FileMaker Pro affects only the elements that have no fill color already defined in the .svg file. For more information on SVG support, see FileMaker Pro SVG Grammar for Button Icons. You can't change the fill color of custom icons in .png format. See Specifying the display state for an object.
Adjust the padding between between the icon and label text	Choose Button Bar: Icon from the object type list, then specify the appropriate value (in points) for the Padding. You can only change one value in Padding because it is determined by the position of the icon and label. For example, if the label text is to the right of the icon, only Right padding is available.

Note  You can’t format a locked object. See Protecting objects from change.