contents/ui/Tabs.qml

0001 // SPDX-FileCopyrightText: 2021 Felipe Kinoshita <kinofhek@gmail.com>
0002 // SPDX-FileCopyrightText: 2022 Devin Lin <espidev@gmail.com>
0003 //
0004 // SPDX-License-Identifier: GPL-2.0-or-later
0005
0006 import QtQuick 2.15
0007 import QtQuick.Layouts 1.1
0008 import QtQuick.Controls 2.15
0009
0010 import QMLTermWidget 1.0
0011 import org.kde.kirigami 2.19 as Kirigami
0012
0013 import org.kde.qmlkonsole 1.0
0014
0015 // Taken from Angelfish's desktop ListView
0016
0017 ListView {
0018     id: root
0019
0020     signal switchToTabRequested(int index)
0021     signal closeTabRequested(int index)
0022     signal addTabRequested()
0023
0024     implicitHeight: Kirigami.Units.gridUnit + Kirigami.Units.largeSpacing * 2
0025     model: TerminalTabModel
0026     orientation: ListView.Horizontal
0027
0028     Shortcut {
0029         sequence: "Ctrl+Shift+W"
0030         onActivated: {
0031             root.closeTabRequested(root.currentIndex);
0032         }
0033     }
0034
0035     Shortcut {
0036         sequences: ["Ctrl+Tab", "Ctrl+PgDown"]
0037         onActivated: {
0038             if (root.currentIndex != root.count -1) {
0039                 root.switchToTabRequested(root.currentIndex + 1);
0040             } else {
0041                 root.switchToTabRequested(0);
0042             }
0043         }
0044     }
0045
0046     Shortcut {
0047         sequences: ["Ctrl+Shift+Tab", "Ctrl+PgUp"]
0048         onActivated: {
0049             if (root.currentIndex === 0) {
0050                 root.switchToTabRequested(root.count - 1);
0051             } else {
0052                 root.switchToTabRequested(root.currentIndex - 1);
0053             }
0054         }
0055     }
0056
0057     delegate: ItemDelegate {
0058         id: control
0059
0060         highlighted: ListView.isCurrentItem
0061
0062         width: Kirigami.Units.gridUnit * 15
0063         height: tabControl.height
0064
0065         background: Rectangle {
0066             Kirigami.Theme.colorSet: Kirigami.Theme.Button
0067             Kirigami.Theme.inherit: false
0068             implicitHeight: Kirigami.Units.gridUnit * 3 + Kirigami.Units.smallSpacing * 2
0069             color: control.highlighted ? Kirigami.Theme.backgroundColor
0070                 : (control.hovered ? Qt.darker(Kirigami.Theme.backgroundColor, 1.05)
0071                 : Qt.darker(Kirigami.Theme.backgroundColor, 1.1))
0072             Behavior on color { ColorAnimation { duration: Kirigami.Units.shortDuration } }
0073
0074             ToolSeparator {
0075                 anchors.top: parent.top
0076                 anchors.bottom: parent.bottom
0077                 anchors.right: parent.right
0078                 orientation: Qt.Vertical
0079             }
0080
0081             ToolSeparator {
0082                 visible: index === 0
0083                 anchors.top: parent.top
0084                 anchors.bottom: parent.bottom
0085                 anchors.left: parent.left
0086                 orientation: Qt.Vertical
0087             }
0088
0089             MouseArea {
0090                 anchors.fill: parent
0091                 acceptedButtons: Qt.AllButtons
0092                 onClicked: {
0093                     if (mouse.button === Qt.LeftButton) {
0094                         root.switchToTabRequested(model.index);
0095                     } else if (mouse.button === Qt.MiddleButton) {
0096                         root.closeTabRequested(model.index);
0097                     }
0098                 }
0099             }
0100         }
0101
0102         contentItem: RowLayout {
0103             id: layout
0104             spacing: Kirigami.Units.smallSpacing
0105
0106             Kirigami.Icon {
0107                 id: tabIcon
0108                 Layout.alignment: Qt.AlignLeft
0109                 Layout.preferredWidth: Kirigami.Units.iconSizes.small
0110                 Layout.preferredHeight: width
0111                 source: "tab-detach"
0112             }
0113
0114             Label {
0115                 id: titleLabel
0116                 Layout.fillWidth: true
0117                 Layout.alignment: Qt.AlignLeft
0118                 Layout.leftMargin: Kirigami.Units.smallSpacing
0119                 Layout.rightMargin: Kirigami.Units.smallSpacing
0120                 text: model.name
0121                 elide: Text.ElideRight
0122                 horizontalAlignment: Text.AlignLeft
0123             }
0124
0125             ToolButton {
0126                 Layout.alignment: Qt.AlignRight
0127                 Layout.preferredWidth: Kirigami.Units.iconSizes.small
0128                 Layout.preferredHeight: width
0129                 icon.name: "tab-close"
0130                 onClicked: root.closeTabRequested(model.index)
0131
0132                 opacity: Kirigami.Settings.tabletMode ? 1 : (control.hovered ? 1 : 0);
0133                 Behavior on opacity {
0134                     OpacityAnimator {
0135                         duration: Kirigami.Units.shortDuration
0136                         easing.type: Easing.InOutQuad
0137                     }
0138                 }
0139             }
0140         }
0141     }
0142     footer: ToolButton {
0143         action: Kirigami.Action {
0144             icon.name: "list-add"
0145             onTriggered: root.addTabRequested()
0146         }
0147     }
0148     add: Transition {
0149         NumberAnimation { property: "opacity"; from: 0; to: 1; duration: Kirigami.Units.longDuration; easing.type: Easing.InQuad }
0150     }
0151     remove: Transition {
0152         NumberAnimation { property: "opacity"; to: 0; duration: Kirigami.Units.longDuration; easing.type: Easing.OutQuad }
0153     }
0154 }