mirror of
https://gitlab.linphone.org/BC/public/linphone-desktop.git
synced 2026-01-17 11:28:07 +00:00
UI fixes : digit input (indicator), error messages (text + colors), pages item sizes, popup background
This commit is contained in:
Gaelle Braud
parent
24c78564ef
commit
18ad29338c
13 changed files with 262 additions and 204 deletions
|
|
@ -23,17 +23,17 @@ Window {
|
|||
|
||||
AccountProxy{
|
||||
id: accountProxy
|
||||
onHaveAccountChanged: {
|
||||
if(haveAccount)
|
||||
mainWindowStackView.replace(mainPage, StackView.Immediate)
|
||||
else
|
||||
mainWindowStackView.replace(loginPage, StackView.Immediate)
|
||||
}
|
||||
// onHaveAccountChanged: {
|
||||
// if(haveAccount)
|
||||
// mainWindowStackView.replace(mainPage, StackView.Immediate)
|
||||
// else
|
||||
// mainWindowStackView.replace(loginPage, StackView.Immediate)
|
||||
// }
|
||||
}
|
||||
StackView {
|
||||
id: mainWindowStackView
|
||||
anchors.fill: parent
|
||||
initialItem: accountProxy.haveAccount ? mainPage : welcomePage
|
||||
initialItem: welcomePage
|
||||
}
|
||||
Component {
|
||||
id: welcomePage
|
||||
|
|
|
|||
|
|
@ -30,6 +30,7 @@ list(APPEND _LINPHONEAPP_QML_FILES
|
|||
view/Item/DesktopPopup.qml
|
||||
view/Item/DigitInput.qml
|
||||
view/Item/EffectImage.qml
|
||||
view/Item/ErrorText.qml
|
||||
view/Item/NumericPad.qml
|
||||
view/Item/PhoneNumberComboBox.qml
|
||||
view/Item/PhoneNumberInput.qml
|
||||
|
|
|
|||
|
|
@ -1,13 +1,14 @@
|
|||
import QtQuick
|
||||
import QtQuick.Controls as Control
|
||||
import QtQuick.Layouts 1.0
|
||||
import QtQuick.Effects
|
||||
import Linphone
|
||||
|
||||
ColumnLayout {
|
||||
id: mainItem
|
||||
property string label: ""
|
||||
property int backgroundWidth: 200 * DefaultStyle.dp
|
||||
// Usage : each item of the model list must be {text: ..., img: ...}
|
||||
// If string list, only text part of the delegate will be filled
|
||||
property var modelList: []
|
||||
readonly property string currentText: selectedItemText.text
|
||||
property bool enableBackgroundColors: true
|
||||
|
|
@ -27,9 +28,9 @@ ColumnLayout {
|
|||
Control.ComboBox {
|
||||
id: combobox
|
||||
model: mainItem.modelList
|
||||
width: mainItem.backgroundWidth
|
||||
Layout.preferredWidth: mainItem.width
|
||||
background: Rectangle {
|
||||
implicitWidth: mainItem.backgroundWidth
|
||||
implicitWidth: mainItem.width
|
||||
implicitHeight: 49 * DefaultStyle.dp
|
||||
radius: 63 * DefaultStyle.dp
|
||||
color: combobox.enabled ? DefaultStyle.grey_100 : DefaultStyle.grey_200
|
||||
|
|
@ -53,6 +54,10 @@ ColumnLayout {
|
|||
id: selectedItemText
|
||||
color: combobox.enabled ? DefaultStyle.main2_600 : DefaultStyle.grey_400
|
||||
elide: Text.ElideRight
|
||||
font {
|
||||
pixelSize: 14 * DefaultStyle.dp
|
||||
weight: 400 * DefaultStyle.dp
|
||||
}
|
||||
anchors.left: selectedItemImg.right
|
||||
anchors.leftMargin: selectedItemImg.visible ? 5 * DefaultStyle.dp : 10 * DefaultStyle.dp
|
||||
anchors.right: parent.right
|
||||
|
|
@ -98,7 +103,7 @@ ColumnLayout {
|
|||
highlight: Rectangle {
|
||||
width: listView.width
|
||||
color: DefaultStyle.main2_300
|
||||
radius: 63 * DefaultStyle.dp
|
||||
radius: 15 * DefaultStyle.dp
|
||||
y: listView.currentItem? listView.currentItem.y : 0
|
||||
}
|
||||
|
||||
|
|
@ -127,6 +132,10 @@ ColumnLayout {
|
|||
? modelData
|
||||
: ""
|
||||
elide: Text.ElideRight
|
||||
font {
|
||||
pixelSize: 14 * DefaultStyle.dp
|
||||
weight: 400 * DefaultStyle.dp
|
||||
}
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
anchors.left: delegateImg.right
|
||||
anchors.leftMargin: delegateImg.visible ? 5 * DefaultStyle.dp : 10 * DefaultStyle.dp
|
||||
|
|
@ -140,7 +149,7 @@ ColumnLayout {
|
|||
Rectangle {
|
||||
anchors.fill: parent
|
||||
opacity: 0.1
|
||||
radius: 63 * DefaultStyle.dp
|
||||
radius: 15 * DefaultStyle.dp
|
||||
color: DefaultStyle.main2_500main
|
||||
visible: parent.containsMouse
|
||||
}
|
||||
|
|
@ -165,11 +174,23 @@ ColumnLayout {
|
|||
listView.positionViewAtIndex(listView.currentIndex, ListView.Center)
|
||||
}
|
||||
|
||||
background: Rectangle {
|
||||
implicitWidth: mainItem.backgroundWidth
|
||||
background: Item {
|
||||
implicitWidth: mainItem.width
|
||||
implicitHeight: 30 * DefaultStyle.dp
|
||||
radius: 63 * DefaultStyle.dp
|
||||
}
|
||||
Rectangle {
|
||||
id: cboxBg
|
||||
anchors.fill: parent
|
||||
radius: 15 * DefaultStyle.dp
|
||||
}
|
||||
MultiEffect {
|
||||
anchors.fill: cboxBg
|
||||
source: cboxBg
|
||||
shadowEnabled: true
|
||||
shadowColor: DefaultStyle.grey_1000
|
||||
shadowBlur: 1
|
||||
shadowOpacity: 0.1
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -6,42 +6,46 @@ Control.TextField {
|
|||
id: mainItem
|
||||
property int inputSize: 100 * DefaultStyle.dp
|
||||
color: activeFocus ? DefaultStyle.main1_500_main : DefaultStyle.main2_500main
|
||||
rightPadding: width * 0.32
|
||||
leftPadding: width * 0.32
|
||||
topPadding: height * 0.2
|
||||
bottomPadding: height * 0.2
|
||||
validator: IntValidator{bottom: 0; top: 9}
|
||||
// horizontalAlignment: TextInput.AlignHCenter
|
||||
// verticalAlignment: TextInput.AlignVCenter
|
||||
|
||||
width: inputSize * 0.9
|
||||
height: inputSize
|
||||
horizontalAlignment: TextInput.AlignHCenter
|
||||
verticalAlignment: TextInput.AlignVCenter
|
||||
|
||||
// just reserve the space for the background
|
||||
placeholderText: "0"
|
||||
placeholderTextColor: "transparent"
|
||||
|
||||
// cursorVisible is overwritten on focus change so useless to hide the cursor
|
||||
cursorDelegate: Item{}
|
||||
|
||||
// horizontalAlignment: Control.TextField.AlignHCenter
|
||||
font.family: DefaultStyle.defaultFont
|
||||
font.pixelSize: inputSize / 2
|
||||
font.weight: 300 * DefaultStyle.dp
|
||||
|
||||
background: Rectangle {
|
||||
id: background
|
||||
border.width: Math.max(DefaultStyle.dp, 1)
|
||||
border.color: mainItem.activeFocus ? DefaultStyle.main1_500_main : DefaultStyle.main2_500main
|
||||
radius: mainItem.inputSize * 0.15
|
||||
width: mainItem.inputSize * 0.9
|
||||
height: mainItem.inputSize
|
||||
background: Item {
|
||||
anchors.fill: parent
|
||||
// width: mainItem.inputSize * 0.9
|
||||
// height: mainItem.inputSize
|
||||
Rectangle {
|
||||
id: background
|
||||
border.width: Math.max(DefaultStyle.dp, 1)
|
||||
border.color: mainItem.activeFocus ? DefaultStyle.main1_500_main : DefaultStyle.main2_500main
|
||||
radius: mainItem.inputSize * 0.15
|
||||
width: mainItem.inputSize * 0.9
|
||||
height: mainItem.inputSize
|
||||
}
|
||||
Rectangle {
|
||||
id: indicator
|
||||
visible: mainItem.activeFocus
|
||||
color: DefaultStyle.main1_500_main
|
||||
height : Math.max(0.5, 1 * DefaultStyle.dp)
|
||||
width: mainItem.inputSize * 0.67
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
anchors.bottom: parent.bottom
|
||||
anchors.bottomMargin: (mainItem.inputSize / 8) * DefaultStyle.dp
|
||||
}
|
||||
}
|
||||
// cursorDelegate: Rectangle {
|
||||
// visible: mainItem.activeFocus
|
||||
// // width: mainItem.cursorRectangle.width
|
||||
// // height: mainItem.cursorRectangle.height - inputSize/5
|
||||
// x: background.x
|
||||
// y: background.height - inputSize/8
|
||||
// transform: Rotation {angle: -90}
|
||||
// // anchors.bottom: parent.bottom
|
||||
// // anchors.left: parent.left
|
||||
// // anchors.bottomMargin: inputSize/8
|
||||
// // transform: [/*Translate {x: mainItem.cursorRectangle.height},*/ Rotation {angle: -90}]
|
||||
// color:DefaultStyle.main1_500_main
|
||||
// }
|
||||
}
|
||||
}
|
||||
55
Linphone/view/Item/ErrorText.qml
Normal file
55
Linphone/view/Item/ErrorText.qml
Normal file
|
|
@ -0,0 +1,55 @@
|
|||
import QtQuick
|
||||
import QtQuick.Controls as Control
|
||||
import QtQuick.Layouts 1.0
|
||||
import QtQuick.Effects
|
||||
import Linphone
|
||||
|
||||
Text {
|
||||
id: mainItem
|
||||
color: DefaultStyle.danger_500main
|
||||
opacity: 0
|
||||
font {
|
||||
pixelSize: 13 * DefaultStyle.dp
|
||||
weight: 600 * DefaultStyle.dp
|
||||
}
|
||||
states: [
|
||||
State{
|
||||
name: "Visible"
|
||||
PropertyChanges{target: mainItem; opacity: 1.0}
|
||||
},
|
||||
State{
|
||||
name:"Invisible"
|
||||
PropertyChanges{target: mainItem; opacity: 0.0}
|
||||
}
|
||||
]
|
||||
transitions: [
|
||||
Transition {
|
||||
from: "Visible"
|
||||
to: "Invisible"
|
||||
NumberAnimation {
|
||||
property: "opacity"
|
||||
duration: 1000
|
||||
}
|
||||
// NumberAnimation {
|
||||
// property: "visible"
|
||||
// duration: 1100
|
||||
// }
|
||||
}
|
||||
]
|
||||
Timer {
|
||||
id: autoHideErrorMessage
|
||||
interval: 2500
|
||||
onTriggered: mainItem.state = "Invisible"
|
||||
}
|
||||
|
||||
onOpacityChanged: if (opacity === 1) autoHideErrorMessage.restart()
|
||||
|
||||
Connections {
|
||||
target: mainItem
|
||||
onTextChanged: {
|
||||
if (mainItem.text.length > 0) {
|
||||
errorText.state = "Visible"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -13,52 +13,41 @@ ColumnLayout {
|
|||
id: username
|
||||
label: "Username"
|
||||
mandatory: true
|
||||
textInputWidth: 250 * DefaultStyle.dp
|
||||
enableErrorText: true
|
||||
|
||||
Binding on background.border.color {
|
||||
when: errorText.opacity != 0
|
||||
value: DefaultStyle.danger_500main
|
||||
}
|
||||
Binding on textField.color {
|
||||
when: errorText.opacity != 0
|
||||
value: DefaultStyle.danger_500main
|
||||
}
|
||||
}
|
||||
TextInput {
|
||||
id: password
|
||||
label: "Password"
|
||||
mandatory: true
|
||||
hidden: true
|
||||
textInputWidth: 250 * DefaultStyle.dp
|
||||
enableErrorText: true
|
||||
|
||||
Binding on background.border.color {
|
||||
when: errorText.opacity != 0
|
||||
value: DefaultStyle.danger_500main
|
||||
}
|
||||
Binding on textField.color {
|
||||
when: errorText.opacity != 0
|
||||
value: DefaultStyle.danger_500main
|
||||
}
|
||||
}
|
||||
|
||||
Text {
|
||||
ErrorText {
|
||||
id: errorText
|
||||
text: "Connection has failed. Please verify your credentials"
|
||||
color: DefaultStyle.danger_500main
|
||||
opacity: 0
|
||||
states: [
|
||||
State{
|
||||
name: "Visible"
|
||||
PropertyChanges{target: errorText; opacity: 1.0}
|
||||
},
|
||||
State{
|
||||
name:"Invisible"
|
||||
PropertyChanges{target: errorText; opacity: 0.0}
|
||||
}
|
||||
]
|
||||
transitions: [
|
||||
Transition {
|
||||
from: "Visible"
|
||||
to: "Invisible"
|
||||
NumberAnimation {
|
||||
property: "opacity"
|
||||
duration: 1000
|
||||
}
|
||||
}
|
||||
]
|
||||
Timer {
|
||||
id: autoHideErrorMessage
|
||||
interval: 2500
|
||||
onTriggered: errorText.state = "Invisible"
|
||||
}
|
||||
Connections {
|
||||
target: LoginPageCpp
|
||||
onRegistrationStateChanged: {
|
||||
if (LoginPageCpp.registrationState === LinphoneEnums.RegistrationState.Failed) {
|
||||
errorText.state = "Visible"
|
||||
autoHideErrorMessage.restart()
|
||||
errorText.text = qsTr("Le couple identifiant mot de passe ne correspont pas")
|
||||
} else if (LoginPageCpp.registrationState === LinphoneEnums.RegistrationState.Ok) {
|
||||
mainItem.connectionSucceed()
|
||||
}
|
||||
|
|
@ -69,7 +58,7 @@ ColumnLayout {
|
|||
RowLayout {
|
||||
id: lastFormLineLayout
|
||||
Button {
|
||||
text: "Log in"
|
||||
text: qsTr("Connexion")
|
||||
Layout.rightMargin: 20 * DefaultStyle.dp
|
||||
onClicked: {
|
||||
username.errorMessage = ""
|
||||
|
|
|
|||
|
|
@ -190,18 +190,22 @@ ColumnLayout {
|
|||
listView.positionViewAtIndex(listView.currentIndex, ListView.Center)
|
||||
}
|
||||
|
||||
background: Rectangle {
|
||||
background: Item {
|
||||
anchors.fill: parent
|
||||
radius: 15 * DefaultStyle.dp
|
||||
color: DefaultStyle.grey_100
|
||||
}
|
||||
|
||||
MultiEffect {
|
||||
anchors.fill: listPopup
|
||||
source: listPopup
|
||||
shadowEnabled: true
|
||||
shadowColor: DefaultStyle.grey_1000
|
||||
shadowBlur: 1
|
||||
Rectangle {
|
||||
id: popupBg
|
||||
anchors.fill: parent
|
||||
radius: 15 * DefaultStyle.dp
|
||||
color: DefaultStyle.grey_100
|
||||
}
|
||||
MultiEffect {
|
||||
anchors.fill: popupBg
|
||||
source: popupBg
|
||||
shadowEnabled: true
|
||||
shadowColor: DefaultStyle.grey_1000
|
||||
shadowBlur: 1
|
||||
shadowOpacity: 0.1
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -27,8 +27,8 @@ ColumnLayout {
|
|||
}
|
||||
|
||||
Rectangle {
|
||||
implicitWidth: mainItem.textInputWidth
|
||||
implicitHeight: 49 * DefaultStyle.dp
|
||||
Layout.preferredWidth: mainItem.textInputWidth
|
||||
Layout.preferredHeight: 49 * DefaultStyle.dp
|
||||
radius: 63 * DefaultStyle.dp
|
||||
color: DefaultStyle.grey_100
|
||||
border.color: mainItem.errorMessage.length > 0
|
||||
|
|
|
|||
|
|
@ -16,6 +16,12 @@ ColumnLayout {
|
|||
property bool fillWidth: false
|
||||
property bool enableBackgroundColors: true
|
||||
property string initialText
|
||||
|
||||
property bool enableErrorText: false
|
||||
|
||||
property alias textField: textField
|
||||
property alias background: input
|
||||
|
||||
readonly property string text: textField.text
|
||||
readonly property bool hasActiveFocus: textField.activeFocus
|
||||
|
||||
|
|
@ -50,21 +56,24 @@ ColumnLayout {
|
|||
if (mainItem.fillWidth)
|
||||
Layout.fillWidth = true
|
||||
}
|
||||
implicitWidth: mainItem.textInputWidth
|
||||
implicitHeight: 49 * DefaultStyle.dp
|
||||
Layout.preferredWidth: mainItem.textInputWidth
|
||||
Layout.preferredHeight: 49 * DefaultStyle.dp
|
||||
radius: 79 * DefaultStyle.dp
|
||||
color: mainItem.enableBackgroundColors ? DefaultStyle.grey_100 : "transparent"
|
||||
border.color: mainItem.enableBackgroundColors
|
||||
? (mainItem.errorMessage.length > 0
|
||||
? DefaultStyle.danger_500main
|
||||
: textField.activeFocus
|
||||
? DefaultStyle.main1_500_main
|
||||
: DefaultStyle.grey_200)
|
||||
: "transparent"
|
||||
? errorText.opacity === 0
|
||||
? textField.activeFocus
|
||||
? DefaultStyle.main1_500_main
|
||||
: DefaultStyle.grey_200
|
||||
: DefaultStyle.danger_500main
|
||||
: "transparent"
|
||||
|
||||
Control.TextField {
|
||||
id: textField
|
||||
anchors.left: parent.left
|
||||
anchors.leftMargin: 10 * DefaultStyle.dp
|
||||
anchors.right: eyeButton.visible ? eyeButton.left : parent.right
|
||||
anchors.rightMargin: eyeButton.visible ? 0 : 10 * DefaultStyle.dp
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
placeholderText: mainItem.placeholderText
|
||||
echoMode: (mainItem.hidden && !eyeButton.checked) ? TextInput.Password : TextInput.Normal
|
||||
|
|
@ -73,7 +82,7 @@ ColumnLayout {
|
|||
pixelSize: 14 * DefaultStyle.dp
|
||||
weight: 400 * DefaultStyle.dp
|
||||
}
|
||||
color: DefaultStyle.main2_600
|
||||
color: errorText.opacity === 0 ? DefaultStyle.main2_600 : DefaultStyle.danger_500main
|
||||
selectByMouse: true
|
||||
validator: mainItem.validator
|
||||
background: Item {
|
||||
|
|
@ -95,25 +104,19 @@ ColumnLayout {
|
|||
contentItem: Image {
|
||||
fillMode: Image.PreserveAspectFit
|
||||
source: eyeButton.checked ? AppIcons.eyeShow : AppIcons.eyeHide
|
||||
width: 20 * DefaultStyle.dp
|
||||
height: 20 * DefaultStyle.dp
|
||||
}
|
||||
anchors.top: parent.top
|
||||
anchors.bottom: parent.bottom
|
||||
anchors.right: parent.right
|
||||
anchors.rightMargin: 5 * DefaultStyle.dp
|
||||
}
|
||||
}
|
||||
Text {
|
||||
visible: mainItem.errorMessage.length > 0
|
||||
verticalAlignment: Text.AlignVCenter
|
||||
ErrorText {
|
||||
id: errorText
|
||||
visible: mainItem.enableErrorText
|
||||
text: mainItem.errorMessage
|
||||
color: DefaultStyle.danger_500main
|
||||
elide: Text.ElideRight
|
||||
wrapMode: Text.Wrap
|
||||
// maximumLineCount: 1
|
||||
font {
|
||||
pixelSize: 13 * DefaultStyle.dp
|
||||
family: DefaultStyle.defaultFont
|
||||
bold: true
|
||||
}
|
||||
Layout.preferredWidth: mainItem.textInputWidth
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -32,7 +32,7 @@ LoginLayout {
|
|||
source: AppIcons.profile
|
||||
}
|
||||
Text {
|
||||
text: "Login"
|
||||
text: qsTr("Connexion")
|
||||
font {
|
||||
pixelSize: 36 * DefaultStyle.dp
|
||||
weight: 800 * DefaultStyle.dp
|
||||
|
|
@ -44,13 +44,13 @@ LoginLayout {
|
|||
}
|
||||
Text {
|
||||
Layout.rightMargin: 15 * DefaultStyle.dp
|
||||
text: "No account yet ?"
|
||||
text: qsTr("Pas encore de compte ?")
|
||||
font.pixelSize: 14 * DefaultStyle.dp
|
||||
font.weight: 400 * DefaultStyle.dp
|
||||
}
|
||||
Button {
|
||||
Layout.alignment: Qt.AlignRight
|
||||
text: "Register"
|
||||
text: qsTr("S'inscrire")
|
||||
onClicked: {
|
||||
console.debug("[LoginPage] User: go to register")
|
||||
mainItem.goToRegister()
|
||||
|
|
@ -68,7 +68,7 @@ LoginLayout {
|
|||
Button {
|
||||
Layout.topMargin: 40 * DefaultStyle.dp
|
||||
inversedColors: true
|
||||
text: "Use SIP Account"
|
||||
text: qsTr("Compte SIP tiers")
|
||||
onClicked: {mainItem.useSIPButtonClicked()}
|
||||
}
|
||||
}
|
||||
|
|
@ -76,14 +76,15 @@ LoginLayout {
|
|||
Layout.fillWidth: true
|
||||
}
|
||||
Image {
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
Layout.rightMargin: 40 * DefaultStyle.dp
|
||||
Layout.preferredWidth: 300 * DefaultStyle.dp
|
||||
Layout.preferredWidth: 395 * DefaultStyle.dp
|
||||
fillMode: Image.PreserveAspectFit
|
||||
source: AppIcons.loginImage
|
||||
}
|
||||
}
|
||||
Item {
|
||||
Layout.fillHeight: true
|
||||
Item {
|
||||
Layout.fillHeight: true
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -50,7 +50,10 @@ LoginLayout {
|
|||
Text {
|
||||
Layout.alignment: Qt.AlignTop
|
||||
font.bold: true
|
||||
font.pixelSize: DefaultStyle.defaultFontPointSize
|
||||
font {
|
||||
pixelSize: 22 * DefaultStyle.dp
|
||||
weight: 800 * DefaultStyle.dp
|
||||
}
|
||||
color: DefaultStyle.main2_700
|
||||
text: {
|
||||
var completeString = (mainItem.email.length > 0) ? ("email " + mainItem.email) : ("phone number " + mainItem.phoneNumber)
|
||||
|
|
@ -71,16 +74,22 @@ LoginLayout {
|
|||
model: 4
|
||||
DigitInput {
|
||||
required property int index
|
||||
onTextEdited: if (text.length > 0 ) {
|
||||
if (index < 3)
|
||||
nextItemInFocusChain(true).forceActiveFocus()
|
||||
else {
|
||||
// validate()
|
||||
}
|
||||
} else {
|
||||
if (index > 0)
|
||||
nextItemInFocusChain(false).forceActiveFocus()
|
||||
}
|
||||
Layout.preferredWidth: width
|
||||
Layout.preferredHeight: height
|
||||
Component.onCompleted: console.log("completed", width, Layout.preferredWidth)
|
||||
onTextEdited: {
|
||||
console.log("textfield text", text, index)
|
||||
if (text.length > 0 ) {
|
||||
if (index < 3)
|
||||
nextItemInFocusChain(true).forceActiveFocus()
|
||||
else {
|
||||
// validate()
|
||||
}
|
||||
} else {
|
||||
if (index > 0)
|
||||
nextItemInFocusChain(false).forceActiveFocus()
|
||||
}
|
||||
}
|
||||
Layout.margins: 10 * DefaultStyle.dp
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -18,7 +18,7 @@ LoginLayout {
|
|||
}
|
||||
Text {
|
||||
Layout.preferredWidth: width
|
||||
text: qsTr("Register")
|
||||
text: qsTr("Inscription")
|
||||
font {
|
||||
pixelSize: 36 * DefaultStyle.dp
|
||||
weight: 800 * DefaultStyle.dp
|
||||
|
|
@ -32,7 +32,7 @@ LoginLayout {
|
|||
Text {
|
||||
Layout.rightMargin: 15 * DefaultStyle.dp
|
||||
color: DefaultStyle.main2_700
|
||||
text: qsTr("Already have an account ?")
|
||||
text: qsTr("Déjà un compte ?")
|
||||
font {
|
||||
pixelSize: 14 * DefaultStyle.dp
|
||||
weight: 400 * DefaultStyle.dp
|
||||
|
|
@ -40,8 +40,7 @@ LoginLayout {
|
|||
}
|
||||
Button {
|
||||
// Layout.alignment: Qt.AlignRight
|
||||
inversedColors: true
|
||||
text: "Log in"
|
||||
text: qsTr("Connexion")
|
||||
onClicked: {
|
||||
console.debug("[RegisterPage] User: return")
|
||||
returnToLogin()
|
||||
|
|
@ -62,10 +61,11 @@ LoginLayout {
|
|||
ColumnLayout {
|
||||
Layout.fillWidth: true
|
||||
Layout.fillHeight: true
|
||||
Layout.topMargin: 20 * DefaultStyle.dp
|
||||
spacing: 15 * DefaultStyle.dp
|
||||
RowLayout {
|
||||
TextInput {
|
||||
label: "Username"
|
||||
label: qsTr("Username")
|
||||
mandatory: true
|
||||
textInputWidth: 346 * DefaultStyle.dp
|
||||
}
|
||||
|
|
@ -73,11 +73,12 @@ LoginLayout {
|
|||
label: " "
|
||||
enabled: false
|
||||
modelList: [{text:"@sip.linphone.org"}]
|
||||
Layout.preferredWidth: 210 * DefaultStyle.dp
|
||||
}
|
||||
}
|
||||
PhoneNumberInput {
|
||||
id: phoneNumberInput
|
||||
label: "Phone number"
|
||||
label: qsTr("Phone number")
|
||||
mandatory: true
|
||||
placeholderText: "Phone number"
|
||||
textInputWidth: 346 * DefaultStyle.dp
|
||||
|
|
@ -85,13 +86,13 @@ LoginLayout {
|
|||
RowLayout {
|
||||
ColumnLayout {
|
||||
TextInput {
|
||||
label: "Password"
|
||||
label: qsTr("Password")
|
||||
mandatory: true
|
||||
hidden: true
|
||||
textInputWidth: 346 * DefaultStyle.dp
|
||||
}
|
||||
Text {
|
||||
text: "The password must contain 6 characters minimum"
|
||||
text: qsTr("The password must contain 6 characters minimum")
|
||||
font {
|
||||
pixelSize: 12 * DefaultStyle.dp
|
||||
weight: 300 * DefaultStyle.dp
|
||||
|
|
@ -100,13 +101,13 @@ LoginLayout {
|
|||
}
|
||||
ColumnLayout {
|
||||
TextInput {
|
||||
label: "Confirm password"
|
||||
label: qsTr("Confirm password")
|
||||
mandatory: true
|
||||
hidden: true
|
||||
textInputWidth: 346 * DefaultStyle.dp
|
||||
}
|
||||
Text {
|
||||
text: "The password must contain 6 characters minimum"
|
||||
text: qsTr("The password must contain 6 characters minimum")
|
||||
font {
|
||||
pixelSize: 12 * DefaultStyle.dp
|
||||
weight: 300 * DefaultStyle.dp
|
||||
|
|
@ -118,7 +119,7 @@ LoginLayout {
|
|||
CheckBox {
|
||||
}
|
||||
Text {
|
||||
text: "I would like to suscribe to the newsletter"
|
||||
text: qsTr("I would like to suscribe to the newsletter")
|
||||
}
|
||||
}
|
||||
RowLayout {
|
||||
|
|
@ -126,11 +127,11 @@ LoginLayout {
|
|||
}
|
||||
Text {
|
||||
Layout.preferredWidth: 450 * DefaultStyle.dp
|
||||
text: "I accept the Terms and Conditions : Read the Terms and Conditions. <br>I accept the Privacy policy : Read the Privacy policy."
|
||||
text: qsTr("I accept the Terms and Conditions : Read the Terms and Conditions. <br>I accept the Privacy policy : Read the Privacy policy.")
|
||||
}
|
||||
}
|
||||
Button {
|
||||
text: "Register"
|
||||
text: qsTr("Register")
|
||||
onClicked:{
|
||||
console.log("[RegisterPage] User: Call register with phone number", phoneNumberInput.phoneNumber)
|
||||
mainItem.registerCalled(phoneNumberInput.countryCode, phoneNumberInput.phoneNumber, "")
|
||||
|
|
@ -142,7 +143,7 @@ LoginLayout {
|
|||
}
|
||||
Image {
|
||||
Layout.rightMargin: 40 * DefaultStyle.dp
|
||||
Layout.preferredWidth: 300 * DefaultStyle.dp
|
||||
Layout.preferredWidth: 395 * DefaultStyle.dp
|
||||
fillMode: Image.PreserveAspectFit
|
||||
source: AppIcons.loginImage
|
||||
}
|
||||
|
|
@ -154,7 +155,7 @@ LoginLayout {
|
|||
spacing: 15 * DefaultStyle.dp
|
||||
RowLayout {
|
||||
TextInput {
|
||||
label: "Username"
|
||||
label: qsTr("Username")
|
||||
mandatory: true
|
||||
textInputWidth: 346 * DefaultStyle.dp
|
||||
}
|
||||
|
|
@ -164,12 +165,12 @@ LoginLayout {
|
|||
label: " "
|
||||
enabled: false
|
||||
modelList: [{text:"@sip.linphone.org"}]
|
||||
backgroundWidth: 154 * DefaultStyle.dp
|
||||
Layout.preferredWidth: 210 * DefaultStyle.dp
|
||||
}
|
||||
}
|
||||
TextInput {
|
||||
id: emailInput
|
||||
label: "Email"
|
||||
label: qsTr("Email")
|
||||
mandatory: true
|
||||
textInputWidth: 346 * DefaultStyle.dp
|
||||
}
|
||||
|
|
@ -177,13 +178,13 @@ LoginLayout {
|
|||
ColumnLayout {
|
||||
TextInput {
|
||||
id: pwdInput
|
||||
label: "Password"
|
||||
label: qsTr("Password")
|
||||
mandatory: true
|
||||
hidden: true
|
||||
textInputWidth: 346 * DefaultStyle.dp
|
||||
}
|
||||
Text {
|
||||
text: "The password must contain 6 characters minimum"
|
||||
text: qsTr("The password must contain 6 characters minimum")
|
||||
font {
|
||||
pixelSize: 12 * DefaultStyle.dp
|
||||
weight: 300 * DefaultStyle.dp
|
||||
|
|
@ -193,13 +194,13 @@ LoginLayout {
|
|||
ColumnLayout {
|
||||
TextInput {
|
||||
id: confirmPwdInput
|
||||
label: "Confirm password"
|
||||
label: qsTr("Confirm password")
|
||||
mandatory: true
|
||||
hidden: true
|
||||
textInputWidth: 346 * DefaultStyle.dp
|
||||
}
|
||||
Text {
|
||||
text: "The password must contain 6 characters minimum"
|
||||
text: qsTr("The password must contain 6 characters minimum")
|
||||
font {
|
||||
pixelSize: 12 * DefaultStyle.dp
|
||||
weight: 300 * DefaultStyle.dp
|
||||
|
|
@ -211,7 +212,7 @@ LoginLayout {
|
|||
CheckBox {
|
||||
}
|
||||
Text {
|
||||
text: "I would like to suscribe to the newsletter"
|
||||
text: qsTr("I would like to suscribe to the newsletter")
|
||||
}
|
||||
}
|
||||
RowLayout {
|
||||
|
|
@ -219,15 +220,15 @@ LoginLayout {
|
|||
}
|
||||
Text {
|
||||
Layout.preferredWidth: 450 * DefaultStyle.dp
|
||||
text: "I accept the Terms and Conditions : Read the Terms and Conditions. <br>I accept the Privacy policy : Read the Privacy policy."
|
||||
text: qsTr("I accept the Terms and Conditions : Read the Terms and Conditions. <br>I accept the Privacy policy : Read the Privacy policy.")
|
||||
}
|
||||
}
|
||||
Button {
|
||||
text: "Register"
|
||||
text: qsTr("Register")
|
||||
onClicked:{
|
||||
console.log("[RegisterPage] User: Call register with email", emailInput.text)
|
||||
if (emailInput.text.length == 0) {
|
||||
emailInput.errorMessage = "You must enter an email"
|
||||
emailInput.errorMessage = qsTr("You must enter an email")
|
||||
return
|
||||
}
|
||||
mainItem.registerCalled("", "", emailInput.text)
|
||||
|
|
@ -239,7 +240,7 @@ LoginLayout {
|
|||
}
|
||||
Image {
|
||||
Layout.rightMargin: 40 * DefaultStyle.dp
|
||||
Layout.preferredWidth: 300 * DefaultStyle.dp
|
||||
Layout.preferredWidth: 395 * DefaultStyle.dp
|
||||
fillMode: Image.PreserveAspectFit
|
||||
source: AppIcons.loginImage
|
||||
}
|
||||
|
|
|
|||
|
|
@ -49,7 +49,7 @@ LoginLayout {
|
|||
}
|
||||
Text {
|
||||
Layout.rightMargin: 15 * DefaultStyle.dp
|
||||
text: qsTr("No account yet ?")
|
||||
text: qsTr("Pas encore de compte ?")
|
||||
font {
|
||||
pixelSize: 14 * DefaultStyle.dp
|
||||
weight: 400 * DefaultStyle.dp
|
||||
|
|
@ -57,8 +57,7 @@ LoginLayout {
|
|||
}
|
||||
Button {
|
||||
Layout.alignment: Qt.AlignRight
|
||||
inversedColors: true
|
||||
text: qsTr("Register")
|
||||
text: qsTr("S'inscrire")
|
||||
onClicked: {
|
||||
console.debug("[SIPLoginPage] User: go to register page")
|
||||
mainItem.goToRegister()
|
||||
|
|
@ -115,7 +114,7 @@ LoginLayout {
|
|||
Button {
|
||||
Layout.fillWidth: true
|
||||
inversedColors: true
|
||||
text: "I prefer creating an account"
|
||||
text: qsTr("I prefer creating an account")
|
||||
onClicked: {
|
||||
console.debug("[SIPLoginPage] User: click register")
|
||||
mainItem.goToRegister()
|
||||
|
|
@ -123,7 +122,7 @@ LoginLayout {
|
|||
}
|
||||
Button {
|
||||
Layout.fillWidth: true
|
||||
text: "I understand"
|
||||
text: qsTr("I understand")
|
||||
onClicked: {
|
||||
rootStackView.replace(secondItem)
|
||||
}
|
||||
|
|
@ -139,70 +138,41 @@ LoginLayout {
|
|||
spacing: 10 * DefaultStyle.dp
|
||||
TextInput {
|
||||
id: username
|
||||
label: "Username"
|
||||
label: qsTr("Username")
|
||||
mandatory: true
|
||||
textInputWidth: 250 * DefaultStyle.dp
|
||||
textInputWidth: 360 * DefaultStyle.dp
|
||||
}
|
||||
TextInput {
|
||||
id: password
|
||||
label: "Password"
|
||||
label: qsTr("Password")
|
||||
mandatory: true
|
||||
hidden: true
|
||||
textInputWidth: 250 * DefaultStyle.dp
|
||||
textInputWidth: 360 * DefaultStyle.dp
|
||||
}
|
||||
TextInput {
|
||||
id: domain
|
||||
label: "Domain"
|
||||
label: qsTr("Domain")
|
||||
mandatory: true
|
||||
textInputWidth: 250 * DefaultStyle.dp
|
||||
textInputWidth: 360 * DefaultStyle.dp
|
||||
}
|
||||
TextInput {
|
||||
id: displayName
|
||||
label: "Display Name"
|
||||
textInputWidth: 250 * DefaultStyle.dp
|
||||
label: qsTr("Display Name")
|
||||
textInputWidth: 360 * DefaultStyle.dp
|
||||
}
|
||||
ComboBox {
|
||||
label: "Transport"
|
||||
backgroundWidth: 250 * DefaultStyle.dp
|
||||
modelList:[ "TCP", "UDP", "TLS"]
|
||||
label: qsTr("Transport")
|
||||
modelList:[ "TCP", "UDP", "TLS", "DTLS"]
|
||||
Layout.preferredWidth: 360 * DefaultStyle.dp
|
||||
}
|
||||
|
||||
Text {
|
||||
ErrorText {
|
||||
id: errorText
|
||||
text: "Connection has failed. Please verify your credentials"
|
||||
color: DefaultStyle.danger_500main
|
||||
opacity: 0
|
||||
states: [
|
||||
State{
|
||||
name: "Visible"
|
||||
PropertyChanges{target: errorText; opacity: 1.0}
|
||||
},
|
||||
State{
|
||||
name:"Invisible"
|
||||
PropertyChanges{target: errorText; opacity: 0.0}
|
||||
}
|
||||
]
|
||||
transitions: [
|
||||
Transition {
|
||||
from: "Visible"
|
||||
to: "Invisible"
|
||||
NumberAnimation {
|
||||
property: "opacity"
|
||||
duration: 1000
|
||||
}
|
||||
}
|
||||
]
|
||||
Timer {
|
||||
id: autoHideErrorMessage
|
||||
interval: 2500
|
||||
onTriggered: errorText.state = "Invisible"
|
||||
}
|
||||
Connections {
|
||||
target: LoginPageCpp
|
||||
onRegistrationStateChanged: {
|
||||
if (LoginPageCpp.registrationState === LinphoneEnums.RegistrationState.Failed) {
|
||||
errorText.state = "Visible"
|
||||
autoHideErrorMessage.restart()
|
||||
errorText.text = qsTr("Connection has failed. Please verify your credentials")
|
||||
} else if (LoginPageCpp.registrationState === LinphoneEnums.RegistrationState.Ok) {
|
||||
mainItem.connectionSucceed()
|
||||
}
|
||||
|
|
@ -214,7 +184,7 @@ LoginLayout {
|
|||
Layout.topMargin: 20 * DefaultStyle.dp
|
||||
Layout.bottomMargin: 20 * DefaultStyle.dp
|
||||
|
||||
text: "Log in"
|
||||
text: qsTr("Log in")
|
||||
onClicked: {
|
||||
console.debug("[SIPLoginPage] User: Log in")
|
||||
LoginPageCpp.login(username.inputText, password.inputText);
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue