Ubuntu.Components.TextArea

The TextArea item displays a block of editable, scrollable, formatted text. More...

• Obsolete members

Properties

• autoSize : bool
• baseUrl : url
• canPaste : bool
• canRedo : bool
• canUndo : bool
• color : color
• contentHeight : real
• contentWidth : real
• cursorDelegate : Component
• cursorPosition : int
• cursorRectangle : rectangle
• cursorVisible : bool
• displayText : string
• effectiveHorizontalAlignment : enumeration
• font : font
• highlighted : bool
• horizontalAlignment : enumeration
• inputMethodComposing : bool
• inputMethodHints : enumeration
• length : int
• lineCount : int
• maximumLineCount : int
• mouseSelectionMode : enumeration
• paintedHeight : real
• paintedWidth : real
• persistentSelection : enumeration
• placeholderText : string
• popover : var
• readOnly : bool
• renderType : enumeration
• selectByMouse : bool
• selectedText : string
• selectedTextColor : color
• selectionColor : color
• selectionEnd : int
• selectionStart : int
• text : string
• textDocument : var
• textFormat : enumeration
• verticalAlignment : enumeration
• wrapMode : enumeration

Signals

• linkActivated(string link)

Methods

• copy()
• cut()
• deselect()
• getFormattedText(start, end)
• getText(start, end)
• insert(position, text)
• isRightToLeft(start, end)
• moveCursorSelection(position, mode)
• paste(data)
• positionAt(x, y)
• positionToRectangle(position)
• redo()
• remove(start, end)
• select(start, end)
• selectAll()
• selectWord()
• undo()

Detailed Description

The TextArea supports fix-size and auto-expanding modes. In fix-size mode the content is scrolled when exceeds the boundaries and can be scrolled both horizontally and vertically, depending on the contentWidth and contentHeight set. The following example will scroll the editing area both horizontally and vertically:

TextArea {
width: units.gu(20)
height: units.gu(12)
contentWidth: units.gu(30)
contentHeight: units.gu(60)
}

The auto-expand mode is realized using two properties: autoSize and maximumLineCount. Setting autoSize will set implicitHeight to one line, and the height will follow the line count, meaning when lines are added the area will expand and when removed the area will shrink. The maximumLineCount specifies how much the editor should be expanded. If this value is set to 0, the area will always expand vertically to fit the content. When autoSize is set, the contentHeight property value is ignored, and the expansion only happens vertically.

TextArea {
width: units.gu(20)
height: units.gu(12)
contentWidth: units.gu(30)
autoSize: true
maximumLineCount: 0
}

TextArea comes with 30 grid-units implicit width and one line height on auto-sizing mode and 4 lines on fixed-mode. The line size is calculated from the font size and the ovarlay and frame spacing specified in the style.

Scrolling and text selection

The input is activated when the tap or mouse is released after being pressed over the component.

Scrolling the editing area can happen when the size is fixed or in auto-sizing mode when the content size is bigger than the visible area. The scrolling is realized by swipe gestures, or by navigating the cursor.

The content can be selected in the following ways:

• - double tapping/left mouse clicking over the content, when the word that had been tapped over will be selected
• - by pressing and dragging the selection cursor over the text input. Note that there has to be a delay of approx. 200 ms between the press and drag gesture, time when the input switches from scroll mode to selection mode

The input is focused (activated) upon tap/left mouse button release. The cursor will be placed at the position the mouse/tap point at release time. If the click is happening on a selected area, the selection will be cleared. Long press above a selected area brings up the clipboard context menu. When the long press happens over a non-selected area, the cursor will be moved to the position and the component enters in selection mode. The selection mode can also be activated by tapping and keeping the tap/mouse over for approx 300 ms. If there is a move during this time, the component enters into scrolling mode. The mode is exited once the scrolling finishes. During the scrolling mode the selected text is preserved.

Note: During text selection all interactive parent Flickables are turned off.

Property Documentation

This property specifies whether the text area sizes following the line count or not. The default value is false.

This property specifies a base URL which is used to resolve relative URLs within the text. The default value is the url of the QML file instantiating the TextArea item.

Returns true if the TextArea is writable and the content of the clipboard is suitable for pasting into the TextArea.

Returns true if the TextArea is writable and there are undone operations that can be redone.

Returns true if the TextArea is writable and there are previous operations that can be undone.

The text color.

The property folds the height of the text editing content. This can be equal or bigger than the frame height minus the spacing between the frame and the input area defined in the current theme. The default value is the same as the visible input area's height.

The property folds the width of the text editing content. This can be equal or bigger than the frame width minus the spacing between the frame and the input area defined in the current theme. The default value is the same as the visible input area's width.

