AZEN-SGG/amnezia-client
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

added some new controls and started layout of pageStart and pageCredentials

Browse source
This commit is contained in:
vladimir.kuznetsov 2023-04-12 19:13:41 +03:00
parent ec96c1b534
commit 905a3a30f3
18 changed files with 558 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

2
client/amnezia_application.cpp
View file

@ -92,7 +92,7 @@ void AmneziaApplication::init()
m_engine = new QQmlApplicationEngine;
m_uiLogic = new UiLogic(m_settings, m_configurator, m_serverController);
const QUrl url(QStringLiteral("qrc:/ui/qml/main.qml"));
const QUrl url(QStringLiteral("qrc:/ui/qml/main2.qml"));
QObject::connect(m_engine, &QQmlApplicationEngine::objectCreated,
this, [url](QObject *obj, const QUrl &objUrl) {
if (!obj && url == objUrl)

BIN
client/images/amneziaBigLogo.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 25 KiB

1
client/images/amneziaBigLogo.svg Normal file
View file

File diff suppressed because one or more lines are too long
Side by side

After

Width:  |  Height:  |  Size: 236 KiB

4
client/images/controls/arrow-left.svg Normal file
View file

@ -0,0 +1,4 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M19 12H5" stroke="#CBCBCB" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M12 19L5 12L12 5" stroke="#CBCBCB" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 315 B

12
client/resources.qrc
View file

@ -176,5 +176,17 @@
<file>ui/qml/Controls2/CardType.qml</file>
<file>ui/qml/Controls2/CheckBoxType.qml</file>
<file>images/controls/check.svg</file>
<file>ui/qml/Controls2/DropDownType.qml</file>
<file>ui/qml/Pages2/PageStart.qml</file>
<file>ui/qml/main2.qml</file>
<file>ui/qml/PageLoader.qml</file>
<file>images/amneziaBigLogo.png</file>
<file>images/amneziaBigLogo.svg</file>
<file>ui/qml/Controls2/BodyTextType.qml</file>
<file>ui/qml/Controls2/FlickableType.qml</file>
<file>ui/qml/Controls2/Header2TextType.qml</file>
<file>ui/qml/Pages2/PageCredentials.qml</file>
<file>ui/qml/Controls2/HeaderTextType.qml</file>
<file>images/controls/arrow-left.svg</file>
</qresource>
</RCC>

2
client/ui/pages.h
View file

@ -24,7 +24,7 @@ enum class Page {Start = 0, NewServer, NewServerProtocols, Vpn,
Wizard, WizardLow, WizardMedium, WizardHigh, WizardVpnMode, ServerConfiguringProgress,
GeneralSettings, AppSettings, NetworkSettings, ServerSettings,
ServerContainers, ServersList, ShareConnection, Sites,
ProtocolSettings, ProtocolShare, QrDecoder, QrDecoderIos, About, ViewConfig, AdvancedServerSettings, Test};
ProtocolSettings, ProtocolShare, QrDecoder, QrDecoderIos, About, ViewConfig, AdvancedServerSettings, Test, Credentials};
Q_ENUM_NS(Page)
static void declareQmlPageEnum() {

12
client/ui/qml/Controls2/BodyTextType.qml Normal file
View file

@ -0,0 +1,12 @@
import QtQuick
Text {
text: root.bodyText
wrapMode: Text.WordWrap
color: "#D7D8DB"
font.pixelSize: 16
font.weight: 400
font.family: "PT Root UI VF"
height: 24
}

5
client/ui/qml/Controls2/DropDownType.qml Normal file
View file

@ -0,0 +1,5 @@
import QtQuick
Item {
}

23
client/ui/qml/Controls2/FlickableType.qml Normal file
View file

@ -0,0 +1,23 @@
import QtQuick 2.12
import QtQuick.Controls 2.12
import "../Config"
Flickable {
id: fl
clip: true
width: parent.width
anchors.bottom: parent.bottom
anchors.left: root.left
anchors.right: root.right
anchors.rightMargin: 1
Keys.onUpPressed: scrollBar.decrease()
Keys.onDownPressed: scrollBar.increase()
ScrollBar.vertical: ScrollBar {
id: scrollBar
policy: fl.height >= fl.contentHeight ? ScrollBar.AlwaysOff : ScrollBar.AlwaysOn
}
}

10
client/ui/qml/Controls2/Header2TextType.qml Normal file
View file

@ -0,0 +1,10 @@
import QtQuick
Text {
color: "#D7D8DB"
font.pixelSize: 25
font.weight: 700
font.family: "PT Root UI VF"
height: 30
}

40
client/ui/qml/Controls2/HeaderTextType.qml Normal file
View file

@ -0,0 +1,40 @@
import QtQuick
import QtQuick.Layouts
ColumnLayout {
id: root
property string buttonImage
property string headerText
property var wrapMode
ImageButtonType {
id: button
Layout.leftMargin: -6
hoverEnabled: false
image: root.buttonImage
onClicked: {
if (onClickedFunc && typeof onClickedFunc === "function") {
onClickedFunc()
}
}
}
Text {
id: header
text: root.headerText
color: "#D7D8DB"
font.pixelSize: 36
font.weight: 700
font.family: "PT Root UI VF"
font.letterSpacing: -0.03
wrapMode: Text.WordWrap
height: 38
}
}

4
client/ui/qml/Controls2/TextFieldWithHeaderType.qml
View file

@ -7,6 +7,7 @@ Item {
property string headerText
property string textFieldText
property string textFieldPlaceholderText
property bool textFieldEditable: true
implicitWidth: 328
@ -45,6 +46,9 @@ Item {
enabled: root.textFieldEditable
text: root.textFieldText
color: "#d7d8db"
placeholderText: textFieldPlaceholderText
font.pixelSize: 16
font.weight: 400
font.family: "PT Root UI VF"

57
client/ui/qml/PageLoader.qml Normal file
View file

@ -0,0 +1,57 @@
import QtQuick
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());
}
}
}
}

