Label

The Label widget can display a single line of text and/or an image and align them using multiple options. If you need to create a component that displays a string, an image, or both, you should use or extend Label. If the component is interactive and has a specific state, a Button is the most suitable widget (instead of a label). For multiple line texts, you can use TextArea.

To create a text label:

Label textLabel = new Label("I am a Label"); // for a text label

To create an image for an icon label:

Image icon = Image.createImage("/images/duke.png");
Label imageLabel = new Label(icon);

Labels can be aligned to one of the following three directions: CENTER, LEFT, RIGHT. LEFT is the default. You can change the alignment by calling setAlignment method of the Style object associated to the Label:

Label label = new Label(“I’m aligned to the right”);
label.getStyle().setAlignment(Label.RIGHT);

You can set the vertical alignment by calling the setVerticalAlignment method of the Label class. The accepted values are TOP, BOTTOM or MIDDLE.

setVerticalAlignment(int alignment);

In addition, the text can be aligned relative to the image position. Valid values are TOP, BOTTOM, LEFT, RIGHT, where the default is RIGHT. To update the text position relative to the image, use:

setTextPosition(int alignment);

Figure 1 displays three types of labels with text to icon alignment position of RIGHT. The container is divided into three rows, and the label in each row is as wide as possible.

Figure 2 shows relative alignment, with the label below the icon.