Basics
Guides
API Reference
Basics
Guides
API Reference
[113:7] extends: StyleClassedTextArea
CodeArea wraps the RichTextFX CodeArea control, a fixed-width (monospace) text area designed for code editing. It extends StyleClassedTextArea with a monospace font loaded by default and sets useInitialStyleForInsertion to true so that newly typed characters start without any inherited style class. This is the correct behavior for a code editor where you apply syntax highlighting after the text is entered. CodeArea inherits all StyleClassedTextArea methods for text manipulation, selection, caret management, undo/redo, clipboard operations, scroll control, and event callbacks. It adds setSyntaxHighlighter, which registers a plain-text change listener that re-highlights the entire document on every edit.
| Style Class | Applied To | Description |
|---|---|---|
.styled-text-area |
The area root | Base style class applied to all RichTextFX areas. |
.code-area |
The area root | Additional class applied only to CodeArea; target this for monospace font overrides. |
.content |
Inner content region | Wraps the scrollable text content. |
.paragraph-box |
Each paragraph row | Container for one line or paragraph of text. |
.paragraph-text |
Text flow in a paragraph | Holds the individual text segments. |
.caret |
The text insertion caret | A thin blinking line indicating the insert position. |
.selection |
Selected text highlight | Drawn behind selected character ranges. |
.lineno |
Line number label | Rendered by LineNumberFactory when setLineNumbers(true) is called. |
The built-in code-area.css stylesheet shipped with RichTextFX sets a monospace font
and a dark background on the content area. Override these in your own stylesheet:
| Property | Values | Default | Description |
| --- | --- | --- | --- |
| -fx-font-family | <string> | "Monospaced" | Monospace font family used for all code text. Override in .code-area .text. |
| -fx-font-size | <number> | 13px | Font size for code text. Override in .code-area .text. |
| -fx-background-color | <paint> | #23241f | Background of the code area. |
| Property | Values | Default | Description |
|---|---|---|---|
-rtfx-blink-rate |
<duration> |
500ms |
Blink period of the caret. Set to 0ms to disable blinking. |
-fx-stroke |
<paint> |
white |
Color of the caret line in the default dark theme. |
-fx-stroke-width |
<number> |
1 |
Width of the caret line in pixels. |
| Property | Values | Default | Description |
|---|---|---|---|
-fx-background-color |
<paint> |
#282923 |
Background of the line number label. |
-fx-text-fill |
<paint> |
#aaaaaa |
Color of the line number text. |
-fx-font-size |
<number> |
inherits | Font size of the line number text. |
-fx-padding |
<size> |
0 5px 0 5px |
Padding inside each line number label. |
| Property | Values | Default | Description |
|---|---|---|---|
-fx-fill |
<paint> |
#6897bb |
Fill color of the selection highlight rectangle. |
| Property | Values | Default | Description |
|---|---|---|---|
-fx-background-color |
<paint> [, <paint>]* |
#23241f |
One or more paint values for background fill layers, rendered back to front. |
-fx-background-insets |
<size> or <t> <r> <b> <l> [, ...]* |
0 |
Insets from the region edges for each background fill layer. |
-fx-background-radius |
<size> [/ <size>]* [, ...]* |
0 |
Corner radii for each background fill layer. |
| Property | Values | Default | Description |
|---|---|---|---|
-fx-border-color |
<paint> or <t> <r> <b> <l> [, ...]* |
null |
Paint colors for the border stroke layers. |
-fx-border-insets |
<size> or <t> <r> <b> <l> [, ...]* |
null |
Insets from region edges for each border layer. |
-fx-border-radius |
<size> [, ...]* |
null |
Corner radii for border stroke layers. |
-fx-border-style |
<border-style> [, ...]* |
null |
Border line style (solid, dotted, dashed) plus line cap/join options per layer. |
-fx-border-width |
<size> or <t> <r> <b> <l> [, ...]* |
null |
Thickness of each border stroke layer, per side. |
| Property | Values | Default | Description |
|---|---|---|---|
-fx-padding |
<size> or <t> <r> <b> <l> |
0 |
Interior padding between the region border and its content. |
-fx-min-width |
<size> |
-1 |
Minimum width. -1 uses the computed minimum. |
-fx-pref-width |
<size> |
-1 |
Preferred width. -1 uses the computed preferred. |
-fx-max-width |
<size> |
-1 |
Maximum width. -1 uses the computed maximum. |
-fx-min-height |
<size> |
-1 |
Minimum height. -1 uses the computed minimum. |
-fx-pref-height |
<size> |
-1 |
Preferred height. -1 uses the computed preferred. |
-fx-max-height |
<size> |
-1 |
Maximum height. -1 uses the computed maximum. |
| Property | Values | Default | Description |
|---|---|---|---|
-fx-blend-mode |
add | blue | color-burn | color-dodge | darken | difference | exclusion | green | hard-light | lighten | multiply | overlay | red | screen | soft-light | src-atop | src-in | src-out | src-over |
null |
Blend mode used when compositing this node with nodes beneath it. |
-fx-effect |
<effect> |
null |
A visual effect (e.g. DropShadow, InnerShadow) applied to the rendered node. |
-fx-opacity |
<number> [0.0 - 1.0] |
1 |
Opacity of the node. 0 is fully transparent, 1 is fully opaque. |
-fx-rotate |
<number> |
0 |
Rotation angle in degrees applied around the node's center point. |
-fx-scale-x |
<number> |
1 |
Scale factor along the X axis about the node's center. |
-fx-scale-y |
<number> |
1 |
Scale factor along the Y axis about the node's center. |
-fx-translate-x |
<number> |
0 |
Translation offset along the X axis in pixels. |
-fx-translate-y |
<number> |
0 |
Translation offset along the Y axis in pixels. |
visibility |
visible | hidden | collapse | inherit |
visible |
Controls whether the node is rendered and participates in layout. |
-fx-managed |
true | false |
true |
When false, the parent layout does not manage this node's position or size. |
CodeArea (Text = null)
Creates a new CodeArea with optional initial text.
Text is a string with the initial text content, or null for an empty area.setSyntaxHighlighter (callback Highlighter)
Registers a callback that re-highlights the entire document on every plain text change. The callback receives the full updated plain text as a string. Inside the callback, call clearStyles() followed by setStyleClass() or setStyleClasses() to apply highlighting based on the new content. Example: editor.setSyntaxHighlighter(::highlight); public highlight(Text) { editor.clearStyles(); // apply style classes based on Text content }
Highlighter is a callback with signature (string Text).this object for chainingcallHighlighter (Change)
selectWord ()
Extends the selection to cover the word currently containing the caret. The word boundaries are determined by the WORD_PATTERN regular expression defined on the underlying CodeArea.
this object for chainingwordBreaksBackwards (int N, string PolicyName)
Moves the caret to the previous word boundary at or before the given character index, applying the named SelectionPolicy.
N is an int with the character index to break backwards from.PolicyName is the SelectionPolicy enum value name: "CLEAR", "ADJUST", or "EXTEND".this object for chainingwordBreaksForwards (int N, string PolicyName)
Moves the caret to the next word boundary at or after the given character index, applying the named SelectionPolicy.
N is an int with the character index to break forwards from.PolicyName is the SelectionPolicy enum value name: "CLEAR", "ADJUST", or "EXTEND".this object for chaining
Aussom
Write once. Embed everywhere.
Copyright 2026 Austin Lehman. All rights reserved.