[prev in list] [next in list] [prev in thread] [next in thread]
List: kde-commits
Subject: [ktouch/homescreen-ng] src/qml: Unifiy ListItem And IconToolButton Implementations
From: Sebastian Gottfried <null () kde ! org>
Date: 2017-06-30 13:48:00
Message-ID: E1dQwHA-0008Ck-Ji () code ! kde ! org
[Download RAW message or body]
Git commit acbc625c339489808ada2ee7027c0bd56d8e9055 by Sebastian Gottfried.
Committed on 30/06/2017 at 13:41.
Pushed by gottfried into branch 'homescreen-ng'.
Unifiy ListItem And IconToolButton Implementations
They are both basically a frame with an icon and a text label.
A +44 -0 src/qml/common/IconLabel.qml [License: GPL (v2+)]
M +6 -32 src/qml/common/IconToolButton.qml
M +25 -62 src/qml/common/ListItem.qml
A +32 -0 src/qml/common/MonochromeIcon.qml [License: GPL (v2+)]
M +2 -0 src/qml/qml.qrc
https://commits.kde.org/ktouch/acbc625c339489808ada2ee7027c0bd56d8e9055
diff --git a/src/qml/common/IconLabel.qml b/src/qml/common/IconLabel.qml
new file mode 100644
index 0000000..d1e1f86
--- /dev/null
+++ b/src/qml/common/IconLabel.qml
@@ -0,0 +1,44 @@
+/*
+ * Copyright 2017 Sebastian Gottfried <sebastian.gottfried@posteo.de>
+ *
+ * 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; either version 2 of
+ * the License, or (at your option) any later version.
+ *
+ * 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 <http://www.gnu.org/licenses/>.
+ */
+
+import QtQuick 2.4
+import QtQuick.Controls 2.0
+
+Label {
+ property string icon: ""
+ property bool reserveSpaceForIcon: false
+ id: label
+ elide: Text.ElideRight
+
+ padding: Math.ceil(0.7 * font.pixelSize)
+ leftPadding: iconItem.visible || reserveSpaceForIcon? 2 * padding + \
iconItem.width: padding + verticalAlignment: Text.AlignVCenter
+
+ MonochromeIcon {
+ id: iconItem
+ visible: label.icon != ""
+ color: label.color
+ anchors {
+ left: parent.left
+ leftMargin: label.padding
+ verticalCenter: parent.verticalCenter
+ }
+ icon: label.icon
+ width: 22
+ height: 22
+ }
+}
diff --git a/src/qml/common/IconToolButton.qml b/src/qml/common/IconToolButton.qml
index 64ae30a..ef8a4ad 100644
--- a/src/qml/common/IconToolButton.qml
+++ b/src/qml/common/IconToolButton.qml
@@ -17,46 +17,20 @@
import QtQuick 2.4
import QtQuick.Controls 2.0
-import QtGraphicalEffects 1.0
-import QtQuick.Layouts 1.1
-import org.kde.kquickcontrolsaddons 2.0
ToolButton {
id: button
- property color color: "#000000"
+ property alias color: content.color
+ property alias icon: content.icon
property color backgroundColor: "#ffffff"
- property alias icon: icon.icon
+ padding: 0
hoverEnabled: true
- implicitWidth: button.text == ""? implicitHeight: icon.implicitWidth + \
label.implicitWidth + layout.spacing
- implicitHeight: 40
- contentItem: RowLayout {
- id: layout
- spacing: button.text != ""? 5: 0
- Item {
- Layout.fillHeight: true
- Layout.preferredWidth: icon.width
- Layout.fillWidth: button.text == ""
- QIconItem {
- id: icon
- width: 24
- height: 24
- anchors.centerIn: parent
- }
- ColorOverlay {
- anchors.fill: icon
- source: icon
- color: button.color
- }
- }
- Text {
- id: label
- Layout.fillWidth: true
- color: button.color
- text: button.text
- }
+ contentItem: IconLabel {
+ id: content
+ text: button.text
}
background: Rectangle {
diff --git a/src/qml/common/ListItem.qml b/src/qml/common/ListItem.qml
index 2185b57..8a31a0c 100644
--- a/src/qml/common/ListItem.qml
+++ b/src/qml/common/ListItem.qml
@@ -17,84 +17,47 @@
*/
import QtQuick 2.4
-import QtQuick.Controls 1.3
-import QtQuick.Layouts 1.1
-import org.kde.kquickcontrolsaddons 2.0
+import QtQuick.Controls 2.0
import ktouch 1.0
-Item {
+ItemDelegate {
id: root
- property alias title: label.text
- property string iconSource
+ property string icon
property alias label: label
- property bool isCurrent: ListView.isCurrentItem;
- signal clicked
- signal doubleClicked
- height: 2 * content.height
+ property alias bg: bg
+ property alias reserveSpaceForIcon: label.reserveSpaceForIcon
+ hoverEnabled: true
+ padding: 0
+
+ KColorScheme {
+ id: listItemColorSchemeNormal
+ colorGroup: KColorScheme.Active
+ colorSet: KColorScheme.View
+ }
- SystemPalette {
- id: listItemPallete
- colorGroup: SystemPalette.Active
+ KColorScheme {
+ id: listItemColorSchemeHighlighted
+ colorGroup: KColorScheme.Active
+ colorSet: KColorScheme.Selection
}
- Rectangle {
+ background: Rectangle {
id: bg
anchors.fill: parent
- color: Qt.rgba(listItemPallete.highlight.r, listItemPallete.highlight.g, \
listItemPallete.highlight.b, 0.3)
- radius: 0.2 * height
- border {
- width: 1
- color: listItemPallete.highlight
- }
- opacity: root.isCurrent || mouseArea.containsMouse? 1: 0
+ color: listItemColorSchemeHighlighted.normalBackground
+ opacity: root.highlighted ? 1 : (root.hovered? 0.3: 0)
Behavior on opacity {
NumberAnimation {
duration: 150
- }
- }
- }
-
- Item {
- id: content
- anchors {
- verticalCenter: parent.verticalCenter
- left: parent.left
- right: parent.right
- leftMargin: 5
- rightMargin: 5
- }
-
- height: Math.max(label.height, label.height)
-
- QIconItem {
- id: iconItem
- visible: !!root.iconSource
- anchors {
- left: parent.left
- verticalCenter: parent.verticalCenter
- }
- icon: root.iconSource
- width: 22
- height: 22
- }
-
- Label {
- id: label
- elide: Text.ElideRight
- anchors {
- left: iconItem.visible? iconItem.right: parent.left
- right: parent.right
- verticalCenter: parent.verticalCenter
}
}
}
- MouseArea {
- id: mouseArea
- anchors.fill: parent
- hoverEnabled: true
- onClicked: root.clicked()
- onDoubleClicked: root.doubleClicked()
+ contentItem: IconLabel {
+ id: label
+ text: root.text
+ icon: root.icon
+ color: root.highlighted? listItemColorSchemeHighlighted.activeText: \
listItemColorSchemeNormal.normalText; }
}
diff --git a/src/qml/common/MonochromeIcon.qml b/src/qml/common/MonochromeIcon.qml
new file mode 100644
index 0000000..1649e0b
--- /dev/null
+++ b/src/qml/common/MonochromeIcon.qml
@@ -0,0 +1,32 @@
+/*
+ * Copyright 2017 Sebastian Gottfried <sebastian.gottfried@posteo.de>
+ *
+ * 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; either version 2 of
+ * the License, or (at your option) any later version.
+ *
+ * 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 <http://www.gnu.org/licenses/>.
+ */
+
+import QtQuick 2.4
+import QtGraphicalEffects 1.0
+import org.kde.kquickcontrolsaddons 2.0
+
+QIconItem {
+ property color color: "#000000"
+ id: icon
+ width: 24
+ height: 24
+ ColorOverlay {
+ anchors.fill: parent
+ source: icon
+ color: parent.color
+ }
+}
diff --git a/src/qml/qml.qrc b/src/qml/qml.qrc
index 298ca13..657960c 100644
--- a/src/qml/qml.qrc
+++ b/src/qml/qml.qrc
@@ -41,5 +41,7 @@
<file>keyboard/KeyLabel.qml</file>
<file>keyboard/KeyboardLayoutEditor.qml</file>
<file>common/IconToolButton.qml</file>
+ <file>common/IconLabel.qml</file>
+ <file>common/MonochromeIcon.qml</file>
</qresource>
</RCC>
[prev in list] [next in list] [prev in thread] [next in thread]
Configure |
About |
News |
Add a list |
Sponsored by KoreLogic