diff --git a/nymea-app/resources.qrc b/nymea-app/resources.qrc index d027429b..966f82c6 100644 --- a/nymea-app/resources.qrc +++ b/nymea-app/resources.qrc @@ -43,10 +43,6 @@ ui/components/SwipeDelegateGroup.qml ui/components/PasswordTextField.qml ui/components/BrightnessSlider.qml - ui/components/SegmentedImage.qml - ui/components/SegmentRenderer.qml - ui/components/SegmentBoundingBoxes.qml - ui/components/FingerprintVisual.qml ui/components/ListSectionHeader.qml ui/components/ListFilterInput.qml ui/components/Led.qml diff --git a/nymea-app/ui/components/ColorIcon.qml b/nymea-app/ui/components/ColorIcon.qml index 40cccf73..be85552d 100644 --- a/nymea-app/ui/components/ColorIcon.qml +++ b/nymea-app/ui/components/ColorIcon.qml @@ -1,126 +1,67 @@ -/* - * Copyright (C) 2013 Canonical, Ltd. - * - * This program is free software; you can redistribute it and/or modify - * it under the terms of the GNU General Public License as published by - * the Free Software Foundation; version 3. - * - * This program is distributed in the hope that it will be useful, - * but WITHOUT ANY WARRANTY; without even the implied warranty of - * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the - * GNU General Public License for more details. - * - * You should have received a copy of the GNU General Public License - * along with this program. If not, see . - */ +/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * +* +* Copyright 2013 - 2020, nymea GmbH +* Contact: contact@nymea.io +* +* This file is part of nymea. +* This project including source code and documentation is protected by +* copyright law, and remains the property of nymea GmbH. All rights, including +* reproduction, publication, editing and translation, are reserved. The use of +* this project is subject to the terms of a license agreement to be concluded +* with nymea GmbH in accordance with the terms of use of nymea GmbH, available +* under https://nymea.io/license +* +* GNU General Public License Usage +* Alternatively, this project may be redistributed and/or modified under the +* terms of the GNU General Public License as published by the Free Software +* Foundation, GNU version 3. This project is distributed in the hope that it +* will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty +* of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU General +* Public License for more details. +* +* You should have received a copy of the GNU General Public License along with +* this project. If not, see . +* +* For any further details and any questions please contact us under +* contact@nymea.io or see our FAQ/Licensing Information on +* https://nymea.io/license/faq +* +* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */ + import QtQuick 2.4 +import QtGraphicalEffects 1.0 -/*! - \qmltype Icon - \inqmlmodule Ubuntu.Components 0.1 - \ingroup ubuntu - \brief The Icon component displays an icon from the icon theme. - - The icon theme contains a set of standard icons referred to by their name. - Using icons whenever possible enhances consistency accross applications. - Each icon has a name and can have different visual representations depending - on the size requested. - - Icons can also be colorized. Setting the \l color property will make all pixels - with the \l keyColor (by default #808080) colored. - - Example: - \qml - Icon { - width: 64 - height: 64 - name: "search" - } - \endqml - - Example of colorization: - \qml - Icon { - width: 64 - height: 64 - name: "search" - color: UbuntuColors.warmGrey - } - \endqml - - Icon themes are created following the - \l{http://standards.freedesktop.org/icon-theme-spec/icon-theme-spec-latest.html}{Freedesktop Icon Theme Specification}. -*/ Item { id: icon - /*! - The name of the icon to display. - \qmlproperty string name - */ property string name - - /*! - The color that all pixels that originally are of color \l keyColor should take. - \qmlproperty color color - */ - property alias color: colorizedImage.keyColorOut - - /*! - The color of the pixels that should be colorized. - By default it is set to #808080. - \qmlproperty color keyColor - */ - property alias keyColor: colorizedImage.keyColorIn - + property alias color: colorizedImage.color property int margins: 0 + //TODO: Should be in the style + readonly property color keyColor: "#808080" + property alias status: image.status Image { id: image - - /* Necessary so that icons are not loaded before a size is set. */ - property bool ready: false - Component.onCompleted: ready = true - anchors.fill: parent anchors.margins: parent ? parent.margins : 0 - source: ready && width > 0 && height > 0 && icon.name ? icon.name : "" + source: width > 0 && height > 0 && icon.name ? icon.name : "" sourceSize { width: width height: height } cache: true - visible: !colorizedImage.active } - ShaderEffect { + ColorOverlay { id: colorizedImage anchors.fill: parent anchors.margins: parent ? parent.margins : 0 - visible: active && image.status == Image.Ready - - // Whether or not a color has been set. - property bool active: keyColorOut != Qt.rgba(0.0, 0.0, 0.0, 0.0) - - property Image source: image - property color keyColorOut: Qt.rgba(0.0, 0.0, 0.0, 0.0) - property color keyColorIn: "#808080" - property real threshold: 0.1 - - fragmentShader: " - varying highp vec2 qt_TexCoord0; - uniform sampler2D source; - uniform highp vec4 keyColorOut; - uniform highp vec4 keyColorIn; - uniform lowp float threshold; - uniform lowp float qt_Opacity; - void main() { - lowp vec4 sourceColor = texture2D(source, qt_TexCoord0); - gl_FragColor = mix(vec4(keyColorOut.rgb, 1.0) * sourceColor.a, sourceColor, step(threshold, distance(sourceColor.rgb / sourceColor.a, keyColorIn.rgb))) * qt_Opacity; - }" + visible: image.status == Image.Ready + source: image } } diff --git a/nymea-app/ui/devicepages/FingerprintReaderDevicePage.qml b/nymea-app/ui/devicepages/FingerprintReaderDevicePage.qml index ba9e1603..73095d21 100644 --- a/nymea-app/ui/devicepages/FingerprintReaderDevicePage.qml +++ b/nymea-app/ui/devicepages/FingerprintReaderDevicePage.qml @@ -164,10 +164,11 @@ DevicePageBase { Layout.preferredWidth: 100 Layout.preferredHeight: width Layout.alignment: Qt.AlignHCenter - FingerprintVisual { - id: fingerprintVisual + ColorIcon { + name: "../images/fingerprint.svg" anchors.centerIn: parent - scale: parent.height / implicitHeight + height: Math.min(parent.width, parent.height) + width: height } } @@ -199,11 +200,10 @@ DevicePageBase { Connections { target: engine.deviceManager onExecuteActionReply: { - addUserPage.error = params["deviceError"] !== "DeviceErrorNoError" - print("Execute action reply:", params["deviceError"]); + print("Execute action reply:", JSON.stringify(params)); + addUserPage.error = params["params"]["deviceError"] !== "DeviceErrorNoError" var masks =[] masks.push({x: 0, y: 0, width: 1, height: 1}); - fingerprintVisual.masks = masks addUserPage.done = true } } @@ -299,13 +299,15 @@ DevicePageBase { Layout.preferredHeight: 100 Layout.alignment: Qt.AlignCenter - FingerprintVisual { - id: fingerprintVisual - scale: parent.height / implicitHeight + ColorIcon { + name: "../images/fingerprint.svg" + height: Math.min(parent.width, parent.height) + width: height anchors.centerIn: parent - fillColor: addUserPage.error ? "red" : app.accentColor + color: addUserPage.done ? + (addUserPage.error ? "red" : app.accentColor) + : keyColor } - } Label { text: addUserPage.error ? qsTr("Fingerprint could not be read.\nPlease try again.") :