mirror of https://github.com/cutefishos/statusbar
Add media controller
reionwong
4 years ago
parent
ed6d33e795
commit
931d4fbfe2
@ -1,4 +1,6 @@
|
|||||||
<svg width="16" height="16" enable-background="new" version="1.1" xmlns="http://www.w3.org/2000/svg">
|
<svg width="16" height="16" enable-background="new" version="1.1" xmlns="http://www.w3.org/2000/svg">
|
||||||
<rect x="4" y="3" width="2" height="10" rx="1" ry="1" fill="#FFFFFF" stroke-width="1.8257"/>
|
<g transform="matrix(1.25,0,0,1.25,-2,-2)" fill="#fff" stroke-width="1.8257">
|
||||||
<rect x="10" y="3" width="2" height="10" rx="1" ry="1" fill="#FFFFFF" stroke-width="1.8257"/>
|
<rect x="4" y="3" width="2" height="10" rx="1" ry="1"/>
|
||||||
|
<rect x="10" y="3" width="2" height="10" rx="1" ry="1"/>
|
||||||
|
</g>
|
||||||
</svg>
|
</svg>
|
||||||
|
|||||||
|
Before Width: | Height: | Size: 298 B After Width: | Height: | Size: 311 B |
@ -1,3 +1,3 @@
|
|||||||
<svg width="16" height="16" enable-background="new" version="1.1" xmlns="http://www.w3.org/2000/svg">
|
<svg width="16" height="16" enable-background="new" version="1.1" xmlns="http://www.w3.org/2000/svg">
|
||||||
<path d="m5.8812 3.0087c-0.2513 0.031145-0.45989 0.14032-0.62812 0.32931-0.16823 0.18899-0.25308 0.41133-0.25308 0.66471v7.9948c0 0.25338 0.084865 0.47572 0.25308 0.66471 0.16823 0.18899 0.37685 0.29815 0.62812 0.32931 0.2513 0.03116 0.47935-0.0244 0.68911-0.1677l5.7994-3.9973c0.18484-0.12669 0.31359-0.29945 0.38418-0.5092 0.07063-0.21183 0.07063-0.42139 0-0.63118-0.07063-0.20976-0.19836-0.38045-0.38114-0.5092l-5.8025-4.0005c-0.20907-0.14538-0.4385-0.19955-0.68911-0.1677z" fill="#FFFFFF" stroke-width="1.5611"/>
|
<path d="m4.1288 1.6066c-0.3219 0.039894-0.58908 0.17974-0.80457 0.42182s-0.32418 0.52688-0.32418 0.85144v10.241c0 0.32456 0.10871 0.60936 0.32418 0.85144 0.21549 0.24208 0.48272 0.38191 0.80457 0.42182 0.3219 0.03991 0.61401-0.03125 0.8827-0.21481l7.4286-5.1202c0.23677-0.16228 0.40168-0.38357 0.4921-0.65225 0.09047-0.27134 0.09047-0.53977 0-0.80849-0.090471-0.26869-0.25408-0.48733-0.48821-0.65225l-7.4326-5.1243c-0.2678-0.18622-0.56169-0.25561-0.8827-0.21481z" fill="#fff" stroke-width="1.9996"/>
|
||||||
</svg>
|
</svg>
|
||||||
|
|||||||
|
Before Width: | Height: | Size: 627 B After Width: | Height: | Size: 611 B |
@ -1,4 +1,6 @@
|
|||||||
<svg width="16" height="16" enable-background="new" version="1.1" xmlns="http://www.w3.org/2000/svg">
|
<svg width="16" height="16" enable-background="new" version="1.1" xmlns="http://www.w3.org/2000/svg">
|
||||||
<rect x="4" y="3" width="2" height="10" rx="1" ry="1" fill="#363636" stroke-width="1.8257"/>
|
<g transform="matrix(1.25,0,0,1.25,-2,-2)" fill="#363636" stroke-width="1.8257">
|
||||||
<rect x="10" y="3" width="2" height="10" rx="1" ry="1" fill="#363636" stroke-width="1.8257"/>
|
<rect x="4" y="3" width="2" height="10" rx="1" ry="1"/>
|
||||||
|
<rect x="10" y="3" width="2" height="10" rx="1" ry="1"/>
|
||||||
|
</g>
|
||||||
</svg>
|
</svg>
|
||||||
|
|||||||
|
Before Width: | Height: | Size: 298 B After Width: | Height: | Size: 314 B |
@ -1,3 +1,3 @@
|
|||||||
<svg width="16" height="16" enable-background="new" version="1.1" xmlns="http://www.w3.org/2000/svg">
|
<svg width="16" height="16" enable-background="new" version="1.1" xmlns="http://www.w3.org/2000/svg">
|
||||||
<path d="m5.8812 3.0087c-0.2513 0.031145-0.45989 0.14032-0.62812 0.32931-0.16823 0.18899-0.25308 0.41133-0.25308 0.66471v7.9948c0 0.25338 0.084865 0.47572 0.25308 0.66471 0.16823 0.18899 0.37685 0.29815 0.62812 0.32931 0.2513 0.03116 0.47935-0.0244 0.68911-0.1677l5.7994-3.9973c0.18484-0.12669 0.31359-0.29945 0.38418-0.5092 0.07063-0.21183 0.07063-0.42139 0-0.63118-0.07063-0.20976-0.19836-0.38045-0.38114-0.5092l-5.8025-4.0005c-0.20907-0.14538-0.4385-0.19955-0.68911-0.1677z" fill="#363636" stroke-width="1.5611"/>
|
<path d="m4.1288 1.6066c-0.3219 0.039894-0.58908 0.17974-0.80457 0.42182s-0.32418 0.52688-0.32418 0.85144v10.241c0 0.32456 0.10871 0.60936 0.32418 0.85144 0.21549 0.24208 0.48272 0.38191 0.80457 0.42182 0.3219 0.03991 0.61401-0.03125 0.8827-0.21481l7.4286-5.1202c0.23677-0.16228 0.40168-0.38357 0.4921-0.65225 0.09047-0.27134 0.09047-0.53977 0-0.80849-0.090471-0.26869-0.25408-0.48733-0.48821-0.65225l-7.4326-5.1243c-0.2678-0.18622-0.56169-0.25561-0.8827-0.21481z" fill="#363636" stroke-width="1.9996"/>
|
||||||
</svg>
|
</svg>
|
||||||
|
|||||||
|
Before Width: | Height: | Size: 627 B After Width: | Height: | Size: 614 B |
@ -0,0 +1,4 @@
|
|||||||
|
<svg width="64" height="64" version="1.1" viewBox="0 0 16.933 16.933" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<rect x="1.9073e-7" y="1.9073e-7" width="16.933" height="16.933" fill="#63a2ff" stroke-width=".56331"/>
|
||||||
|
<path d="m10.964 4.2521c-0.07382-0.0015-0.1662 0.011903-0.28202 0.038088l-1.9848 0.40273-1.7632 0.34795c-0.2025 0.043289-0.30291 0.13007-0.34795 0.25891-0.00906 0.025765-0.016032 0.053059-0.020963 0.082169-0.00992 0.058339-0.012244 0.12309-0.010274 0.19472l0.00514 4.4619c-0.00368 0.0784-0.00881 0.14771-0.01969 0.20885-2.19e-5 1.23e-4 2.32e-5 3.07e-4 0 4.39e-4 -0.016362 0.09151-0.046195 0.16437-0.10571 0.21956-0.059597 0.05525-0.14889 0.09305-0.28417 0.1147-0.39898 0.05939-0.69766 0.13877-0.91928 0.23709-0.044324 0.01966-0.085319 0.04003-0.12368 0.0612-0.076716 0.04233-0.14215 0.08744-0.1973 0.13566-0.082714 0.07233-0.14265 0.15149-0.18531 0.23666-0.014227 0.02838-0.026286 0.05711-0.036798 0.08688-0.021147 0.05971-0.035108 0.12184-0.043651 0.18702-0.00857 0.06498-0.011622 0.13258-0.010645 0.20285 0.00293 0.20996 0.068432 0.40438 0.18232 0.56193 0.038034 0.0526 0.081416 0.10103 0.12968 0.14465 0.048081 0.04347 0.10118 0.08212 0.15835 0.11513 0.11454 0.06613 0.24615 0.10987 0.39073 0.12454 0.072287 0.0074 0.14779 0.0075 0.22595-4.39e-4 0.20571-0.02288 0.39181-0.05987 0.55722-0.12368 0.27572-0.10627 0.49401-0.28764 0.65094-0.60473 0.01211-0.02389 0.023227-0.05094 0.033384-0.08089 0.030471-0.08982 0.051998-0.20494 0.065055-0.3351 0.017401-0.17355 0.019727-0.37358 0.00771-0.57475l-0.00514-3.5491c3.953e-4 -0.092979-0.0049-0.17073 0.00514-0.23496 2.31e-5 -1.433e-4 -2.22e-5 -2.847e-4 0-4.378e-4 9.098e-4 -0.00568 0.00318-0.010378 0.00427-0.015837 0.00318-0.015198 0.00624-0.03044 0.011991-0.044079 0.00771-0.01854 0.017622-0.035557 0.031242-0.051358 0.040922-0.047394 0.11234-0.082672 0.23582-0.10828l1.9819-0.39972v-4.379e-4l1.1765-0.23709c0.09568-0.019297 0.16594-0.012406 0.2127 0.026106 0.04665 0.038572 0.07001 0.10881 0.07147 0.21654l0.0052 2.6518c-0.0074 0.15679-0.01864 0.27117-0.07318 0.3535-0.01365 0.020567-0.02997 0.038899-0.04964 0.055637-0.03925 0.033413-0.09207 0.059925-0.16262 0.080023-1.43e-4 3.97e-5 -2.86e-4 -4.05e-5 -4.39e-4 0-0.03529 0.010027-0.07531 0.018486-0.12026 0.025683-0.15959 0.023756-0.30322 0.051277-0.43226 0.082167-0.19337 0.046295-0.3543 0.10051-0.48745 0.16177-0.088834 0.040881-0.16577 0.084744-0.23153 0.13181-0.065754 0.04708-0.12036 0.09734-0.16605 0.15022-0.15996 0.18506-0.20626 0.40456-0.20285 0.65052 0.00477 0.34993 0.18661 0.64515 0.47504 0.80202 0.11538 0.06274 0.24792 0.10332 0.39288 0.11642 0.07248 0.0065 0.14821 0.0063 0.22639-0.0017 0.2057-0.02289 0.38959-0.05708 0.55251-0.11769 0.10861-0.04038 0.20784-0.09263 0.29787-0.16091 0.13504-0.10246 0.24947-0.24114 0.34367-0.4314 0.01211-0.02378 0.02302-0.05071 0.03252-0.08002 4e-5 -1.23e-4 -3.8e-5 -3.09e-4 0-4.38e-4 0.06667-0.20634 0.07376-0.54186 0.08089-0.89998l-0.0034-5.4291c-3e-5 -0.065761-0.0038-0.12123-0.0098-0.17161-0.0024-0.02085-0.0055-0.042039-0.0094-0.060343-0.0018-0.0089-0.0034-0.018228-0.0055-0.026535-0.0076-0.028769-0.01684-0.055197-0.02911-0.077033-0.01211-0.021691-0.02786-0.03881-0.04536-0.053922-0.0055-0.00476-0.01187-0.00872-0.01797-0.012835-0.01401-0.00949-0.0298-0.01735-0.04708-0.023538-0.0072-0.00258-0.01404-0.00568-0.02183-0.0077-0.02606-0.00676-0.0544-0.011325-0.08774-0.011977z" fill="#fff" opacity=".9" stroke-width=".82818"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 3.3 KiB |
@ -0,0 +1,193 @@
|
|||||||
|
/*
|
||||||
|
* Copyright (C) 2021 CutefishOS Team.
|
||||||
|
*
|
||||||
|
* Author: Reion Wong <aj@cutefishos.com>
|
||||||
|
*
|
||||||
|
* 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 3 of the License, or
|
||||||
|
* 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.12
|
||||||
|
import QtQuick.Layouts 1.12
|
||||||
|
import QtQuick.Controls 2.12
|
||||||
|
import QtGraphicalEffects 1.0
|
||||||
|
import FishUI 1.0 as FishUI
|
||||||
|
import Cutefish.Mpris 1.0
|
||||||
|
|
||||||
|
Item {
|
||||||
|
id: control
|
||||||
|
|
||||||
|
property bool available: mprisManager.availableServices.length > 0
|
||||||
|
property bool isPlaying: currentService && mprisManager.playbackStatus === Mpris.Playing
|
||||||
|
property alias currentService: mprisManager.currentService
|
||||||
|
property var artUrlTag: Mpris.metadataToString(Mpris.ArtUrl)
|
||||||
|
property var titleTag: Mpris.metadataToString(Mpris.Title)
|
||||||
|
property var artistTag: Mpris.metadataToString(Mpris.Artist)
|
||||||
|
|
||||||
|
MprisManager {
|
||||||
|
id: mprisManager
|
||||||
|
|
||||||
|
onCurrentServiceChanged: {
|
||||||
|
control.updateInfo()
|
||||||
|
}
|
||||||
|
|
||||||
|
onMetadataChanged: {
|
||||||
|
control.updateInfo()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
Component.onCompleted: { control.updateInfo() }
|
||||||
|
|
||||||
|
function updateInfo() {
|
||||||
|
var titleAvailable = (titleTag in mprisManager.metadata) ? mprisManager.metadata[titleTag].toString() !== "" : false
|
||||||
|
var artistAvailable = (artistTag in mprisManager.metadata) ? mprisManager.metadata[artistTag].toString() !== "" : false
|
||||||
|
|
||||||
|
control.visible = titleAvailable || artistAvailable
|
||||||
|
_songLabel.text = titleAvailable ? mprisManager.metadata[titleTag].toString() : ""
|
||||||
|
_artistLabel.text = artistAvailable ? mprisManager.metadata[artistTag].toString() : ""
|
||||||
|
artImage.source = (artUrlTag in mprisManager.metadata) ? mprisManager.metadata[artUrlTag].toString() : ""
|
||||||
|
}
|
||||||
|
|
||||||
|
Rectangle {
|
||||||
|
anchors.fill: parent
|
||||||
|
radius: FishUI.Theme.bigRadius
|
||||||
|
color: FishUI.Theme.darkMode ? Qt.rgba(255, 255, 255, 0.4)
|
||||||
|
: Qt.rgba(0, 0, 0, 0.1)
|
||||||
|
opacity: FishUI.Theme.darkMode ? 0.3 : 0.5
|
||||||
|
}
|
||||||
|
|
||||||
|
RowLayout {
|
||||||
|
id: _mainLayout
|
||||||
|
anchors.fill: parent
|
||||||
|
anchors.margins: FishUI.Units.largeSpacing
|
||||||
|
spacing: FishUI.Units.largeSpacing
|
||||||
|
|
||||||
|
Image {
|
||||||
|
id: defaultImage
|
||||||
|
width: _mainLayout.height
|
||||||
|
height: width
|
||||||
|
source: "qrc:/images/media-cover.svg"
|
||||||
|
sourceSize: Qt.size(width, height)
|
||||||
|
visible: !artImage.visible
|
||||||
|
|
||||||
|
layer.enabled: true
|
||||||
|
layer.effect: OpacityMask {
|
||||||
|
maskSource: Item {
|
||||||
|
width: defaultImage.width
|
||||||
|
height: defaultImage.height
|
||||||
|
|
||||||
|
Rectangle {
|
||||||
|
anchors.fill: parent
|
||||||
|
radius: FishUI.Theme.bigRadius
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
Image {
|
||||||
|
id: artImage
|
||||||
|
Layout.preferredHeight: _mainLayout.height
|
||||||
|
Layout.preferredWidth: _mainLayout.height
|
||||||
|
visible: status === Image.Ready
|
||||||
|
// sourceSize: Qt.size(width, height)
|
||||||
|
fillMode: Image.PreserveAspectFit
|
||||||
|
|
||||||
|
layer.enabled: true
|
||||||
|
layer.effect: OpacityMask {
|
||||||
|
maskSource: Item {
|
||||||
|
width: artImage.width
|
||||||
|
height: artImage.height
|
||||||
|
|
||||||
|
Rectangle {
|
||||||
|
anchors.fill: parent
|
||||||
|
radius: FishUI.Theme.bigRadius
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
Item {
|
||||||
|
Layout.fillHeight: true
|
||||||
|
Layout.fillWidth: true
|
||||||
|
|
||||||
|
ColumnLayout {
|
||||||
|
anchors.fill: parent
|
||||||
|
|
||||||
|
Item {
|
||||||
|
Layout.fillHeight: true
|
||||||
|
}
|
||||||
|
|
||||||
|
Label {
|
||||||
|
id: _songLabel
|
||||||
|
Layout.fillWidth: true
|
||||||
|
visible: _songLabel.text !== ""
|
||||||
|
elide: Text.ElideRight
|
||||||
|
}
|
||||||
|
|
||||||
|
Label {
|
||||||
|
id: _artistLabel
|
||||||
|
Layout.fillWidth: true
|
||||||
|
visible: _artistLabel.text !== ""
|
||||||
|
elide: Text.ElideRight
|
||||||
|
}
|
||||||
|
|
||||||
|
Item {
|
||||||
|
Layout.fillHeight: true
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
Item {
|
||||||
|
id: _buttons
|
||||||
|
Layout.fillHeight: true
|
||||||
|
Layout.preferredWidth: _buttonsLayout.implicitWidth
|
||||||
|
|
||||||
|
RowLayout {
|
||||||
|
id: _buttonsLayout
|
||||||
|
anchors.fill: parent
|
||||||
|
spacing: FishUI.Units.smallSpacing
|
||||||
|
|
||||||
|
IconButton {
|
||||||
|
width: 30
|
||||||
|
height: 30
|
||||||
|
source: "qrc:/images/" + (FishUI.Theme.darkMode ? "dark" : "light") + "/media-skip-backward-symbolic.svg"
|
||||||
|
onLeftButtonClicked: if (mprisManager.canGoPrevious) mprisManager.previous()
|
||||||
|
visible: mprisManager.canGoPrevious
|
||||||
|
Layout.alignment: Qt.AlignRight
|
||||||
|
}
|
||||||
|
|
||||||
|
IconButton {
|
||||||
|
width: 30
|
||||||
|
height: 30
|
||||||
|
source: control.isPlaying ? "qrc:/images/" + (FishUI.Theme.darkMode ? "dark" : "light") + "/media-playback-pause-symbolic.svg"
|
||||||
|
: "qrc:/images/" + (FishUI.Theme.darkMode ? "dark" : "light") + "/media-playback-start-symbolic.svg"
|
||||||
|
Layout.alignment: Qt.AlignRight
|
||||||
|
visible: mprisManager.canPause || mprisManager.canPlay
|
||||||
|
onLeftButtonClicked:
|
||||||
|
if ((control.isPlaying && mprisManager.canPause) || (!control.isPlaying && mprisManager.canPlay)) {
|
||||||
|
mprisManager.playPause()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
IconButton {
|
||||||
|
width: 30
|
||||||
|
height: 30
|
||||||
|
source: "qrc:/images/" + (FishUI.Theme.darkMode ? "dark" : "light") + "/media-skip-forward-symbolic.svg"
|
||||||
|
Layout.alignment: Qt.AlignRight
|
||||||
|
visible: mprisManager.canGoNext
|
||||||
|
onLeftButtonClicked: if (mprisManager.canGoNext) mprisManager.next()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
Loading…
Reference in New Issue