Allow changing the tile overlay icon color in the style
This commit is contained in:
parent
eea91a2d7f
commit
39f2c9373b
@ -4,6 +4,9 @@ Item {
|
||||
property color backgroundColor: "#fafafa"
|
||||
property color foregroundColor: "#202020"
|
||||
|
||||
property color accentColor: "#ff57baae"
|
||||
property color iconColor: "#808080"
|
||||
|
||||
property color headerBackgroundColor: "#ffffff"
|
||||
property color headerForegroundColor: "#202020"
|
||||
|
||||
@ -11,11 +14,9 @@ Item {
|
||||
property color tileForegroundColor: foregroundColor
|
||||
property color tileOverlayColor: Qt.tint(backgroundColor, Qt.rgba(foregroundColor.r, foregroundColor.g, foregroundColor.b, 0.1))
|
||||
property color tileOverlayForegroundColor: foregroundColor
|
||||
property color tileOverlayIconColor: iconColor
|
||||
property int tileRadius: 6
|
||||
|
||||
property color accentColor: "#ff57baae"
|
||||
|
||||
property color iconColor: "#808080"
|
||||
|
||||
// Note: Font files need to be provided in a "fonts" folder in the style
|
||||
property string fontFamily: "Ubuntu"
|
||||
|
||||
@ -40,12 +40,15 @@ RowLayout {
|
||||
|
||||
property Thing thing: null
|
||||
|
||||
property color iconColor: Style.iconColor
|
||||
|
||||
property bool showExtendedControls: false
|
||||
|
||||
readonly property State playbackState: thing.stateByName("playbackStatus")
|
||||
readonly property State shuffleState: thing.stateByName("shuffle")
|
||||
readonly property State repeatState: thing.stateByName("repeat")
|
||||
|
||||
|
||||
function executeAction(actionName, params) {
|
||||
if (params === undefined) {
|
||||
params = []
|
||||
@ -62,6 +65,7 @@ RowLayout {
|
||||
enabled: root.shuffleState !== null
|
||||
opacity: enabled ? 1 : .5
|
||||
visible: root.showExtendedControls
|
||||
color: root.shuffleState.value === false ? root.iconColor : Style.accentColor
|
||||
onClicked: {
|
||||
var params = []
|
||||
var param = {}
|
||||
@ -81,6 +85,7 @@ RowLayout {
|
||||
longpressEnabled: root.thing.thingClass.actionTypes.findByName("fastRewind") !== null
|
||||
enabled: root.playbackState && root.playbackState.value !== "Stopped"
|
||||
opacity: enabled ? 1 : .5
|
||||
color: root.iconColor
|
||||
|
||||
repeat: true
|
||||
onClicked: {
|
||||
@ -97,6 +102,7 @@ RowLayout {
|
||||
imageSource: root.playbackState && root.playbackState.value === "Playing" ? "../images/media-playback-pause.svg" : "../images/media-playback-start.svg"
|
||||
longpressImageSource: "../images/media-playback-stop.svg"
|
||||
longpressEnabled: root.playbackState && root.playbackState.value !== "Stopped"
|
||||
color: root.iconColor
|
||||
|
||||
onClicked: {
|
||||
if (root.playbackState.value === "Playing") {
|
||||
@ -120,6 +126,7 @@ RowLayout {
|
||||
enabled: root.playbackState && root.playbackState.value !== "Stopped"
|
||||
opacity: enabled ? 1 : .5
|
||||
repeat: true
|
||||
color: root.iconColor
|
||||
onClicked: {
|
||||
root.executeAction("skipNext")
|
||||
}
|
||||
@ -133,7 +140,7 @@ RowLayout {
|
||||
Layout.preferredHeight: app.iconSize
|
||||
Layout.preferredWidth: height
|
||||
imageSource: root.repeatState.value === "One" ? "../images/media-playlist-repeat-one.svg" : "../images/media-playlist-repeat.svg"
|
||||
color: root.repeatState.value === "None" ? Style.iconColor : Style.accentColor
|
||||
color: root.repeatState.value === "None" ? root.iconColor : Style.accentColor
|
||||
longpressEnabled: false
|
||||
enabled: root.repeatState !== null
|
||||
opacity: enabled ? 1 : .5
|
||||
|
||||
@ -255,6 +255,7 @@ MainPageTile {
|
||||
|
||||
MediaControls {
|
||||
thing: inlineMediaControl.currentDevice
|
||||
iconColor: Style.tileOverlayIconColor
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -308,6 +309,7 @@ MainPageTile {
|
||||
ProgressButton {
|
||||
longpressEnabled: false
|
||||
visible: imageSource.length > 0
|
||||
color: Style.tileOverlayIconColor
|
||||
imageSource: {
|
||||
switch (iface.name) {
|
||||
case "media":
|
||||
@ -382,6 +384,7 @@ MainPageTile {
|
||||
ProgressButton {
|
||||
longpressEnabled: false
|
||||
visible: imageSource.length > 0
|
||||
color: Style.tileOverlayIconColor
|
||||
imageSource: {
|
||||
switch (iface.name) {
|
||||
case "media":
|
||||
@ -454,6 +457,7 @@ MainPageTile {
|
||||
|
||||
ProgressButton {
|
||||
longpressEnabled: false
|
||||
color: Style.tileOverlayIconColor
|
||||
imageSource: {
|
||||
switch (iface.name) {
|
||||
case "media":
|
||||
|
||||
Reference in New Issue
Block a user