Commit 5b267c9a authored by Ming Rui Zhang's avatar Ming Rui Zhang Committed by Sébastien Blin
Browse files

dialog: use popup dialogs to replace the existing Qt.labs.platform ones

Dialog in Qt.labs.platform which is used to be native in Qt 5.15
cannnot be accessed in Qt 6.2 for now, use popup dialogs instead

1. Add tittle
2. DropShadow revisit
3. Dim properly

Change-Id: I8804ae0c30e3450c9a800d9a1c3946ff0bf44b46
parent 2c7a0e16
......@@ -21,8 +21,7 @@
<file>src/commoncomponents/UsernameLineEdit.qml</file>
<file>src/commoncomponents/Scaffold.qml</file>
<file>src/commoncomponents/LineEditContextMenu.qml</file>
<file>src/commoncomponents/BaseDialog.qml</file>
<file>src/commoncomponents/ModalPopup.qml</file>
<file>src/commoncomponents/BaseModalDialog.qml</file>
<file>src/commoncomponents/SimpleMessageDialog.qml</file>
<file>src/commoncomponents/ResponsiveImage.qml</file>
<file>src/commoncomponents/PresenceIndicator.qml</file>
......
......@@ -198,17 +198,6 @@ ApplicationWindow {
}
}
Overlay.modal: ColorOverlay {
source: root.contentItem
color: "transparent"
// Color animation for overlay when pop up is shown.
ColorAnimation on color {
to: Qt.rgba(0, 0, 0, 0.33)
duration: 500
}
}
Component.onCompleted: {
DBusErrorHandler.setActive(true)
......
......@@ -202,17 +202,6 @@ ApplicationWindow {
}
}
Overlay.modal: ColorOverlay {
source: root.contentItem
color: "transparent"
// Color animation for overlay when pop up is shown.
ColorAnimation on color {
to: Qt.rgba(0, 0, 0, 0.33)
duration: 500
}
}
onClosing: root.close()
onScreenChanged: JamiQmlUtils.mainApplicationScreen = root.screen
......
/*
* Copyright (C) 2020 by Savoir-faire Linux
* Author: Albert Babí <albert.babi@savoirfairelinux.com>
*
* This program is free software; you can redistribute it and/or modify
* it under the terms of the GNU General Public License as published by
* the Free Software Foundation; either version 3 of the License, or
* (at your option) any later version.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU General Public License for more details.
*
* You should have received a copy of the GNU General Public License
* along with this program. If not, see <https://www.gnu.org/licenses/>.
*/
import QtQuick
import QtQuick.Controls
Dialog {
id: root
visible: false
}
......@@ -18,6 +18,7 @@
import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
import Qt5Compat.GraphicalEffects
import net.jami.Constants 1.1
......@@ -28,6 +29,12 @@ Popup {
// convient access to closePolicy
property bool autoClose: true
property alias backgroundColor: container.color
property alias title: titleText.text
property var popupContentLoader: containerSubContentLoader
property alias popupContentLoadStatus: containerSubContentLoader.status
property alias popupContent: containerSubContentLoader.sourceComponent
property int popupContentPreferredHeight: 0
property int popupContentPreferredWidth: 0
parent: Overlay.overlay
......@@ -37,20 +44,64 @@ Popup {
modal: true
padding: 0
// A popup is invisible until opened.
visible: false
closePolicy: autoClose ?
(Popup.CloseOnEscape | Popup.CloseOnPressOutside) :
Popup.NoAutoClose
padding: 0
background: Rectangle {
Rectangle {
id: container
anchors.fill: parent
ColumnLayout {
anchors.fill: parent
spacing: 0
Text {
id: titleText
Layout.alignment: Qt.AlignTop | Qt.AlignLeft
Layout.margins: text.length === 0 ? 0 : 10
Layout.preferredHeight: text.length === 0 ? 0 : contentHeight
font.pointSize: 12
color: JamiTheme.textColor
}
Loader {
id: containerSubContentLoader
Layout.alignment: Qt.AlignCenter
Layout.fillWidth: popupContentPreferredWidth === 0
Layout.fillHeight: popupContentPreferredHeight === 0
Layout.preferredHeight: popupContentPreferredHeight
Layout.preferredWidth: popupContentPreferredWidth
}
}
radius: JamiTheme.modalPopupRadius
width: root.width
height: root.height
color: JamiTheme.secondaryBackgroundColor
}
background: Rectangle {
color: JamiTheme.transparentColor
}
Overlay.modal: Rectangle {
color: JamiTheme.transparentColor
// Color animation for overlay when pop up is shown.
ColorAnimation on color {
to: JamiTheme.popupOverlayColor
duration: 500
}
}
DropShadow {
......
......@@ -23,7 +23,7 @@ import QtQuick.Layouts
import net.jami.Constants 1.1
import net.jami.Models 1.1
ModalPopup {
BaseModalDialog {
id: root
property bool connectionFailed: false
......@@ -31,73 +31,69 @@ ModalPopup {
autoClose: false
contentItem: Rectangle {
id: contentRect
implicitHeight: daemonReconnectPopupColumnLayout.implicitHeight + 50
color: JamiTheme.secondaryBackgroundColor
ColumnLayout {
id: daemonReconnectPopupColumnLayout
anchors.fill: parent
onPopupContentLoadStatusChanged: {
if (popupContentLoadStatus === Loader.Ready) {
root.height = Qt.binding(function() {
return popupContentLoader.item.implicitHeight + 50
})
root.width = Qt.binding(function() {
return popupContentLoader.item.implicitWidth + 50
})
}
}
spacing: 0
popupContent: ColumnLayout {
id: daemonReconnectPopupColumnLayout
Text {
id: daemonReconnectPopupTextLabel
spacing: 0
Layout.alignment: Qt.AlignHCenter | Qt.AlignTop
Layout.topMargin: preferredMargin
Text {
id: daemonReconnectPopupTextLabel
text: connectionFailed ? JamiStrings.reconnectionFailed :
JamiStrings.reconnectDaemon
font.pointSize: JamiTheme.textFontSize + 2
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter
color: JamiTheme.textColor
Layout.alignment: Qt.AlignHCenter | Qt.AlignTop
Layout.topMargin: preferredMargin
Component.onCompleted: {
contentRect.implicitWidth = JamiQmlUtils.getTextBoundingRect(
font, text).width + 100
}
}
text: connectionFailed ? JamiStrings.reconnectionFailed :
JamiStrings.reconnectDaemon
font.pointSize: JamiTheme.textFontSize + 2
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter
color: JamiTheme.textColor
}
AnimatedImage {
Layout.alignment: Qt.AlignHCenter | Qt.AlignBottom
Layout.preferredHeight: 30
Layout.preferredWidth: 30
Layout.bottomMargin: preferredMargin
AnimatedImage {
Layout.alignment: Qt.AlignHCenter | Qt.AlignBottom
Layout.preferredHeight: 30
Layout.preferredWidth: 30
Layout.bottomMargin: preferredMargin
visible: !connectionFailed
visible: !connectionFailed
source: JamiResources.jami_rolling_spinner_gif
source: JamiResources.jami_rolling_spinner_gif
playing: true
paused: false
mipmap: true
smooth: true
fillMode: Image.PreserveAspectFit
}
playing: true
paused: false
mipmap: true
smooth: true
fillMode: Image.PreserveAspectFit
}
MaterialButton {
id: btnOk
MaterialButton {
id: btnOk
Layout.alignment: Qt.AlignHCenter | Qt.AlignBottom
Layout.alignment: Qt.AlignHCenter | Qt.AlignBottom
preferredWidth: JamiTheme.preferredFieldWidth / 2
preferredWidth: JamiTheme.preferredFieldWidth / 2
visible: connectionFailed
visible: connectionFailed
text: qsTr("Ok")
color: JamiTheme.buttonTintedBlue
hoveredColor: JamiTheme.buttonTintedBlueHovered
pressedColor: JamiTheme.buttonTintedBluePressed
outlined: true
text: JamiStrings.optionOk
color: JamiTheme.buttonTintedBlue
hoveredColor: JamiTheme.buttonTintedBlueHovered
pressedColor: JamiTheme.buttonTintedBluePressed
outlined: true
onClicked: Qt.quit()
}
onClicked: Qt.quit()
}
}
}
......@@ -26,7 +26,7 @@ import net.jami.Constants 1.1
import "../commoncomponents"
BaseDialog {
BaseModalDialog {
id: root
property bool isSIP: {
......@@ -42,140 +42,131 @@ BaseDialog {
title: JamiStrings.deleteAccount
contentItem: Rectangle {
id: deleteAccountContentRect
width: JamiTheme.preferredDialogWidth
height: JamiTheme.preferredDialogHeight
implicitWidth: JamiTheme.preferredDialogWidth
implicitHeight: JamiTheme.preferredDialogHeight
color: JamiTheme.secondaryBackgroundColor
popupContent: ColumnLayout {
id: deleteAccountContentColumnLayout
ColumnLayout {
anchors.centerIn: parent
anchors.fill: parent
anchors.margins: JamiTheme.preferredMarginSize
Label {
id: labelDeletion
Label {
id: labelDeletion
Layout.alignment: Qt.AlignHCenter
Layout.preferredWidth: deleteAccountContentColumnLayout.width -
JamiTheme.preferredMarginSize * 2
Layout.alignment: Qt.AlignHCenter
Layout.preferredWidth: deleteAccountContentRect.width -
JamiTheme.preferredMarginSize * 2
color: JamiTheme.textColor
text: JamiStrings.confirmDeleteQuestion
color: JamiTheme.textColor
text: JamiStrings.confirmDeleteQuestion
font.pointSize: JamiTheme.textFontSize
font.kerning: true
font.pointSize: JamiTheme.textFontSize
font.kerning: true
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter
wrapMode: Text.Wrap
}
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter
wrapMode: Text.Wrap
}
Label {
id: labelBestId
Label {
id: labelBestId
Layout.alignment: Qt.AlignHCenter
Layout.preferredWidth: deleteAccountContentRect.width -
JamiTheme.preferredMarginSize * 2
Layout.alignment: Qt.AlignHCenter
Layout.preferredWidth: deleteAccountContentColumnLayout.width -
JamiTheme.preferredMarginSize * 2
color: JamiTheme.textColor
text: CurrentAccount.bestName
color: JamiTheme.textColor
text: CurrentAccount.bestName
font.pointSize: JamiTheme.textFontSize
font.kerning: true
font.bold: true
font.pointSize: JamiTheme.textFontSize
font.kerning: true
font.bold: true
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter
wrapMode: Text.Wrap
}
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter
wrapMode: Text.Wrap
}
Label {
id: labelAccountHash
Label {
id: labelAccountHash
Layout.alignment: Qt.AlignHCenter
Layout.preferredWidth: deleteAccountContentRect.width -
JamiTheme.preferredMarginSize * 2
Layout.alignment: Qt.AlignHCenter
Layout.preferredWidth: deleteAccountContentColumnLayout.width -
JamiTheme.preferredMarginSize * 2
color: JamiTheme.textColor
text: CurrentAccount.uri
color: JamiTheme.textColor
text: CurrentAccount.uri
font.pointSize: JamiTheme.textFontSize
font.kerning: true
font.pointSize: JamiTheme.textFontSize
font.kerning: true
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter
wrapMode: Text.Wrap
}
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter
wrapMode: Text.Wrap
}
Label {
id: labelWarning
Label {
id: labelWarning
visible: !isSIP
visible: !isSIP
Layout.alignment: Qt.AlignHCenter
Layout.preferredWidth: deleteAccountContentRect.width -
JamiTheme.preferredMarginSize * 2
Layout.alignment: Qt.AlignHCenter
Layout.preferredWidth: deleteAccountContentColumnLayout.width -
JamiTheme.preferredMarginSize * 2
text: JamiStrings.deleteAccountInfos
text: JamiStrings.deleteAccountInfos
font.pointSize: JamiTheme.textFontSize
font.kerning: true
font.pointSize: JamiTheme.textFontSize
font.kerning: true
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter
wrapMode: Text.Wrap
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter
wrapMode: Text.Wrap
color: "red"
}
color: JamiTheme.redColor
}
RowLayout {
spacing: 16
Layout.fillWidth: true
Layout.alignment: Qt.AlignCenter
RowLayout {
spacing: 16
Layout.fillWidth: true
Layout.alignment: Qt.AlignCenter
MaterialButton {
id: btnDelete
MaterialButton {
id: btnDelete
Layout.alignment: Qt.AlignHCenter
Layout.alignment: Qt.AlignHCenter
preferredWidth: JamiTheme.preferredFieldWidth / 2 - 8
preferredHeight: JamiTheme.preferredFieldHeight
preferredWidth: JamiTheme.preferredFieldWidth / 2 - 8
preferredHeight: JamiTheme.preferredFieldHeight
color: JamiTheme.buttonTintedRed
hoveredColor: JamiTheme.buttonTintedRedHovered
pressedColor: JamiTheme.buttonTintedRedPressed
outlined: true
color: JamiTheme.buttonTintedRed
hoveredColor: JamiTheme.buttonTintedRedHovered
pressedColor: JamiTheme.buttonTintedRedPressed
outlined: true
text: qsTr("Delete")
text: JamiStrings.optionDelete
onClicked: {
AccountAdapter.deleteCurrentAccount()
accepted()
close()
}
onClicked: {
AccountAdapter.deleteCurrentAccount()
accepted()
close()
}
}
MaterialButton {
id: btnCancel
MaterialButton {
id: btnCancel
Layout.alignment: Qt.AlignHCenter
Layout.alignment: Qt.AlignHCenter
preferredWidth: JamiTheme.preferredFieldWidth / 2 - 8
preferredHeight: JamiTheme.preferredFieldHeight
preferredWidth: JamiTheme.preferredFieldWidth / 2 - 8
preferredHeight: JamiTheme.preferredFieldHeight
color: JamiTheme.buttonTintedBlack
hoveredColor: JamiTheme.buttonTintedBlackHovered
pressedColor: JamiTheme.buttonTintedBlackPressed
outlined: true
color: JamiTheme.buttonTintedBlack
hoveredColor: JamiTheme.buttonTintedBlackHovered
pressedColor: JamiTheme.buttonTintedBlackPressed
outlined: true
text: qsTr("Cancel")
text: JamiStrings.optionCancel
onClicked: {
close()
}
}
onClicked: close()
}
}
}
......
......@@ -23,7 +23,7 @@ import net.jami.Adapters 1.1
import net.jami.Constants 1.1
// PasswordDialog for changing password and exporting account
BaseDialog {
BaseModalDialog {
id: root
enum PasswordEnteringPurpose {
......@@ -40,52 +40,12 @@ BaseDialog {
function openDialog(purposeIn, exportPathIn = "") {
purpose = purposeIn
path = exportPathIn
currentPasswordEdit.clear()
passwordEdit.clear()
confirmPasswordEdit.clear()
validatePassword()
open()
}
function validatePassword() {
switch (purpose) {
case PasswordDialog.ExportAccount:
btnConfirm.enabled = currentPasswordEdit.length > 0
break
case PasswordDialog.SetPassword:
btnConfirm.enabled = passwordEdit.length > 0 &&
passwordEdit.text === confirmPasswordEdit.text
break
default:
btnConfirm.enabled = currentPasswordEdit.length > 0 &&
passwordEdit.text === confirmPasswordEdit.text
}
}
function exportAccountQML() {
var success = false
if (path.length > 0) {
success = AccountAdapter.exportToFile(
LRCInstance.currentAccountId,
path,
currentPasswordEdit.text)
}
doneSignal(success, purpose)
close()
open()
}
function savePasswordQML() {
var success = false
success = AccountAdapter.savePassword(
LRCInstance.currentAccountId,
currentPasswordEdit.text,
passwordEdit.text)
if (success) {
AccountAdapter.setArchiveHasPassword(passwordEdit.text.length !== 0)
}
doneSignal(success, purpose)
close()
}
height: JamiTheme.preferredDialogHeight
width: JamiTheme.preferredDialogWidth
title: {
switch(purpose){
......@@ -98,131 +58,161 @@ BaseDialog {