108 lines
2.4 KiB
QML
108 lines
2.4 KiB
QML
import QtQuick
|
|
import QtQuick.Layouts
|
|
import Quickshell
|
|
import qs.Constants
|
|
import qs.Services
|
|
|
|
Item {
|
|
id: root
|
|
|
|
property color fillColor: Colors.red
|
|
property color _actualColor: Colors.red
|
|
|
|
visible: RecordService.isRecording
|
|
implicitHeight: parent.height
|
|
implicitWidth: layout.width + 10
|
|
|
|
SequentialAnimation {
|
|
id: blinkAnimation
|
|
|
|
running: RecordService.isRecording
|
|
loops: Animation.Infinite
|
|
|
|
ColorAnimation {
|
|
target: root
|
|
property: "_actualColor"
|
|
to: Qt.rgba(fillColor.r, fillColor.g, fillColor.b, 0)
|
|
duration: Style.animationSlowest
|
|
easing.type: Easing.InOutCubic
|
|
}
|
|
|
|
ColorAnimation {
|
|
target: root
|
|
property: "_actualColor"
|
|
to: fillColor
|
|
duration: Style.animationSlowest
|
|
easing.type: Easing.InOutCubic
|
|
}
|
|
|
|
}
|
|
|
|
RowLayout {
|
|
id: layout
|
|
|
|
anchors.top: parent.top
|
|
anchors.bottom: parent.bottom
|
|
spacing: 0
|
|
|
|
Text {
|
|
text: Icons.record
|
|
font.pointSize: Fonts.icon + 6
|
|
color: _actualColor
|
|
}
|
|
|
|
Item {
|
|
id: expander
|
|
|
|
implicitWidth: mouseArea.containsMouse ? ipText.implicitWidth + 10 : 0
|
|
implicitHeight: parent.height
|
|
clip: true
|
|
|
|
Text {
|
|
id: ipText
|
|
|
|
text: RecordService.recordingDisplay
|
|
font.pointSize: Fonts.medium
|
|
font.family: Fonts.primary
|
|
color: fillColor
|
|
anchors.verticalCenter: parent.verticalCenter
|
|
anchors.left: parent.left
|
|
anchors.leftMargin: 5
|
|
}
|
|
|
|
Behavior on implicitWidth {
|
|
NumberAnimation {
|
|
duration: Style.animationFast
|
|
easing.type: Easing.InOutCubic
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
MouseArea {
|
|
id: mouseArea
|
|
|
|
anchors.fill: parent
|
|
cursorShape: Qt.PointingHandCursor
|
|
hoverEnabled: true
|
|
acceptedButtons: Qt.LeftButton | Qt.RightButton | Qt.MiddleButton
|
|
onClicked: (mouse) => {
|
|
if (mouse.button === Qt.LeftButton)
|
|
RecordService.startOrStop();
|
|
|
|
}
|
|
}
|
|
|
|
Behavior on _actualColor {
|
|
ColorAnimation {
|
|
duration: Style.animationFast
|
|
easing.type: Easing.InOutCubic
|
|
}
|
|
|
|
}
|
|
|
|
}
|