aboutsummaryrefslogtreecommitdiffstats
path: root/src/imports/controls/material/SwipeDelegate.qml
diff options
context:
space:
mode:
authorMitch Curtis <mitch.curtis@theqtcompany.com>2016-02-27 13:15:46 +0100
committerMitch Curtis <mitch.curtis@theqtcompany.com>2016-03-15 21:44:12 +0000
commitef885485a19f0e70273650d88312af0195c32920 (patch)
tree48ca030228c456a53e08c45df97dee0944a7d2c8 /src/imports/controls/material/SwipeDelegate.qml
parente1add88186ed3ace78c7f6c1e3d683285a1a51fa (diff)
Add SwipeDelegate
SwipeDelegate presents a view item that can be swiped left or right to expose more options or information. It is used as a delegate in views such as ListView. Change-Id: I7533a2b223f652993b6cee730930ea6dc125c869 Task-number: QTBUG-51610 Reviewed-by: J-P Nurmi <jpnurmi@theqtcompany.com>
Diffstat (limited to 'src/imports/controls/material/SwipeDelegate.qml')
-rw-r--r--src/imports/controls/material/SwipeDelegate.qml168
1 files changed, 168 insertions, 0 deletions
diff --git a/src/imports/controls/material/SwipeDelegate.qml b/src/imports/controls/material/SwipeDelegate.qml
new file mode 100644
index 00000000..600eb480
--- /dev/null
+++ b/src/imports/controls/material/SwipeDelegate.qml
@@ -0,0 +1,168 @@
+/****************************************************************************
+**
+** Copyright (C) 2016 The Qt Company Ltd.
+** Contact: http://www.qt.io/licensing/
+**
+** This file is part of the Qt Labs Controls module of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:LGPL3$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see http://www.qt.io/terms-conditions. For further
+** information use the contact form at http://www.qt.io/contact-us.
+**
+** GNU Lesser General Public License Usage
+** Alternatively, this file may be used under the terms of the GNU Lesser
+** General Public License version 3 as published by the Free Software
+** Foundation and appearing in the file LICENSE.LGPLv3 included in the
+** packaging of this file. Please review the following information to
+** ensure the GNU Lesser General Public License version 3 requirements
+** will be met: https://www.gnu.org/licenses/lgpl.html.
+**
+** GNU General Public License Usage
+** Alternatively, this file may be used under the terms of the GNU
+** General Public License version 2.0 or later as published by the Free
+** Software Foundation and appearing in the file LICENSE.GPL included in
+** the packaging of this file. Please review the following information to
+** ensure the GNU General Public License version 2.0 requirements will be
+** met: http://www.gnu.org/licenses/gpl-2.0.html.
+**
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick 2.6
+import Qt.labs.templates 1.0 as T
+import Qt.labs.controls.material 1.0
+import Qt.labs.controls.material.impl 1.0
+
+T.SwipeDelegate {
+ id: control
+
+ implicitWidth: Math.max(background ? background.implicitWidth : 0,
+ contentItem.implicitWidth + leftPadding + rightPadding)
+ implicitHeight: Math.max(background ? background.implicitHeight : 0,
+ Math.max(contentItem.implicitHeight,
+ indicator ? indicator.implicitHeight : 0) + topPadding + bottomPadding)
+ baselineOffset: contentItem.y + contentItem.baselineOffset
+
+ padding: 16
+ spacing: 16
+
+ //! [indicator]
+ indicator: Rectangle {
+ id: indicatorItem
+ x: text ? (control.mirrored ? control.width - width - control.rightPadding : control.leftPadding) : control.leftPadding + (control.availableWidth - width) / 2
+ y: control.topPadding + (control.availableHeight - height) / 2
+ implicitWidth: 20
+ implicitHeight: 20
+ color: "transparent"
+ border.color: control.checked ? control.Material.accentColor : control.Material.secondaryTextColor
+ border.width: control.checked ? width / 2 : 2
+ radius: 2
+
+ visible: control.checkable
+
+ Behavior on border.width {
+ NumberAnimation {
+ duration: 100
+ easing.type: Easing.OutCubic
+ }
+ }
+
+ Behavior on border.color {
+ ColorAnimation {
+ duration: 100
+ easing.type: Easing.OutCubic
+ }
+ }
+
+ Ripple {
+ width: parent.width
+ height: width
+ control: control
+ colored: control.checked
+ opacity: control.pressed ? 1 : 0
+ }
+
+ // TODO: This needs to be transparent
+ Image {
+ id: checkImage
+ x: (parent.width - width) / 2
+ y: (parent.height - height) / 2
+ width: 16
+ height: 16
+ source: "qrc:/qt-project.org/imports/Qt/labs/controls/material/images/check.png"
+ fillMode: Image.PreserveAspectFit
+
+ scale: control.checked ? 1 : 0
+ Behavior on scale { NumberAnimation { duration: 100 } }
+ }
+
+ states: State {
+ name: "checked"
+ when: control.checked
+ }
+
+ transitions: Transition {
+ SequentialAnimation {
+ NumberAnimation {
+ target: indicatorItem
+ property: "scale"
+ // Go down 2 pixels in size.
+ to: 1 - 2 / indicatorItem.width
+ duration: 120
+ }
+ NumberAnimation {
+ target: indicatorItem
+ property: "scale"
+ to: 1
+ duration: 120
+ }
+ }
+ }
+ }
+ //! [indicator]
+
+ //! [contentItem]
+ contentItem: Text {
+ leftPadding: control.checkable && !control.mirrored ? control.indicator.width + control.spacing : 0
+ rightPadding: control.checkable && control.mirrored ? control.indicator.width + control.spacing : 0
+
+ text: control.text
+ font: control.font
+ color: control.enabled ? control.Material.primaryTextColor : control.Material.hintTextColor
+ elide: Text.ElideRight
+ visible: control.text
+ horizontalAlignment: Text.AlignLeft
+ verticalAlignment: Text.AlignVCenter
+
+ Behavior on x {
+ enabled: !control.pressed
+ NumberAnimation {
+ easing.type: Easing.InOutCubic
+ duration: 400
+ }
+ }
+ }
+ //! [contentItem]
+
+ //! [background]
+ background: Rectangle {
+ color: !control.enabled ? control.Material.swipeDelegateDisabledColor :
+ (control.pressed ? control.Material.swipeDelegatePressColor :
+ (control.activeFocus || control.hovered ? control.Material.swipeDelegateHoverColor : control.Material.swipeDelegateColor))
+
+ Behavior on x {
+ enabled: !control.pressed
+ NumberAnimation {
+ easing.type: Easing.InOutCubic
+ duration: 400
+ }
+ }
+ }
+ //! [background]
+}