mirror of
https://thingvellir.net/git/overte
synced 2025-03-27 23:52:03 +01:00
Removed ColorOverlay from TabletButton, added more icon & text states
Now uses separate images for each state. Now tabletButtonProxy has 4 state properties, one for icon and images. * icon * hoverIcon * activeIcon * activeHoverIcon * text * hoverText * activeText * activeHoverText Updated scripts to set new button states, if necessary.
This commit is contained in:
parent
adc50dd30f
commit
1c783031b1
9 changed files with 44 additions and 32 deletions
|
@ -4,10 +4,14 @@ import QtGraphicalEffects 1.0
|
|||
Item {
|
||||
id: tabletButton
|
||||
property var uuid;
|
||||
property string text: "EDIT"
|
||||
property string icon: "icons/edit-icon.svg"
|
||||
property string activeText: tabletButton.text
|
||||
property string icon: "icons/tablet-icons/edit-i.svg"
|
||||
property string hoverIcon: tabletButton.icon
|
||||
property string activeIcon: tabletButton.icon
|
||||
property string activeHoverIcon: tabletButton.activeIcon
|
||||
property string text: "EDIT"
|
||||
property string hoverText: tabletButton.text
|
||||
property string activeText: tabletButton.text
|
||||
property string activeHoverText: tabletButton.activeText
|
||||
property bool isActive: false
|
||||
property bool inDebugMode: false
|
||||
property bool isEntered: false
|
||||
|
@ -25,9 +29,9 @@ Item {
|
|||
|
||||
onIsActiveChanged: {
|
||||
if (tabletButton.isEntered) {
|
||||
tabletButton.state = (tabletButton.isActive) ? "hover active state" : "hover sate";
|
||||
tabletButton.state = (tabletButton.isActive) ? "hover active state" : "hover state";
|
||||
} else {
|
||||
tabletButton.state = (tabletButton.isActive) ? "active state" : "base sate";
|
||||
tabletButton.state = (tabletButton.isActive) ? "active state" : "base state";
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -89,7 +93,6 @@ Item {
|
|||
id: icon
|
||||
width: 50
|
||||
height: 50
|
||||
visible: false
|
||||
anchors.bottom: text.top
|
||||
anchors.bottomMargin: 5
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
|
@ -97,13 +100,6 @@ Item {
|
|||
source: tabletButton.urlHelper(tabletButton.icon)
|
||||
}
|
||||
|
||||
ColorOverlay {
|
||||
id: iconColorOverlay
|
||||
anchors.fill: icon
|
||||
source: icon
|
||||
color: "#ffffff"
|
||||
}
|
||||
|
||||
Text {
|
||||
id: text
|
||||
color: "#ffffff"
|
||||
|
@ -166,6 +162,17 @@ Item {
|
|||
target: glow
|
||||
visible: true
|
||||
}
|
||||
|
||||
PropertyChanges {
|
||||
target: text
|
||||
color: "#ffffff"
|
||||
text: tabletButton.hoverText
|
||||
}
|
||||
|
||||
PropertyChanges {
|
||||
target: icon
|
||||
source: tabletButton.urlHelper(tabletButton.hoverIcon)
|
||||
}
|
||||
},
|
||||
State {
|
||||
name: "active state"
|
||||
|
@ -188,11 +195,6 @@ Item {
|
|||
text: tabletButton.activeText
|
||||
}
|
||||
|
||||
PropertyChanges {
|
||||
target: iconColorOverlay
|
||||
color: "#333333"
|
||||
}
|
||||
|
||||
PropertyChanges {
|
||||
target: icon
|
||||
source: tabletButton.urlHelper(tabletButton.activeIcon)
|
||||
|
@ -221,13 +223,13 @@ Item {
|
|||
PropertyChanges {
|
||||
target: text
|
||||
color: "#333333"
|
||||
text: tabletButton.activeHoverText
|
||||
}
|
||||
|
||||
PropertyChanges {
|
||||
target: iconColorOverlay
|
||||
color: "#333333"
|
||||
target: icon
|
||||
source: tabletButton.urlHelper(tabletButton.activeHoverIcon)
|
||||
}
|
||||
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
|
@ -227,10 +227,14 @@ protected:
|
|||
|
||||
/**jsdoc
|
||||
* @typedef TabletButtonProxy.ButtonProperties
|
||||
* @property {string} text - button caption
|
||||
* @property {string} icon - url to button icon. (50 x 50)
|
||||
* @property {string} activeText - button caption when button is active
|
||||
* @property {string} hoverIcon - url to button icon, displayed during mouse hover. (50 x 50)
|
||||
* @property {string} activeHoverIcon - url to button icon used when button is active, and during mouse hover. (50 x 50)
|
||||
* @property {string} activeIcon - url to button icon used when button is active. (50 x 50)
|
||||
* @property {string} text - button caption
|
||||
* @property {string} hoverText - button caption when button is not-active but during mouse hover.
|
||||
* @property {string} activeText - button caption when button is active
|
||||
* @property {string} activeHoverText - button caption when button is active and during mouse hover.
|
||||
* @property {string} isActive - true when button is active.
|
||||
* @property {number} sortOrder - determines sort order on tablet. lower numbers will appear before larger numbers. default is 100
|
||||
*/
|
||||
|
|
|
@ -177,6 +177,7 @@
|
|||
var tablet = Tablet.getTablet("com.highfidelity.interface.tablet.system");
|
||||
button = tablet.addButton({
|
||||
icon: "icons/tablet-icons/bubble-i.svg",
|
||||
activeIcon: "icons/tablet-icons/bubble-a.svg",
|
||||
text: buttonName,
|
||||
sortOrder: 4
|
||||
});
|
||||
|
|
|
@ -253,6 +253,7 @@ var toolBar = (function () {
|
|||
tablet = Tablet.getTablet("com.highfidelity.interface.tablet.system");
|
||||
activeButton = tablet.addButton({
|
||||
icon: "icons/tablet-icons/edit-i.svg",
|
||||
activeIcon: "icons/tablet-icons/edit-a.svg",
|
||||
text: "EDIT",
|
||||
sortOrder: 10
|
||||
});
|
||||
|
|
|
@ -39,6 +39,7 @@ if (Settings.getValue("HUDUIEnabled")) {
|
|||
tablet = Tablet.getTablet("com.highfidelity.interface.tablet.system");
|
||||
button = tablet.addButton({
|
||||
icon: "icons/tablet-icons/goto-i.svg",
|
||||
activeIcon: "icons/tablet-icons/goto-a.svg",
|
||||
text: buttonName,
|
||||
sortOrder: 8
|
||||
});
|
||||
|
|
|
@ -30,6 +30,7 @@
|
|||
tablet = Tablet.getTablet("com.highfidelity.interface.tablet.system");
|
||||
button = tablet.addButton({
|
||||
icon: "icons/tablet-icons/help-i.svg",
|
||||
activeIcon: "icons/tablet-icons/help-a.svg",
|
||||
text: buttonName,
|
||||
sortOrder: 6
|
||||
});
|
||||
|
|
|
@ -53,14 +53,13 @@ function onHmdChanged(isHmd) {
|
|||
//TODO change button icon when the hmd changes
|
||||
if (isHmd) {
|
||||
button.editProperties({
|
||||
icon: "icons/tablet-icons/switch-a.svg",
|
||||
icon: "icons/tablet-icons/switch-desk-i.svg",
|
||||
text: "DESKTOP"
|
||||
});
|
||||
} else {
|
||||
button.editProperties({
|
||||
icon: "icons/tablet-icons/switch-i.svg",
|
||||
text: "VR",
|
||||
sortOrder: 2
|
||||
icon: "icons/tablet-icons/switch-vr-i.svg",
|
||||
text: "VR"
|
||||
});
|
||||
}
|
||||
desktopOnlyViews.forEach(function (view) {
|
||||
|
@ -82,8 +81,8 @@ if (headset) {
|
|||
});
|
||||
} else {
|
||||
button = tablet.addButton({
|
||||
icon: "icons/tablet-icons/switch-a.svg",
|
||||
text: "SWITCH",
|
||||
icon: HMD.active ? "icons/tablet-icons/switch-desk-i.svg" : "icons/tablet-icons/switch-vr-i.svg",
|
||||
text: HMD.active ? "DESKTOP" : "VR",
|
||||
sortOrder: 2
|
||||
});
|
||||
}
|
||||
|
|
|
@ -37,9 +37,11 @@ if (Settings.getValue("HUDUIEnabled")) {
|
|||
} else {
|
||||
tablet = Tablet.getTablet("com.highfidelity.interface.tablet.system");
|
||||
button = tablet.addButton({
|
||||
icon: "icons/tablet-icons/mic-a.svg",
|
||||
text: buttonName,
|
||||
activeIcon: "icons/tablet-icons/mic-i.svg",
|
||||
icon: "icons/tablet-icons/mic-unmute-i.svg",
|
||||
hoverIcon: "icons/tablet-icons/mic-mute-i.svg",
|
||||
activeIcon: "icons/tablet-icons/mic-mute-a.svg",
|
||||
activeHoverIcon: "icons/tablet-icons/mic-unmute-a.svg",
|
||||
text: "MUTE",
|
||||
activeText: "UNMUTE",
|
||||
sortOrder: 1
|
||||
});
|
||||
|
|
|
@ -42,6 +42,7 @@
|
|||
tablet = Tablet.getTablet("com.highfidelity.interface.tablet.system");
|
||||
button = tablet.addButton({
|
||||
icon: "icons/tablet-icons/goto-i.svg",
|
||||
activeIcon: "icons/tablet-icons/goto-a.svg",
|
||||
text: buttonName,
|
||||
sortOrder: 8
|
||||
});
|
||||
|
|
Loading…
Reference in a new issue