1
client/ui/qml/Pages/PageTest.qml
View file

@ -13,7 +13,6 @@ PageBase {
logic: ViewConfigLogic
Rectangle {
y: 0
anchors.fill: parent
color: "#0E0E11"
}

83
client/ui/qml/Pages2/PageCredentials.qml Normal file
View file

@ -0,0 +1,83 @@
import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
import PageEnum 1.0
import "./"
import "../Pages"
import "../Controls2"
import "../Config"
PageBase {
id: root
page: PageEnum.Credentials
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
HeaderTextType {
Layout.fillWidth: true
Layout.bottomMargin: 16
Layout.topMargin: 66
Layout.preferredWidth: 328
buttonImage: "qrc:/images/controls/arrow-left.svg"
headerText: "Подключение к серверу"
wrapMode: Text.WordWrap
}
TextFieldWithHeaderType {
Layout.fillWidth: true
headerText: "Server IP adress [:port]"
}
TextFieldWithHeaderType {
Layout.fillWidth: true
headerText: "Login to connect via SSH"
}
TextFieldWithHeaderType {
Layout.fillWidth: true
headerText: "Password / Private key"
}
BasicButtonType {
Layout.fillWidth: true
Layout.topMargin: 40
text: qsTr("Настроить сервер простым образом")
}
BasicButtonType {
Layout.fillWidth: true
Layout.topMargin: 8
defaultColor: "transparent"
hoveredColor: Qt.rgba(255, 255, 255, 0.08)
pressedColor: Qt.rgba(255, 255, 255, 0.12)
disabledColor: "#878B91"
textColor: "#D7D8DB"
borderWidth: 1
text: qsTr("Выбрать протокол для установки")
}
}
}
}

163
client/ui/qml/Pages2/PageStart.qml Normal file
View file

