Concepts / Setting Component Backgrounds

Setting Component Backgrounds

BorderFactory.createEmptyBorder(top, left, bottom, right) creates an empty border that reserves space around the edges of a component.

  • Programming

Why Components Crowd the Edges

When you lay out a Swing interface, components often end up crowded against the edges of their containers. A panel full of buttons can have its buttons touching the panel's boundary, and a text label can sit flush against the edge of its own area. Swing provides static methods in the BorderFactory class to create borders, and one of the most practical of these is createEmptyBorder, which adds an invisible margin of space around a component.

What do you think happens?

A JPanel has a red background. You give it an empty border with the top parameter set to 12 and the other three set to 0. Which part of the panel's background shows the new space?

  • Only the top edge of the panel

  • All four edges equally

  • No part of the panel, because the border is invisible and takes no room

Reveal answer
Answer:

Only the top edge of the panel

The empty border reserves room only along the edge whose parameter is nonzero. Nothing is painted in that room, so the panel's red background fills it. The border is invisible as a line, but it still takes up space.

What the Empty Border Actually Creates

Definition

BorderFactory.createEmptyBorder(top, left, bottom, right) creates an empty border that reserves space around the edges of a component.

The word empty is literal. The border does not paint a line, a bevel, or a pattern. It only reserves room. Because nothing is drawn in that reserved room, whatever background color the component has will fill the space. This is the key idea to hold onto: the border adds space, and the component's own background shows through that space.

Component boundstotal size, margin includedEmpty border spacereserved, nothing paintedContent areausable area for text orchildrenBackground colorfills the reserved spacecontainssurroundsshows through
Which region sits inside which? The outer bounds contain the empty border space, and the empty border space surrounds the content area, where the component's own content sits.

Read the diagram from the outside in. The component's full bounds include the reserved margin. Inside that margin is the empty border space, which paints nothing. The background color is the only thing that appears there. The content area is the smaller region left after the margin is removed, and it is where the component's own material, such as text or nested components, is placed.

Reading the Four Integer Parameters

The method takes four parameters, and they are always given in the same order: top, left, bottom, right. Each parameter is an integer that gives the width of the border along that edge of the component. Because the order is fixed, the first number always controls the top edge, the second the left edge, the third the bottom edge, and the fourth the right edge.

java
Notes on the code
  • 12 is the top edge width
  • 20 is the left edge width
  • 12 is the bottom edge width
  • 20 is the right edge width
topfirst parameterleftsecond parameterbottomthird parameterrightfourth parameter
Which of the four numbers moves the reserved space to which side of the component? Each position in the call always controls the same edge, so the order is what determines the result.

Each integer is a width, so a larger number reserves more room on that edge. A value of zero on an edge reserves nothing along that side. Because the parameters are positional, swapping two numbers changes the layout even though the call still looks plausible.

Tracing a Panel Before and After the Border

Worked example

Adding space around a JPanel that holds buttons

A JPanel has a blue background and holds several buttons. The buttons sit right at the panel's edge. Trace what happens to the panel's usable area and background when an empty border is set on it.

  1. 1
    Start with the panel as it is

    Without a border, the components inside the panel can sit right at the panel's edge. The panel's full bounds and its content area are the same region.

  2. 2
    Attach the empty border

    Create the border with BorderFactory.createEmptyBorder and give it the margin you want on each edge. Attach it to the panel so the panel reserves that room.

  3. 3
    Check the reserved room

    The reserved room is empty. Nothing is drawn in it, so the panel's blue background fills the margin on each reserved edge.

  4. 4
    Check the usable area

    The usable area moves inward. The buttons are now placed inside the content area, which is smaller than the full panel, so they no longer touch the boundary.

Result

The panel keeps its full size and blue background, but its usable area shrinks inward. The buttons gain space from the panel's edges, and the blue background is visible in the reserved margin.

The same reasoning applies to any container. Whatever the container's background is, it shows through the reserved margin, and whatever it holds is laid out within the smaller content area.

Separating Text From a JLabel Edge

The source gives a second common use: a JLabel. Without an empty border, a label does not have any space between its text and the edge of the label. Adding an empty border creates that space, so the text no longer touches the boundary of the label's area.

Textflush against the edgeTextinset from the edge
How does the text position shift inside the label when an empty border is added? Before the border, the text sits flush against the label edge. After the border, it is inset by the reserved margin.

The text itself does not change. What changes is the content area it is placed in. The empty border reserves room on the edges, so the label's text is laid out within the smaller region and stays clear of the boundary.

Mistakes With Border Parameters

Most errors with createEmptyBorder come from misreading the fixed parameter order or from assuming the border is visible. The items below show the mistakes that most often lead learners to unexpected layouts.

  • Common mistake

    Assuming the border is drawn as a visible line

    What it looks like

    Expecting a dark outline to appear around a panel after calling createEmptyBorder.

    Why it fails

    The word empty is literal. The border paints nothing and only reserves room.

    Do this instead

    Expect the component's own background color to fill the reserved space.

  • Common mistake

    Swapping the top and left values

    What it looks like

    Writing createEmptyBorder(20, 12, 20, 12) when you meant 12 on top and 20 on the sides.

    Why it fails

    The parameters are always in the order top, left, bottom, right, so the first number controls the top edge.

    Do this instead

    Read each position from the method signature and place the value for each edge in its fixed slot.

  • Common mistake

    Expecting the content to move outside the component

    What it looks like

    Thinking the reserved margin pushes the panel's other components outward past the panel's edges.

    Why it fails

    The border reserves room inside the component's bounds. The content area becomes smaller, not larger.

    Do this instead

    Think of the content area as shrinking inward while the full component size stays the same.

  • Common mistake

    Forgetting that a zero value reserves nothing on that edge

Predicting the Margin

EASY

A JLabel with a yellow background has text that touches its left edge. You want to move the text away from the left edge only, leaving the top, bottom, and right edges unchanged. Which parameter position should carry a nonzero value, and which edge of the label will show the yellow background in the new space?

Hints
  • Parameters are always in the order top, left, bottom, right.
  • Only one edge needs a nonzero width for this change.
  • The background shows through any reserved space.

Key Takeaways

  1. 1
    BorderFactory.createEmptyBorder reserves space around a component's edges without drawing anything in that space.
  2. 2
    The four integers always map in the fixed order top, left, bottom, right, and each one sets the width of the border on that edge.
  3. 3
    The component's background color fills the reserved space, so the border adds margin that visibly shows the background.
  4. 4
    The usable content area shrinks inward, which is how spacing is added between components and a JPanel edge or between text and a JLabel edge.

At a glance

  • BorderFactory.createEmptyBorder(top, left, bottom, right) reserves space around the edges of a component.
  • The four integer parameters are always in the order top, left, bottom, right, and each gives the border width on that edge.
  • The border paints nothing, so the component's background color shows through the reserved space.
  • The border is used to space components away from a JPanel edge and to separate text from a JLabel edge.