Mirrors/overte
3
0
Fork 0
mirror of https://github.com/overte-org/overte.git synced 2025-04-20 03:44:02 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

Style HMD menu items

Browse source
This commit is contained in:
David Rowe 2016-03-11 15:24:35 +13:00
parent 2b45971f8c
commit fb0f97264c
3 changed files with 48 additions and 26 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

55
interface/resources/qml/menus/VrMenuItem.qml
View file

@ -12,8 +12,8 @@ import QtQuick 2.5
import QtQuick.Controls 1.4
import QtQuick.Controls.Styles 1.4
import "../controls"
import "../styles"
import "../controls-uit"
import "../styles-uit"
Item {
id: root
@ -21,24 +21,28 @@ Item {
property alias text: label.text
property var source
implicitHeight: source.visible ? label.implicitHeight * 1.5 : 0
implicitWidth: label.width + label.height * 2.5
implicitHeight: source.visible ? 2 * label.implicitHeight : 0
implicitWidth: 2 * hifi.dimensions.menuPadding.x + check.width + label.width + tail.width
visible: source.visible
width: parent.width
FontAwesome {
clip: true
id: check
verticalAlignment: Text.AlignVCenter
horizontalAlignment: Text.AlignHCenter
anchors.verticalCenter: parent.verticalCenter
verticalAlignment: Text.AlignVCenter
anchors {
verticalCenter: parent.verticalCenter
left: parent.left
leftMargin: hifi.dimensions.menuPadding.x
}
width: 1.5 * hifi.dimensions.menuPadding.x
color: label.color
text: checkText()
size: label.height
visible: source.visible
font.pixelSize: size
function checkText() {
if (!source || source.type != 1 || !source.checkable) {
if (!source || source.type !== 1 || !source.checkable) {
return ""
}
// FIXME this works for native QML menus but I don't think it will
@ -50,25 +54,36 @@ Item {
}
}
Text {
RalewaySemiBold {
id: label
size: hifi.fontSizes.rootMenu
font.capitalization: Font.AllUppercase
anchors.left: check.right
anchors.leftMargin: 4
anchors.verticalCenter: parent.verticalCenter
verticalAlignment: Text.AlignVCenter
color: source.enabled ? hifi.colors.text : hifi.colors.disabledText
color: source.enabled ? hifi.colors.baseGrayShadow : hifi.colors.baseGrayShadow50
enabled: source.visible && (source.type !== 0 ? source.enabled : false)
visible: source.visible
}
FontAwesome {
id: tag
x: root.parent.width - width
size: label.height
width: implicitWidth
visible: source.visible && (source.type == 2)
text: "\uF0DA"
anchors.verticalCenter: parent.verticalCenter
color: label.color
Item {
// Space for shortcut key or disclosure icon.
id: tail
width: 4 * hifi.dimensions.menuPadding.x
anchors {
verticalCenter: parent.verticalCenter
right: parent.right
rightMargin: hifi.dimensions.menuPadding.x
}
HiFiGlyphs {
text: hifi.glyphs.disclosureExpand
color: source.enabled ? hifi.colors.baseGrayShadow : hifi.colors.baseGrayShadow25
size: 2 * hifi.fontSizes.rootMenuDisclosure
anchors.verticalCenter: parent.verticalCenter
anchors.right: parent.right
horizontalAlignment: Text.AlignRight
visible: source.visible && (source.type === 2)
}
}
}

14
interface/resources/qml/menus/VrMenuView.qml
View file

@ -40,16 +40,20 @@ FocusScope {
x: 8; y: 8
width: 128
height: count * 32
topMargin: hifi.dimensions.menuPadding
topMargin: hifi.dimensions.menuPadding.y
onEnabledChanged: recalcSize();
onVisibleChanged: recalcSize();
onCountChanged: recalcSize();
focus: true
highlight: Rectangle {
width: listView.currentItem ? listView.currentItem.width : 0
height: listView.currentItem ? listView.currentItem.height : 0
color: "lightsteelblue"; radius: 3
anchors {
left: parent ? parent.left : undefined
right: parent ? parent.right : undefined
leftMargin: hifi.dimensions.borderWidth
rightMargin: hifi.dimensions.borderWidth
}
color: hifi.colors.white
}
delegate: VrMenuItem {
@ -86,7 +90,7 @@ FocusScope {
newHeight += currentItem.implicitHeight
}
}
newHeight += 2 * hifi.dimensions.menuPadding; // White space at top and bottom.
newHeight += 2 * hifi.dimensions.menuPadding.y; // White space at top and bottom.
if (maxWidth > width) {
width = maxWidth;
}

5
interface/resources/qml/styles-uit/HifiConstants.qml
View file

@ -67,6 +67,8 @@ Item {
readonly property color darkGray30: "#4d121212"
readonly property color darkGray0: "#00121212"
readonly property color baseGrayShadow60: "#99252525"
readonly property color baseGrayShadow50: "#80252525"
readonly property color baseGrayShadow25: "#40252525"
readonly property color baseGrayHighlight40: "#66575757"
readonly property color baseGrayHighlight15: "#26575757"
readonly property color lightGrayText80: "#ccafafaf"
@ -136,7 +138,7 @@ Item {
readonly property real modalDialogTitleHeight: 40
readonly property real controlLineHeight: 29 // Height of spinbox control on 1920 x 1080 monitor
readonly property real controlInterlineHeight: 22 // 75% of controlLineHeight
readonly property real menuPadding: 12
readonly property vector2d menuPadding: Qt.vector2d(12, 12)
}
Item {
@ -154,6 +156,7 @@ Item {
readonly property real logs: dimensions.largeScreen ? 16 : 12
readonly property real code: dimensions.largeScreen ? 16 : 12
readonly property real rootMenu: dimensions.largeScreen ? 15 : 11
readonly property real rootMenuDisclosure: dimensions.largeScreen ? 20 : 16
readonly property real menuItem: dimensions.largeScreen ? 15 : 11
readonly property real shortcutText: dimensions.largeScreen ? 13 : 9
readonly property real carat: dimensions.largeScreen ? 38 : 30