Custom TextBox

We’ll start with the name data item of our client. Back when we worked with another QString property in our UI with the welcomemessage, we displayed it with the basic text component. This component is read only, so to view and edit our property, we will need to reach for something else. There are a couple of options in the base QtQuick module: TextInput and TextEdit. TextInput is for a single line of editable plain text, while TextEdit handles multiline blocks of text and also supports rich text. TextInput is ideal for our name.

Note

Importing the QtQuick.Controls module makes additional text-based components like Label, TextField, and TextArea available. Label inherits and extends Text, TextField inherits and extends TextInput and TextArea inherits and extends TextEdit. The basic controls are enough for us at this stage, but be aware that these alternatives exist. If you find yourself trying to do something with one of the basic controls which it doesn’t seem to support, then...