changed the way to create qml pages, now the page is created when you go to it

- added PageSetupWizardConfigSource, PageSetupWizardInstalling, PageSetupWizardProtocolSettings, PageSetupWizardTextKey
This commit is contained in:
vladimir.kuznetsov 2023-05-03 19:06:16 +03:00
parent 68b27451f2
commit 4f36349630
25 changed files with 503 additions and 158 deletions

View file

@ -14,7 +14,6 @@ Button {
property string borderColor: "#D7D8DB"
property int borderWidth: 0
implicitWidth: 328
implicitHeight: 56
hoverEnabled: true

View file

@ -9,7 +9,9 @@ Item {
property string descriptionText
property var onClickedFunc
property alias buttonImage: button.image
property string iconImage
implicitWidth: content.implicitWidth
implicitHeight: content.implicitHeight
@ -18,6 +20,13 @@ Item {
id: content
anchors.fill: parent
Image {
id: icon
source: iconImage
visible: iconImage ? true : false
Layout.rightMargin: visible ? 16 : 0
}
ColumnLayout {
Text {
font.family: "PT Root UI"
@ -25,6 +34,7 @@ Item {
font.pixelSize: 18
color: "#d7d8db"
text: root.text
wrapMode: Text.WordWrap
Layout.fillWidth: true
height: 22

View file

@ -10,7 +10,11 @@ Item {
property string textFieldPlaceholderText
property bool textFieldEditable: true
implicitWidth: 328
property string buttonText
property var clickedFunc
property alias textField: textField
implicitHeight: 74
Rectangle {
@ -26,50 +30,77 @@ Item {
}
}
ColumnLayout {
RowLayout {
anchors.fill: backgroud
ColumnLayout {
Text {
text: root.headerText
color: "#878b91"
font.pixelSize: 13
font.weight: 400
font.family: "PT Root UI VF"
font.letterSpacing: 0.02
Text {
text: root.headerText
color: "#878b91"
font.pixelSize: 13
font.weight: 400
font.family: "PT Root UI VF"
font.letterSpacing: 0.02
height: 16
Layout.fillWidth: true
Layout.rightMargin: 16
Layout.leftMargin: 16
Layout.topMargin: 16
height: 16
Layout.fillWidth: true
Layout.rightMargin: 16
Layout.leftMargin: 16
Layout.topMargin: 16
}
TextField {
id: textField
enabled: root.textFieldEditable
text: root.textFieldText
color: "#d7d8db"
placeholderText: textFieldPlaceholderText
placeholderTextColor: "#494B50"
selectionColor: "#412102"
selectedTextColor: "#D7D8DB"
font.pixelSize: 16
font.weight: 400
font.family: "PT Root UI VF"
height: 24
Layout.fillWidth: true
Layout.rightMargin: 16
Layout.leftMargin: 16
Layout.bottomMargin: 16
topPadding: 0
rightPadding: 0
leftPadding: 0
bottomPadding: 0
background: Rectangle {
anchors.fill: parent
color: "#1c1d21"
}
}
}
TextField {
id: textField
BasicButtonType {
visible: root.buttonText !== ""
enabled: root.textFieldEditable
text: root.textFieldText
color: "#d7d8db"
defaultColor: "transparent"
hoveredColor: Qt.rgba(1, 1, 1, 0.08)
pressedColor: Qt.rgba(1, 1, 1, 0.12)
disabledColor: "#878B91"
textColor: "#D7D8DB"
borderWidth: 0
placeholderText: textFieldPlaceholderText
text: buttonText
font.pixelSize: 16
font.weight: 400
font.family: "PT Root UI VF"
Layout.rightMargin: 24
height: 24
Layout.fillWidth: true
Layout.rightMargin: 16
Layout.leftMargin: 16
Layout.bottomMargin: 16
topPadding: 0
rightPadding: 0
leftPadding: 0
bottomPadding: 0
background: Rectangle {
anchors.fill: parent
color: "#1c1d21"
onClicked: {
if (clickedFunc && typeof clickedFunc === "function") {
clickedFunc()
}
}
}
}

View file

@ -1,57 +1,7 @@
import QtQuick
import QtQuick.Controls
import Qt.labs.folderlistmodel
import PageType 1.0
Item {
property var pages: ({})
signal finished()
FolderListModel {
id: folderModelPages
folder: "qrc:/ui/qml/Pages2/"
nameFilters: ["*.qml"]
showDirs: false
onStatusChanged: {
if (status == FolderListModel.Ready) {
for (var i = 0; i < folderModelPages.count; i++) {
createPagesObjects(folderModelPages.get(i, "filePath"), PageType.Basic);
}
finished()
}
}
function createPagesObjects(file, type) {
if (file.indexOf("Base") !== -1) {
return; // skip Base Pages
}
var c = Qt.createComponent("qrc" + file);
var finishCreation = function(component) {
if (component.status === Component.Ready) {
var obj = component.createObject(root);
if (obj === null) {
console.debug("Error creating object " + component.url);
} else {
obj.visible = false
if (type === PageType.Basic) {
pages[obj.page] = obj
}
}
} else if (component.status === Component.Error) {
console.debug("Error loading component:", component.errorString());
}
}
if (c.status === Component.Ready) {
finishCreation(c);
} else {
console.debug("Warning: " + file + " page components are not ready " + c.errorString());
}
}
}
StackView {
id: stackView
initialItem: "PageStart"
}

View file

@ -0,0 +1,114 @@
import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
import QtQuick.Dialogs
import PageEnum 1.0
import "./"
import "../Pages"
import "../Controls2"
import "../Controls2/TextTypes"
import "../Config"
PageBase {
id: root
page: PageEnum.PageSetupWizardInstalling
FlickableType {
id: fl
anchors.top: root.top
anchors.bottom: root.bottom
contentHeight: content.height
ColumnLayout {
id: content
anchors.top: parent.top
anchors.left: parent.left
anchors.right: parent.right
anchors.rightMargin: 16
anchors.leftMargin: 16
spacing: 16
HeaderType {
Layout.fillWidth: true
Layout.topMargin: 20
buttonImage: "qrc:/images/controls/arrow-left.svg"
headerText: "Подключение к серверу"
descriptionText: "Не используйте код подключения из публичных источников. Его могли создать, чтобы перехватывать ваши данные.\n
Всё в порядке, если код передал друг."
}
Header2TextType {
Layout.fillWidth: true
Layout.topMargin: 32
text: "Что у вас есть?"
}
LabelWithButtonType {
Layout.fillWidth: true
Layout.topMargin: 16
text: "Файл с настройками подключения"
buttonImage: "qrc:/images/controls/chevron-right.svg"
iconImage: "qrc:/images/controls/folder-open.svg"
onClickedFunc: function() {
onClicked: fileDialog.open()
}
FileDialog {
id: fileDialog
// currentFolder: StandardPaths.standardLocations(StandardPaths.PicturesLocation)[0]
onAccepted: {
}
}
}
Rectangle {
Layout.fillWidth: true
height: 1
color: "#2C2D30"
}
//todo ifdef mobile platforms>
LabelWithButtonType {
Layout.fillWidth: true
text: "QR-код"
buttonImage: "qrc:/images/controls/chevron-right.svg"
iconImage: "qrc:/images/controls/qr-code.svg"
onClickedFunc: function() {
}
}
Rectangle {
Layout.fillWidth: true
height: 1
color: "#2C2D30"
}
LabelWithButtonType {
Layout.fillWidth: true
text: "Ключ в виде текста"
buttonImage: "qrc:/images/controls/chevron-right.svg"
iconImage: "qrc:/images/controls/text-cursor.svg"
onClickedFunc: function() {
UiLogic.goToPage(PageEnum.PageSetupWizardTextKey)
}
}
Rectangle {
Layout.fillWidth: true
height: 1
color: "#2C2D30"
}
}
}
}

View file

@ -11,7 +11,7 @@ import "../Config"
PageBase {
id: root
page: PageEnum.WizardCredentials
page: PageEnum.PageSetupWizardCredentials
FlickableType {
id: fl
@ -61,7 +61,7 @@ PageBase {
text: qsTr("Настроить сервер простым образом")
onClicked: function() {
UiLogic.goToPage(PageEnum.WizardEasySetup)
UiLogic.goToPage(PageEnum.PageSetupWizardEasy)
}
}
@ -79,7 +79,7 @@ PageBase {
text: qsTr("Выбрать протокол для установки")
onClicked: function() {
UiLogic.goToPage(PageEnum.WizardProtocols)
UiLogic.goToPage(PageEnum.PageSetupWizardProtocols)
}
}
}

View file

@ -11,7 +11,7 @@ import "../Config"
PageBase {
id: root
page: PageEnum.WizardEasySetup
page: PageEnum.PageSetupWizardEasy
FlickableType {
id: fl

View file

@ -0,0 +1,46 @@
import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
import PageEnum 1.0
import "./"
import "../Pages"
import "../Controls2"
import "../Controls2/TextTypes"
import "../Config"
PageBase {
id: root
page: PageEnum.PageSetupWizardInstalling
FlickableType {
id: fl
anchors.top: root.top
anchors.bottom: root.bottom
contentHeight: content.height
ColumnLayout {
id: content
anchors.top: parent.top
anchors.left: parent.left
anchors.right: parent.right
anchors.rightMargin: 16
anchors.leftMargin: 16
spacing: 16
HeaderType {
Layout.fillWidth: true
Layout.topMargin: 20
//TODO remove later
buttonImage: "qrc:/images/controls/arrow-left.svg"
headerText: "Установка"
descriptionText: ContainersModel.getCurrentlyInstalledContainerName()
}
}
}
}

View file

@ -0,0 +1,96 @@
import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
import PageEnum 1.0
import "./"
import "../Pages"
import "../Controls2"
import "../Controls2/TextTypes"
import "../Config"
PageBase {
id: root
page: PageEnum.PageSetupWizardProtocolSettings
FlickableType {
id: fl
anchors.top: root.top
anchors.bottom: root.bottom
contentHeight: content.height
ColumnLayout {
id: content
anchors.top: parent.top
anchors.left: parent.left
anchors.right: parent.right
anchors.rightMargin: 16
anchors.leftMargin: 16
spacing: 16
HeaderType {
Layout.fillWidth: true
Layout.topMargin: 20
buttonImage: "qrc:/images/controls/arrow-left.svg"
headerText: "Установка " + ContainersModel.getCurrentlyInstalledContainerName()
descriptionText: "Эти настройки можно будет изменить позже"
}
BodyTextType {
Layout.topMargin: 16
text: "Network protocol"
}
//TODO move to separete control
Rectangle {
implicitWidth: buttonGroup.implicitWidth
implicitHeight: buttonGroup.implicitHeight
color: "#1C1D21"
radius: 16
RowLayout {
id: buttonGroup
spacing: 0
HorizontalRadioButton {
implicitWidth: (root.width - 32) / 2
text: "UDP"
}
HorizontalRadioButton {
implicitWidth: (root.width - 32) / 2
text: "TCP"
}
}
}
TextFieldWithHeaderType {
Layout.fillWidth: true
headerText: "Port"
}
}
}
BasicButtonType {
anchors.bottom: parent.bottom
anchors.left: parent.left
anchors.right: parent.right
anchors.rightMargin: 16
anchors.leftMargin: 16
anchors.bottomMargin: 32
text: qsTr("Установить")
onClicked: function() {
UiLogic.goToPage(PageEnum.PageSetupWizardInstalling)
}
}
}

View file

@ -14,11 +14,11 @@ import "../Config"
PageBase {
id: root
page: PageEnum.WizardProtocols
page: PageEnum.PageSetupWizardProtocols
SortFilterProxyModel {
id: containersModel
sourceModel: UiLogic.containersModel
id: proxyContainersModel
sourceModel: ContainersModel
filters: [
ValueFilter {
roleName: "is_installed_role"
@ -64,7 +64,7 @@ PageBase {
currentIndex: -1
clip: true
interactive: false
model: containersModel
model: proxyContainersModel
delegate: Item {
implicitWidth: containers.width
@ -87,6 +87,10 @@ PageBase {
descriptionText: desc_role
buttonImage: "qrc:/images/controls/chevron-right.svg"
onClickedFunc: function() {
ContainersModel.setCurrentlyInstalledContainerIndex(proxyContainersModel.mapToSource(index))
UiLogic.goToPage(PageEnum.PageSetupWizardProtocolSettings)
}
}
Rectangle {

View file

@ -0,0 +1,74 @@
import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
import PageEnum 1.0
import "./"
import "../Pages"
import "../Controls2"
import "../Controls2/TextTypes"
import "../Config"
PageBase {
id: root
page: PageEnum.PageSetupWizardInstalling
FlickableType {
id: fl
anchors.top: root.top
anchors.bottom: root.bottom
contentHeight: content.height
ColumnLayout {
id: content
anchors.top: parent.top
anchors.left: parent.left
anchors.right: parent.right
anchors.rightMargin: 16
anchors.leftMargin: 16
spacing: 16
HeaderType {
Layout.fillWidth: true
Layout.topMargin: 20
buttonImage: "qrc:/images/controls/arrow-left.svg"
headerText: "Ключ для подключения"
descriptionText: "Строка, которая начинается с vpn://..."
}
TextFieldWithHeaderType {
Layout.fillWidth: true
Layout.topMargin: 32
headerText: "Ключ"
textFieldPlaceholderText: "vpn://"
buttonText: "Вставить"
clickedFunc: function() {
textField.text = ""
textField.paste()
}
}
}
}
BasicButtonType {
anchors.bottom: parent.bottom
anchors.left: parent.left
anchors.right: parent.right
anchors.rightMargin: 16
anchors.leftMargin: 16
anchors.bottomMargin: 32
text: qsTr("Подключиться")
onClicked: function() {
// UiLogic.goToPage(PageEnum.PageSetupWizardInstalling)
}
}
}

View file

@ -12,7 +12,7 @@ import "../Controls2/TextTypes"
PageBase {
id: root
page: PageEnum.Start
page: PageEnum.PageStart
FlickableType {
id: fl
@ -77,7 +77,7 @@ PageBase {
text: qsTr("У меня ничего нет")
onClicked: {
UiLogic.goToPage(PageEnum.Test)
UiLogic.goToPage(PageEnum.PageTest)
}
}
}
@ -129,7 +129,7 @@ PageBase {
buttonImage: "qrc:/images/controls/chevron-right.svg"
onClickedFunc: function() {
UiLogic.goToPage(PageEnum.WizardCredentials)
UiLogic.goToPage(PageEnum.PageSetupWizardCredentials)
drawer.visible = false
}
}
@ -144,9 +144,10 @@ PageBase {
text: "QR-код, ключ или файл настроек"
buttonImage: "qrc:/images/controls/chevron-right.svg"
// onClickedFunc: function() {
// UiLogic.goToPage(PageEnum.Start)
// }
onClickedFunc: function() {
UiLogic.goToPage(PageEnum.PageSetupWizardConfigSource)
drawer.visible = false
}
}
Rectangle {
Layout.fillWidth: true

View file

@ -14,6 +14,7 @@ Window {
height: GC.screenHeight
minimumWidth: GC.isDesktop() ? 360 : 0
minimumHeight: GC.isDesktop() ? 640 : 0
onClosing: function() {
console.debug("QML onClosing signal")
UiLogic.onCloseWindow()
@ -21,28 +22,18 @@ Window {
title: "AmneziaVPN"
function gotoPage(type, page, reset, slide) {
let p_obj;
if (type === PageType.Basic) p_obj = pageLoader.pages[page]
else if (type === PageType.Proto) p_obj = protocolPages[page]
else if (type === PageType.ShareProto) p_obj = sharePages[page]
else return
function gotoPage(page, reset, slide) {
if (pageStackView.depth > 0) {
pageStackView.currentItem.deactivated()
}
if (slide) {
pageStackView.push(p_obj, {}, StackView.PushTransition)
pageStackView.push(UiLogic.pageEnumToString(page), {}, StackView.PushTransition)
} else {
pageStackView.push(p_obj, {}, StackView.Immediate)
pageStackView.push(UiLogic.pageEnumToString(page), {}, StackView.Immediate)
}
// if (reset) {
// p_obj.logic.onUpdatePage();
// }
p_obj.activated(reset)
pageStackView.currentItem.activated(reset)
}
function closePage() {
@ -60,9 +51,9 @@ Window {
pageStackView.clear()
if (slide) {
pageStackView.push(pages[page], {}, StackView.PushTransition)
pageStackView.push(UiLogic.pageEnumToString(page), {}, StackView.PushTransition)
} else {
pageStackView.push(pages[page], {}, StackView.Immediate)
pageStackView.push(UiLogic.pageEnumToString(page), {}, StackView.Immediate)
}
if (page === PageEnum.Start) {
UiLogic.pushButtonBackFromStartVisible = !pageStackView.empty
@ -79,33 +70,12 @@ Window {
id: pageStackView
anchors.fill: parent
focus: true
onCurrentItemChanged: function() {
UiLogic.currentPageValue = currentItem.page
}
onDepthChanged: function() {
UiLogic.pagesStackDepth = depth
}
Keys.onPressed: function(event) {
UiLogic.keyPressEvent(event.key)
event.accepted = true
}
}
Connections {
target: UiLogic
function onGoToPage(page, reset, slide) {
root.gotoPage(PageType.Basic, page, reset, slide)
}
function onGoToProtocolPage(protocol, reset, slide) {
root.gotoPage(PageType.Proto, protocol, reset, slide)
}
function onGoToShareProtocolPage(protocol, reset, slide) {
root.gotoPage(PageType.ShareProto, protocol, reset, slide)
root.gotoPage(page, reset, slide)
}
function onClosePage() {
@ -118,6 +88,7 @@ Window {
function onShow() {
root.show()
UiLogic.initializeUiLogic()
}
function onHide() {
@ -130,13 +101,4 @@ Window {
root.requestActivate()
}
}
PageLoader {
id: pageLoader
onFinished: {
UiLogic.initializeUiLogic()
}
}
}