From a5da5086171e35a2def5e6d55265a610c7c0d661 Mon Sep 17 00:00:00 2001 From: Alexandra Betouni <31625338+alexandraB99@users.noreply.github.com> Date: Thu, 7 Apr 2022 23:50:36 +0300 Subject: [PATCH] feat(StatusBaseInput): Adding component documentation (#631) Part of #616 --- .../doc/src/images/status_base_input.png | Bin 0 -> 10861 bytes .../sandbox/demoapp/StatusAppChatView.qml | 2 +- .../src/StatusQ/Controls/StatusBaseInput.qml | 192 +++++++++++++++++- 3 files changed, 189 insertions(+), 5 deletions(-) create mode 100644 ui/StatusQ/doc/src/images/status_base_input.png diff --git a/ui/StatusQ/doc/src/images/status_base_input.png b/ui/StatusQ/doc/src/images/status_base_input.png new file mode 100644 index 0000000000000000000000000000000000000000..08e5bc1441a5457a6445021a260a11e345a0081c GIT binary patch literal 10861 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 O0LV%yNmhv)zx{tvR#W`| literal 0 HcmV?d00001 diff --git a/ui/StatusQ/sandbox/demoapp/StatusAppChatView.qml b/ui/StatusQ/sandbox/demoapp/StatusAppChatView.qml index a59a2c46d7..dae571b01b 100644 --- a/ui/StatusQ/sandbox/demoapp/StatusAppChatView.qml +++ b/ui/StatusQ/sandbox/demoapp/StatusAppChatView.qml @@ -41,7 +41,7 @@ StatusAppThreePanelLayout { Layout.leftMargin: 17 implicitHeight: 36 topPadding: 8 - bottomPadding: 0 + bottomPadding: 8 placeholderText: "Search" icon.name: "search" } diff --git a/ui/StatusQ/src/StatusQ/Controls/StatusBaseInput.qml b/ui/StatusQ/src/StatusQ/Controls/StatusBaseInput.qml index 632019d25f..b8d170ef31 100644 --- a/ui/StatusQ/src/StatusQ/Controls/StatusBaseInput.qml +++ b/ui/StatusQ/src/StatusQ/Controls/StatusBaseInput.qml @@ -8,53 +8,217 @@ import StatusQ.Controls 0.1 import StatusQ.Core 0.1 import StatusQ.Core.Theme 0.1 +/*! + \qmltype StatusBaseInput + \inherits Item + \inqmlmodule StatusQ.Controls + \since StatusQ.Controls 0.1 + \brief Displays a customized TextInput component. + Inherits \l{https://doc.qt.io/qt-5/qml-qtquick-item.html}{Item}. + + The \c StatusBaseInput displays an enhanced TextInput for users to type text. + For example: + + \qml + StatusBaseInput { + implicitWidth: parent.width + implicitHeight: 36 + topPadding: 8 + bottomPadding: 8 + clearable: true + placeholderText: "Search" + icon.name: "search" + } + \endqml + + \image status_base_input.png + + For a list of components available see StatusQ. +*/ + Item { id: root + /*! + \qmlproperty bool StatusBaseInput::multiline + This property indicates whether the StatusBaseInput allows multiline text. Default value is false. + */ property bool multiline: false - + /*! + \qmlproperty bool StatusBaseInput::clearable + This property indicates whether the StatusBaseInput allows clearing all text. Default value is false. + */ property bool clearable: false - + /*! + \qmlproperty alias StatusBaseInput::inputMethodHints + This property holds a reference to the TextEdit component's inputMethodHints property. + */ property alias inputMethodHints: edit.inputMethodHints - + /*! + \qmlproperty alias StatusBaseInput::selectedText + This property holds a reference to the TextEdit component's selectedText property. + */ property alias selectedText: edit.selectedText + /*! + \qmlproperty alias StatusBaseInput::selectedTextColor + This property holds a reference to the TextEdit component's selectedTextColor property. + */ property alias selectedTextColor: edit.selectedTextColor + /*! + \qmlproperty alias StatusBaseInput::selectionStart + This property holds a reference to the TextEdit component's selectionStart property. + */ property alias selectionStart: edit.selectionStart + /*! + \qmlproperty alias StatusBaseInput::selectionEnd + This property holds a reference to the TextEdit component's selectionEnd property. + */ property alias selectionEnd: edit.selectionEnd + /*! + \qmlproperty alias StatusBaseInput::cursorPosition + This property holds a reference to the TextEdit component's cursorPosition property. + */ property alias cursorPosition: edit.cursorPosition + /*! + \qmlproperty alias StatusBaseInput::edit + This property holds a reference to the TextEdit component. + */ property alias edit: edit + /*! + \qmlproperty alias StatusBaseInput::text + This property holds a reference to the TextEdit component's text property. + */ property alias text: edit.text + /*! + \qmlproperty alias StatusBaseInput::background + This property holds a reference to the background component. + */ property alias background: background + /*! + \qmlproperty alias StatusBaseInput::color + This property holds a reference to the TextEdit component's color property. + */ property alias color: edit.color + /*! + \qmlproperty alias StatusBaseInput::font + This property holds a reference to the TextEdit component's font property. + */ property alias font: edit.font + /*! + \qmlproperty alias StatusBaseInput::focussed + This property holds a reference to the TextEdit component's activeFocus property. + */ property alias focussed: edit.activeFocus + /*! + \qmlproperty alias StatusBaseInput::verticalAlignmet + This property holds a reference to the TextEdit component's verticalAlignmet property. + */ property alias verticalAlignmet: edit.verticalAlignment + /*! + \qmlproperty alias StatusBaseInput::horizontalAlignment + This property holds a reference to the TextEdit component's horizontalAlignment property. + */ property alias horizontalAlignment: edit.horizontalAlignment - + /*! + \qmlproperty alias StatusBaseInput::placeholderText + This property holds a reference to the placeholder component's placeholderText property. + */ property alias placeholderText: placeholder.text + /*! + \qmlproperty alias StatusBaseInput::placeholderTextColor + This property holds a reference to the placeholder component's placeholderTextColor property. + */ property alias placeholderTextColor: placeholder.color + /*! + \qmlproperty alias StatusBaseInput::placeholderFont + This property holds a reference to the placeholder component's font property. + */ property alias placeholderFont: placeholder.font + /*! + \qmlproperty real StatusBaseInput::leftPadding + This property sets the leftComponentLoader's left padding. + */ property real leftPadding: leftComponentLoader.item ? 8 : 16 + /*! + \qmlproperty real StatusBaseInput::rightPadding + This property sets the right padding. + */ property real rightPadding: 16 + /*! + \qmlproperty real StatusBaseInput::topPadding + This property sets the top padding. + */ property real topPadding: 12 + /*! + \qmlproperty alias StatusBaseInput::bottomPadding + This property sets the bottom padding. + */ property real bottomPadding: 12 + /*! + \qmlproperty var StatusBaseInput::tabNavItem + This property sets the tab key navigation item. + */ property var tabNavItem: null + /*! + \qmlproperty real StatusBaseInput::minimumHeight + This property sets the minimum height. + */ property real minimumHeight: 0 + /*! + \qmlproperty alias StatusBaseInput::maximumHeight + This property sets the maximum height. + */ property real maximumHeight: 0 + /*! + \qmlproperty int StatusBaseInput::maximumLength + This property sets the text's maximum length. + */ property int maximumLength: 0 + /*! + \qmlproperty bool StatusBaseInput::valid + This property sets the valid state. Default value is true. + */ property bool valid: true + /*! + \qmlproperty bool StatusBaseInput::pristine + This property sets the pristine. Default value is true. + */ property bool pristine: true + /*! + \qmlproperty bool StatusBaseInput::dirty + This property sets the dirty property. Default value is false. + */ property bool dirty: false + /*! + \qmlproperty bool StatusBaseInput::pending + This property holds the maximum height of the component. Default value is false. + */ property bool pending: false + /*! + \qmlproperty bool StatusBaseInput::leftIcon + This property sets the visibility of the left icon. Default value is true. + */ property bool leftIcon: true + /*! + \qmlproperty bool StatusBaseInput::isIconSelectable + This property indicates whether icon is selectable. Default value is false. + */ property bool isIconSelectable: false + /*! + \qmlproperty bool StatusBaseInput::showBackground + This property sets the visibility of the background. Default value is true. + */ property bool showBackground: true + /*! + \qmlproperty StatusIconSettings StatusBaseInput::icon + This property holds a set of settings for the icon of the StatusBaseInput. + */ property StatusIconSettings icon: StatusIconSettings { width: 24 height: 24 @@ -69,11 +233,31 @@ Item { } } + /*! + \qmlproperty Component StatusBaseInput::leftComponent + This property sets the left component to be displayed inside the input. + */ property Component leftComponent + /*! + \qmlproperty Component StatusBaseInput::selectedText + This property sets the right component to be displayed inside the input. + */ property Component rightComponent + /*! + \qmlsignal + This signal is emitted when the icon is clicked. + */ signal iconClicked + /*! + \qmlsignal + This signal is emitted when a hard key is pressed passing as parameter the keyboard event. + */ signal keyPressed(var event) + /*! + \qmlsignal + This signal is emitted when the text edit is clicked. + */ signal editClicked() implicitWidth: 448