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
0007 import QtQuick.Layouts
0008 import QtQuick.Controls
0009
0010 import org.kde.konsoleqml
0011 import org.kde.kirigami as Kirigami
0012
0013 import org.kde.qmlkonsole
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
0090         contentItem: MouseArea {
0091             acceptedButtons: Qt.AllButtons
0092             onClicked: mouse => {
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             RowLayout {
0101                 id: layout
0102                 anchors.fill: parent
0103                 spacing: Kirigami.Units.smallSpacing
0104
0105                 Kirigami.Icon {
0106                     id: tabIcon
0107                     Layout.alignment: Qt.AlignLeft | Qt.AlignVCenter
0108                     Layout.preferredWidth: Kirigami.Units.iconSizes.small
0109                     Layout.preferredHeight: width
0110                     source: "tab-detach"
0111                 }
0112
0113                 Label {
0114                     id: titleLabel
0115                     Layout.fillWidth: true
0116                     Layout.alignment: Qt.AlignLeft | Qt.AlignVCenter
0117                     Layout.leftMargin: Kirigami.Units.smallSpacing
0118                     Layout.rightMargin: Kirigami.Units.smallSpacing
0119                     text: model.name
0120                     elide: Text.ElideRight
0121                     horizontalAlignment: Text.AlignLeft
0122                 }
0123
0124                 ToolButton {
0125                     Layout.alignment: Qt.AlignRight | Qt.AlignVCenter
0126                     Layout.preferredWidth: Kirigami.Units.iconSizes.small
0127                     Layout.preferredHeight: width
0128                     icon.name: "tab-close"
0129                     onClicked: root.closeTabRequested(model.index)
0130
0131                     opacity: Kirigami.Settings.tabletMode ? 1 : (control.hovered ? 1 : 0);
0132                     Behavior on opacity {
0133                         OpacityAnimator {
0134                             duration: Kirigami.Units.shortDuration
0135                             easing.type: Easing.InOutQuad
0136                         }
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 }