The delegate for the cursor in the TextArea.

If you set a cursorDelegate for a TextArea, this delegate will be used for drawing the cursor instead of the standard cursor. An instance of the delegate will be created and managed by the text edit when a cursor is needed, and the x and y properties of delegate instance will be set so as to be one pixel before the top left of the current character.

Note that the root item of the delegate component must be a http://doc.qt.io/qt-5/qquickitem.html">QQuickItem or http://doc.qt.io/qt-5/qquickitem.html">QQuickItem derived item.

The position of the cursor in the TextArea.

The rectangle where the standard text cursor is rendered within the text edit. Read-only.

The position and height of a custom cursorDelegate are updated to follow the cursorRectangle automatically when it changes. The width of the delegate is unaffected by changes in the cursor rectangle.

If true the text edit shows a cursor.

This property is set and unset when the text edit gets active focus, but it can also be set directly (useful, for example, if a KeyProxy might forward keys to it).

This property contains the text that is displayed on the screen. May differ from the text property value when TextEdit.RichText format is selected.

Presents the effective horizontal alignment that can be different from the one specified at horizontalAlignment due to layout mirroring.

The property holds the font used by the editing.

The property presents whether the TextArea is highlighted or not. By default the TextArea gets highlighted when gets the focus, so can accept text input. This property allows to control the highlight separately from the focused behavior.

Sets the horizontal alignment of the text within the TextAre item's width and height. By default, the text alignment follows the natural alignment of the text, for example text that is read from left to right will be aligned to the left.

Valid values for effectiveHorizontalAlignment are:

• TextEdit.AlignLeft (default)
• TextEdit.AlignRight
• TextEdit.AlignHCenter
• TextEdit.AlignJustify

This property holds whether the TextArea has partial text input from an input method.

While it is composing an input method may rely on mouse or key events from the TextArea to edit or commit the partial text. This property can be used to determine when to disable events handlers that may interfere with the correct operation of an input method.

Provides hints to the input method about the expected content of the text edit and how it should operate.

The value is a bit-wise combination of flags or Qt.ImhNone if no hints are set.

Flags that alter behaviour are:

• Qt.ImhHiddenText - Characters should be hidden, as is typically used when entering passwords.
• Qt.ImhSensitiveData - Typed text should not be stored by the active input method in any persistent storage like predictive user dictionary.
• Qt.ImhNoAutoUppercase - The input method should not try to automatically switch to upper case when a sentence ends.
• Qt.ImhPreferNumbers - Numbers are preferred (but not required).
• Qt.ImhPreferUppercase - Upper case letters are preferred (but not required).
• Qt.ImhPreferLowercase - Lower case letters are preferred (but not required).
• Qt.ImhNoPredictiveText - Do not use predictive text (i.e. dictionary lookup) while typing.
• Qt.ImhDate - The text editor functions as a date field.
• Qt.ImhTime - The text editor functions as a time field.

Flags that restrict input (exclusive flags) are:

• Qt.ImhDigitsOnly - Only digits are allowed.
• Qt.ImhFormattedNumbersOnly - Only number input is allowed. This includes decimal point and minus sign.
• Qt.ImhUppercaseOnly - Only upper case letter input is allowed.
• Qt.ImhLowercaseOnly - Only lower case letter input is allowed.
• Qt.ImhDialableCharactersOnly - Only characters suitable for phone dialing are allowed.
• Qt.ImhEmailCharactersOnly - Only characters suitable for email addresses are allowed.
• Qt.ImhUrlCharactersOnly - Only characters suitable for URLs are allowed.

Masks:

• Qt.ImhExclusiveInputMask - This mask yields nonzero if any of the exclusive flags are used.

Returns the total number of plain text characters in the TextArea item.

As this number doesn't include any formatting markup it may not be the same as the length of the string returned by the text property.

This property can be faster than querying the length the text property as it doesn't require any copying or conversion of the TextArea's internal string data.

Returns the total number of lines in the TextArea item.

The property holds the maximum amount of lines to expand when autoSize is enabled. The value of 0 does not put any upper limit and the control will expand forever.

The default value is 5 lines.

Specifies how text should be selected using a mouse.

• TextEdit.SelectCharacters - The selection is updated with individual characters. (Default)
• TextEdit.SelectWords - The selection is updated with whole words.

This property only applies when selectByMouse is true.

Exposes the paintedHeight of the underlying text component. It's required if the application uses its own Flickable for scrolling.

Exposes the paintedWidth of the underlying text component. It's required if the application uses its own Flickable for scrolling.

Whether the TextArea should keep the selection visible when it loses active focus to another item in the scene. By default this is set to true;

