import QtQuick 2.14 import QtQuick.Controls 2.14 import StatusQ.Core 0.1 import StatusQ.Core.Theme 0.1 import StatusQ.Controls 0.1 Column { id: root spacing: 8 Component.onCompleted: { focusedTextArea.forceActiveFocus() } StatusTextArea { id: focusedTextArea width: parent.width placeholderText: "Initially focused text area" KeyNavigation.tab: unfocusedTextArea } StatusTextArea { id: unfocusedTextArea width: parent.width placeholderText: "Unfocused text area (hover me to see the color change)" KeyNavigation.tab: invalidTextArea } StatusTextArea { id: invalidTextArea width: parent.width valid: false placeholderText: "Invalid text area, should display red border" KeyNavigation.tab: longTextArea } StatusScrollView { id: scrollView padding: 0 // use our own (StatusTextArea) padding width: parent.width contentWidth: availableWidth height: 120 StatusTextArea { id: longTextArea width: scrollView.availableWidth text: "Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Integer imperdiet lectus quis justo. Sed vel lectus. \ Donec odio tempus molestie, porttitor ut, iaculis quis, sem. Morbi scelerisque luctus velit. Nunc auctor. Nullam at \ arcu a est sollicitudin euismod. Cras elementum. Class aptent taciti sociosqu ad litora torquent per conubia nostra, \ per inceptos hymenaeos. Fusce aliquam vestibulum ipsum. Etiam sapien elit, consequat eget, tristique non, venenatis quis, ante. \ Nullam sit amet magna in magna gravida vehicula. Cras pede libero, dapibus nec, pretium sit amet, tempor quis. Nullam faucibus \ mi quis velit. Nam sed tellus id magna elementum tincidunt. Duis bibendum, lectus ut viverra rhoncus, dolor nunc faucibus libero, \ eget facilisis enim ipsum id lacus. Maecenas aliquet accumsan leo. Aliquam erat volutpat." KeyNavigation.tab: focusedTextArea } } StatusTextArea { enabled: false placeholderText: "Disabled text area" } }