Inline Help Text

Inline help texts provide useful information about settings:

When to use

Follow the rules for context help.

How to use

Text length

Show no more than five lines of help text to not clutter the screen. Text width is limited to 70 characters.

Show more than five lines only when a text cannot be shortened for legal purposes.

Implementation

panel {
  row {
    checkBox("Send usage statistics when using EAP versions")
      .comment("""
        <p>Help JetBrains improve its products by sending anonymous
        data about features and plugins used, hardware and software
        configuration, statistics on types of files, number of files
        per project, etc.</p>
        <br/>
        <p>Please note that this will not include personal data or
        any sensitive information, such as source code, file names,
        etc. The data sent complies with the
        <a href=\"https://www.jetbrains.com\">
        JetBrains Privacy Policy</a></p>
        """.trimIndent()
      )
  }
}

Links

Provide a link to the corresponding help article or to a place in the IDE where the related settings can be found. Place the link at the end of the text where possible so that it does not disrupt reading.

Internal link

External link

Text style formatting

Avoid highlighting

Avoid text highlighting. Usually, the help text is short, and no highlighting in bold or italics is needed:

Correct

Incorrect

Avoid brackets

Avoid using brackets in control labels and place this information in the inline text instead:

Correct

Incorrect

Writing guidelines

Make help text short and descriptive.
Do not repeat the setting name in the help text:

Correct

Incorrect

Placement

Labeled inputs, checkboxes, radio buttons, and buttons

Place the help text to the right of labeled inputs (fields, combo boxes, or text areas), checkboxes, buttons, or radio buttons if all the following applies:

The space to the right is empty.
The help text has 1–5 words, not counting articles and prepositions.
The control label has 1–5 words.

Input fields with inline texts on the right

Implementation

panel {
  row("Plugin update policy:") {
      comboBox(listOf("Default", "Non default"))
      comment("Ignore by Maven 3+")
  }
  row("Thread count:") {
      textField()
      comment("-T option")
  }
}

Checkboxes with inline texts on the right

Implementation

panel {
  row {
    checkBox("Build project automatically")
    comment("Works while not running / debugging")
  }
  row {
    checkBox("Compile independent modules in parallel")
    comment("May require larger heap size")
  }
}

In other cases, place the help text under the UI controls:

Input filed with inline text on the bottom

Implementation

panel {
  row("Default directory:") {
    textFieldWithBrowseButton()
      .comment(
        "Preselected in Open and New | Project dialogs"
      )
  }
}

If there is no space under the UI control, use the help tooltip with the question mark icon for labeled inputs, checkboxes, and radio buttons. For buttons, use the help tooltip without the icon.

Trees, lists, and tables

Text applies to the whole component

If the help text applies to a whole list, tree, or table, place it below the control.

Implementation

import javax.swing.JTable

panel {
  row {
    cell(createTable()) // Actual table creation
      .align(Align.FILL)
      .comment("""
        &lt;Project> is content roots of all modules,
        all immediate descendants<br/>of the projects base
        directory, and .idea directory contents
        """.trimIndent()
      )
  }.resizableRow()
}

Text applies to a single item

If the help text applies to a single list, tree, or table item, its location will depend on its length.

Short texts

Place short texts (1–10 words) to the right of the item:

Long texts

Place longer texts (more than 10 words) into the detail part of master-detail layouts:

Inline text on the bottom of the master detail layout

For other cases, use the help tooltip with the question mark icon:

Group of controls

If the help text applies to several UI controls, place it at the bottom of the group.

Implementation

Use Panel.group() as the border for panels that need title and possibly the gray line on the right of the title:

panel {
  group("Build and Run") {
    row("Build and run with:") {
      comboBox(listOf("IntelliJ IDEA", "Gradle"))
    }
    row("Run tests with:") {
      comboBox(listOf("IntelliJ IDEA", "Gradle"))
    }
    row {
      comment("""
        <p>By default IntelliJ IDEA uses Gradle to build the project
        and run the tasks.</p>
        <p>In a pure Java/Kotlin project, building and running
        by means of IDE might be faster, thanks to optimizations.
        Note, that the IDE doesn't support all Gradle plugins and
        the project might not be built correctly with some of them.</p>
        """.trimIndent()
      )
    }
  }
  group("Gradle") {
    row("Use Gradle from:") {
      comboBox(gradleModel)
    }
  }
}

You can find more examples by invoking the Tools | Internal Actions | UI | Kotlin UI DSL | UI DSL Showcase action (available in internal mode and clicking the View source links on specific pages.

05 February 2025