diff --git a/qml/MediaDetailTelemetry.qml b/qml/MediaDetailTelemetry.qml index 9f8460b..f8f112d 100644 --- a/qml/MediaDetailTelemetry.qml +++ b/qml/MediaDetailTelemetry.qml @@ -377,6 +377,8 @@ Item { } } + //////// + Row { anchors.top: parent.top anchors.topMargin: 16 @@ -483,7 +485,11 @@ Item { anchors.verticalCenter: parent.verticalCenter readOnly: true - text: shot.latitudeString + " " + shot.longitudeString + selectByMouse: true + selectionColor: Theme.colorPrimary + selectedTextColor: "white" + + text: shot.latitudeString + " / " + shot.longitudeString font.pixelSize: Theme.fontSizeContent color: Theme.colorHeaderContent } @@ -504,6 +510,10 @@ Item { visible: shot.altitude readOnly: true + selectByMouse: true + selectionColor: Theme.colorPrimary + selectedTextColor: "white" + text: UtilsString.altitudeToString(shot.altitude - shot.altitudeOffset, 0, settingsManager.appUnits) font.pixelSize: Theme.fontSizeContent color: Theme.colorHeaderContent @@ -525,12 +535,18 @@ Item { visible: shot.speed readOnly: true + selectByMouse: true + selectionColor: Theme.colorPrimary + selectedTextColor: "white" + text: UtilsString.speedToString_km(shot.speed, 1, settingsManager.appUnits) font.pixelSize: Theme.fontSizeContent color: Theme.colorHeaderContent } } } + + //////// } } @@ -878,5 +894,9 @@ Item { } } } + + //////////////// } + + //////////////////////////////////////////////////////////////////////////// } diff --git a/qml/ScreenLibraryGrid.qml b/qml/ScreenLibraryGrid.qml index 5c27b62..51228ff 100755 --- a/qml/ScreenLibraryGrid.qml +++ b/qml/ScreenLibraryGrid.qml @@ -490,7 +490,9 @@ Item { ActionMenu { id: actionMenu z: 7 - onMenuSelected: rectangleLibraryGrid.actionMenuTriggered(index) + onMenuSelected: (index) => { + rectangleLibraryGrid.actionMenuTriggered(index) + } } function actionMenuTriggered(index) { //console.log("actionMenuTriggered(" + index + ") selected shot: '" + shotsView.currentItem.shot.name + "'") @@ -694,6 +696,10 @@ Item { console.log("shotsView::Key_Menu") } } + + //////// } } + + //////////////////////////////////////////////////////////////////////////// } diff --git a/qml/ThemeEngine.qml b/qml/ThemeEngine.qml index 3471249..4d632c4 100644 --- a/qml/ThemeEngine.qml +++ b/qml/ThemeEngine.qml @@ -214,7 +214,7 @@ Item { colorTabletmenuContent = "#9d9d9d" colorTabletmenuHighlight = "#0079fe" - colorBackground = "#F5F5F5" + colorBackground = "#F8F8F8" colorForeground = "#E9E9E9" colorPrimary = "#FFCA28" diff --git a/qml/components/FileInputArea.qml b/qml/components/FileInputArea.qml index ac91006..cc3b663 100644 --- a/qml/components/FileInputArea.qml +++ b/qml/components/FileInputArea.qml @@ -14,19 +14,22 @@ import "qrc:/js/UtilsPath.js" as UtilsPath T.TextField { id: control - implicitWidth: implicitBackgroundWidth + leftInset + rightInset - || Math.max(contentWidth, placeholder.implicitWidth) + leftPadding + rightPadding + implicitWidth: implicitBackgroundWidth + leftInset + rightInset || + Math.max(contentWidth, placeholder.implicitWidth) + leftPadding + rightPadding implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset, contentHeight + topPadding + bottomPadding, placeholder.implicitHeight + topPadding + bottomPadding) - clip: false - padding: 12 - leftPadding: padding + 4 + leftPadding: 12 + rightPadding: 12 - text: "" + clip: true color: colorText + //opacity: control.enabled ? 1 : 0.66 + + text: "" font.pixelSize: Theme.componentFontSize + verticalAlignment: TextInput.AlignVCenter placeholderText: "" placeholderTextColor: colorPlaceholderText @@ -44,6 +47,7 @@ T.TextField { property bool isValid: (control.text.length > 0 && fileArea.text.length > 0 && extensionArea.text.length > 0) // settings + property string buttonText: qsTr("change") property int buttonWidth: (buttonChange.visible ? buttonChange.width : 0) // colors @@ -51,8 +55,8 @@ T.TextField { property string colorPlaceholderText: Theme.colorSubText property string colorBorder: Theme.colorComponentBorder property string colorBackground: Theme.colorComponentBackground - property string colorSelectedText: Theme.colorHighContrast property string colorSelection: Theme.colorPrimary + property string colorSelectedText: "white" //////////////////////////////////////////////////////////////////////////// @@ -84,10 +88,11 @@ T.TextField { PlaceholderText { id: placeholder + anchors.top: control.top + anchors.bottom: control.bottom + x: control.leftPadding - y: control.topPadding width: control.width - (control.leftPadding + control.rightPadding) - height: control.height - (control.topPadding + control.bottomPadding) text: control.placeholderText font: control.font @@ -98,6 +103,43 @@ T.TextField { renderType: control.renderType } + //////////////// + + Row { + id: contentRow + anchors.left: parent.left + anchors.leftMargin: control.leftPadding + control.contentWidth + anchors.verticalCenter: parent.verticalCenter + + TextInput { // fileArea + id: fileArea + anchors.verticalCenter: parent.verticalCenter + + width: contentWidth + autoScroll: false + color: Theme.colorSubText + + selectByMouse: true + selectionColor: control.colorSelection + selectedTextColor: control.colorSelectedText + + onTextChanged: control.textChanged() + onEditingFinished: focus = false + } + Text { // dot + anchors.verticalCenter: parent.verticalCenter + text: "." + color: Theme.colorSubText + verticalAlignment: Text.AlignVCenter + } + Text { // extension + id: extensionArea + anchors.verticalCenter: parent.verticalCenter + color: Theme.colorSubText + verticalAlignment: Text.AlignVCenter + } + } + //////////////////////////////////////////////////////////////////////////// background: Rectangle { @@ -107,23 +149,7 @@ T.TextField { radius: Theme.componentRadius color: control.colorBackground - Rectangle { - anchors.top: parent.top - anchors.right: parent.right - anchors.bottom: parent.bottom - width: buttonWidth - color: Theme.colorComponent - } - - Rectangle { - anchors.fill: parent - color: "transparent" - radius: Theme.componentRadius - border.width: 2 - border.color: (control.activeFocus || fileArea.activeFocus) ? Theme.colorPrimary : control.colorBorder - } - - layer.enabled: true + layer.enabled: false layer.effect: OpacityMask { maskSource: Rectangle { x: background.x @@ -135,72 +161,30 @@ T.TextField { } } - //////////////////////////////////////////////////////////////////////////// - - TextInput { - id: fileArea - anchors.top: control.top - anchors.bottom: control.bottom - - x: control.leftPadding + control.contentWidth - width: control.width - control.buttonWidth - x - 12 - - clip: true - autoScroll: false - color: Theme.colorSubText - verticalAlignment: Text.AlignVCenter - - selectByMouse: true - selectionColor: control.colorSelection - selectedTextColor: control.colorSelectedText - - onTextChanged: { - control.textChanged() - } - onEditingFinished: { - focus = false - } - } - - Text { - id: dot - anchors.top: control.top - anchors.bottom: control.bottom - - x: control.leftPadding + control.contentWidth + fileArea.contentWidth - visible: x < control.width - - text: "." - color: Theme.colorSubText - verticalAlignment: Text.AlignVCenter - } - Text { - id: extensionArea - anchors.top: control.top - anchors.left: dot.right - anchors.bottom: control.bottom - - visible: dot.visible - color: Theme.colorSubText - verticalAlignment: Text.AlignVCenter - } + //////////////// ButtonThemed { id: buttonChange anchors.top: parent.top - anchors.topMargin: 2 anchors.right: parent.right - anchors.rightMargin: 2 anchors.bottom: parent.bottom - anchors.bottomMargin: 2 - height: control.height - visible: control.enabled - text: qsTr("change") + text: control.buttonText onClicked: { fileDialogLoader.active = true fileDialogLoader.item.open() } } + + Rectangle { + anchors.fill: background + radius: Theme.componentRadius + color: "transparent" + + border.width: 2 + border.color: (control.activeFocus || fileArea.activeFocus) ? control.colorSelection : control.colorBorder + } + + //////////////// } diff --git a/qml/components/FolderInputArea.qml b/qml/components/FolderInputArea.qml index 7cf1cd4..4f05434 100644 --- a/qml/components/FolderInputArea.qml +++ b/qml/components/FolderInputArea.qml @@ -14,18 +14,18 @@ import "qrc:/js/UtilsPath.js" as UtilsPath T.TextField { id: control - implicitWidth: implicitBackgroundWidth + leftInset + rightInset - || Math.max(contentWidth, placeholder.implicitWidth) + leftPadding + rightPadding + implicitWidth: implicitBackgroundWidth + leftInset + rightInset || + Math.max(contentWidth, placeholder.implicitWidth) + leftPadding + rightPadding implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset, contentHeight + topPadding + bottomPadding, placeholder.implicitHeight + topPadding + bottomPadding) - padding: 12 - leftPadding: padding + 4 + leftPadding: 12 + rightPadding: 12 - clip: false + clip: true color: colorText - opacity: control.enabled ? 1 : 0.66 + //opacity: control.enabled ? 1 : 0.66 text: "" font.pixelSize: Theme.componentFontSize @@ -45,7 +45,8 @@ T.TextField { property bool isValid: (control.text.length > 0) // settings - property int buttonWidth: (buttonChange.visible ? buttonChange.width + 2 : 2) + property string buttonText: qsTr("change") + property int buttonWidth: (buttonChange.visible ? buttonChange.width : 0) // colors property string colorText: Theme.colorComponentText @@ -53,7 +54,7 @@ T.TextField { property string colorBorder: Theme.colorComponentBorder property string colorBackground: Theme.colorComponentBackground property string colorSelection: Theme.colorPrimary - property string colorSelectedText: Theme.colorHighContrast + property string colorSelectedText: "white" //////////////////////////////////////////////////////////////////////////// @@ -79,6 +80,27 @@ T.TextField { //////////////////////////////////////////////////////////////////////////// + background: Rectangle { + implicitWidth: 256 + implicitHeight: Theme.componentHeight + + radius: Theme.componentRadius + color: control.colorBackground + + layer.enabled: false + layer.effect: OpacityMask { + maskSource: Rectangle { + x: background.x + y: background.y + width: background.width + height: background.height + radius: background.radius + } + } + } + + //////////////// + PlaceholderText { id: placeholder x: control.leftPadding @@ -95,19 +117,15 @@ T.TextField { renderType: control.renderType } - //////////////////////////////////////////////////////////////////////////// + //////////////// ButtonThemed { id: buttonChange anchors.top: parent.top - anchors.topMargin: Theme.componentBorderWidth anchors.right: parent.right - anchors.rightMargin: Theme.componentBorderWidth anchors.bottom: parent.bottom - anchors.bottomMargin: Theme.componentBorderWidth - visible: control.enabled - text: qsTr("change") + text: control.buttonText onClicked: { folderDialogLoader.active = true @@ -115,40 +133,14 @@ T.TextField { } } - background: Rectangle { - implicitWidth: 256 - implicitHeight: Theme.componentHeight - + Rectangle { + anchors.fill: background radius: Theme.componentRadius - color: control.colorBackground + color: "transparent" - Rectangle { - anchors.top: parent.top - anchors.right: parent.right - anchors.bottom: parent.bottom - width: buttonWidth - color: Theme.colorComponent - } - - Rectangle { - anchors.fill: parent - color: "transparent" - radius: Theme.componentRadius - border.width: Theme.componentBorderWidth - border.color: control.activeFocus ? Theme.colorPrimary : colorBorder - } - - layer.enabled: false - layer.effect: OpacityMask { - maskSource: Rectangle { - x: background.x - y: background.y - width: background.width - height: background.height - radius: background.radius - } - } + border.width: 2 + border.color: control.activeFocus ? control.colorSelection : control.colorBorder } - //////////////////////////////////////////////////////////////////////////// + //////////////// } diff --git a/qml/components/ItemMediaDirectory.qml b/qml/components/ItemMediaDirectory.qml index 82ec2c0..867a0dd 100644 --- a/qml/components/ItemMediaDirectory.qml +++ b/qml/components/ItemMediaDirectory.qml @@ -277,4 +277,6 @@ Item { } } } + + //////////////// } diff --git a/qml/components_generic/ActionMenuSeparator.qml b/qml/components_generic/ActionMenuSeparator.qml index d853e47..1aebd5d 100644 --- a/qml/components_generic/ActionMenuSeparator.qml +++ b/qml/components_generic/ActionMenuSeparator.qml @@ -4,10 +4,10 @@ import ThemeEngine 1.0 Item { // action menu separator anchors.left: parent.left - anchors.leftMargin: Theme.componentMargin + anchors.leftMargin: Theme.componentMargin - 4 anchors.right: parent.right - anchors.rightMargin: Theme.componentMargin - height: Theme.componentMargin + 1 + anchors.rightMargin: Theme.componentMargin - 4 + height: Theme.componentMargin - 4 + 1 Rectangle { anchors.left: parent.left diff --git a/qml/components_themed/TextFieldPathThemed.qml b/qml/components_themed/TextFieldPathThemed.qml index 46ba972..194ffe7 100644 --- a/qml/components_themed/TextFieldPathThemed.qml +++ b/qml/components_themed/TextFieldPathThemed.qml @@ -112,7 +112,6 @@ T.TextField { anchors.top: parent.top anchors.right: parent.right anchors.bottom: parent.bottom - anchors.margins: 0 text: control.buttonText