@ -0,0 +1,163 @@
import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
import PageEnum 1.0
import "./"
import "../Pages"
import "../Controls2"
import "../Config"
PageBase {
id: root
page: PageEnum.Start
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
Image {
id: image
source: "qrc:/images/amneziaBigLogo.png"
Layout.alignment: Qt.AlignCenter
Layout.topMargin: 80
Layout.leftMargin: 8
Layout.rightMargin: 8
Layout.preferredWidth: 344
Layout.preferredHeight: 279
}
BodyTextType {
Layout.fillWidth: true
Layout.topMargin: 50
Layout.leftMargin: 16
Layout.rightMargin: 16
text: "Бесплатный сервис для создания личного VPN на вашем сервере. Помогаем получать доступ к заблокированному контенту, не раскрывая конфиденциальность даже провайдерам VPN."
}
BasicButtonType {
Layout.fillWidth: true
Layout.topMargin: 32
Layout.leftMargin: 16
Layout.rightMargin: 16
text: qsTr("У меня есть данные для подключения")
onClicked: {
drawer.visible = true
}
}
BasicButtonType {
Layout.fillWidth: true
Layout.topMargin: 8
Layout.leftMargin: 16
Layout.rightMargin: 16
defaultColor: "transparent"
hoveredColor: Qt.rgba(255, 255, 255, 0.08)
pressedColor: Qt.rgba(255, 255, 255, 0.12)
disabledColor: "#878B91"
textColor: "#D7D8DB"
borderWidth: 1
text: qsTr("У меня ничего нет")
// onClicked: {
// UiLogic.goToPage(PageEnum.Start)
// }
}
}
Drawer {
id: drawer
y: 0
x: 0
edge: Qt.BottomEdge
width: parent.width
height: parent.height * 0.4375
clip: true
background: Rectangle {
anchors.fill: parent
anchors.bottomMargin: -radius
radius: 16
color: "#1C1D21"
}
modal: true
//interactive: activeFocus
// onAboutToHide: {
// pageLoader.focus = true
// }
// onAboutToShow: {
// tfSshLog.focus = true
// }
ColumnLayout {
anchors.top: parent.top
anchors.left: parent.left
anchors.right: parent.right
anchors.rightMargin: 16
anchors.leftMargin: 16
Header2TextType {
Layout.fillWidth: true
Layout.topMargin: 24
Layout.alignment: Qt.AlignHCenter
text: "Данные для подключения"
}
LabelWithButtonType {
id: ip
Layout.fillWidth: true
Layout.topMargin: 32
text: "IP, логин и пароль от сервера"
buttonImage: "qrc:/images/controls/chevron-right.svg"
onClickedFunc: function() {
UiLogic.goToPage(PageEnum.Credentials)
}
}
Rectangle {
Layout.fillWidth: true
height: 1
color: "#2C2D30"
}
LabelWithButtonType {
Layout.fillWidth: true
text: "QR-код, ключ или файл настроек"
buttonImage: "qrc:/images/controls/chevron-right.svg"
// onClickedFunc: function() {
// UiLogic.goToPage(PageEnum.Start)
// }
}
Rectangle {
Layout.fillWidth: true
height: 1
color: "#2C2D30"
}
}
}
}
}

1
client/ui/qml/main.qml
View file

@ -85,7 +85,6 @@ Window {
}
Rectangle {
y: 0
anchors.fill: parent
color: "white"
}

142
client/ui/qml/main2.qml Normal file
View file

@ -0,0 +1,142 @@
import QtQuick
import QtQuick.Window
import QtQuick.Controls
import QtQuick.Layouts
import PageType 1.0
import "Config"
Window {
id: root
visible: true
width: GC.screenWidth
height: GC.screenHeight
minimumWidth: GC.isDesktop() ? 360 : 0
minimumHeight: GC.isDesktop() ? 640 : 0
onClosing: function() {
console.debug("QML onClosing signal")
UiLogic.onCloseWindow()
}
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
if (pageStackView.depth > 0) {
pageStackView.currentItem.deactivated()
}
if (slide) {
pageStackView.push(p_obj, {}, StackView.PushTransition)
} else {
pageStackView.push(p_obj, {}, StackView.Immediate)
}
// if (reset) {
// p_obj.logic.onUpdatePage();
// }
p_obj.activated(reset)
}
function closePage() {
if (pageStackView.depth <= 1) {
return
}
pageStackView.currentItem.deactivated()
pageStackView.pop()
}
function setStartPage(page, slide) {
if (pageStackView.depth > 0) {
pageStackView.currentItem.deactivated()
}
pageStackView.clear()
if (slide) {
pageStackView.push(pages[page], {}, StackView.PushTransition)
} else {
pageStackView.push(pages[page], {}, StackView.Immediate)
}
if (page === PageEnum.Start) {
UiLogic.pushButtonBackFromStartVisible = !pageStackView.empty
UiLogic.onUpdatePage();
}
}
Rectangle {
anchors.fill: parent
color: "#0E0E11"
}
StackView {
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)
}
function onClosePage() {
root.closePage()
}
function onSetStartPage(page, slide) {
root.setStartPage(page, slide)
}
function onShow() {
root.show()
}
function onHide() {
root.hide()
}
function onRaise() {
root.show()
root.raise()
root.requestActivate()
}
}
PageLoader {
id: pageLoader
onFinished: {
UiLogic.initalizeUiLogic()
}
}
}