diff --git a/Linphone/view/App/Layout/LoginLayout.qml b/Linphone/view/App/Layout/LoginLayout.qml index 125f8c3d..d083516a 100644 --- a/Linphone/view/App/Layout/LoginLayout.qml +++ b/Linphone/view/App/Layout/LoginLayout.qml @@ -37,9 +37,9 @@ Item { Text { Layout.alignment: Qt.AlignRight | Qt.AlignVCenter - text: "About" - font.pixelSize: 12 - color: DefaultStyle.grayColor + textItem.text: "About" + textItem.font.pixelSize: 12 + textItem.color: DefaultStyle.grayColor } } RowLayout { diff --git a/Linphone/view/CMakeLists.txt b/Linphone/view/CMakeLists.txt index c96fb1b8..86951e6d 100644 --- a/Linphone/view/CMakeLists.txt +++ b/Linphone/view/CMakeLists.txt @@ -14,9 +14,12 @@ list(APPEND _LINPHONEAPP_QML_FILES view/Item/TabBar.qml view/Item/Text.qml view/Item/TextInput.qml + view/Item/ToolTip.qml view/Item/Form/LoginForm.qml + view/Item/Test/ItemsTest.qml + view/Page/Login/LoginPage.qml view/Page/Login/RegisterPage.qml view/Page/Login/SIPLoginPage.qml diff --git a/Linphone/view/Item/Button.qml b/Linphone/view/Item/Button.qml index 1a2ab8cf..30045abf 100644 --- a/Linphone/view/Item/Button.qml +++ b/Linphone/view/Item/Button.qml @@ -7,7 +7,7 @@ Control.Button { property int capitalization property bool inversedColors: false property int textSize: DefaultStyle.buttonTextSize - + background: Rectangle { color: inversedColors ? DefaultStyle.buttonInversedBackground : DefaultStyle.buttonBackground radius: 24 @@ -15,19 +15,20 @@ Control.Button { } contentItem: Text { - horizontalAlignment: Text.AlignHCenter - verticalAlignment: Text.AlignVCenter - leftPadding: 11 - rightPadding: 11 - topPadding: 6 - bottomPadding: 6 + textItem.horizontalAlignment: Text.AlignHCenter + textItem.verticalAlignment: Text.AlignVCenter + textItem.leftPadding: 11 + textItem.rightPadding: 11 + textItem.topPadding: 6 + textItem.bottomPadding: 6 - wrapMode: Text.WordWrap - text: mainItem.text - color: inversedColors ? DefaultStyle.buttonInversedTextColor : DefaultStyle.buttonTextColor - font { + textItem.wrapMode: Text.WordWrap + textItem.text: mainItem.text + textItem.color: inversedColors ? DefaultStyle.buttonInversedTextColor : DefaultStyle.buttonTextColor + textItem.font { bold: true pointSize: mainItem.textSize + family: DefaultStyle.defaultFont capitalization: mainItem.capitalization } } diff --git a/Linphone/view/Item/Carousel.qml b/Linphone/view/Item/Carousel.qml index 43eee000..ee881a20 100644 --- a/Linphone/view/Item/Carousel.qml +++ b/Linphone/view/Item/Carousel.qml @@ -7,7 +7,10 @@ import Linphone ColumnLayout { id: mainItem - property list itemsList + required property list itemsList + // Items count is needed when using a repeater for itemsList + // which is part of the carouselStackLayout children list + required property int itemsCount property int currentIndex: carouselStackLayout.currentIndex property bool prevButtonVisible: true property bool nextButtonVisible: true @@ -18,8 +21,7 @@ ColumnLayout { StackLayout { id: carouselStackLayout - - property var items: children + children: mainItem.itemsList property int previousIndex: currentIndex function goToSlideAtIndex(index) { @@ -30,16 +32,23 @@ ColumnLayout { Component.onCompleted: { // The animation is not working until the slide // has been displayed once - for (var i = 0; i < mainItem.itemsList.length; ++i) { + for (var i = 0; i < mainItem.itemsCount; ++i) { // const newObject = Qt.createQmlObject(mainItem.itemsList[i], carouselStackLayout); - mainItem.itemsList[i].createObject(carouselStackLayout) + // mainItem.itemsList[i].createObject(carouselStackLayout) + // carouselStackLayout.append(itemsList[i]) var button = carouselButton.createObject(carouselButtonsLayout, {slideIndex: i, stackLayout: carouselStackLayout}) button.buttonClicked.connect(goToSlideAtIndex) currentIndex = i } currentIndex = 0 previousIndex = currentIndex - items = children + } + + onCurrentIndexChanged: { + var currentItem = children[currentIndex] + var crossFaderAnim = crossFader.createObject(parent, {fadeInTarget: currentItem, mirrored: (previousIndex > currentIndex)}) + crossFaderAnim.restart() + mainItem.currentIndex = currentIndex } Component { @@ -68,13 +77,6 @@ ColumnLayout { } } } - - onCurrentIndexChanged: { - var currentItem = items[currentIndex] - var crossFaderAnim = crossFader.createObject(parent, {fadeInTarget: currentItem, mirrored: (previousIndex > currentIndex)}) - crossFaderAnim.restart() - mainItem.currentIndex = currentIndex - } } RowLayout { id: carouselButtonsLayout diff --git a/Linphone/view/Item/CheckBox.qml b/Linphone/view/Item/CheckBox.qml index e45374e4..d83d6f14 100644 --- a/Linphone/view/Item/CheckBox.qml +++ b/Linphone/view/Item/CheckBox.qml @@ -16,11 +16,11 @@ Control.CheckBox { // color: checkbox.checked ? DefaultStyle.checkboxBorderColor : "transparent" Text { - anchors.centerIn: parent - text: "\u2714" - font.pointSize: 18 - color: DefaultStyle.checkboxBorderColor visible: mainItem.checked + textItem.text: "\u2714" + textItem.font.pointSize: 18 + textItem.color: DefaultStyle.checkboxBorderColor + anchors.centerIn: parent } } } diff --git a/Linphone/view/Item/ComboBox.qml b/Linphone/view/Item/ComboBox.qml index 8c82fd62..9025ea2f 100644 --- a/Linphone/view/Item/ComboBox.qml +++ b/Linphone/view/Item/ComboBox.qml @@ -9,14 +9,14 @@ ColumnLayout { property int backgroundWidth: 200 // Usage : each item of the model list must be {text: ..., img: ...} property var modelList: [] - readonly property string currentText: selectedItemText.text + readonly property string currentText: selectedItemText.textItem.text Text { visible: label.length > 0 - verticalAlignment: Text.AlignVCenter - text: mainItem.label - color: DefaultStyle.formItemLabelColor - font { + textItem.verticalAlignment: Text.AlignVCenter + textItem.text: mainItem.label + textItem.color: DefaultStyle.formItemLabelColor + textItem.font { pointSize: DefaultStyle.formItemLabelSize bold: true } @@ -42,14 +42,15 @@ ColumnLayout { width: visible ? 20 : 0 fillMode: Image.PreserveAspectFit anchors.verticalCenter: parent.verticalCenter + anchors.left: parent.left anchors.leftMargin: visible ? 10 : 0 } Text { id: selectedItemText - elide: Text.ElideRight + textItem.elide: Text.ElideRight anchors.left: selectedItemImg.right - anchors.leftMargin: selectedItemImg.visible ? 15 : 10 + anchors.leftMargin: selectedItemImg.visible ? 5 : 10 anchors.right: parent.right anchors.rightMargin: 20 anchors.verticalCenter: parent.verticalCenter @@ -61,9 +62,9 @@ ColumnLayout { selectedItemImg.source = mainItem.modelList[0].img } if (mainItem.modelList[index].text) - selectedItemText.text = mainItem.modelList[0].text + selectedItemText.textItem.text = mainItem.modelList[0].text else if (mainItem.modelList[index]) - selectedItemText.text = mainItem.modelList[0] + selectedItemText.textItem.text = mainItem.modelList[0] } } @@ -116,12 +117,12 @@ ColumnLayout { } Text { - text: modelData.text + textItem.text: modelData.text ? modelData.text : modelData ? modelData : "" - elide: Text.ElideRight + textItem.elide: Text.ElideRight anchors.verticalCenter: parent.verticalCenter anchors.left: delegateImg.right anchors.leftMargin: delegateImg.visible ? 5 : 10 @@ -141,7 +142,7 @@ ColumnLayout { } onPressed: { combobox.state = "" - selectedItemText.text = modelData.text + selectedItemText.textItem.text = modelData.text ? modelData.text : modelData ? modelData diff --git a/Linphone/view/Item/Form/LoginForm.qml b/Linphone/view/Item/Form/LoginForm.qml index f07dc991..51e8f816 100644 --- a/Linphone/view/Item/Form/LoginForm.qml +++ b/Linphone/view/Item/Form/LoginForm.qml @@ -38,10 +38,10 @@ ColumnLayout { } } Text { - color: DefaultStyle.grayColor - text: "Forgotten password?" - font.underline: true - font.pointSize: DefaultStyle.defaultTextSize + textItem.color: DefaultStyle.grayColor + textItem.text: "Forgotten password?" + textItem.font.underline: true + textItem.font.pointSize: DefaultStyle.defaultTextSize } } diff --git a/Linphone/view/Item/PhoneNumberComboBox.qml b/Linphone/view/Item/PhoneNumberComboBox.qml index ac1cf883..ed14ef48 100644 --- a/Linphone/view/Item/PhoneNumberComboBox.qml +++ b/Linphone/view/Item/PhoneNumberComboBox.qml @@ -12,10 +12,10 @@ ColumnLayout { Text { visible: label.length > 0 - verticalAlignment: Text.AlignVCenter - text: mainItem.label - color: DefaultStyle.formItemLabelColor - font { + textItem.verticalAlignment: Text.AlignVCenter + textItem.text: mainItem.label + textItem.color: DefaultStyle.formItemLabelColor + textItem.font { pointSize: DefaultStyle.formItemLabelSize bold: true } @@ -42,19 +42,19 @@ ColumnLayout { Text { visible: text.length > 0 id: selectedItemFlag - text: parent.currentItem ? parent.currentItem.flag : "" - font.family: DefaultStyle.emojiFont + textItem.text: parent.currentItem ? parent.currentItem.flag : "" + textItem.font.family: DefaultStyle.emojiFont anchors.rightMargin: 5 anchors.verticalCenter: parent.verticalCenter } Text { - leftPadding: 5 - text: parent.currentItem ? "+" + parent.currentItem.countryCallingCode : "" - color: DefaultStyle.formItemLabelColor + textItem.leftPadding: 5 + textItem.text: parent.currentItem ? "+" + parent.currentItem.countryCallingCode : "" + textItem.color: DefaultStyle.formItemLabelColor anchors.right: parent.right anchors.left: selectedItemFlag.right anchors.verticalCenter: parent.verticalCenter - elide: Text.ElideRight + textItem.elide: Text.ElideRight } } @@ -95,8 +95,8 @@ ColumnLayout { Text { id: delegateImg; visible: text.length > 0 - text: $modelData.flag - font.family: DefaultStyle.emojiFont + textItem.text: $modelData.flag + textItem.font.family: DefaultStyle.emojiFont anchors.left: parent.left anchors.verticalCenter: parent.verticalCenter anchors.leftMargin: 15 @@ -104,13 +104,13 @@ ColumnLayout { } Text { - text: "+" + $modelData.countryCallingCode - elide: Text.ElideRight - leftPadding: 5 + textItem.text: "+" + $modelData.countryCallingCode + textItem.elide: Text.ElideRight + textItem.leftPadding: 5 anchors.left: delegateImg.right anchors.right: parent.right anchors.verticalCenter: parent.verticalCenter - color: DefaultStyle.formItemLabelColor + textItem.color: DefaultStyle.formItemLabelColor } MouseArea { diff --git a/Linphone/view/Item/PhoneNumberInput.qml b/Linphone/view/Item/PhoneNumberInput.qml index d4b04adf..735b37b9 100644 --- a/Linphone/view/Item/PhoneNumberInput.qml +++ b/Linphone/view/Item/PhoneNumberInput.qml @@ -15,10 +15,10 @@ ColumnLayout { Text { visible: label.length > 0 - verticalAlignment: Text.AlignVCenter - text: mainItem.label + (mainItem.mandatory ? "*" : "") - color: DefaultStyle.formItemLabelColor - font { + textItem.verticalAlignment: Text.AlignVCenter + textItem.text: mainItem.label + (mainItem.mandatory ? "*" : "") + textItem.color: DefaultStyle.formItemLabelColor + textItem.font { pointSize: DefaultStyle.formItemLabelSize bold: true } diff --git a/Linphone/view/Item/TabBar.qml b/Linphone/view/Item/TabBar.qml index 07810040..7565dff7 100644 --- a/Linphone/view/Item/TabBar.qml +++ b/Linphone/view/Item/TabBar.qml @@ -1,4 +1,4 @@ -import QtQuick 2.7 +import QtQuick 2.7 as QT import QtQuick.Layouts 1.3 import QtQuick.Controls 2.2 as Control import Linphone @@ -10,11 +10,12 @@ Control.TabBar { ? itemAt(0).x : 0 spacing: 40 - - background: Item { + wheelEnabled: true + background: QT.Item { + id: tabBarBackground anchors.fill: parent - Rectangle { + QT.Rectangle { id: barBG height: 4 color: DefaultStyle.lightGrayColor @@ -22,41 +23,63 @@ Control.TabBar { width: parent.width } - Rectangle { - height: 4 - color: DefaultStyle.orangeColor - anchors.bottom: parent.bottom - x: mainItem.currentItem - ? mainItem.currentItem.x - mainItem.originX - : 0 - width: mainItem.currentItem ? mainItem.currentItem.width : 0 - clip: true - Behavior on x { NumberAnimation {duration: 100}} - Behavior on width {NumberAnimation {duration: 100}} - } + // QT.Rectangle { + // height: 4 + // color: DefaultStyle.orangeColor + // anchors.bottom: parent.bottom + // // anchors.left: mainItem.currentItem.left + // // anchors.right: mainItem.currentItem.right + // x: mainItem.currentItem + // ? mainItem.currentItem.x - mainItem.originX + // : 0 + // width: mainItem.currentItem ? mainItem.currentItem.width : 0 + // // clip: true + // QT.Behavior on x { QT.NumberAnimation {duration: 100}} + // QT.Behavior on width {QT.NumberAnimation {duration: 100}} + // } } - Repeater { + QT.Repeater { model: mainItem.model Control.TabButton { required property string modelData - width: txtMeter. advanceWidth - - background: Item { - visible: false + required property int index + width: Math.min(txtMeter.advanceWidth, Math.max(50, mainItem.width - (x - mainItem.x))) + hoverEnabled: true + ToolTip { + visible: tabText.truncated && hovered + delay: 1000 + text: modelData } - contentItem: Text { + background: QT.Item { + anchors.fill: parent + + QT.Rectangle { + visible: mainItem.currentIndex === index + height: 4 + color: DefaultStyle.orangeColor + anchors.bottom: parent.bottom + anchors.left: parent.left + anchors.right: parent.right + } + } + + contentItem: QT.Text { id: tabText anchors.fill: parent font.bold: true + color: DefaultStyle.defaultTextColor + font.family: DefaultStyle.defaultFont font.pointSize: DefaultStyle.tabButtonTextSize - text: txtMeter.text + elide: QT.Text.ElideRight + maximumLineCount: 1 + text: txtMeter.elidedText + // width: Math.min(txtMeter.advanceWidth, Math.max(50, mainItem.width - (x - mainItem.x))) bottomPadding: 5 - width: txtMeter.advanceWidth } - TextMetrics { + QT.TextMetrics { id: txtMeter font: tabText.font text: modelData diff --git a/Linphone/view/Item/Test/ItemsTest.qml b/Linphone/view/Item/Test/ItemsTest.qml new file mode 100644 index 00000000..f2113c52 --- /dev/null +++ b/Linphone/view/Item/Test/ItemsTest.qml @@ -0,0 +1,145 @@ +import QtQuick 2.7 +import QtQuick.Controls 2.2 as Control +import QtQuick.Layouts +import Linphone + +Window { + width: 960 + height: 600 + visible: true + title: qsTr("Test") + ColumnLayout { + RowLayout { + ColumnLayout { + Text { + textItem.text: "Combobox with image" + } + ComboBox { + modelList: [ + {text: "item 1", img: AppIcons.info}, + {text: "item 2", img: AppIcons.info}, + {text: "item 3", img: AppIcons.info} + ] + } + } + ColumnLayout { + Text { + textItem.text: "Combobox without image" + } + ComboBox { + modelList: [ + {text: "item 1"}, + {text: "item 2"}, + {text: "item 3"} + ] + } + } + } + RowLayout { + Button { + text: "button" + } + Button { + capitalization: Font.AllUppercase + text: "capital button" + } + Button { + text: "inversed colors button" + inversedColors: true + } + Button { + text: "button with long tooltip" + hoverEnabled: true + ToolTip { + visible: parent.hovered + delay: 1000 + text: " Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc ultrices, arcu ut egestas tincidunt, nisi velit hendrerit nunc, malesuada feugiat enim ipsum eu tortor. Nam a nibh posuere, hendrerit lacus non, blandit nisi. Aliquam quis ipsum sed elit euismod consequat. Donec vitae bibendum justo. Vestibulum ornare quam sit amet velit vestibulum maximus. Curabitur venenatis convallis eros, vitae pulvinar turpis. Pellentesque consequat sodales massa, dapibus sollicitudin nunc ultricies consectetur. Cras id quam luctus, rhoncus neque vitae, aliquet nibh. Quisque placerat, ipsum eu tincidunt elementum, mauris augue rutrum sem, ac accumsan turpis tellus at turpis. Quisque sollicitudin velit vel libero rhoncus tempor. Maecenas ut turpis aliquet, auctor ante sit amet, volutpat orci. Donec purus quam, venenatis a massa in, placerat finibus nulla. Vestibulum ac nunc eu sapien sollicitudin convallis. Aliquam elit quam, scelerisque at diam sed, vestibulum dapibus ligula. Suspendisse lobortis, neque eget iaculis efficitur, lorem ligula posuere urna, id tempor ipsum mi sed lacus. Mauris faucibus fringilla dapibus. Pellentesque quis vulputate odio. Integer pretium, est non fermentum tristique, eros metus vulputate ante, eu laoreet nulla odio in justo. Mauris mollis nulla sit amet erat malesuada interdum. Donec pretium risus ut justo sodales, sed sollicitudin felis consequat. Praesent semper porta leo, nec finibus urna molestie porttitor. Etiam sagittis odio nec turpis consequat dignissim. Sed pellentesque sodales rutrum. Donec varius neque nec ex imperdiet interdum. Suspendisse dignissim elit et dignissim blandit. " + } + } + } + + Carousel { + itemsList: [ + Component { + ColumnLayout { + Text { + textItem.text: "item 1" + } + Text { + textItem.text: "item 1" + } + } + }, + Component { + RowLayout { + Text { + textItem.text: "item 2" + } + Text { + textItem.text: "item 2" + } + } + }, + Component { + Text { + textItem.text: "item 3" + } + }, + Component { + Text { + textItem.text: "item 4" + } + } + ] + } + + Text { + textItem.text: "default text" + } + Text { + id: testText + scaleLettersFactor: 2 + textItem.text: "scaled text" + } + RowLayout { + TextInput { + label: "mandatory text input" + defaultText: "default text" + mandatory: true + } + TextInput { + label: "password text input" + defaultText: "default text" + hidden: true + } + TextInput { + id: next + label: "text input with long long looooooooooooooooooooooooooooooooooooooooooooooooooooooooong label" + defaultText: "long long long default text" + } + TextInput { + label: "number text input" + validator: IntValidator{} + } + } + + ColumnLayout { + Text { + textItem.text: "4 digit inputs" + } + RowLayout { + Repeater { + model: 4 + DigitInput { + } + } + } + } + TabBar { + spacing: 10 + contentWidth: 400 + model: [qsTr("A"), qsTr("Lot"), qsTr("Of"), qsTr("Tab"), qsTr("Buttons (which one has a very long label)"), qsTr("For"), qsTr("The"), qsTr("Tab"), qsTr("Bar"), qsTr("To"), qsTr("Not"), qsTr("Have"), qsTr("Enough"), qsTr("Space"), qsTr("To"), qsTr("Display"), qsTr("Them"), qsTr("All")] + } + + } +} \ No newline at end of file diff --git a/Linphone/view/Item/Text.qml b/Linphone/view/Item/Text.qml index bbe13b4f..69e5ca3e 100644 --- a/Linphone/view/Item/Text.qml +++ b/Linphone/view/Item/Text.qml @@ -1,11 +1,21 @@ import QtQuick 2.7 -import QtQuick.Controls 2.2 as Control +import QtQuick.Layouts import Linphone -Text { +RowLayout { + id: mainItem + property alias textItem: innerItem property double scaleLettersFactor: 1. - font.family: DefaultStyle.defaultFont - font.pointSize: DefaultStyle.defaultFontPointSize - color: DefaultStyle.defaultTextColor - transform: Scale { yScale: scaleLettersFactor} -} + Text { + id: innerItem + font.family: DefaultStyle.defaultFont + font.pointSize: DefaultStyle.defaultFontPointSize + color: DefaultStyle.defaultTextColor + wrapMode: Text.Wrap + elide: Text.ElideRight + transformOrigin: Item.TopLeft + transform: Scale { + yScale: mainItem.scaleLettersFactor + } + } +} \ No newline at end of file diff --git a/Linphone/view/Item/TextInput.qml b/Linphone/view/Item/TextInput.qml index a547bc00..21daf568 100644 --- a/Linphone/view/Item/TextInput.qml +++ b/Linphone/view/Item/TextInput.qml @@ -18,16 +18,22 @@ ColumnLayout { Text { visible: label.length > 0 - verticalAlignment: Text.AlignVCenter - text: mainItem.label + (mainItem.mandatory ? "*" : "") - color: DefaultStyle.formItemLabelColor - font { + textItem.verticalAlignment: Text.AlignVCenter + textItem.text: mainItem.label + (mainItem.mandatory ? "*" : "") + textItem.color: DefaultStyle.formItemLabelColor + textItem.elide: Text.ElideRight + textItem.wrapMode: Text.Wrap + textItem.maximumLineCount: 1 + textItem.font { pointSize: DefaultStyle.formItemLabelSize + family: DefaultStyle.defaultFont bold: true } + Layout.preferredWidth: mainItem.textInputWidth } Rectangle { + id: input Component.onCompleted: { if (mainItem.fillWidth) Layout.fillWidth = true @@ -50,10 +56,6 @@ ColumnLayout { inputMethodHints: mainItem.inputMethodHints selectByMouse: true validator: mainItem.validator - // MouseArea { - // anchors.fill: parent - // // acceptedButtons: Qt.NoButton - // } background: Item { opacity: 0. } diff --git a/Linphone/view/Item/ToolTip.qml b/Linphone/view/Item/ToolTip.qml new file mode 100644 index 00000000..c128dae8 --- /dev/null +++ b/Linphone/view/Item/ToolTip.qml @@ -0,0 +1,22 @@ +import QtQuick 2.7 +import QtQuick.Controls as Control +import Linphone + +Control.ToolTip { + id: mainItem + delay: 1000 + clip: true + background: Rectangle { + id: tooltipBackground + opacity: 0.7 + color: DefaultStyle.tooltipBackgroundColor + radius: 15 + } + contentItem: Text { + textItem.text: mainItem.text + textItem.color: DefaultStyle.defaultTextColor + textItem.width: tooltipBackground.width + textItem.wrapMode: Text.Wrap + textItem.elide: Text.ElideRight + } +} \ No newline at end of file diff --git a/Linphone/view/Page/Login/LoginPage.qml b/Linphone/view/Page/Login/LoginPage.qml index 5cc94eab..6e33dae2 100644 --- a/Linphone/view/Page/Login/LoginPage.qml +++ b/Linphone/view/Page/Login/LoginPage.qml @@ -14,9 +14,9 @@ LoginLayout { source: AppIcons.profile } Text { - text: "Login" - font.pointSize: DefaultStyle.title2FontPointSize - font.bold: true + textItem.text: "Login" + textItem.font.pointSize: DefaultStyle.title2FontPointSize + textItem.font.bold: true scaleLettersFactor: 1.1 } Item { @@ -24,8 +24,8 @@ LoginLayout { } Text { Layout.rightMargin: 15 - text: "No account yet ?" - font.pointSize: DefaultStyle.defaultTextSize + textItem.text: "No account yet ?" + textItem.font.pointSize: DefaultStyle.defaultTextSize } Button { Layout.alignment: Qt.AlignRight diff --git a/Linphone/view/Page/Login/RegisterCheckingPage.qml b/Linphone/view/Page/Login/RegisterCheckingPage.qml index 46de76a8..09b7793f 100644 --- a/Linphone/view/Page/Login/RegisterCheckingPage.qml +++ b/Linphone/view/Page/Login/RegisterCheckingPage.qml @@ -29,12 +29,12 @@ LoginLayout { source: AppIcons.profile } Text { - text: { + textItem.text: { var completeString = (mainItem.email.length > 0) ? "email" : "phone number" text = "Register | Register with your " + completeString } - font.pointSize: DefaultStyle.title2FontPointSize - font.bold: true + textItem.font.pointSize: DefaultStyle.title2FontPointSize + textItem.font.bold: true scaleLettersFactor: 1.1 } Item { @@ -47,8 +47,8 @@ LoginLayout { Layout.fillHeight: true Text { Layout.alignment: Qt.AlignTop - font.bold: true - text: { + textItem.font.bold: true + textItem.text: { var completeString = (mainItem.email.length > 0) ? ("email" + mainItem.email) : ("phone number" + mainItem.phoneNumber) text = "We have sent a verification code on your " + completeString + "
Please enter the verification code below:" } @@ -77,8 +77,8 @@ LoginLayout { RowLayout { Text { Layout.rightMargin: 15 - text: "Didn't receive the code ?" - font.pointSize: DefaultStyle.defaultTextSize + textItem.text: "Didn't receive the code ?" + textItem.font.pointSize: DefaultStyle.defaultTextSize } Button { Layout.alignment: Qt.AlignRight diff --git a/Linphone/view/Page/Login/RegisterPage.qml b/Linphone/view/Page/Login/RegisterPage.qml index 7709b79b..30fde752 100644 --- a/Linphone/view/Page/Login/RegisterPage.qml +++ b/Linphone/view/Page/Login/RegisterPage.qml @@ -17,9 +17,9 @@ LoginLayout { source: AppIcons.profile } Text { - text: "Register" - font.pointSize: DefaultStyle.title2FontPointSize - font.bold: true + textItem.text: "Register" + textItem.font.pointSize: DefaultStyle.title2FontPointSize + textItem.font.bold: true scaleLettersFactor: 1.1 } Item { @@ -27,8 +27,8 @@ LoginLayout { } Text { Layout.rightMargin: 15 - text: "Already have an account ?" - font.pointSize: DefaultStyle.defaultTextSize + textItem.text: "Already have an account ?" + textItem.font.pointSize: DefaultStyle.defaultTextSize } Button { Layout.alignment: Qt.AlignRight @@ -89,14 +89,14 @@ LoginLayout { CheckBox { } Text { - text: "I would like to suscribe to the newsletter" + textItem.text: "I would like to suscribe to the newsletter" } } RowLayout { CheckBox { } Text { - text: "I accept the Terms and Conditions : Read the Terms and Conditions.
I accept the Privacy policy : Read the Privacy policy." + textItem.text: "I accept the Terms and Conditions : Read the Terms and Conditions.
I accept the Privacy policy : Read the Privacy policy." } } Button { @@ -158,14 +158,14 @@ LoginLayout { CheckBox { } Text { - text: "I would like to suscribe to the newsletter" + textItem.text: "I would like to suscribe to the newsletter" } } RowLayout { CheckBox { } Text { - text: "I accept the Terms and Conditions : Read the Terms and Conditions.
I accept the Privacy policy : Read the Privacy policy." + textItem.text: "I accept the Terms and Conditions : Read the Terms and Conditions.
I accept the Privacy policy : Read the Privacy policy." } } Button { diff --git a/Linphone/view/Page/Login/SIPLoginPage.qml b/Linphone/view/Page/Login/SIPLoginPage.qml index 80117dc5..063e0799 100644 --- a/Linphone/view/Page/Login/SIPLoginPage.qml +++ b/Linphone/view/Page/Login/SIPLoginPage.qml @@ -28,9 +28,9 @@ LoginLayout { source: AppIcons.profile } Text { - text: "Use a SIP Account" - font.pointSize: DefaultStyle.title2FontPointSize - font.bold: true + textItem.text: "Use a SIP Account" + textItem.font.pointSize: DefaultStyle.title2FontPointSize + textItem.font.bold: true scaleLettersFactor: 1.1 } Item { @@ -38,8 +38,8 @@ LoginLayout { } Text { Layout.rightMargin: 15 - text: "No account yet ?" - font.pointSize: DefaultStyle.defaultTextSize + textItem.text: "No account yet ?" + textItem.font.pointSize: DefaultStyle.defaultTextSize } Button { Layout.alignment: Qt.AlignRight @@ -72,10 +72,10 @@ LoginLayout { Text { Layout.preferredWidth: 361 Layout.fillWidth: true - wrapMode: Text.WordWrap - color: DefaultStyle.darkGrayColor - font.pointSize: DefaultStyle.defaultTextSize - text: "

Some features require a Linphone account, such as group messaging, video conferences...

+ textItem.wrapMode: Text.WordWrap + textItem.color: DefaultStyle.darkGrayColor + textItem.font.pointSize: DefaultStyle.defaultTextSize + textItem.text: "

Some features require a Linphone account, such as group messaging, video conferences...

These features are hidden when you register with a third party SIP account.

To enable it in a commercial projet, please contact us.

" } diff --git a/Linphone/view/Page/Login/WelcomePage.qml b/Linphone/view/Page/Login/WelcomePage.qml index 43a46f87..b051f657 100644 --- a/Linphone/view/Page/Login/WelcomePage.qml +++ b/Linphone/view/Page/Login/WelcomePage.qml @@ -11,20 +11,20 @@ LoginLayout { titleContent: RowLayout { Text { id: welcome - text: "Welcome" - color: DefaultStyle.titleColor - font.pointSize: DefaultStyle.title1FontPointSize - font.bold: true + textItem.text: "Welcome" + textItem.color: DefaultStyle.titleColor + textItem.font.pointSize: DefaultStyle.title1FontPointSize + textItem.font.bold: true scaleLettersFactor: 1.1 } Text { Layout.alignment: Qt.AlignBottom Layout.leftMargin: 10 Layout.bottomMargin: 5 - color: DefaultStyle.titleColor - text: "in Linphone" - font.pointSize: 18 - font.bold: true + textItem.color: DefaultStyle.titleColor + textItem.text: "in Linphone" + textItem.font.pointSize: 18 + textItem.font.bold: true scaleLettersFactor: 1.1 } Item { @@ -42,8 +42,8 @@ LoginLayout { radius: 48 } contentItem: Text { - text: "Skip" - font.underline: true + textItem.text: "Skip" + textItem.font.underline: true } onClicked: { console.debug("[LoginItem] User: Click skip") @@ -65,61 +65,28 @@ LoginLayout { } Carousel { id: carousel - itemsList: [carousel0, carousel1, carousel2] - Component { - id: carousel0 + itemsCount: slideRepeater.count + itemsList: Repeater { + id: slideRepeater + model: [ + {title: "Linphone", text: "Une application de communication sécurisée,
open source et française."}, + {title: "Sécurisé", text: "Vos communications sont en sécurité grâce aux
Chiffrement de bout en bout."}, + {title: "Open Source", text: "Une application open source et un service gratuit depuis 2001"}, + ] Item { ColumnLayout { anchors.verticalCenter: parent.verticalCenter Text { - text: "Linphone" - font.bold: true - font.pixelSize: 20 + textItem.text: modelData.title + textItem.font.bold: true + textItem.font.pixelSize: 20 scaleLettersFactor: 1.1 } Text { Layout.maximumWidth: 361 - wrapMode: Text.WordWrap - font.pixelSize: 11 - text: "Une application de communication sécurisée,
open source et française. " - } - } - } - } - Component { - id: carousel1 - Item { - ColumnLayout { - anchors.verticalCenter: parent.verticalCenter - Text { - text: "Sécurisé" - font.bold: true - font.pixelSize: 20 - } - Text { - Layout.maximumWidth: 361 - wrapMode: Text.WordWrap - font.pixelSize: 11 - text: "Vos communications sont en sécurité grâce aux
Chiffrement de bout en bout." - } - } - } - } - Component { - id: carousel2 - Item { - ColumnLayout { - anchors.verticalCenter: parent.verticalCenter - Text { - text: "Open Source" - font.bold: true - font.pixelSize: 20 - } - Text { - Layout.maximumWidth: 361 - wrapMode: Text.WordWrap - font.pixelSize: 11 - text: "Une application open source et un service gratuit depuis 2001" + textItem.wrapMode: Text.WordWrap + textItem.font.pixelSize: 11 + textItem.text: modelData.text } } } @@ -132,7 +99,7 @@ LoginLayout { Layout.bottomMargin: 20 Layout.leftMargin: 361 - width Layout.alignment: Qt.AlignBottom - text: carousel.currentIndex < (carousel.itemsList.length - 1) ? "Next" : "Start" + text: carousel.currentIndex < (carousel.itemsCount - 1) ? "Next" : "Start" onClicked: { if (carousel.currentIndex < 2) carousel.goToSlide(carousel.currentIndex + 1); else mainItem.startButtonPressed(); diff --git a/Linphone/view/Style/DefaultStyle.qml b/Linphone/view/Style/DefaultStyle.qml index e9332230..c78d8281 100644 --- a/Linphone/view/Style/DefaultStyle.qml +++ b/Linphone/view/Style/DefaultStyle.qml @@ -25,6 +25,8 @@ QtObject { property color comboBoxHighlightColor: "#C0D1D9" property color comboBoxHoverColor: "#6C7A87" + property color tooltipBackgroundColor: "#DFECF2" + property color digitInputFocusedColor: "#FE5E00" property color digitInputColor: "#6C7A87"