mirror of
https://github.com/HifiExperiments/overte.git
synced 2025-08-17 06:20:11 +02:00
First steps - also make letterbox closable only when clicking on gray
This commit is contained in:
parent
08eb07242d
commit
d0b68b8c32
2 changed files with 69 additions and 5 deletions
|
@ -32,14 +32,15 @@ Item {
|
|||
radius: popupRadius
|
||||
}
|
||||
Rectangle {
|
||||
width: Math.max(parent.width * 0.75, 400)
|
||||
id: textContainer;
|
||||
width: Math.max(parent.width * 0.8, 400)
|
||||
height: contentContainer.height + 50
|
||||
anchors.centerIn: parent
|
||||
radius: popupRadius
|
||||
color: "white"
|
||||
Item {
|
||||
id: contentContainer
|
||||
width: parent.width - 60
|
||||
width: parent.width - 50
|
||||
height: childrenRect.height
|
||||
anchors.centerIn: parent
|
||||
Item {
|
||||
|
@ -92,7 +93,7 @@ Item {
|
|||
anchors.top: parent.top
|
||||
anchors.topMargin: -20
|
||||
anchors.right: parent.right
|
||||
anchors.rightMargin: -25
|
||||
anchors.rightMargin: -20
|
||||
MouseArea {
|
||||
anchors.fill: closeGlyphButton
|
||||
hoverEnabled: true
|
||||
|
@ -127,11 +128,51 @@ Item {
|
|||
color: hifi.colors.darkGray
|
||||
wrapMode: Text.WordWrap
|
||||
textFormat: Text.StyledText
|
||||
onLinkActivated: {
|
||||
Qt.openUrlExternally(link)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
// Left gray MouseArea
|
||||
MouseArea {
|
||||
anchors.fill: parent
|
||||
anchors.left: parent.left;
|
||||
anchors.right: textContainer.left;
|
||||
anchors.top: textContainer.top;
|
||||
anchors.bottom: textContainer.bottom;
|
||||
acceptedButtons: Qt.LeftButton
|
||||
onClicked: {
|
||||
letterbox.visible = false
|
||||
}
|
||||
}
|
||||
// Right gray MouseArea
|
||||
MouseArea {
|
||||
anchors.left: textContainer.left;
|
||||
anchors.right: parent.left;
|
||||
anchors.top: textContainer.top;
|
||||
anchors.bottom: textContainer.bottom;
|
||||
acceptedButtons: Qt.LeftButton
|
||||
onClicked: {
|
||||
letterbox.visible = false
|
||||
}
|
||||
}
|
||||
// Top gray MouseArea
|
||||
MouseArea {
|
||||
anchors.left: parent.left;
|
||||
anchors.right: parent.right;
|
||||
anchors.top: parent.top;
|
||||
anchors.bottom: textContainer.top;
|
||||
acceptedButtons: Qt.LeftButton
|
||||
onClicked: {
|
||||
letterbox.visible = false
|
||||
}
|
||||
}
|
||||
// Bottom gray MouseArea
|
||||
MouseArea {
|
||||
anchors.left: parent.left;
|
||||
anchors.right: parent.right;
|
||||
anchors.top: textContainer.bottom;
|
||||
anchors.bottom: parent.bottom;
|
||||
acceptedButtons: Qt.LeftButton
|
||||
onClicked: {
|
||||
letterbox.visible = false
|
||||
|
|
|
@ -25,6 +25,19 @@ Rectangle {
|
|||
id: spectatorCamera;
|
||||
// Style
|
||||
color: hifi.colors.baseGray;
|
||||
|
||||
// The letterbox used for popup messages
|
||||
LetterboxMessage {
|
||||
id: letterboxMessage;
|
||||
z: 999; // Force the popup on top of everything else
|
||||
}
|
||||
function letterbox(headerGlyph, headerText, message) {
|
||||
letterboxMessage.headerGlyph = headerGlyph;
|
||||
letterboxMessage.headerText = headerText;
|
||||
letterboxMessage.text = message;
|
||||
letterboxMessage.visible = true;
|
||||
letterboxMessage.popupRadius = 0;
|
||||
}
|
||||
|
||||
//
|
||||
// TITLE BAR START
|
||||
|
@ -144,7 +157,17 @@ Rectangle {
|
|||
anchors.fill: parent;
|
||||
hoverEnabled: enabled;
|
||||
onClicked: {
|
||||
console.log("FIXME! Add popup pointing to 'Learn More' page");
|
||||
letterbox(hifi.glyphs.question,
|
||||
"Spectator Camera",
|
||||
"By default, your monitor shows a preview of what you're seeing in VR. " +
|
||||
"Using the Spectator Camera app, your monitor can display the view " +
|
||||
"from a virtual hand-held camera - perfect for taking selfies or filming " +
|
||||
"your friends!<br>" +
|
||||
"<h3>Streaming and Recording</h3>" +
|
||||
"We recommend OBS for streaming and recording the contents of your monitor to services like " +
|
||||
"Twitch, YouTube Live, and Facebook Live.<br><br>" +
|
||||
"To get started using OBS, click this link now. The page will open in an external browser:<br>" +
|
||||
'<font size="4"><a href="https://obsproject.com/forum/threads/official-overview-guide.402/">OBS Official Overview Guide</a></font>');
|
||||
}
|
||||
onEntered: parent.color = hifi.colors.blueHighlight;
|
||||
onExited: parent.color = hifi.colors.blueAccent;
|
||||
|
|
Loading…
Reference in a new issue