status-im
/
status-desktop
mirror of https://github.com/status-im/status-desktop.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity
status-desktop/ui/onboarding/Intro.qml

337 lines
12 KiB
QML
Raw Normal View History

feat: Onboarding carousel Onboarding carousel completed Redo folder restructuring NOTES: 1. nim_status_client binary is output to `./bin/nim_status_client`, so you'll need to update your workflow to run this file. README has been updated to reflect this. Also, if you're running VSCode, instructions for code reload were added. 2. All `ui` files now live in `ui/` 3. All lib files (ie `libstatus`) now live in `lib/` 4. Removed the Qt Creater user project file as this is unique to each user 5. Moved the project file to `ui/`, so just open up the `ui` folder in Qt creator and it should locate the project file 6. `-d:release` removed from compilation as it wasn't needed 7. Broke up main.qml in to the main app and onboarding components, however this should be broken down further into more reusable components 8. Click "Get started" to show chat Format some files using nimpretty
2020-05-11 21:24:08 +00:00
import QtQuick 2.3
import QtQuick.Controls 1.3
import QtQuick.Controls 2.3
import QtQuick.Layouts 1.3
feat: onboarding generate new account Generates 5 random accounts with identicons, allows user to enter password, then stores the account and logs in to the statusgo node. Add EventEmitter that notifies nim_status_client.nim once node has started and is logged in (likely needs some refactoring to include the eventemitter in the base controller class). Add QML StateMachine for the onboarding view. Add nimcrytpo, uuids, eventemitter, isaac dependencies via submodules. Add button to Intro view to randomly gen account.
2020-05-19 13:22:38 +00:00
import "../shared"
feat: Onboarding carousel Onboarding carousel completed Redo folder restructuring NOTES: 1. nim_status_client binary is output to `./bin/nim_status_client`, so you'll need to update your workflow to run this file. README has been updated to reflect this. Also, if you're running VSCode, instructions for code reload were added. 2. All `ui` files now live in `ui/` 3. All lib files (ie `libstatus`) now live in `lib/` 4. Removed the Qt Creater user project file as this is unique to each user 5. Moved the project file to `ui/`, so just open up the `ui` folder in Qt creator and it should locate the project file 6. `-d:release` removed from compilation as it wasn't needed 7. Broke up main.qml in to the main app and onboarding components, however this should be broken down further into more reusable components 8. Click "Get started" to show chat Format some files using nimpretty
2020-05-11 21:24:08 +00:00
RowLayout {
feat: onboarding generate new account Generates 5 random accounts with identicons, allows user to enter password, then stores the account and logs in to the statusgo node. Add EventEmitter that notifies nim_status_client.nim once node has started and is logged in (likely needs some refactoring to include the eventemitter in the base controller class). Add QML StateMachine for the onboarding view. Add nimcrytpo, uuids, eventemitter, isaac dependencies via submodules. Add button to Intro view to randomly gen account.
2020-05-19 13:22:38 +00:00
property alias btnGetStarted: btnGetStarted
feat: Onboarding carousel Onboarding carousel completed Redo folder restructuring NOTES: 1. nim_status_client binary is output to `./bin/nim_status_client`, so you'll need to update your workflow to run this file. README has been updated to reflect this. Also, if you're running VSCode, instructions for code reload were added. 2. All `ui` files now live in `ui/` 3. All lib files (ie `libstatus`) now live in `lib/` 4. Removed the Qt Creater user project file as this is unique to each user 5. Moved the project file to `ui/`, so just open up the `ui` folder in Qt creator and it should locate the project file 6. `-d:release` removed from compilation as it wasn't needed 7. Broke up main.qml in to the main app and onboarding components, however this should be broken down further into more reusable components 8. Click "Get started" to show chat Format some files using nimpretty
2020-05-11 21:24:08 +00:00
id: obLayout
anchors.fill: parent
Layout.fillWidth: true
Layout.fillHeight: true
Rectangle {
border.width: 0
Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter
Layout.fillHeight: true
Layout.fillWidth: true
SwipeView {
id: vwOnboarding
width: parent.width
height: parent.height
currentIndex: 0
interactive: false
anchors.fill: parent
Item {
id: itmSlide1
Image {
id: img1
anchors.horizontalCenter: parent.horizontalCenter
sourceSize.width: 414
sourceSize.height: 414
anchors.topMargin: 17
fillMode: Image.PreserveAspectFit
source: "img/chat@2x.jpg"
}
Text {
id: txtTitle1
text: qsTr("Truly private communication")
anchors.right: parent.right
anchors.rightMargin: 177
anchors.left: parent.left
anchors.leftMargin: 177
anchors.top: img1.bottom
anchors.topMargin: 44
font.letterSpacing: -0.2
font.weight: Font.Bold
lineHeight: 1
verticalAlignment: Text.AlignVCenter
horizontalAlignment: Text.AlignHCenter
transformOrigin: Item.Center
font.bold: true
font.pixelSize: 22
font.kerning: true
}
Text {
id: txtDesc1
x: 772
color: "#939BA1"
text: qsTr("Chat over a peer-to-peer, encrypted network\n where messages can't be censored or hacked")
font.weight: Font.Normal
style: Text.Normal
anchors.horizontalCenterOffset: 0
anchors.top: txtTitle1.bottom
anchors.topMargin: 14
font.bold: true
anchors.horizontalCenter: parent.horizontalCenter
font.pixelSize: 15
}
Button {
id: btnNext1
width: 40
height: 40
anchors.top: txtDesc1.top
anchors.bottomMargin: -2
anchors.bottom: txtDesc1.bottom
anchors.topMargin: -2
anchors.left: txtDesc1.right
anchors.leftMargin: 32
onClicked: vwOnboarding.currentIndex++
background: Rectangle {
id: rctNext1
color: "#ECEFFC"
border.width: 0
radius: 50
Image {
anchors.horizontalCenter: parent.horizontalCenter
anchors.verticalCenter: parent.verticalCenter
source: "img/next.svg"
}
}
}
}
Item {
id: itmSlide2
Image {
id: img2
anchors.horizontalCenter: parent.horizontalCenter
sourceSize.width: 414
sourceSize.height: 414
anchors.top: parent.top
anchors.topMargin: 17
fillMode: Image.PreserveAspectFit
source: "img/wallet@2x.jpg"
}
Text {
id: txtTitle2
text: qsTr("Secure crypto wallet")
anchors.right: parent.right
anchors.rightMargin: 177
anchors.left: parent.left
anchors.leftMargin: 177
anchors.top: img2.bottom
anchors.topMargin: 44
font.letterSpacing: -0.2
font.weight: Font.Bold
lineHeight: 1
verticalAlignment: Text.AlignVCenter
horizontalAlignment: Text.AlignHCenter
transformOrigin: Item.Center
font.bold: true
font.pixelSize: 22
font.kerning: true
}
Button {
id: btnPrev2
width: 40
height: 40
anchors.top: txtDesc2.top
anchors.bottomMargin: -2
anchors.bottom: txtDesc2.bottom
anchors.topMargin: -2
anchors.right: txtDesc2.left
anchors.rightMargin: 32
onClicked: vwOnboarding.currentIndex--
background: Rectangle {
id: rctPrev2
color: "#ECEFFC"
border.width: 0
radius: 50
Image {
rotation: 180
anchors.horizontalCenter: parent.horizontalCenter
anchors.verticalCenter: parent.verticalCenter
source: "img/next.svg"
}
}
}
Text {
id: txtDesc2
x: 772
color: "#939BA1"
text: qsTr("Send and receive digital assets anywhere in the\nworld--no bank account required")
font.weight: Font.Normal
style: Text.Normal
anchors.horizontalCenterOffset: 0
anchors.top: txtTitle2.bottom
anchors.topMargin: 14
font.bold: true
anchors.horizontalCenter: parent.horizontalCenter
font.pixelSize: 15
}
Button {
id: btnNext2
width: 40
height: 40
anchors.top: txtDesc2.top
anchors.bottomMargin: -2
anchors.bottom: txtDesc2.bottom
anchors.topMargin: -2
anchors.left: txtDesc2.right
anchors.leftMargin: 32
onClicked: vwOnboarding.currentIndex++
background: Rectangle {
id: rctNext2
color: "#ECEFFC"
border.width: 0
radius: 50
Image {
anchors.horizontalCenter: parent.horizontalCenter
anchors.verticalCenter: parent.verticalCenter
source: "img/next.svg"
}
}
}
}
Item {
id: itmSlide3
Image {
id: img3
anchors.horizontalCenter: parent.horizontalCenter
sourceSize.width: 414
sourceSize.height: 414
anchors.topMargin: 17
fillMode: Image.PreserveAspectFit
source: "img/browser@2x.jpg"
}
Text {
id: txtTitle3
text: qsTr("Decentralized apps")
anchors.right: parent.right
anchors.rightMargin: 177
anchors.left: parent.left
anchors.leftMargin: 177
anchors.top: img3.bottom
anchors.topMargin: 44
font.letterSpacing: -0.2
font.weight: Font.Bold
lineHeight: 1
verticalAlignment: Text.AlignVCenter
horizontalAlignment: Text.AlignHCenter
transformOrigin: Item.Center
font.bold: true
font.pixelSize: 22
font.kerning: true
}
Button {
id: btnPrev3
width: 40
height: 40
anchors.top: txtDesc3.top
anchors.bottomMargin: -2
anchors.bottom: txtDesc3.bottom
anchors.topMargin: -2
anchors.right: txtDesc3.left
anchors.rightMargin: 32
onClicked: vwOnboarding.currentIndex--
background: Rectangle {
id: rctPrev3
color: "#ECEFFC"
border.width: 0
radius: 50
Image {
rotation: 180
anchors.horizontalCenter: parent.horizontalCenter
anchors.verticalCenter: parent.verticalCenter
source: "img/next.svg"
}
}
}
Text {
id: txtDesc3
x: 772
color: "#939BA1"
text: qsTr("Explore games, exchanges and social networks\nwhere you alone own your data")
font.weight: Font.Normal
style: Text.Normal
anchors.horizontalCenterOffset: 0
anchors.top: txtTitle3.bottom
anchors.topMargin: 14
font.bold: true
anchors.horizontalCenter: parent.horizontalCenter
font.pixelSize: 15
}
}
}
Rectangle {
id: rctPageIndicator
border.width: 0
anchors.bottom: vwOnboarding.bottom
anchors.bottomMargin: 191
anchors.top: vwOnboarding.top
anchors.topMargin: 567
anchors.horizontalCenter: parent.horizontalCenter
width: parent.width
PageIndicator {
id: pgOnboarding
anchors.horizontalCenter: parent.horizontalCenter
spacing: 5
padding: 0
topPadding: 0
bottomPadding: 0
rightPadding: 0
leftPadding: 0
font.pixelSize: 6
count: vwOnboarding.count
currentIndex: vwOnboarding.currentIndex
}
}
feat: onboarding generate new account Generates 5 random accounts with identicons, allows user to enter password, then stores the account and logs in to the statusgo node. Add EventEmitter that notifies nim_status_client.nim once node has started and is logged in (likely needs some refactoring to include the eventemitter in the base controller class). Add QML StateMachine for the onboarding view. Add nimcrytpo, uuids, eventemitter, isaac dependencies via submodules. Add button to Intro view to randomly gen account.
2020-05-19 13:22:38 +00:00
StyledButton {
feat: Onboarding carousel Onboarding carousel completed Redo folder restructuring NOTES: 1. nim_status_client binary is output to `./bin/nim_status_client`, so you'll need to update your workflow to run this file. README has been updated to reflect this. Also, if you're running VSCode, instructions for code reload were added. 2. All `ui` files now live in `ui/` 3. All lib files (ie `libstatus`) now live in `lib/` 4. Removed the Qt Creater user project file as this is unique to each user 5. Moved the project file to `ui/`, so just open up the `ui` folder in Qt creator and it should locate the project file 6. `-d:release` removed from compilation as it wasn't needed 7. Broke up main.qml in to the main app and onboarding components, however this should be broken down further into more reusable components 8. Click "Get started" to show chat Format some files using nimpretty
2020-05-11 21:24:08 +00:00
id: btnGetStarted
feat: onboarding generate new account Generates 5 random accounts with identicons, allows user to enter password, then stores the account and logs in to the statusgo node. Add EventEmitter that notifies nim_status_client.nim once node has started and is logged in (likely needs some refactoring to include the eventemitter in the base controller class). Add QML StateMachine for the onboarding view. Add nimcrytpo, uuids, eventemitter, isaac dependencies via submodules. Add button to Intro view to randomly gen account.
2020-05-19 13:22:38 +00:00
label: "Get started"
feat: Onboarding carousel Onboarding carousel completed Redo folder restructuring NOTES: 1. nim_status_client binary is output to `./bin/nim_status_client`, so you'll need to update your workflow to run this file. README has been updated to reflect this. Also, if you're running VSCode, instructions for code reload were added. 2. All `ui` files now live in `ui/` 3. All lib files (ie `libstatus`) now live in `lib/` 4. Removed the Qt Creater user project file as this is unique to each user 5. Moved the project file to `ui/`, so just open up the `ui` folder in Qt creator and it should locate the project file 6. `-d:release` removed from compilation as it wasn't needed 7. Broke up main.qml in to the main app and onboarding components, however this should be broken down further into more reusable components 8. Click "Get started" to show chat Format some files using nimpretty
2020-05-11 21:24:08 +00:00
anchors.top: rctPageIndicator.bottom
anchors.topMargin: 87
anchors.horizontalCenter: parent.horizontalCenter
feat: onboarding generate new account Generates 5 random accounts with identicons, allows user to enter password, then stores the account and logs in to the statusgo node. Add EventEmitter that notifies nim_status_client.nim once node has started and is logged in (likely needs some refactoring to include the eventemitter in the base controller class). Add QML StateMachine for the onboarding view. Add nimcrytpo, uuids, eventemitter, isaac dependencies via submodules. Add button to Intro view to randomly gen account.
2020-05-19 13:22:38 +00:00
// onClicked: app.visible = true
width: 146
height: 44
feat: Onboarding carousel Onboarding carousel completed Redo folder restructuring NOTES: 1. nim_status_client binary is output to `./bin/nim_status_client`, so you'll need to update your workflow to run this file. README has been updated to reflect this. Also, if you're running VSCode, instructions for code reload were added. 2. All `ui` files now live in `ui/` 3. All lib files (ie `libstatus`) now live in `lib/` 4. Removed the Qt Creater user project file as this is unique to each user 5. Moved the project file to `ui/`, so just open up the `ui` folder in Qt creator and it should locate the project file 6. `-d:release` removed from compilation as it wasn't needed 7. Broke up main.qml in to the main app and onboarding components, however this should be broken down further into more reusable components 8. Click "Get started" to show chat Format some files using nimpretty
2020-05-11 21:24:08 +00:00
}
Text {
id: txtPrivacyPolicy
x: 772
text: qsTr("Status does not collect, share or sell any personal data. By continuing you agree with the privacy policy.")
anchors.top: btnGetStarted.bottom
anchors.topMargin: 17
anchors.horizontalCenter: parent.horizontalCenter
font.pixelSize: 12
font.letterSpacing: 0.1
color: "#939BA1"
}
}
}
/*##^##
Designer {
D{i:0;autoSize:true;height:770;width:1232}
}
##^##*/