organise inputs and form editors

MerginMaps · Jan 31, 2024 · 1e4e35a · 1e4e35a
1 parent 33cacbe
commit 1e4e35a
Show file tree

Hide file tree

Showing 29 changed files with 298 additions and 166 deletions.
diff --git a/app/qml/CMakeLists.txt b/app/qml/CMakeLists.txt
@@ -36,6 +36,7 @@ set(MM_QML
     components/MMRoundButton.qml
     components/MMButton.qml
     components/MMComponent_reachedDataLimit.qml
+    components/MMCheckBox.qml
     components/MMDrawer.qml
     components/MMHeader.qml
     components/MMHlineText.qml
@@ -54,7 +55,6 @@ set(MM_QML
     components/MMNotification.qml
     components/MMNotificationView.qml
     components/MMPhoto.qml
-    components/MMPhotoGallery.qml
     components/MMProgressBar.qml
     components/MMProjectItem.qml
     components/MMRadioButton.qml
@@ -100,18 +100,44 @@ set(MM_QML
     editor/inputvaluerelationcombobox.qml
     editor/inputvaluerelationpage.qml
     editor/inputspacer.qml
-    inputs/MMAbstractEditor.qml
-    inputs/MMCheckBox.qml
-    inputs/MMInputEditor.qml
-    inputs/MMPasswordEditor.qml
-    inputs/MMSliderEditor.qml
+
+    #
+    # Inputs
+    #
+
+    inputs/MMBaseInput.qml
+    inputs/MMPasswordInput.qml
+    inputs/MMTextInput.qml
+    inputs/MMSearchInput.qml
+
+    #
+    # Forms
+    #
+
     form/FeatureForm.qml
     form/FeatureFormPage.qml
     form/FeatureFormStyling.qml
     form/FeatureToolbar.qml
     form/FormWrapper.qml
     form/MMFormTabBar.qml
     form/PreviewPanel.qml
+    form/editors/MMButtonFormEditor.qml
+    form/editors/MMCalendarFormEditor.qml
+    form/editors/MMDropdownFormEditor.qml
+    form/editors/MMGalleryFormEditor.qml
+    form/editors/MMNumberFormEditor.qml
+    form/editors/MMPhotoFormEditor.qml
+    form/editors/MMScannerFormEditor.qml
+    form/editors/MMSliderFormEditor.qml
+    form/editors/MMSwitchFormEditor.qml
+    form/editors/MMTextMultilineFormEditor.qml
+    form/editors/MMTextFormEditor.qml
+    # we are missing the following form editors:
+    # - Spacer
+    # - Text / HTML widget
+    # - Relation reference
+    # - Relations
+
     layers/FeaturesListPageV2.qml
     layers/LayerDetail.qml
     layers/LayersListPageV2.qml

diff --git a/app/qml/inputs/MMCheckBox.qml → app/qml/components/MMCheckBox.qml b/app/qml/inputs/MMCheckBox.qml → app/qml/components/MMCheckBox.qml
diff --git a/app/qml/components/MMComboBoxDrawer.qml b/app/qml/components/MMComboBoxDrawer.qml
@@ -12,6 +12,8 @@ import QtQuick.Controls
 import QtQuick.Controls.Basic
 import "../inputs"
 
+
+// TODO: rename to MMDropdownDrawer
 Drawer {
   id: root
 
@@ -84,7 +86,7 @@ Drawer {
         }
       }
 
-      MMSearchEditor {
+      MMSearchInput {
         id: searchBar
 
         width: parent.width - 2 * root.padding

diff --git a/app/qml/components/MMDrawer.qml b/app/qml/components/MMDrawer.qml
@@ -89,7 +89,7 @@ Drawer {
 
           MouseArea {
             anchors.fill: parent
-            onClicked: control.visible = false
+            onClicked: control.close()
           }
         }
       }

diff --git a/app/qml/inputs/MMButtonInputEditor.qml → app/qml/form/editors/MMButtonFormEditor.qml b/app/qml/inputs/MMButtonInputEditor.qml → app/qml/form/editors/MMButtonFormEditor.qml
@@ -10,9 +10,10 @@
 import QtQuick
 import QtQuick.Controls
 import QtQuick.Controls.Basic
-import "../components"
+import "../../components"
+import "../../inputs"
 
-MMAbstractEditor {
+MMBaseInput {
   id: root
 
   property var parentValue: parent.value ?? ""

diff --git a/app/qml/inputs/MMCalendarEditor.qml → ...qml/form/editors/MMCalendarFormEditor.qml b/app/qml/inputs/MMCalendarEditor.qml → ...qml/form/editors/MMCalendarFormEditor.qml
@@ -10,9 +10,10 @@
 import QtQuick
 import QtQuick.Controls
 import QtQuick.Controls.Basic
-import "../components"
+import "../../components"
+import "../../inputs"
 
-MMAbstractEditor {
+MMBaseInput {
   id: root
 
   property var parentField: parent.field ?? ""

diff --git a/app/qml/inputs/MMComboBoxEditor.qml → ...qml/form/editors/MMDropdownFormEditor.qml b/app/qml/inputs/MMComboBoxEditor.qml → ...qml/form/editors/MMDropdownFormEditor.qml
@@ -10,9 +10,10 @@
 import QtQuick
 import QtQuick.Controls
 import QtQuick.Controls.Basic
-import "../components"
+import "../../components"
+import "../../inputs"
 
-MMAbstractEditor {
+MMBaseInput {
   id: root
 
   property alias placeholderText: textField.placeholderText

diff --git a/app/qml/components/MMPhotoGallery.qml → app/qml/form/editors/MMGalleryFormEditor.qml b/app/qml/components/MMPhotoGallery.qml → app/qml/form/editors/MMGalleryFormEditor.qml
@@ -10,6 +10,8 @@
 import QtQuick
 import QtQuick.Controls
 
+import "../../components"
+
 Item {
   id: root
 

diff --git a/app/qml/inputs/MMNumberEditor.qml → app/qml/form/editors/MMNumberFormEditor.qml b/app/qml/inputs/MMNumberEditor.qml → app/qml/form/editors/MMNumberFormEditor.qml
@@ -10,32 +10,52 @@
 import QtQuick
 import QtQuick.Controls
 import QtQuick.Controls.Basic
-import "../components"
 
-MMAbstractEditor {
+import "../../components"
+import "../../inputs"
+
+/*
+ * Number (range editable) editor for QGIS Attribute Form
+ * Requires various global properties set to function, see featureform Loader section.
+ * These properties are injected here via 'fieldXYZ' properties and captured with underscore `_`.
+ *
+ * Should be used only within feature form.
+ */
+
+MMBaseInput {
   id: root
 
-  property var parentValue: parent.value ?? 0
-  property bool parentValueIsNull: parent.valueIsNull ?? false
-  property bool isReadOnly: parent.readOnly ?? false
+  property var _fieldValue: parent.fieldValue
+  property var _fieldConfig: parent.fieldConfig
+  property bool _fieldValueIsNull: parent.fieldValueIsNull
+
+  property bool _fieldShouldShowTitle: parent.fieldShouldShowTitle
+  property bool _fieldIsReadOnly: parent.fieldIsReadOnly
+
+  property string _fieldTitle: parent.fieldTitle
+  property string _fieldErrorMessage: parent.fieldErrorMessage
+  property string _fieldWarningMessage: parent.fieldWarningMessage
 
-  property var locale: Qt.locale()
-  // TODO: uncomment in Input app
-  property real precision//: config['Precision'] ? config['Precision'] : 0
-  property string suffix//: config['Suffix'] ? config['Suffix'] : ''
-  property real from //: config["Min"]
-  property real to //: config["Max"]
+  property real to: _fieldConfig["Max"]
+  property real from: _fieldConfig["Min"]
+  property string suffix: _fieldConfig['Suffix'] ? _fieldConfig['Suffix'] : ''
+  property real precision: _fieldConfig['Precision'] ? _fieldConfig['Precision'] : 0
 
   property alias placeholderText: numberInput.placeholderText
 
   // don't ever use a step smaller than would be visible in the widget
   // i.e. if showing 2 decimals, smallest increment will be 0.01
   // https://github.com/qgis/QGIS/blob/a038a79997fb560e797daf3903d94c7d68e25f42/src/gui/editorwidgets/qgsdoublespinbox.cpp#L83-L87
-  property real step//: Math.max(config["Step"], Math.pow( 10.0, 0.0 - precision ))
+  property real step: Math.max(_fieldConfig["Step"], Math.pow( 10.0, 0.0 - precision ))
 
   signal editorValueChanged( var newValue, var isNull )
 
-  enabled: !isReadOnly
+  title: _fieldShouldShowTitle ? _fieldTitle : ""
+
+  errorMsg: _fieldErrorMessage
+  warningMsg: _fieldWarningMessage
+
+  enabled: !_fieldIsReadOnly
   hasFocus: numberInput.activeFocus
 
   leftAction: MMIcon {
@@ -48,8 +68,17 @@ MMAbstractEditor {
     enabled: Number( numberInput.text ) - root.step >= root.from
   }
 
+  onLeftActionClicked: {
+    if ( leftIcon.enabled )
+    {
+      let decremented = Number( numberInput.text ) - root.step
+      root.editorValueChanged( decremented.toFixed( root.precision ), false )
+    }
+  }
+
   content: Item {
     anchors.fill: parent
+
     Row {
       height: parent.height
       anchors.horizontalCenter: parent.horizontalCenter
@@ -60,12 +89,16 @@ MMAbstractEditor {
 
         height: parent.height
 
-        clip: true
-        text: root.parentValue === undefined || root.parentValueIsNull ? "" : root.parentValue
-        color: root.enabled ? __style.nightColor : __style.mediumGreenColor
+        text: root._fieldValue === undefined || root._fieldValueIsNull ? '' : root._fieldValue
+
         placeholderTextColor: __style.nightAlphaColor
+        color: root.enabled ? __style.nightColor : __style.mediumGreenColor
+
         font: __style.p5
+
+        clip: true
         hoverEnabled: true
+
         verticalAlignment: Qt.AlignVCenter
         inputMethodHints: Qt.ImhFormattedNumbersOnly
 
@@ -83,7 +116,7 @@ MMAbstractEditor {
       Text {
         id: suffix
 
-        text: root.suffix
+        text: root.suffix ? ' ' + root.suffix : "" // to make sure there is a space between the number and the suffix
 
         visible: root.suffix !== "" && numberInput.text !== ""
 
@@ -106,18 +139,14 @@ MMAbstractEditor {
     enabled: Number( numberInput.text ) + root.step <= root.to
   }
 
-  onLeftActionClicked: {
-    numberInput.forceActiveFocus()
-    if ( leftIcon.enabled ) {
-      let decremented = Number( numberInput.text ) - root.step
-      root.editorValueChanged( decremented.toFixed( root.precision ), false )
-    }
-  }
   onRightActionClicked: {
-    numberInput.forceActiveFocus();
-    if ( rightIcon.enabled ) {
+    if ( rightIcon.enabled )
+    {
       let incremented = Number( numberInput.text ) + root.step
       root.editorValueChanged( incremented.toFixed( root.precision ), false )
     }
   }
+
+  // on press and hold behavior can be used from here:
+  // https://github.com/mburakov/qt5/blob/93bfa3874c10f6cb5aa376f24363513ba8264117/qtquickcontrols/src/controls/SpinBox.qml#L306-L309
 }
diff --git a/app/qml/inputs/MMPhotoEditor.qml → app/qml/form/editors/MMPhotoFormEditor.qml b/app/qml/inputs/MMPhotoEditor.qml → app/qml/form/editors/MMPhotoFormEditor.qml
@@ -10,9 +10,10 @@
 import QtQuick
 import QtQuick.Controls
 import QtQuick.Controls.Basic
-import "../components"
+import "../../components"
+import "../../inputs"
 
-MMAbstractEditor {
+MMBaseInput {
   id: root
 
   property var parentValue: parent.value ?? ""

diff --git a/app/qml/inputs/MMQrCodeEditor.qml → app/qml/form/editors/MMScannerFormEditor.qml b/app/qml/inputs/MMQrCodeEditor.qml → app/qml/form/editors/MMScannerFormEditor.qml
@@ -10,9 +10,10 @@
 import QtQuick
 import QtQuick.Controls
 import QtQuick.Controls.Basic
-import "../components"
+import "../../components"
+import "../../inputs"
 
-MMAbstractEditor {
+MMBaseInput {
   id: root
 
   property var parentValue: parent.value
@@ -41,6 +42,8 @@ MMAbstractEditor {
     background: Rectangle {
       color: __style.transparentColor
     }
+
+    onTextChanged: root.editorValueChanged( text, text === "" )
   }
 
   rightAction: MMIcon {