feature/custom-drawer (#563)

Replaced all the DrawerType with DrawerType2
This commit is contained in:
Nethius 2024-02-16 15:24:06 +05:00 committed by GitHub
parent fd030a5fd4
commit 074562b141
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
35 changed files with 1331 additions and 1319 deletions

View file

@ -8,18 +8,24 @@ import "../Controls2"
import "../Controls2/TextTypes"
import "../Config"
DrawerType {
DrawerType2 {
id: root
width: parent.width
height: parent.height * 0.4375
height: parent.height
expandedContent: ColumnLayout {
id: content
ColumnLayout {
anchors.top: parent.top
anchors.left: parent.left
anchors.right: parent.right
spacing: 0
Component.onCompleted: {
root.expandedHeight = content.implicitHeight + 32
}
Header2Type {
Layout.fillWidth: true
Layout.topMargin: 24
@ -40,7 +46,7 @@ DrawerType {
clickedFunction: function() {
PageController.goToPage(PageEnum.PageSetupWizardCredentials)
root.visible = false
root.close()
}
}
@ -54,7 +60,7 @@ DrawerType {
clickedFunction: function() {
PageController.goToPage(PageEnum.PageSetupWizardConfigSource)
root.visible = false
root.close()
}
}

View file

@ -60,7 +60,7 @@ ListView {
}
if (checked) {
containersDropDown.menuVisible = false
containersDropDown.close()
ServersModel.setDefaultContainer(ServersModel.defaultIndex, proxyContainersModel.mapToSource(index))
} else {
if (!isSupported && isInstalled) {
@ -71,7 +71,7 @@ ListView {
ContainersModel.setCurrentlyProcessedContainerIndex(proxyContainersModel.mapToSource(index))
InstallController.setShouldCreateServer(false)
PageController.goToPage(PageEnum.PageSetupWizardProtocolSettings)
containersDropDown.menuVisible = false
containersDropDown.close()
}
}

View file

@ -5,7 +5,7 @@ import QtQuick.Layouts
import "../Controls2"
import "../Controls2/TextTypes"
DrawerType {
DrawerType2 {
id: root
property string headerText
@ -16,23 +16,24 @@ DrawerType {
property var yesButtonFunction
property var noButtonFunction
width: parent.width
height: content.implicitHeight + 32
ColumnLayout {
expandedContent: ColumnLayout {
id: content
anchors.top: parent.top
anchors.left: parent.left
anchors.right: parent.right
anchors.topMargin: 16
anchors.rightMargin: 16
anchors.leftMargin: 16
spacing: 8
onImplicitHeightChanged: {
root.expandedHeight = content.implicitHeight + 32
}
Header2TextType {
Layout.fillWidth: true
Layout.topMargin: 16
Layout.rightMargin: 16
Layout.leftMargin: 16
text: headerText
}
@ -40,6 +41,8 @@ DrawerType {
ParagraphTextType {
Layout.fillWidth: true
Layout.topMargin: 8
Layout.rightMargin: 16
Layout.leftMargin: 16
text: descriptionText
}
@ -47,6 +50,8 @@ DrawerType {
BasicButtonType {
Layout.fillWidth: true
Layout.topMargin: 16
Layout.rightMargin: 16
Layout.leftMargin: 16
text: yesButtonText
@ -59,6 +64,8 @@ DrawerType {
BasicButtonType {
Layout.fillWidth: true
Layout.rightMargin: 16
Layout.leftMargin: 16
defaultColor: "transparent"
hoveredColor: Qt.rgba(1, 1, 1, 0.08)

View file

@ -5,129 +5,136 @@ import QtQuick.Layouts
import "../Controls2"
import "../Controls2/TextTypes"
DrawerType {
DrawerType2 {
id: root
width: parent.width
height: parent.height * 0.9
expandedContent: Item {
id: container
ColumnLayout {
id: backButton
implicitHeight: root.height * 0.9
anchors.top: parent.top
anchors.left: parent.left
anchors.right: parent.right
anchors.topMargin: 16
BackButtonType {
backButtonImage: "qrc:/images/controls/arrow-left.svg"
backButtonFunction: function() {
root.close()
}
Component.onCompleted: {
root.expandedHeight = container.implicitHeight
}
}
FlickableType {
anchors.top: backButton.bottom
anchors.left: parent.left
anchors.right: parent.right
anchors.bottom: parent.bottom
contentHeight: content.implicitHeight
ColumnLayout {
id: content
id: backButton
anchors.fill: parent
anchors.top: parent.top
anchors.left: parent.left
anchors.right: parent.right
anchors.topMargin: 16
Header2Type {
id: header
Layout.fillWidth: true
Layout.topMargin: 16
Layout.rightMargin: 16
Layout.leftMargin: 16
headerText: qsTr("Choose language")
BackButtonType {
backButtonImage: "qrc:/images/controls/arrow-left.svg"
backButtonFunction: function() {
root.close()
}
}
}
ListView {
id: listView
FlickableType {
anchors.top: backButton.bottom
anchors.left: parent.left
anchors.right: parent.right
anchors.bottom: parent.bottom
contentHeight: content.implicitHeight
Layout.fillWidth: true
height: listView.contentItem.height
ColumnLayout {
id: content
clip: true
interactive: false
anchors.fill: parent
model: LanguageModel
currentIndex: LanguageModel.currentLanguageIndex
Header2Type {
id: header
Layout.fillWidth: true
Layout.topMargin: 16
Layout.rightMargin: 16
Layout.leftMargin: 16
ButtonGroup {
id: buttonGroup
headerText: qsTr("Choose language")
}
delegate: Item {
implicitWidth: root.width
implicitHeight: delegateContent.implicitHeight
ListView {
id: listView
ColumnLayout {
id: delegateContent
Layout.fillWidth: true
height: listView.contentItem.height
anchors.fill: parent
clip: true
interactive: false
RadioButton {
id: radioButton
model: LanguageModel
currentIndex: LanguageModel.currentLanguageIndex
implicitWidth: parent.width
implicitHeight: radioButtonContent.implicitHeight
ButtonGroup {
id: buttonGroup
}
hoverEnabled: true
delegate: Item {
implicitWidth: root.width
implicitHeight: delegateContent.implicitHeight
indicator: Rectangle {
anchors.fill: parent
color: radioButton.hovered ? "#2C2D30" : "#1C1D21"
ColumnLayout {
id: delegateContent
Behavior on color {
PropertyAnimation { duration: 200 }
}
}
anchors.fill: parent
RowLayout {
id: radioButtonContent
anchors.fill: parent
RadioButton {
id: radioButton
anchors.rightMargin: 16
anchors.leftMargin: 16
implicitWidth: parent.width
implicitHeight: radioButtonContent.implicitHeight
spacing: 0
hoverEnabled: true
z: 1
indicator: Rectangle {
anchors.fill: parent
color: radioButton.hovered ? "#2C2D30" : "#1C1D21"
ParagraphTextType {
Layout.fillWidth: true
Layout.topMargin: 20
Layout.bottomMargin: 20
text: languageName
Behavior on color {
PropertyAnimation { duration: 200 }
}
}
Image {
source: "qrc:/images/controls/check.svg"
visible: radioButton.checked
RowLayout {
id: radioButtonContent
anchors.fill: parent
width: 24
height: 24
anchors.rightMargin: 16
anchors.leftMargin: 16
Layout.rightMargin: 8
spacing: 0
z: 1
ParagraphTextType {
Layout.fillWidth: true
Layout.topMargin: 20
Layout.bottomMargin: 20
text: languageName
}
Image {
source: "qrc:/images/controls/check.svg"
visible: radioButton.checked
width: 24
height: 24
Layout.rightMargin: 8
}
}
}
ButtonGroup.group: buttonGroup
checked: listView.currentIndex === index
ButtonGroup.group: buttonGroup
checked: listView.currentIndex === index
onClicked: {
listView.currentIndex = index
LanguageModel.changeLanguage(languageIndex)
root.close()
onClicked: {
listView.currentIndex = index
LanguageModel.changeLanguage(languageIndex)
root.close()
}
}
}
}

View file

@ -16,19 +16,18 @@ import "../Controls2/TextTypes"
import "../Config"
import "../Components"
DrawerType {
DrawerType2 {
id: root
property alias headerText: header.headerText
property alias configContentHeaderText: configContentHeader.headerText
property alias contentVisible: content.visible
property string headerText
property string configContentHeaderText
property string contentVisible
property string configExtension: ".vpn"
property string configCaption: qsTr("Save AmneziaVPN config")
property string configFileName: "amnezia_config"
width: parent.width
height: parent.height * 0.9
expandedHeight: parent.height * 0.9
onClosed: {
configExtension = ".vpn"
@ -36,8 +35,8 @@ DrawerType {
configFileName = "amnezia_config"
}
Item {
anchors.fill: parent
expandedContent: Item {
implicitHeight: root.expandedHeight
Header2Type {
id: header
@ -47,6 +46,8 @@ DrawerType {
anchors.topMargin: 20
anchors.leftMargin: 16
anchors.rightMargin: 16
headerText: root.headerText
}
FlickableType {
@ -64,6 +65,8 @@ DrawerType {
anchors.leftMargin: 16
anchors.rightMargin: 16
visible: root.contentVisible
BasicButtonType {
Layout.fillWidth: true
Layout.topMargin: 16
@ -91,6 +94,7 @@ DrawerType {
}
BasicButtonType {
id: copyConfigTextButton
Layout.fillWidth: true
Layout.topMargin: 8
@ -103,20 +107,14 @@ DrawerType {
text: qsTr("Copy")
imageSource: "qrc:/images/controls/copy.svg"
onClicked: {
configText.selectAll()
configText.copy()
configText.select(0, 0)
PageController.showNotificationMessage(qsTr("Copied"))
}
}
BasicButtonType {
id: copyNativeConfigStringButton
Layout.fillWidth: true
Layout.topMargin: 8
visible: nativeConfigString.text !== ""
visible: false
defaultColor: "transparent"
hoveredColor: Qt.rgba(1, 1, 1, 0.08)
@ -127,13 +125,6 @@ DrawerType {
text: qsTr("Copy config string")
imageSource: "qrc:/images/controls/copy.svg"
onClicked: {
nativeConfigString.selectAll()
nativeConfigString.copy()
nativeConfigString.select(0, 0)
PageController.showNotificationMessage(qsTr("Copied"))
}
}
BasicButtonType {
@ -150,82 +141,116 @@ DrawerType {
text: qsTr("Show connection settings")
onClicked: {
configContentDrawer.visible = true
configContentDrawer.open()
}
}
DrawerType {
DrawerType2 {
id: configContentDrawer
width: parent.width
height: parent.height * 0.9
parent: root.parent
BackButtonType {
id: backButton
anchors.fill: parent
expandedHeight: parent.height * 0.9
anchors.top: parent.top
anchors.left: parent.left
anchors.right: parent.right
anchors.topMargin: 16
expandedContent: Item {
id: configContentContainer
backButtonFunction: function() {
configContentDrawer.visible = false
implicitHeight: configContentDrawer.expandedHeight
Connections {
target: copyNativeConfigStringButton
function onClicked() {
nativeConfigString.selectAll()
nativeConfigString.copy()
nativeConfigString.select(0, 0)
PageController.showNotificationMessage(qsTr("Copied"))
}
}
}
FlickableType {
anchors.top: backButton.bottom
anchors.left: parent.left
anchors.right: parent.right
anchors.bottom: parent.bottom
contentHeight: configContent.implicitHeight + configContent.anchors.topMargin + configContent.anchors.bottomMargin
ColumnLayout {
id: configContent
anchors.fill: parent
anchors.rightMargin: 16
anchors.leftMargin: 16
Header2Type {
id: configContentHeader
Layout.fillWidth: true
Layout.topMargin: 16
Connections {
target: copyConfigTextButton
function onClicked() {
configText.selectAll()
configText.copy()
configText.select(0, 0)
PageController.showNotificationMessage(qsTr("Copied"))
}
}
TextField {
id: nativeConfigString
visible: false
text: ExportController.nativeConfigString
BackButtonType {
id: backButton
anchors.top: parent.top
anchors.left: parent.left
anchors.right: parent.right
anchors.topMargin: 16
backButtonFunction: function() {
configContentDrawer.open()
}
}
TextArea {
id: configText
FlickableType {
anchors.top: backButton.bottom
anchors.left: parent.left
anchors.right: parent.right
anchors.bottom: parent.bottom
contentHeight: configContent.implicitHeight + configContent.anchors.topMargin + configContent.anchors.bottomMargin
Layout.fillWidth: true
Layout.topMargin: 16
Layout.bottomMargin: 16
ColumnLayout {
id: configContent
padding: 0
leftPadding: 0
height: 24
anchors.fill: parent
anchors.rightMargin: 16
anchors.leftMargin: 16
readOnly: true
Header2Type {
id: configContentHeader
Layout.fillWidth: true
Layout.topMargin: 16
color: "#D7D8DB"
selectionColor: "#633303"
selectedTextColor: "#D7D8DB"
headerText: root.configContentHeaderText
}
font.pixelSize: 16
font.weight: Font.Medium
font.family: "PT Root UI VF"
TextField {
id: nativeConfigString
visible: false
text: ExportController.nativeConfigString
text: ExportController.config
onTextChanged: {
copyNativeConfigStringButton.visible = nativeConfigString.text !== ""
}
}
wrapMode: Text.Wrap
TextArea {
id: configText
background: Rectangle {
color: "transparent"
Layout.fillWidth: true
Layout.topMargin: 16
Layout.bottomMargin: 16
padding: 0
leftPadding: 0
height: 24
readOnly: true
color: "#D7D8DB"
selectionColor: "#633303"
selectedTextColor: "#D7D8DB"
font.pixelSize: 16
font.weight: Font.Medium
font.family: "PT Root UI VF"
text: ExportController.config
wrapMode: Text.Wrap
background: Rectangle {
color: "transparent"
}
}
}
}