Text is one of the most frequently used components in JDance. It displays textual content and allows you to control its appearance directly from Java.

You can configure typography, colors, spacing, and other visual properties without writing HTML or CSS yourself.

Text can be used independently or placed inside layouts, panels, forms, and other components.

Overview

Creating text is straightforward. Pass the content to the Text constructor and configure the component as needed.

The following example demonstrates a simple text component with a background color and padding.

CODE

Text text = new Text("Hello, JDance!");
text.setBackground(new Color("#DCEEFF"));
text.setPadding(10);

RESULT

Hello, JDance!

Text works like other JDance components. It can be added to a layout, styled individually, and combined with other components to create an interface.

For example, you can add several Text components to a VerticalLayout to create a group of labels or descriptions.

CODE

VerticalLayout layout = new VerticalLayout();

layout.add(new Text("Name"));
layout.add(new Text("Description"));
layout.add(new Text("Additional information"));

Typography

Text supports font configuration through the Font class.

You can change properties such as the font size, weight, and color. This makes it possible to use the same component for headings, descriptions, labels, and other textual elements.

The following example demonstrates different typography settings.

CODE

VerticalLayout layout = new VerticalLayout();
layout.setGap(8);

Text heading = new Text("Heading");
heading.setFont(new Font().setSize(22).setBold(true).setColor(new Color("#263238")));
layout.add(heading);

Text description = new Text("Supporting text");
description.setFont(new Font().setSize(14).setColor(new Color("#607D8B")));
layout.add(description);

Text highlight = new Text("Important");
highlight.setFont(new Font().setSize(16).setBold(true).setColor(new Color("#0783C5")));
layout.add(highlight);

RESULT

Heading

Supporting text

Important

The Font object groups typography settings together, keeping the configuration separate from the text content.

This is particularly useful when the same typography needs to be reused across multiple components.

Text shadows

Text can also use CSS text-shadow effects to create emphasis or visual depth.

A text shadow is different from a component shadow. It follows the shape of the characters rather than the rectangular boundaries of the component.

The example below demonstrates two different shadow styles.

CODE

VerticalLayout layout = new VerticalLayout();
layout.setGap(12);

Text soft = new Text("Soft shadow");
soft.setFont(new Font().setSize(20).setBold(true).setColor(new Color("#263238")));
soft.addExplicitStyle("text-shadow","2px 2px 4px #AAB7C4");
layout.add(soft);

Text glow = new Text("Blue glow");
glow.setFont(new Font().setSize(20).setBold(true).setColor(new Color("#0783C5")));
glow.addExplicitStyle("text-shadow","0 0 6px #78C7FF");
layout.add(glow);

RESULT

Soft shadow

Blue glow

In these examples, addExplicitStyle() applies the CSS text-shadow property directly to the Text component.

The first effect adds a subtle offset shadow, while the second produces a soft glow around the characters.

Text shadows can be useful for headings and decorative text, but they should be used sparingly in interfaces where readability is important.

Styling text within layouts

Text components can be combined with cell styling to create reusable interface patterns.

For example, rather than giving the Text component a background color, you can apply the background and padding to the containing layout cell.

CODE

VerticalLayout layout = new VerticalLayout();

layout.add(new Text("Information"))
        .setPadding(12)
        .setBgColor(new Color("#E4F5E9"));

layout.add(new Text("Warning"))
        .setPadding(12)
        .setBgColor(new Color("#FFF0D8"));

This separates the appearance of the text from the appearance of its surrounding cell.

It is especially useful when building cards, notifications, forms, and other structured interface elements.

Full API reference

Text provides additional configuration options beyond the examples demonstrated here.

For the complete reference covering Text, Font, and inherited component functionality, visit https://doc.jdance.org.