mirror of
https://thingvellir.net/git/overte
synced 2025-03-27 23:52:03 +01:00
Still trying get QML gridLayouts to work
This commit is contained in:
RebeccaStankus
parent
b1fd6050c7
commit
94e71e1bdd
3 changed files with 89 additions and 92 deletions
|
|
@ -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 <b>temporary avatar</b> to use
|
||||
for today. If you see this avatar in-world, walk up and
|
||||
say hello to other new users!<br></br><br></br>
|
||||
<b>We want you to be you</b> 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
|
||||
|
|
|
|||
|
|
@ -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 {
|
||||
|
|
|
|||
|
|
@ -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";
|
||||
|
|
|
|||
Loading…
Reference in a new issue