Text that appears when there is no focus and no content in the component (hint text).

The property overrides the default popover of the TextArea. When set, the TextArea will open the given popover instead of the default one defined. The popover can either be a component or a URL to be loaded.

Whether the user can interact with the TextArea item. If this property is set to true the text cannot be edited by user interaction.

By default this property is false.

Override the default rendering type for this component.

Supported render types are:

• Text.QtRendering - the default
• Text.NativeRendering

Select Text.NativeRendering if you prefer text to look native on the target platform and do not require advanced features such as transformation of the text. Using such features in combination with the NativeRendering render type will lend poor and sometimes pixelated results.

The property drives whether text selection should happen with the mouse or not. The default value is true.

This read-only property provides the text currently selected in the text edit.

The selected text color, used in selections.

The text highlight color, used behind selections.

The cursor position after the last character in the current selection.

This property is read-only. To change the selection, use select(start, end), selectAll(), or selectWord().

See also selectionStart, cursorPosition, and selectedText.

The cursor position before the first character in the current selection.

This property is read-only. To change the selection, use select(start, end), selectAll(), or selectWord().

See also selectionEnd, cursorPosition, and selectedText.

The text to display. If the text format is AutoText the text edit will automatically determine whether the text should be treated as rich text. This determination is made using Qt::mightBeRichText().

Exposes the http://doc.qt.io/qt-5/qquicktextdocument.html">QQuickTextDocument which can be used to implement advanced formatting and syntax highlighting (QSyntaxHighlighter) with C++.

The way the text property should be displayed.

• TextEdit.AutoText
• TextEdit.PlainText
• TextEdit.RichText

The default is TextEdit.PlainText. If the text format is TextEdit.AutoText the text edit will automatically determine whether the text should be treated as rich text. This determination is made using Qt::mightBeRichText().

Sets the vertical alignment of the text within the TextAres item's width and height. By default, the text alignment follows the natural alignment of the text.

Valid values for verticalAlignment are:

• TextEdit.AlignTop (default)
• TextEdit.AlignBottom
• TextEdit.AlignVCenter

Set this property to wrap the text to the TextEdit item's width. The text will only wrap if an explicit width has been set.

• TextEdit.NoWrap - no wrapping will be performed. If the text contains insufficient newlines, then implicitWidth will exceed a set width.
• TextEdit.WordWrap - wrapping is done on word boundaries only. If a word is too long, implicitWidth will exceed a set width.
• TextEdit.WrapAnywhere - wrapping is done at any point on a line, even if it occurs in the middle of a word.
• TextEdit.Wrap - if possible, wrapping occurs at a word boundary; otherwise it will occur at the appropriate point on the line, even in the middle of a word.

The default is TextEdit.Wrap

Signal Documentation

This handler is called when the user clicks on a link embedded in the text. The link must be in rich text or HTML format and the link string provides access to the particular link.

Method Documentation

Copies the currently selected text to the system clipboard.

Moves the currently selected text to the system clipboard.

Removes active text selection.

Returns the section of text that is between the start and end positions.

The returned text will be formatted according the textFormat property.

Returns the section of text that is between the start and end positions.

The returned text does not include any rich text formatting. A getText(0, length) will result in the same value as displayText.

Inserts text into the TextArea at position.

Returns true if the natural reading direction of the editor text found between positions start and end is right to left.

Moves the cursor to position and updates the selection according to the optional mode parameter. (To only move the cursor, set the cursorPosition property.)

When this method is called it additionally sets either the selectionStart or the selectionEnd (whichever was at the previous cursor position) to the specified position. This allows you to easily extend and contract the selected text range.

The selection mode specifies whether the selection is updated on a per character or a per word basis. If not specified the selection mode will default to whatever is given in the mouseSelectionMode property.

Places the clipboard or the data given as parameter into the text input. The selected text will be replaces with the data.

Returns the text position closest to pixel position (x, y).

Position 0 is before the first character, position 1 is after the first character but before the second, and so on until position text.length, which is after all characters.

Returns the rectangle at the given position in the text. The x, y, and height properties correspond to the cursor that would describe that position.

Redoes the last operation if redo is available.

Removes the section of text that is between the start and end positions from the TextArea.

Causes the text from start to end to be selected.

If either start or end is out of range, the selection is not changed.

After calling this, selectionStart will become the lesser and selectionEnd will become the greater (regardless of the order passed to this method).

See also selectionStart and selectionEnd.

Causes all text to be selected.

Causes the word closest to the current cursor position to be selected.

Undoes the last operation if undo is available. Deselects any current selection, and updates the selection start to the current cursor position.