diff --git a/scripts/simplifiedUI/ui/simplifiedFTUE/InitialLaunchWindow.qml b/scripts/simplifiedUI/ui/simplifiedFTUE/InitialLaunchWindow.qml
index 3844459a98..a136152534 100644
--- a/scripts/simplifiedUI/ui/simplifiedFTUE/InitialLaunchWindow.qml
+++ b/scripts/simplifiedUI/ui/simplifiedFTUE/InitialLaunchWindow.qml
@@ -20,6 +20,7 @@ Rectangle {
id: root
color: simplifiedUI.colors.white
anchors.fill: parent
+ property bool landscapeOrientation: root.width > root.height
SimplifiedConstants.SimplifiedConstants {
id: simplifiedUI
@@ -56,55 +57,59 @@ Rectangle {
id: tempAvatarPageContainer
visible: true
- SimplifiedControls.VerticalScrollBar {
- parent: tempAvatarPageContainer
- }
-
GridLayout {
id: tempAvatarPageGrid
anchors.fill: parent
- anchors.leftMargin: 180
+ anchors.leftMargin: 50
anchors.topMargin: 50
anchors.rightMargin: 100
- columns: root.width > root.height ? 2 : 1
- rows: root.width > root.height ? 1 : 2
- flow: root.width > root.height ? GridLayout.LeftToRight : GridLayout.TopToBottom
+ columns: landscapeOrientation ? 2 : 1
+ rows: landscapeOrientation ? 1 : 2
+
+ Item {
+ id: tempAvatarImageContainer
+ Layout.preferredWidth: tempAvatarImage.width
+ Layout.preferredHeight: tempAvatarImage.height
+
+ Image {
+ id: tempAvatarImage
+ width: landscapeOrientation ? 428 : 320
+ height: landscapeOrientation ? 800 : 598
+ source: resourceDirectoryUrl + "qml/hifi/simplifiedUI/avatarApp/images/" +
+ MyAvatar.skeletonModelURL.substring(MyAvatar.skeletonModelURL.indexOf("simplifiedAvatar"), MyAvatar.skeletonModelURL.lastIndexOf("/")) + ".png"
+ }
+ }
Item {
id: textAndQRContainer
- Layout.preferredWidth: 550
- Layout.preferredHeight: 670
- Layout.minimumWidth: 200
- Layout.maximumWidth: 800
- Layout.topMargin: 130
+ Layout.preferredWidth: 680
+ Layout.preferredHeight: childrenRect.height
+ Layout.topMargin: landscapeOrientation ? 130 : 0
HifiStylesUit.RalewayBold {
id: headerText
text: "We know this isn't you..."
- color: simplifiedUI.colors.text.darkGray
+ color: simplifiedUI.colors.text.black
size: 48
wrapMode: Text.WordWrap
anchors.left: parent.left
- height: 60
- width: 550
+ anchors.right: parent.right
}
HifiStylesUit.RalewayRegular {
id: descriptionText
anchors.top: headerText.bottom
- anchors.topMargin: 30
+ anchors.topMargin: 10
text: "but, we've given you this temporary avatar to use
for today. If you see this avatar in-world, walk up and
say hello to other new users!
We want you to be you so we've built an Avatar Creator
App that's as easy as taking a selfie and picking your
outfits! Available now on iOS and Android Platforms."
- color: simplifiedUI.colors.text.darkGray
+ color: simplifiedUI.colors.text.black
size: 22
anchors.left: parent.left
anchors.right: parent.right
- height: 180
- width: 550
wrapMode: Text.WordWrap
}
@@ -112,7 +117,8 @@ Rectangle {
id: qrAndInstructionsContainer
anchors.top: descriptionText.bottom
height: avatarAppQRCodeImage.height
- width: parent.width
+ anchors.left: parent.left
+ anchors.right: parent.right
anchors.topMargin: 50
Image {
@@ -130,7 +136,7 @@ Rectangle {
anchors.right: parent.right
anchors.leftMargin: 30
text: "Use your mobile phone to scan this QR code."
- color: simplifiedUI.colors.text.darkGray
+ color: simplifiedUI.colors.text.black
size: 22
wrapMode: Text.WordWrap
}
@@ -141,7 +147,7 @@ Rectangle {
anchors.topMargin: 50
anchors.left: parent.left
anchors.right: parent.right
- horizontalAlignment: Text.AlignRight
+ horizontalAlignment: Text.AlignLeft
text: "Continue >"
color: simplifiedUI.colors.text.lightBlue
opacity: continueMouseArea.containsMouse ? 1.0 : 0.7
@@ -162,22 +168,10 @@ Rectangle {
}
}
}
+ }
- Item {
- id: tempAvatarImageContainer
- Layout.leftMargin: 30
- Layout.preferredWidth: tempAvatarImage.width
- Layout.preferredHeight: tempAvatarImage.height
-
- Image {
- id: tempAvatarImage
- width: root.width > root.height ? 428 : 320
- height: root.width > root.height ? 800 : 598
- source: resourceDirectoryUrl + "qml/hifi/simplifiedUI/avatarApp/images/" +
- MyAvatar.skeletonModelURL.substring(MyAvatar.skeletonModelURL.indexOf("simplifiedAvatar"), MyAvatar.skeletonModelURL.lastIndexOf("/")) + ".png"
- }
- // TODO move this to be above the rest of the grid layout stuff in landscape mode
- }
+ SimplifiedControls.VerticalScrollBar {
+ parent: tempAvatarPageContainer
}
}
@@ -200,7 +194,7 @@ Rectangle {
horizontalAlignment: Text.AlignHCenter
height: 100
width: 850
- color: simplifiedUI.colors.darkGray
+ color: simplifiedUI.colors.text.black
size: 36
wrapMode: Text.WordWrap
}
@@ -211,9 +205,10 @@ Rectangle {
anchors.topMargin: 60
anchors.bottomMargin: 80
anchors.horizontalCenter: parent.horizontalCenter
- columns: 2
columnSpacing: 50
rowSpacing: 40
+ columns: 2
+ rows: 2
Image {
Layout.preferredWidth: 360
diff --git a/scripts/simplifiedUI/ui/simplifiedFTUE/SecondLaunchWindow.qml b/scripts/simplifiedUI/ui/simplifiedFTUE/SecondLaunchWindow.qml
index 702bfaa92a..0e87363ba9 100644
--- a/scripts/simplifiedUI/ui/simplifiedFTUE/SecondLaunchWindow.qml
+++ b/scripts/simplifiedUI/ui/simplifiedFTUE/SecondLaunchWindow.qml
@@ -20,6 +20,7 @@ Rectangle {
id: root
color: simplifiedUI.colors.white
anchors.fill: parent
+ property bool landscapeOrientation: root.width > root.height
SimplifiedConstants.SimplifiedConstants {
id: simplifiedUI
@@ -51,28 +52,39 @@ Rectangle {
GridLayout {
id: tempAvatarPageGrid
anchors.fill: parent
- anchors.leftMargin: 180
+ anchors.leftMargin: 50
anchors.bottomMargin: 50
- anchors.rightMargin: 100
- columns: 2
+ anchors.rightMargin: 50
+ columns: landscapeOrientation ? 2 : 1
+ rows: landscapeOrientation ? 1 : 2
+
+ Item {
+ id: heroImageContainer
+ Layout.preferredWidth: heroImage.width
+ Layout.preferredHeight: heroImage.height
+
+ Image {
+ id: heroImage
+ width: 428
+ height: 800
+ source: resourceDirectoryUrl + "qml/hifi/simplifiedUI/avatarApp/images/hero.png"
+ }
+ }
Item {
id: textAndQRContainer
- Layout.preferredWidth: 650
- Layout.preferredHeight: 670
- Layout.minimumWidth: 200
- Layout.maximumWidth: 800
- Layout.topMargin: 180
+ Layout.preferredWidth: 720
+ Layout.preferredHeight: childrenRect.height
+ Layout.topMargin: 150
HifiStylesUit.RalewayBold {
id: headerText
text: "Stand out from the crowd!"
- color: simplifiedUI.colors.darkGray
+ color: simplifiedUI.colors.text.black
size: 48
wrapMode: Text.WordWrap
anchors.left: parent.left
anchors.right: parent.right
- height: 60
}
HifiStylesUit.RalewayRegular {
@@ -81,10 +93,9 @@ Rectangle {
anchors.top: headerText.bottom
anchors.topMargin: 10
text: "You can create and upload custom avatars from our Avatar Creator App. It's as easy as taking a selfie. Available now on iOS and Android Platforms."
- color: simplifiedUI.colors.darkGray
+ color: simplifiedUI.colors.text.black
size: 24
anchors.left: parent.left
- height: 80
wrapMode: Text.WordWrap
}
@@ -92,40 +103,42 @@ Rectangle {
id: qrAndInstructionsContainer
anchors.top: descriptionText.bottom
anchors.left: parent.left
- height: avatarAppQRCodeImage.height + instructionText.height + 50
- width: descriptionText.width
- anchors.topMargin: 60
+ height: avatarAppQRCodeImage.height
+ width: parent.width
+ anchors.topMargin: 150
Image {
id: avatarAppQRCodeImage
- anchors.horizontalCenter: instructionText.horizontalCenter
+ anchors.left: parent.left
source: resourceDirectoryUrl + "qml/hifi/simplifiedUI/avatarApp/images/qrCode.jpg"
- height: 220
- width: 220
+ height: 180
+ width: 180
}
HifiStylesUit.RalewayBold {
id: instructionText
- anchors.left: parent.left
- anchors.topMargin: 10
- width: 515
+ anchors.left: avatarAppQRCodeImage.right
+ anchors.leftMargin: 20
+ anchors.verticalCenter: avatarAppQRCodeImage.verticalCenter
+ anchors.right: parent.right
anchors.top: avatarAppQRCodeImage.bottom
text: "Use your mobile phone to scan this QR code."
- color: simplifiedUI.colors.darkGray
+ color: simplifiedUI.colors.text.black
size: 24
- height: 30
wrapMode: Text.WordWrap
}
}
HifiStylesUit.RalewayBold {
anchors.top: qrAndInstructionsContainer.bottom
- anchors.topMargin: 50
- anchors.horizontalCenter: qrAndInstructionsContainer.horizontalCenter
- text: "No thanks, I'll keep using my default avatar."
+ anchors.topMargin: 150
+ anchors.left: parent.left
+ anchors.right: parent.right
+ horizontalAlignment: Text.AlignLeft
+ text: "Continue >"
color: simplifiedUI.colors.text.lightBlue
opacity: continueMouseArea.containsMouse ? 1.0 : 0.7
- size: 14
+ size: 36
z: 1
wrapMode: Text.WordWrap
@@ -144,21 +157,6 @@ Rectangle {
}
}
}
-
- Item {
- id: heroImageContainer
- Layout.leftMargin: 30
- Layout.preferredWidth: heroImage.width
- Layout.preferredHeight: heroImage.height
-
- Image {
- id: heroImage
- width: 428
- height: 800
- source: resourceDirectoryUrl + "qml/hifi/simplifiedUI/avatarApp/images/hero.png"
- }
- // TODO move this to be above the rest of the grid layout stuff in landscape mode
- }
}
SimplifiedControls.VerticalScrollBar {
diff --git a/scripts/simplifiedUI/ui/simplifiedUI.js b/scripts/simplifiedUI/ui/simplifiedUI.js
index 369b037a5d..98ec5e2260 100644
--- a/scripts/simplifiedUI/ui/simplifiedUI.js
+++ b/scripts/simplifiedUI/ui/simplifiedUI.js
@@ -436,21 +436,25 @@ function displaySecondLaunchWindow() {
}
function closeInitialLaunchWindow() {
- initialLaunchWindow.fromQml.disconnect(onMessageFromInitialLaunchWindow);
- var homeLocation = LocationBookmarks.getAddress("hqhome");
- if (homeLocation) {
- Window.location = homeLocation;
+ if (initialLaunchWindow) {
+ initialLaunchWindow.fromQml.disconnect(onMessageFromInitialLaunchWindow);
+ var homeLocation = LocationBookmarks.getAddress("hqhome");
+ if (homeLocation) {
+ Window.location = homeLocation;
+ }
+ initialLaunchWindow.close();
}
- initialLaunchWindow.close();
}
function closeSecondLaunchWindow() {
- secondLaunchWindow.fromQml.disconnect(onMessageFromSecondLaunchWindow);
- var homeLocation = LocationBookmarks.getAddress("hqhome");
- if (homeLocation) {
- Window.location = homeLocation;
+ if (secondLaunchWindow) {
+ secondLaunchWindow.fromQml.disconnect(onMessageFromSecondLaunchWindow);
+ var homeLocation = LocationBookmarks.getAddress("hqhome");
+ if (homeLocation) {
+ Window.location = homeLocation;
+ }
+ secondLaunchWindow.close();
}
- secondLaunchWindow.close();
}
var INITIAL_LAUNCH_WINDOW_MESSAGE_SOURCE = "InitialLaunchWindow.qml";