data/linux.x86.linphone
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Ui colors and sizes

Browse source
This commit is contained in:
Gaëlle Braud 2023-12-11 10:56:13 +00:00
parent a69f8a6832
commit 3e06e3c55d
38 changed files with 1054 additions and 907 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

25
Linphone/core/call/CallCore.cpp
View file

@ -44,7 +44,7 @@ CallCore::CallCore(const std::shared_ptr<linphone::Call> &call) : QObject(nullpt
mCallModel->setSelf(mCallModel); mCallModel->setSelf(mCallModel);
mDuration = call->getDuration(); mDuration = call->getDuration();
mMicrophoneMuted = call->getMicrophoneMuted(); mMicrophoneMuted = call->getMicrophoneMuted();
// mSpeakerMuted = call->getSpeakerMuted(); mSpeakerMuted = call->getSpeakerMuted();
mCameraEnabled = call->cameraEnabled(); mCameraEnabled = call->cameraEnabled();
mDuration = call->getDuration(); mDuration = call->getDuration();
mState = LinphoneEnums::fromLinphone(call->getState()); mState = LinphoneEnums::fromLinphone(call->getState());
@ -78,12 +78,12 @@ void CallCore::setSelf(QSharedPointer<CallCore> me) {
mAccountModelConnection->makeConnectToModel(&CallModel::remoteVideoEnabledChanged, [this](bool enabled) { mAccountModelConnection->makeConnectToModel(&CallModel::remoteVideoEnabledChanged, [this](bool enabled) {
mAccountModelConnection->invokeToCore([this, enabled]() { setRemoteVideoEnabled(enabled); }); mAccountModelConnection->invokeToCore([this, enabled]() { setRemoteVideoEnabled(enabled); });
}); });
// mAccountModelConnection->makeConnect(this, &CallCore::lSetSpeakerMuted, [this](bool isMuted) { mAccountModelConnection->makeConnectToCore(&CallCore::lSetSpeakerMuted, [this](bool isMuted) {
// mAccountModelConnection->invokeToModel([this, isMuted]() { mCallModel->setSpeakerMuted(isMuted); }); mAccountModelConnection->invokeToModel([this, isMuted]() { mCallModel->setSpeakerMuted(isMuted); });
// }); });
// mAccountModelConnection->makeConnect(mCallModel.get(), &CallModel::speakerMutedChanged, [this](bool isMuted) { mAccountModelConnection->makeConnectToModel(&CallModel::speakerMutedChanged, [this](bool isMuted) {
// mAccountModelConnection->invokeToCore([this, isMuted]() { setSpeakerMuted(isMuted); }); mAccountModelConnection->invokeToCore([this, isMuted]() { setSpeakerMuted(isMuted); });
// }); });
mAccountModelConnection->makeConnectToCore(&CallCore::lSetCameraEnabled, [this](bool enabled) { mAccountModelConnection->makeConnectToCore(&CallCore::lSetCameraEnabled, [this](bool enabled) {
mAccountModelConnection->invokeToModel([this, enabled]() { mCallModel->setCameraEnabled(enabled); }); mAccountModelConnection->invokeToModel([this, enabled]() { mCallModel->setCameraEnabled(enabled); });
}); });
@ -207,6 +207,17 @@ void CallCore::setDuration(int duration) {
} }
} }
bool CallCore::getSpeakerMuted() const {
return mSpeakerMuted;
}
void CallCore::setSpeakerMuted(bool isMuted) {
if (mSpeakerMuted != isMuted) {
mSpeakerMuted = isMuted;
emit speakerMutedChanged();
}
}
bool CallCore::getMicrophoneMuted() const { bool CallCore::getMicrophoneMuted() const {
return mMicrophoneMuted; return mMicrophoneMuted;
} }

7
Linphone/core/call/CallCore.hpp
View file

@ -37,6 +37,7 @@ class CallCore : public QObject, public AbstractObject {
Q_PROPERTY(LinphoneEnums::CallState state READ getState NOTIFY stateChanged) Q_PROPERTY(LinphoneEnums::CallState state READ getState NOTIFY stateChanged)
Q_PROPERTY(QString lastErrorMessage READ getLastErrorMessage NOTIFY lastErrorMessageChanged) Q_PROPERTY(QString lastErrorMessage READ getLastErrorMessage NOTIFY lastErrorMessageChanged)
Q_PROPERTY(int duration READ getDuration NOTIFY durationChanged) Q_PROPERTY(int duration READ getDuration NOTIFY durationChanged)
Q_PROPERTY(bool speakerMuted READ getSpeakerMuted WRITE lSetSpeakerMuted NOTIFY speakerMutedChanged)
Q_PROPERTY(bool microphoneMuted READ getMicrophoneMuted WRITE lSetMicrophoneMuted NOTIFY microphoneMutedChanged) Q_PROPERTY(bool microphoneMuted READ getMicrophoneMuted WRITE lSetMicrophoneMuted NOTIFY microphoneMutedChanged)
Q_PROPERTY(bool cameraEnabled READ getCameraEnabled WRITE lSetCameraEnabled NOTIFY cameraEnabledChanged) Q_PROPERTY(bool cameraEnabled READ getCameraEnabled WRITE lSetCameraEnabled NOTIFY cameraEnabledChanged)
Q_PROPERTY(bool paused READ getPaused WRITE lSetPaused NOTIFY pausedChanged) Q_PROPERTY(bool paused READ getPaused WRITE lSetPaused NOTIFY pausedChanged)
@ -70,6 +71,9 @@ public:
int getDuration(); int getDuration();
void setDuration(int duration); void setDuration(int duration);
bool getSpeakerMuted() const;
void setSpeakerMuted(bool isMuted);
bool getMicrophoneMuted() const; bool getMicrophoneMuted() const;
void setMicrophoneMuted(bool isMuted); void setMicrophoneMuted(bool isMuted);
@ -97,6 +101,7 @@ signals:
void lastErrorMessageChanged(); void lastErrorMessageChanged();
void peerAddressChanged(); void peerAddressChanged();
void durationChanged(int duration); void durationChanged(int duration);
void speakerMutedChanged();
void microphoneMutedChanged(); void microphoneMutedChanged();
void cameraEnabledChanged(); void cameraEnabledChanged();
void pausedChanged(); void pausedChanged();
@ -108,6 +113,7 @@ signals:
void lAccept(bool withVideo); // Accept an incoming call void lAccept(bool withVideo); // Accept an incoming call
void lDecline(); // Decline an incoming call void lDecline(); // Decline an incoming call
void lTerminate(); // Hangup a call void lTerminate(); // Hangup a call
void lSetSpeakerMuted(bool muted);
void lSetMicrophoneMuted(bool isMuted); void lSetMicrophoneMuted(bool isMuted);
void lSetCameraEnabled(bool enabled); void lSetCameraEnabled(bool enabled);
void lSetPaused(bool paused); void lSetPaused(bool paused);
@ -144,6 +150,7 @@ private:
QString mPeerAddress; QString mPeerAddress;
bool mPeerSecured; bool mPeerSecured;
int mDuration = 0; int mDuration = 0;
bool mSpeakerMuted;
bool mMicrophoneMuted; bool mMicrophoneMuted;
bool mCameraEnabled; bool mCameraEnabled;
bool mPaused = false; bool mPaused = false;

6
Linphone/model/call/CallModel.cpp
View file

@ -68,7 +68,6 @@ void CallModel::terminate() {
mustBeInLinphoneThread(log().arg(Q_FUNC_INFO)); mustBeInLinphoneThread(log().arg(Q_FUNC_INFO));
mMonitor->terminate(); mMonitor->terminate();
} }
void CallModel::setPaused(bool paused) { void CallModel::setPaused(bool paused) {
mustBeInLinphoneThread(log().arg(Q_FUNC_INFO)); mustBeInLinphoneThread(log().arg(Q_FUNC_INFO));
if (paused) { if (paused) {
@ -83,9 +82,8 @@ void CallModel::setPaused(bool paused) {
void CallModel::transferTo(const std::shared_ptr<linphone::Address> &address) { void CallModel::transferTo(const std::shared_ptr<linphone::Address> &address) {
mustBeInLinphoneThread(log().arg(Q_FUNC_INFO)); mustBeInLinphoneThread(log().arg(Q_FUNC_INFO));
if (mMonitor->transferTo(address) == -1) if (mMonitor->transferTo(address) == -1)
qWarning() << log() qWarning()
.arg(QStringLiteral("Unable to transfer: `%1`.")) << log().arg(QStringLiteral("Unable to transfer: `%1`.")).arg(QString::fromStdString(address->asString()));
.arg(Utils::coreStringToAppString(address->asString()));
} }
void CallModel::setMicrophoneMuted(bool isMuted) { void CallModel::setMicrophoneMuted(bool isMuted) {

23
Linphone/tool/Utils.cpp
View file

@ -100,6 +100,14 @@ VariantObject *Utils::createCall(const QString &sipAddress,
void Utils::openCallsWindow(CallGui *call) { void Utils::openCallsWindow(CallGui *call) {
if (call) App::getInstance()->getCallsWindow(QVariant::fromValue(call))->show(); if (call) App::getInstance()->getCallsWindow(QVariant::fromValue(call))->show();
} }
QQuickWindow *Utils::getCallsWindow(CallGui *callGui) {
auto app = App::getInstance();
auto window = app->getCallsWindow(QVariant::fromValue(callGui));
window->show();
return window;
}
void Utils::closeCallsWindow() { void Utils::closeCallsWindow() {
App::getInstance()->closeCallsWindow(); App::getInstance()->closeCallsWindow();
} }
@ -168,17 +176,14 @@ QString Utils::formatElapsedTime(int seconds) {
QString hours, min, sec; QString hours, min, sec;
if (h < 10 && h > 0) { if (h < 10 && h > 0) hours = "0";
hours = "0" + QString::number(h); hours.append(QString::number(h));
}
if (m < 10) { if (m < 10) min = "0";
min = "0" + QString::number(m); min.append(QString::number(m));
}
if (s < 10) { if (s < 10) sec = "0";
sec = "0" + QString::number(s); sec.append(QString::number(s));
}
return (h == 0 ? "" : hours + ":") + min + ":" + sec; return (h == 0 ? "" : hours + ":") + min + ":" + sec;
} }

2
Linphone/tool/Utils.hpp
View file

@ -40,6 +40,7 @@
#endif // if defined(__GNUC__) && __GNUC__ >= 7 #endif // if defined(__GNUC__) && __GNUC__ >= 7
#endif // ifndef UTILS_NO_BREAK #endif // ifndef UTILS_NO_BREAK
class CallGui;
class QQuickWindow; class QQuickWindow;
class VariantObject; class VariantObject;
class CallGui; class CallGui;
@ -57,6 +58,7 @@ public:
const QString &prepareTransfertAddress = "", const QString &prepareTransfertAddress = "",
const QHash<QString, QString> &headers = {}); const QHash<QString, QString> &headers = {});
Q_INVOKABLE static void openCallsWindow(CallGui *call); Q_INVOKABLE static void openCallsWindow(CallGui *call);
Q_INVOKABLE static QQuickWindow *getCallsWindow(CallGui *callGui);
Q_INVOKABLE static void closeCallsWindow(); Q_INVOKABLE static void closeCallsWindow();
Q_INVOKABLE static VariantObject *haveAccount(); Q_INVOKABLE static VariantObject *haveAccount();
Q_INVOKABLE static QString createAvatar(const QUrl &fileUrl); // Return the avatar path Q_INVOKABLE static QString createAvatar(const QUrl &fileUrl); // Return the avatar path

312
Linphone/view/App/CallsWindow.qml
View file

@ -13,8 +13,6 @@ Window {
property CallGui call property CallGui call
property bool isInContactList: false
property int callsCount: 0 property int callsCount: 0
onCallsCountChanged: console.log("calls count", callsCount) onCallsCountChanged: console.log("calls count", callsCount)
@ -29,7 +27,6 @@ Window {
endCall() endCall()
} }
} }
onClosing: { onClosing: {
endCall() endCall()
} }
@ -69,12 +66,11 @@ Window {
checkable: true checkable: true
background: Rectangle { background: Rectangle {
anchors.fill: parent anchors.fill: parent
RectangleTest{}
color: bottomButton.enabled color: bottomButton.enabled
? bottomButton.checked ? disabledIcon
? disabledIcon ? DefaultStyle.grey_500
? DefaultStyle.grey_0 : bottomButton.pressed || bottomButton.checked
: DefaultStyle.main2_400
: bottomButton.pressed
? DefaultStyle.main2_400 ? DefaultStyle.main2_400
: DefaultStyle.grey_500 : DefaultStyle.grey_500
: DefaultStyle.grey_600 : DefaultStyle.grey_600
@ -96,7 +92,7 @@ Window {
modal: true modal: true
closePolicy: Control.Popup.NoAutoClose closePolicy: Control.Popup.NoAutoClose
anchors.centerIn: parent anchors.centerIn: parent
padding: 20 padding: 20 * DefaultStyle.dp
background: Item { background: Item {
anchors.fill: parent anchors.fill: parent
@ -106,12 +102,12 @@ Window {
anchors.right: parent.right anchors.right: parent.right
height: parent.height + 2 height: parent.height + 2
color: DefaultStyle.main1_500_main color: DefaultStyle.main1_500_main
radius: 15 radius: 15 * DefaultStyle.dp
} }
Rectangle { Rectangle {
id: mainBackground id: mainBackground
anchors.fill: parent anchors.fill: parent
radius: 15 radius: 15 * DefaultStyle.dp
} }
} }
contentItem: ColumnLayout { contentItem: ColumnLayout {
@ -124,34 +120,40 @@ Window {
} }
} }
} }
Timer {
id: autoClosePopup
interval: 2000
onTriggered: {
transferErrorPopup.close()
}
}
Control.Popup { Control.Popup {
id: transferErrorPopup id: transferErrorPopup
visible: mainWindow.call.core.transferState === LinphoneEnums.CallState.Error visible: mainWindow.call.core.transferState === LinphoneEnums.CallState.Error
modal: true onVisibleChanged: if (visible) autoClosePopup.restart()
closePolicy: Control.Popup.NoAutoClose closePolicy: Control.Popup.NoAutoClose
x : parent.x + parent.width - width x : parent.x + parent.width - width
y : parent.y + parent.height - height y : parent.y + parent.height - height
padding: 20 rightMargin: 20 * DefaultStyle.dp
bottomMargin: 20 * DefaultStyle.dp
padding: 20 * DefaultStyle.dp
background: Item { background: Item {
anchors.fill: parent anchors.fill: parent
Rectangle { Rectangle {
anchors.top: parent.top
anchors.left: parent.left anchors.left: parent.left
anchors.right: parent.right anchors.right: parent.right
height: parent.height + 2 height: parent.height + 2 * DefaultStyle.dp
color: DefaultStyle.danger_500 color: DefaultStyle.danger_500main
} }
Rectangle { Rectangle {
id: transferErrorBackground id: transferErrorBackground
anchors.fill: parent anchors.fill: parent
radius: 15
} }
MultiEffect { MultiEffect {
anchors.fill: transferErrorBackground anchors.fill: transferErrorBackground
shadowEnabled: true shadowEnabled: true
shadowColor: DefaultStyle.grey_900 shadowColor: DefaultStyle.grey_900
shadowBlur: 10 shadowBlur: 1
// shadowOpacity: 0.1 // shadowOpacity: 0.1
} }
} }
@ -168,25 +170,25 @@ Window {
Rectangle { Rectangle {
anchors.fill: parent anchors.fill: parent
color: DefaultStyle.ongoingCallWindowColor color: DefaultStyle.grey_900
ColumnLayout { ColumnLayout {
anchors.fill: parent anchors.fill: parent
spacing: 5 spacing: 5 * DefaultStyle.dp
anchors.bottomMargin: 5 anchors.bottomMargin: 5 * DefaultStyle.dp
Item { Item {
Layout.margins: 10 Layout.margins: 10 * DefaultStyle.dp
Layout.fillWidth: true Layout.fillWidth: true
Layout.minimumHeight: 25 Layout.minimumHeight: 25 * DefaultStyle.dp
RowLayout { RowLayout {
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
spacing: 10 spacing: 10 * DefaultStyle.dp
EffectImage { EffectImage {
id: callStatusIcon id: callStatusIcon
image.fillMode: Image.PreserveAspectFit image.fillMode: Image.PreserveAspectFit
image.width: 15 image.width: 15 * DefaultStyle.dp
image.height: 15 image.height: 15 * DefaultStyle.dp
image.sourceSize.width: 15 image.sourceSize.width: 15 * DefaultStyle.dp
image.sourceSize.height: 15 image.sourceSize.height: 15 * DefaultStyle.dp
image.source: (mainWindow.call.core.state === LinphoneEnums.CallState.Paused image.source: (mainWindow.call.core.state === LinphoneEnums.CallState.Paused
|| mainWindow.callState === LinphoneEnums.CallState.PausedByRemote) || mainWindow.callState === LinphoneEnums.CallState.PausedByRemote)
? AppIcons.pause ? AppIcons.pause
@ -198,7 +200,7 @@ Window {
: AppIcons.incomingCall : AppIcons.incomingCall
colorizationColor: mainWindow.callState === LinphoneEnums.CallState.Paused colorizationColor: mainWindow.callState === LinphoneEnums.CallState.Paused
|| mainWindow.callState === LinphoneEnums.CallState.PausedByRemote || mainWindow.callState === LinphoneEnums.CallState.End || mainWindow.callState === LinphoneEnums.CallState.PausedByRemote || mainWindow.callState === LinphoneEnums.CallState.End
|| mainWindow.callState === LinphoneEnums.CallState.Released ? DefaultStyle.danger_500 : undefined || mainWindow.callState === LinphoneEnums.CallState.Released ? DefaultStyle.danger_500main : undefined
} }
Text { Text {
id: callStatusText id: callStatusText
@ -208,17 +210,24 @@ Window {
? qsTr("Appel mis en pause") ? qsTr("Appel mis en pause")
: EnumsToStringCpp.dirToString(mainWindow.call.core.dir) + qsTr(" call") : EnumsToStringCpp.dirToString(mainWindow.call.core.dir) + qsTr(" call")
color: DefaultStyle.grey_0 color: DefaultStyle.grey_0
font.bold: true font {
pixelSize: 22 * DefaultStyle.dp
weight: 800 * DefaultStyle.dp
}
} }
Rectangle { Rectangle {
visible: mainWindow.callState === LinphoneEnums.CallState.Connected visible: mainWindow.callState === LinphoneEnums.CallState.Connected
|| mainWindow.callState === LinphoneEnums.CallState.StreamsRunning || mainWindow.callState === LinphoneEnums.CallState.StreamsRunning
Layout.preferredHeight: parent.height Layout.preferredHeight: parent.height
Layout.preferredWidth: 2 Layout.preferredWidth: 2 * DefaultStyle.dp
} }
Text { Text {
text: UtilsCpp.formatElapsedTime(mainWindow.call.core.duration) text: UtilsCpp.formatElapsedTime(mainWindow.call.core.duration)
color: DefaultStyle.grey_0 color: DefaultStyle.grey_0
font {
pixelSize: 22 * DefaultStyle.dp
weight: 800 * DefaultStyle.dp
}
visible: mainWindow.callState === LinphoneEnums.CallState.Connected visible: mainWindow.callState === LinphoneEnums.CallState.Connected
|| mainWindow.callState === LinphoneEnums.CallState.StreamsRunning || mainWindow.callState === LinphoneEnums.CallState.StreamsRunning
} }
@ -226,29 +235,33 @@ Window {
Control.Control { Control.Control {
anchors.centerIn: parent anchors.centerIn: parent
topPadding: 8 topPadding: 8 * DefaultStyle.dp
bottomPadding: 8 bottomPadding: 8 * DefaultStyle.dp
leftPadding: 10 leftPadding: 10 * DefaultStyle.dp
rightPadding: 10 rightPadding: 10 * DefaultStyle.dp
visible: mainWindow.call.core.peerSecured visible: mainWindow.call.core.peerSecured
onVisibleChanged: console.log("peer secured", mainWindow.call.core.peerSecured) onVisibleChanged: console.log("peer secured", mainWindow.call.core.peerSecured)
background: Rectangle { background: Rectangle {
anchors.fill: parent anchors.fill: parent
border.color: DefaultStyle.info_500_main border.color: DefaultStyle.info_500_main
radius: 15 radius: 15 * DefaultStyle.dp
} }
contentItem: RowLayout { contentItem: RowLayout {
Image { Image {
source: AppIcons.trusted source: AppIcons.trusted
Layout.preferredWidth: 15 Layout.preferredWidth: 24 * DefaultStyle.dp
Layout.preferredHeight: 15 Layout.preferredHeight: 24 * DefaultStyle.dp
sourceSize.width: 15 sourceSize.width: 24 * DefaultStyle.dp
sourceSize.height: 15 sourceSize.height: 24 * DefaultStyle.dp
fillMode: Image.PreserveAspectFit fillMode: Image.PreserveAspectFit
} }
Text { Text {
text: "This call is completely secured" text: "This call is completely secured"
color: DefaultStyle.info_500_main color: DefaultStyle.info_500_main
font {
pixelSize: 14 * DefaultStyle.dp
weight: 400 * DefaultStyle.dp
}
} }
} }
} }
@ -259,13 +272,13 @@ Window {
Layout.fillWidth: true Layout.fillWidth: true
Layout.preferredWidth: 1059 * DefaultStyle.dp Layout.preferredWidth: 1059 * DefaultStyle.dp
Layout.fillHeight: true Layout.fillHeight: true
Layout.leftMargin: 10 Layout.leftMargin: 10 * DefaultStyle.dp
Layout.rightMargin: 10 Layout.rightMargin: 10 * DefaultStyle.dp
Layout.alignment: Qt.AlignCenter Layout.alignment: Qt.AlignCenter
background: Rectangle { background: Rectangle {
anchors.fill: parent anchors.fill: parent
color: DefaultStyle.ongoingCallBackgroundColor color: DefaultStyle.grey_600 * DefaultStyle.dp
radius: 15 radius: 15 * DefaultStyle.dp
} }
contentItem: Item { contentItem: Item {
anchors.fill: parent anchors.fill: parent
@ -294,7 +307,7 @@ Window {
ColumnLayout { ColumnLayout {
anchors.horizontalCenter: parent.horizontalCenter anchors.horizontalCenter: parent.horizontalCenter
anchors.top: parent.top anchors.top: parent.top
anchors.topMargin: 30 anchors.topMargin: 30 * DefaultStyle.dp
visible: mainWindow.callState == LinphoneEnums.CallState.OutgoingInit visible: mainWindow.callState == LinphoneEnums.CallState.OutgoingInit
|| mainWindow.callState == LinphoneEnums.CallState.OutgoingProgress || mainWindow.callState == LinphoneEnums.CallState.OutgoingProgress
|| mainWindow.callState == LinphoneEnums.CallState.OutgoingRinging || mainWindow.callState == LinphoneEnums.CallState.OutgoingRinging
@ -311,7 +324,7 @@ Window {
color: DefaultStyle.grey_0 color: DefaultStyle.grey_0
Layout.alignment: Qt.AlignHCenter Layout.alignment: Qt.AlignHCenter
horizontalAlignment: Text.AlignHCenter horizontalAlignment: Text.AlignHCenter
font.pointSize: DefaultStyle.ongoingCallElapsedTimeSize font.pointSize: 30 * DefaultStyle.dp
Component.onCompleted: { Component.onCompleted: {
secondsTimer.restart() secondsTimer.restart()
} }
@ -319,49 +332,23 @@ Window {
} }
ColumnLayout { ColumnLayout {
anchors.centerIn: parent anchors.centerIn: parent
spacing: 2 spacing: 2 * DefaultStyle.dp
Sticker{ Avatar {
Layout.fillHeight: true Layout.alignment: Qt.AlignCenter
Layout.fillWidth: true // TODO : remove username when friend list ready
call: mainWindow.call address: mainWindow.peerNameText
Layout.preferredWidth: 120 * DefaultStyle.dp
Layout.preferredHeight: 120 * DefaultStyle.dp
} }
// Avatar {
// Layout.alignment: Qt.AlignCenter
// visible: mainWindow.isInContactList
// image.source: AppIcons.avatar
// size: 100
// }
// DefaultAvatar {
// id: defaultAvatar
// Layout.alignment: Qt.AlignCenter
// visible: !mainWindow.isInContactList
// initials:{
// var usernameList = mainWindow.peerNameText.split(' ')
// for (var i = 0; i < usernameList.length; ++i) {
// initials += usernameList[i][0]
// }
// }
// Connections {
// target: mainWindow
// onPeerNameChanged: {
// defaultAvatar.initials = ""
// var usernameList = mainWindow.peerName.value.split(' ')
// for (var i = 0; i < usernameList.length; ++i) {
// defaultAvatar.initials += usernameList[i][0]
// }
// }
// }
// width: 100
// height: 100
// }
Text { Text {
Layout.alignment: Qt.AlignCenter Layout.alignment: Qt.AlignCenter
Layout.topMargin: 15 Layout.topMargin: 15 * DefaultStyle.dp
visible: mainWindow.peerNameText.length > 0 visible: mainWindow.peerNameText.length > 0
text: mainWindow.peerNameText text: mainWindow.peerNameText
color: DefaultStyle.grey_0 color: DefaultStyle.grey_0
font { font {
pointSize: DefaultStyle.ongoingCallNameSize pixelSize: 22 * DefaultStyle.dp
weight: 300 * DefaultStyle.dp
capitalization: Font.Capitalize capitalization: Font.Capitalize
} }
} }
@ -369,7 +356,10 @@ Window {
Layout.alignment: Qt.AlignCenter Layout.alignment: Qt.AlignCenter
text: mainWindow.call.core.peerAddress text: mainWindow.call.core.peerAddress
color: DefaultStyle.grey_0 color: DefaultStyle.grey_0
font.pointSize: DefaultStyle.ongoingCallAddressSize font {
pixelSize: 14 * DefaultStyle.dp
weight: 300 * DefaultStyle.dp
}
} }
} }
} }
@ -387,18 +377,21 @@ Window {
text: qsTr(mainWindow.call.core.lastErrorMessage) text: qsTr(mainWindow.call.core.lastErrorMessage)
Layout.alignment: Qt.AlignCenter Layout.alignment: Qt.AlignCenter
color: DefaultStyle.grey_0 color: DefaultStyle.grey_0
font.pointSize: DefaultStyle.ongoingCallNameSize font.pixelSize: 40 * DefaultStyle.dp
} }
} }
} }
Text { Text {
anchors.left: parent.left anchors.left: parent.left
anchors.bottom: parent.bottom anchors.bottom: parent.bottom
anchors.leftMargin: 10 anchors.leftMargin: 10 * DefaultStyle.dp
anchors.bottomMargin: 10 anchors.bottomMargin: 10 * DefaultStyle.dp
text: mainWindow.peerNameText text: mainWindow.peerNameText
color: DefaultStyle.grey_0 color: DefaultStyle.grey_0
font.pointSize: DefaultStyle.ongoingCallAddressSize font {
pixelSize: 14 * DefaultStyle.dp
weight: 500 * DefaultStyle.dp
}
} }
} }
} }
@ -407,31 +400,75 @@ Window {
Layout.fillHeight: true Layout.fillHeight: true
Layout.preferredWidth: 393 * DefaultStyle.dp Layout.preferredWidth: 393 * DefaultStyle.dp
property int currentIndex: 0 property int currentIndex: 0
Layout.rightMargin: 10 Layout.rightMargin: 10 * DefaultStyle.dp
visible: false visible: false
headerContent: StackLayout { headerContent: StackLayout {
currentIndex: rightPanel.currentIndex currentIndex: rightPanel.currentIndex
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
Text { Text {
color: DefaultStyle.mainPageTitleColor color: DefaultStyle.main2_700
text: qsTr("Transfert d'appel") text: qsTr("Transfert d'appel")
font.bold: true font.bold: true
} }
Text {
color: DefaultStyle.main2_700
text: qsTr("Dialer")
font.bold: true
}
} }
contentItem: StackLayout { contentItem: StackLayout {
currentIndex: rightPanel.currentIndex currentIndex: rightPanel.currentIndex
ContactsList { ContactsList {
Layout.fillWidth: true Layout.fillWidth: true
Layout.fillHeight: true Layout.fillHeight: true
sideMargin: 10 sideMargin: 10 * DefaultStyle.dp
topMargin: 15 topMargin: 15 * DefaultStyle.dp
groupCallVisible: false groupCallVisible: false
searchBarColor: DefaultStyle.grey_0 searchBarColor: DefaultStyle.grey_0
searchBarBorderColor: DefaultStyle.callRightPanelSearchBarBorderColor searchBarBorderColor: DefaultStyle.grey_200
onCallButtonPressed: (address) => { onCallButtonPressed: (address) => {
mainWindow.call.core.lTransferCall(address) mainWindow.call.core.lTransferCall(address)
} }
} }
ColumnLayout {
Layout.fillWidth: true
Layout.fillHeight: true
SearchBar {
id: dialerTextInput
Layout.fillWidth: true
// Layout.maximumWidth: mainItem.width
color: DefaultStyle.grey_0
borderColor: DefaultStyle.grey_200
placeholderText: ""
numericPad: numPad
Component.onCompleted: numericPad.visible = true
numericPadButton.visible: false
}
Item {
Component.onCompleted: console.log("num pad", x, y, width, height)
Layout.fillWidth: true
Layout.preferredHeight: numPad.height
Layout.fillHeight: numPad.height
Layout.alignment: Qt.AlignBottom
visible: false
onVisibleChanged: {
console.log("visible cvhanged", visible)
if (visible) numPad.open()
else numPad.close()
}
NumericPad {
id: numPad
width: parent.width
visible: parent.visible
closeButtonVisible: false
onVisibleChanged: {
console.log("visible numpad", visible, parent.visible)
}
onOpened: console.log("open")
onClosed: console.log("close")
}
}
}
} }
} }
} }
@ -441,7 +478,7 @@ Window {
columns: 3 columns: 3
Layout.alignment: Qt.AlignHCenter Layout.alignment: Qt.AlignHCenter
layoutDirection: Qt.LeftToRight layoutDirection: Qt.LeftToRight
columnSpacing: 20 columnSpacing: 20 * DefaultStyle.dp
Connections { Connections {
target: mainWindow target: mainWindow
onCallStateChanged: if (mainWindow.callState === LinphoneEnums.CallState.Connected || mainWindow.callState === LinphoneEnums.CallState.StreamsRunning) { onCallStateChanged: if (mainWindow.callState === LinphoneEnums.CallState.Connected || mainWindow.callState === LinphoneEnums.CallState.StreamsRunning) {
@ -468,7 +505,7 @@ Window {
Layout.preferredHeight: 55 * DefaultStyle.dp Layout.preferredHeight: 55 * DefaultStyle.dp
background: Rectangle { background: Rectangle {
anchors.fill: parent anchors.fill: parent
color: DefaultStyle.danger_500 color: DefaultStyle.danger_500main
radius: 71 * DefaultStyle.dp radius: 71 * DefaultStyle.dp
} }
onClicked: mainWindow.endCall() onClicked: mainWindow.endCall()
@ -504,7 +541,7 @@ Window {
Layout.preferredWidth: 55 * DefaultStyle.dp Layout.preferredWidth: 55 * DefaultStyle.dp
Layout.preferredHeight: 55 * DefaultStyle.dp Layout.preferredHeight: 55 * DefaultStyle.dp
onClicked: { onClicked: {
rightPanel.visible = !rightPanel.visible rightPanel.visible = true
rightPanel.currentIndex = 0 rightPanel.currentIndex = 0
} }
} }
@ -527,7 +564,6 @@ Window {
} }
BottomButton { BottomButton {
id: micButton
enabledIcon: AppIcons.microphone enabledIcon: AppIcons.microphone
disabledIcon: AppIcons.microphoneSlash disabledIcon: AppIcons.microphoneSlash
checked: mainWindow.call.core.microphoneMuted checked: mainWindow.call.core.microphoneMuted
@ -535,13 +571,91 @@ Window {
Layout.preferredHeight: 55 * DefaultStyle.dp Layout.preferredHeight: 55 * DefaultStyle.dp
onClicked: mainWindow.call.core.lSetMicrophoneMuted(!mainWindow.call.core.microphoneMuted) onClicked: mainWindow.call.core.lSetMicrophoneMuted(!mainWindow.call.core.microphoneMuted)
} }
BottomButton {
id: moreOptionsButton
checkable: true
enabledIcon: AppIcons.verticalDots
Layout.preferredWidth: 55 * DefaultStyle.dp
Layout.preferredHeight: 55 * DefaultStyle.dp
onCheckedChanged: {
if (checked) moreOptionsMenu.open()
else moreOptionsMenu.close()
}
}
Popup {
id: moreOptionsMenu
x: moreOptionsButton.x
y: moreOptionsButton.y - height
padding: 20 * DefaultStyle.dp
closePolicy: Control.Popup.CloseOnEscape
onClosed: moreOptionsButton.checked = false
Connections {
target: rightPanel
onVisibleChanged: if (!rightPanel.visible) moreOptionsMenu.close()
}
contentItem: ColumnLayout {
id: optionsList
spacing: 10 * DefaultStyle.dp
Control.Button {
id: dialerButton
// width: 150
Layout.fillWidth: true
height: 32 * DefaultStyle.dp
background: Item {
visible: false
}
contentItem: RowLayout {
Image {
width: 24 * DefaultStyle.dp
height: 24 * DefaultStyle.dp
source: AppIcons.dialer
}
Text {
text: qsTr("Dialer")
}
}
onClicked: {
rightPanel.visible = true
rightPanel.currentIndex = 1
moreOptionsMenu.close()
}
}
Control.Button {
id: speakerButton
Layout.fillWidth: true
height: 32 * DefaultStyle.dp
checkable: true
background: Item {
visible: false
}
contentItem: RowLayout {
Image {
width: 24 * DefaultStyle.dp
height: 24 * DefaultStyle.dp
source: mainWindow.call.core.speakerMuted ? AppIcons.speakerSlash : AppIcons.speaker
}
Text {
text: mainWindow.call.core.speakerMuted ? qsTr("Activer le son") : qsTr("Désactiver le son")
}
}
onClicked: {
mainWindow.call.core.lSetSpeakerMuted(!mainWindow.call.core.speakerMuted)
}
}
}
}
} }
} }
} }
} }
Sticker{ Sticker{
height: 100 height: 100 * DefaultStyle.dp
width: 100 width: 100 * DefaultStyle.dp
anchors.right: parent.right anchors.right: parent.right
anchors.bottom: parent.bottom anchors.bottom: parent.bottom
visible: mainWindow.call.core.cameraEnabled visible: mainWindow.call.core.cameraEnabled

44
Linphone/view/App/Layout/LoginLayout.qml
View file

@ -12,23 +12,25 @@ Item {
id: mainItem id: mainItem
property alias titleContent : titleLayout.children property alias titleContent : titleLayout.children
property alias centerContent : centerLayout.children property alias centerContent : centerLayout.children
ColumnLayout { ColumnLayout {
anchors.rightMargin: 30 anchors.rightMargin: 40 * DefaultStyle.dp
anchors.leftMargin: 80 anchors.leftMargin: 119 * DefaultStyle.dp
anchors.top: parent.top anchors.top: parent.top
anchors.left: parent.left anchors.left: parent.left
anchors.right: parent.right anchors.right: parent.right
anchors.bottom: bottomMountains.top anchors.bottom: bottomMountains.top
spacing: 20 spacing: 3 * DefaultStyle.dp
ColumnLayout { RowLayout {
Layout.fillWidth: true Layout.fillWidth: true
Layout.preferredHeight: 50 Layout.preferredHeight: 102 * DefaultStyle.dp
Layout.topMargin: 18 // Layout.topMargin: 18
Layout.alignment: Qt.AlignRight | Qt.AlignTop // Layout.alignment: Qt.AlignRight | Qt.AlignTop
Item {
Layout.fillWidth: true
}
Control.Button { Control.Button {
Layout.alignment: Qt.AlignRight Layout.alignment: Qt.AlignRight | Qt.AlignVCenter
Layout.bottomMargin: 20 // Layout.bottomMargin: 20
background: Rectangle { background: Rectangle {
color: "transparent" color: "transparent"
} }
@ -36,12 +38,17 @@ Item {
Image { Image {
fillMode: Image.PreserveAspectFit fillMode: Image.PreserveAspectFit
source: AppIcons.info source: AppIcons.info
Layout.preferredWidth: 24 * DefaultStyle.dp
Layout.preferredHeight: 24 * DefaultStyle.dp
} }
Text { Text {
Layout.alignment: Qt.AlignRight | Qt.AlignVCenter Layout.alignment: Qt.AlignRight | Qt.AlignVCenter
text: "About" text: qsTr("À propos")
font.pixelSize: 12 font {
color: DefaultStyle.aboutButtonTextColor pixelSize: 14 * DefaultStyle.dp
weight: 400 * DefaultStyle.dp
}
color: DefaultStyle.main2_500main
} }
} }
onClicked: console.debug("[LoginLayout]User: open about popup") onClicked: console.debug("[LoginLayout]User: open about popup")
@ -51,13 +58,16 @@ Item {
RowLayout { RowLayout {
id: titleLayout id: titleLayout
Layout.bottomMargin: 20 Layout.preferredHeight: 131 * DefaultStyle.dp
// Layout.bottomMargin: 20
} }
ColumnLayout { ColumnLayout {
id: centerLayout id: centerLayout
Layout.fillHeight: true Layout.fillHeight: true
} }
Item {
Layout.fillHeight: true
}
} }
RowLayout { RowLayout {
@ -66,8 +76,8 @@ Item {
anchors.left: parent.left anchors.left: parent.left
anchors.right: parent.right anchors.right: parent.right
Image { Image {
Layout.minimumHeight: 50 Layout.minimumHeight: 50 * DefaultStyle.dp
Layout.preferredHeight: 80 Layout.preferredHeight: 80 * DefaultStyle.dp
Layout.fillWidth: true Layout.fillWidth: true
source: AppIcons.belledonne source: AppIcons.belledonne
fillMode: Image.Stretch fillMode: Image.Stretch

6
Linphone/view/App/Layout/MainLayout.qml
View file

@ -37,8 +37,8 @@ Item {
id: topRow id: topRow
Layout.leftMargin: 25 * DefaultStyle.dp Layout.leftMargin: 25 * DefaultStyle.dp
Layout.rightMargin: 41 * DefaultStyle.dp Layout.rightMargin: 41 * DefaultStyle.dp
TextInput { SearchBar {
fillWidth: true Layout.fillWidth: true
placeholderText: qsTr("Rechercher un contact, appeler ou envoyer un message...") placeholderText: qsTr("Rechercher un contact, appeler ou envoyer un message...")
} }
Control.Button { Control.Button {
@ -60,7 +60,7 @@ Item {
account: accountProxy.defaultAccount account: accountProxy.defaultAccount
} }
onClicked: { onClicked: {
accountList.open() accountList.open()
} }
} }
Control.Button { Control.Button {

4
Linphone/view/App/Main.qml
View file

@ -15,9 +15,9 @@ Window {
id: accountProxy id: accountProxy
onHaveAccountChanged: { onHaveAccountChanged: {
if(haveAccount) if(haveAccount)
mainWindowStackView.replace(mainPage) mainWindowStackView.replace(mainPage, StackView.Immediate)
else else
mainWindowStackView.replace(loginPage) mainWindowStackView.replace(loginPage, StackView.Immediate)
} }
} }
StackView { StackView {

26
Linphone/view/Item/Button.qml
View file

@ -7,23 +7,28 @@ Control.Button {
id: mainItem id: mainItem
property int capitalization property int capitalization
property bool inversedColors: false property bool inversedColors: false
property int textSize: DefaultStyle.buttonTextSize property int textSize: 18 * DefaultStyle.dp
property bool boldText: true property int textWeight: 600 * DefaultStyle.dp
property bool shadowEnabled: false property bool shadowEnabled: false
hoverEnabled: true hoverEnabled: true
leftPadding: 20 * DefaultStyle.dp
rightPadding: 20 * DefaultStyle.dp
topPadding: 11 * DefaultStyle.dp
bottomPadding: 11 * DefaultStyle.dp
background: Item { background: Item {
Rectangle { Rectangle {
anchors.fill: parent anchors.fill: parent
id: buttonBackground id: buttonBackground
color: inversedColors color: inversedColors
? mainItem.pressed ? mainItem.pressed
? DefaultStyle.buttonPressedInversedBackground ? DefaultStyle.grey_100
: DefaultStyle.grey_0 : DefaultStyle.grey_0
: mainItem.pressed : mainItem.pressed
? DefaultStyle.buttonPressedBackground ? DefaultStyle.main1_500_main_darker
: DefaultStyle.main1_500_main : DefaultStyle.main1_500_main
radius: 24 radius: 48 * DefaultStyle.dp
border.color: inversedColors ? DefaultStyle.main1_500_main : DefaultStyle.grey_0 border.color: inversedColors ? DefaultStyle.main1_500_main : DefaultStyle.grey_0
MouseArea { MouseArea {
@ -37,8 +42,9 @@ Control.Button {
anchors.fill: buttonBackground anchors.fill: buttonBackground
source: buttonBackground source: buttonBackground
shadowEnabled: mainItem.shadowEnabled shadowEnabled: mainItem.shadowEnabled
shadowColor: "black"//DefaultStyle.numericPadShadowColor shadowColor: DefaultStyle.grey_1000
shadowHorizontalOffset: 1.0 shadowBlur: 1
shadowOpacity: 0.1
} }
} }
@ -49,8 +55,8 @@ Control.Button {
text: mainItem.text text: mainItem.text
color: inversedColors ? DefaultStyle.main1_500_main : DefaultStyle.grey_0 color: inversedColors ? DefaultStyle.main1_500_main : DefaultStyle.grey_0
font { font {
bold: mainItem.boldText pixelSize: mainItem.textSize
pointSize: mainItem.textSize weight: mainItem.textWeight
family: DefaultStyle.defaultFont family: DefaultStyle.defaultFont
capitalization: mainItem.capitalization capitalization: mainItem.capitalization
} }

117
Linphone/view/Item/Call/ContactsList.qml
View file

@ -7,10 +7,10 @@ import Linphone
Item { Item {
id: mainItem id: mainItem
property int sideMargin: 25 property int sideMargin: 25 * DefaultStyle.dp
property int topMargin: 5 property int topMargin: 5 * DefaultStyle.dp
property bool groupCallVisible property bool groupCallVisible
property color searchBarColor: DefaultStyle.contactListSearchBarColor property color searchBarColor: DefaultStyle.grey_100
property color searchBarBorderColor: "transparent" property color searchBarBorderColor: "transparent"
signal callButtonPressed(string address) signal callButtonPressed(string address)
clip: true clip: true
@ -25,7 +25,7 @@ Item {
} }
contentItem: ColumnLayout { contentItem: ColumnLayout {
anchors.fill: parent anchors.fill: parent
spacing: 10 spacing: 10 * DefaultStyle.dp
SearchBar { SearchBar {
id: searchBar id: searchBar
Layout.alignment: Qt.AlignTop Layout.alignment: Qt.AlignTop
@ -46,18 +46,21 @@ Item {
background: Rectangle { background: Rectangle {
color: DefaultStyle.groupCallButtonColor color: DefaultStyle.groupCallButtonColor
anchors.fill: parent anchors.fill: parent
radius: 50 radius: 50 * DefaultStyle.dp
} }
contentItem: RowLayout { contentItem: RowLayout {
Image { Image {
source: AppIcons.groupCall source: AppIcons.groupCall
Layout.preferredWidth: 35 Layout.preferredWidth: 35 * DefaultStyle.dp
sourceSize.width: 35 sourceSize.width: 35 * DefaultStyle.dp
fillMode: Image.PreserveAspectFit fillMode: Image.PreserveAspectFit
} }
Text { Text {
text: "Appel de groupe" text: "Appel de groupe"
font.bold: true font {
pixelSize: 16 * DefaultStyle.dp
weight: 800 * DefaultStyle.dp
}
} }
Item { Item {
Layout.fillWidth: true Layout.fillWidth: true
@ -81,15 +84,15 @@ Item {
Layout.fillWidth: true Layout.fillWidth: true
} }
Control.Button { Control.Button {
implicitWidth: 30 implicitWidth: 30 * DefaultStyle.dp
implicitHeight: 30 implicitHeight: 30 * DefaultStyle.dp
background: Item { background: Item {
visible: false visible: false
} }
contentItem: Image { contentItem: Image {
source: AppIcons.phone source: AppIcons.phone
width: 20 width: 20 * DefaultStyle.dp
sourceSize.width: 20 sourceSize.width: 20 * DefaultStyle.dp
fillMode: Image.PreserveAspectFit fillMode: Image.PreserveAspectFit
} }
onClicked: { onClicked: {
@ -97,50 +100,48 @@ Item {
} }
} }
} }
ColumnLayout { ListView {
ListView { id: contactList
id: contactList Layout.fillWidth: true
Layout.fillWidth: true Layout.fillHeight: true
Layout.fillHeight: true // call history
// call history model: 30
model: 30 delegate: Item {
delegate: Item { required property int index
required property int index width:contactList.width
width:contactList.width height: 30 * DefaultStyle.dp
height: 30 RowLayout {
RowLayout { anchors.fill: parent
Image {
source: AppIcons.info
}
ColumnLayout {
Text {
text: "John Doe"
}
// RowLayout {
// Image {
// source: AppIcons.incomingCall
// }
// Text {
// text: "info sur l'appel"
// }
// }
}
Item {
Layout.fillWidth: true
}
}
MouseArea {
hoverEnabled: true
Rectangle {
anchors.fill: parent anchors.fill: parent
Image { opacity: 0.1
source: AppIcons.info radius: 15 * DefaultStyle.dp
} color: DefaultStyle.main2_500main
ColumnLayout { visible: parent.containsMouse
Text {
text: "John Doe"
}
// RowLayout {
// Image {
// source: AppIcons.incomingCall
// }
// Text {
// text: "info sur l'appel"
// }
// }
}
Item {
Layout.fillWidth: true
}
}
MouseArea {
hoverEnabled: true
Rectangle {
anchors.fill: parent
opacity: 0.1
radius: 15
color: DefaultStyle.comboBoxHoverColor
visible: parent.containsMouse
}
onClicked: contactList.currentIndex = parent.index
} }
onClicked: contactList.currentIndex = parent.index
} }
} }
} }
@ -151,18 +152,14 @@ Item {
anchors.bottom: parent.bottom anchors.bottom: parent.bottom
anchors.left: parent.left anchors.left: parent.left
anchors.right: parent.right anchors.right: parent.right
height: numPad.height height: numPad.implicitHeight
NumericPad { NumericPad {
id: numPad id: numPad
// anchors.centerIn: parent
width: parent.width width: parent.width
onLaunchCall: { onLaunchCall: {
var callVarObject = UtilsCpp.createCall(searchBar.text + "@sip.linphone.org") var callVarObject = UtilsCpp.createCall(searchBar.text + "@sip.linphone.org")
// TODO : auto completion instead of sip linphone // TODO : auto completion instead of sip linphone
var windowComp = Qt.createComponent("OngoingCallPage.qml")
var callWindow = windowComp.createObject({callVarObject: callVarObject})
callWindow.show()
} }
} }
} }
} }

14
Linphone/view/Item/Call/OngoingCallRightPanel.qml
View file

@ -10,8 +10,8 @@ Control.Page {
background: Rectangle { background: Rectangle {
width: mainItem.width width: mainItem.width
height: mainItem.height height: mainItem.height
color: DefaultStyle.callRightPanelBackgroundColor color: DefaultStyle.grey_100
radius: 15 radius: 15 * DefaultStyle.dp
} }
header: Control.Control { header: Control.Control {
@ -22,7 +22,7 @@ Control.Page {
width: pageHeader.width width: pageHeader.width
height: pageHeader.height height: pageHeader.height
color: DefaultStyle.grey_0 color: DefaultStyle.grey_0
radius: 15 radius: 15 * DefaultStyle.dp
Rectangle { Rectangle {
y: pageHeader.height/2 y: pageHeader.height/2
height: pageHeader.height/2 height: pageHeader.height/2
@ -33,7 +33,7 @@ Control.Page {
contentItem: RowLayout { contentItem: RowLayout {
width: pageHeader.width width: pageHeader.width
height: pageHeader.height height: pageHeader.height
anchors.leftMargin: 10 anchors.leftMargin: 10 * DefaultStyle.dp
anchors.left: pageHeader.left anchors.left: pageHeader.left
Item { Item {
id: header id: header
@ -50,12 +50,12 @@ Control.Page {
contentItem: Image { contentItem: Image {
anchors.centerIn: closeButton anchors.centerIn: closeButton
source: AppIcons.closeX source: AppIcons.closeX
width: 10 width: 10 * DefaultStyle.dp
sourceSize.width: 10 sourceSize.width: 10 * DefaultStyle.dp
fillMode: Image.PreserveAspectFit fillMode: Image.PreserveAspectFit
} }
onClicked: mainItem.visible = false onClicked: mainItem.visible = false
} }
} }
} }
} }

13
Linphone/view/Item/Carousel.qml
View file

@ -6,14 +6,11 @@ import Linphone
ColumnLayout { ColumnLayout {
id: mainItem id: mainItem
required property list<Item> itemsList required property list<Item> itemsList
// Items count is needed when using a repeater for itemsList // Items count is needed when using a repeater for itemsList
// which is part of the carouselStackLayout children list // which is part of the carouselStackLayout children list
required property int itemsCount required property int itemsCount
property int currentIndex: carouselStackLayout.currentIndex property int currentIndex: carouselStackLayout.currentIndex
property bool prevButtonVisible: true
property bool nextButtonVisible: true
function goToSlide(index) { function goToSlide(index) {
carouselStackLayout.goToSlideAtIndex(index) carouselStackLayout.goToSlideAtIndex(index)
@ -80,8 +77,6 @@ ColumnLayout {
} }
RowLayout { RowLayout {
id: carouselButtonsLayout id: carouselButtonsLayout
Layout.topMargin: 20
Layout.bottomMargin: 20
Component { Component {
id: carouselButton id: carouselButton
@ -91,10 +86,10 @@ ColumnLayout {
signal buttonClicked(int index) signal buttonClicked(int index)
background: Rectangle { background: Rectangle {
color: stackLayout.currentIndex == slideIndex ? DefaultStyle.main1_500_main : DefaultStyle.carouselLightGrayColor color: stackLayout.currentIndex == slideIndex ? DefaultStyle.main1_500_main : DefaultStyle.main2_200
radius: 15 radius: 15 * DefaultStyle.dp
width: stackLayout.currentIndex == slideIndex ? 11 : 8 width: stackLayout.currentIndex == slideIndex ? 11 * DefaultStyle.dp : 8 * DefaultStyle.dp
height: 8 height: 8 * DefaultStyle.dp
Behavior on width { NumberAnimation {duration: 100}} Behavior on width { NumberAnimation {duration: 100}}
} }
onClicked: { onClicked: {

18
Linphone/view/Item/CheckBox.qml
View file

@ -6,21 +6,19 @@ Control.CheckBox {
id: mainItem id: mainItem
indicator: Rectangle { indicator: Rectangle {
implicitWidth: 18 implicitWidth: 20 * DefaultStyle.dp
implicitHeight: 18 implicitHeight: 20 * DefaultStyle.dp
x: (parent.width - width) / 2 x: (parent.width - width) / 2
y: (parent.height - height) / 2 y: (parent.height - height) / 2
radius: 3 radius: 3 * DefaultStyle.dp
border.color: DefaultStyle.main1_500_main border.color: DefaultStyle.main1_500_main
border.width: DefaultStyle.checkboxBorderWidth border.width: 2 * DefaultStyle.dp
// color: mainItem.checked ? DefaultStyle.main1_500_main : "transparent" // color: mainItem.checked ? DefaultStyle.main1_500_main : "transparent"
EffectImage {
Text {
visible: mainItem.checked visible: mainItem.checked
text: "\u2714" image.source: AppIcons.check
font.pointSize: 18 colorizationColor: DefaultStyle.main1_500_main
color: DefaultStyle.main1_500_main anchors.fill: parent
anchors.centerIn: parent
} }
} }
} }

54
Linphone/view/Item/ComboBox.qml
View file

@ -6,7 +6,7 @@ import Linphone
ColumnLayout { ColumnLayout {
id: mainItem id: mainItem
property string label: "" property string label: ""
property int backgroundWidth: 200 property int backgroundWidth: 200 * DefaultStyle.dp
// Usage : each item of the model list must be {text: ..., img: ...} // Usage : each item of the model list must be {text: ..., img: ...}
property var modelList: [] property var modelList: []
readonly property string currentText: selectedItemText.text readonly property string currentText: selectedItemText.text
@ -17,10 +17,10 @@ ColumnLayout {
visible: label.length > 0 visible: label.length > 0
verticalAlignment: Text.AlignVCenter verticalAlignment: Text.AlignVCenter
text: mainItem.label text: mainItem.label
color: combobox.activeFocus ? DefaultStyle.main1_500_main : DefaultStyle.formItemLabelColor color: combobox.activeFocus ? DefaultStyle.main1_500_main : DefaultStyle.main2_600
font { font {
pointSize: DefaultStyle.formItemLabelSize pixelSize: 13 * DefaultStyle.dp
bold: true weight: 700 * DefaultStyle.dp
} }
} }
@ -30,10 +30,10 @@ ColumnLayout {
width: mainItem.backgroundWidth width: mainItem.backgroundWidth
background: Rectangle { background: Rectangle {
implicitWidth: mainItem.backgroundWidth implicitWidth: mainItem.backgroundWidth
implicitHeight: 30 implicitHeight: 49 * DefaultStyle.dp
radius: 15 radius: 63 * DefaultStyle.dp
color: combobox.enabled ? DefaultStyle.formItemBackgroundColor : DefaultStyle.formItemDisableBackgroundColor color: combobox.enabled ? DefaultStyle.grey_100 : DefaultStyle.grey_200
border.color: combobox.enabled ? DefaultStyle.formItemBorderColor : DefaultStyle.formItemDisableColor border.color: combobox.enabled ? DefaultStyle.grey_200 : DefaultStyle.grey_400
} }
contentItem: Item { contentItem: Item {
anchors.left: parent.left anchors.left: parent.left
@ -41,22 +41,22 @@ ColumnLayout {
Image { Image {
id: selectedItemImg id: selectedItemImg
visible: source != "" visible: source != ""
sourceSize.width: 20 sourceSize.width: 20 * DefaultStyle.dp
width: visible ? 20 : 0 width: visible ? 20 * DefaultStyle.dp : 0
fillMode: Image.PreserveAspectFit fillMode: Image.PreserveAspectFit
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
anchors.left: parent.left anchors.left: parent.left
anchors.leftMargin: visible ? 10 : 0 anchors.leftMargin: visible ? 10 * DefaultStyle.dp : 0
} }
Text { Text {
id: selectedItemText id: selectedItemText
color: combobox.enabled ? DefaultStyle.defaultTextColor : DefaultStyle.formItemDisableColor color: combobox.enabled ? DefaultStyle.main2_600 : DefaultStyle.grey_400
elide: Text.ElideRight elide: Text.ElideRight
anchors.left: selectedItemImg.right anchors.left: selectedItemImg.right
anchors.leftMargin: selectedItemImg.visible ? 5 : 10 anchors.leftMargin: selectedItemImg.visible ? 5 * DefaultStyle.dp : 10 * DefaultStyle.dp
anchors.right: parent.right anchors.right: parent.right
anchors.rightMargin: 20 anchors.rightMargin: 20 * DefaultStyle.dp
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
} }
@ -76,7 +76,7 @@ ColumnLayout {
indicator: Image { indicator: Image {
id: indicImage id: indicImage
anchors.right: parent.right anchors.right: parent.right
anchors.rightMargin: 10 anchors.rightMargin: 10 * DefaultStyle.dp
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
source: AppIcons.downArrow source: AppIcons.downArrow
} }
@ -86,7 +86,7 @@ ColumnLayout {
y: combobox.height - 1 y: combobox.height - 1
width: combobox.width width: combobox.width
implicitHeight: contentItem.implicitHeight implicitHeight: contentItem.implicitHeight
padding: 1 padding: 1 * DefaultStyle.dp
contentItem: ListView { contentItem: ListView {
id: listView id: listView
@ -97,8 +97,8 @@ ColumnLayout {
highlightFollowsCurrentItem: true highlightFollowsCurrentItem: true
highlight: Rectangle { highlight: Rectangle {
width: listView.width width: listView.width
color: DefaultStyle.comboBoxHighlightColor color: DefaultStyle.main2_300
radius: 15 radius: 63 * DefaultStyle.dp
y: listView.currentItem? listView.currentItem.y : 0 y: listView.currentItem? listView.currentItem.y : 0
} }
@ -111,12 +111,12 @@ ColumnLayout {
Image { Image {
id: delegateImg id: delegateImg
visible: source != "" visible: source != ""
width: visible ? 20 : 0 width: visible ? 20 * DefaultStyle.dp : 0
sourceSize.width: 20 sourceSize.width: 20 * DefaultStyle.dp
source: modelData.img ? modelData.img : "" source: modelData.img ? modelData.img : ""
fillMode: Image.PreserveAspectFit fillMode: Image.PreserveAspectFit
anchors.left: parent.left anchors.left: parent.left
anchors.leftMargin: visible ? 10 : 0 anchors.leftMargin: visible ? 10 * DefaultStyle.dp : 0
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
} }
@ -129,9 +129,9 @@ ColumnLayout {
elide: Text.ElideRight elide: Text.ElideRight
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
anchors.left: delegateImg.right anchors.left: delegateImg.right
anchors.leftMargin: delegateImg.visible ? 5 : 10 anchors.leftMargin: delegateImg.visible ? 5 * DefaultStyle.dp : 10 * DefaultStyle.dp
anchors.right: parent.right anchors.right: parent.right
anchors.rightMargin: 20 anchors.rightMargin: 20 * DefaultStyle.dp
} }
MouseArea { MouseArea {
@ -140,8 +140,8 @@ ColumnLayout {
Rectangle { Rectangle {
anchors.fill: parent anchors.fill: parent
opacity: 0.1 opacity: 0.1
radius: 15 radius: 63 * DefaultStyle.dp
color: DefaultStyle.comboBoxHoverColor color: DefaultStyle.main2_500main
visible: parent.containsMouse visible: parent.containsMouse
} }
onPressed: { onPressed: {
@ -167,8 +167,8 @@ ColumnLayout {
background: Rectangle { background: Rectangle {
implicitWidth: mainItem.backgroundWidth implicitWidth: mainItem.backgroundWidth
implicitHeight: 30 implicitHeight: 30 * DefaultStyle.dp
radius: 15 radius: 63 * DefaultStyle.dp
} }
} }
} }

24
Linphone/view/Item/DigitInput.qml
View file

@ -4,11 +4,15 @@ import Linphone
Control.TextField { Control.TextField {
id: mainItem id: mainItem
property int inputSize: 60 property int inputSize: 100 * DefaultStyle.dp
color: activeFocus ? DefaultStyle.main1_500_main : DefaultStyle.digitInputColor color: activeFocus ? DefaultStyle.main1_500_main : DefaultStyle.main2_500main
rightPadding: inputSize / 4 rightPadding: width * 0.32
leftPadding: inputSize / 4 leftPadding: width * 0.32
topPadding: height * 0.2
bottomPadding: height * 0.2
validator: IntValidator{bottom: 0; top: 9} validator: IntValidator{bottom: 0; top: 9}
// horizontalAlignment: TextInput.AlignHCenter
// verticalAlignment: TextInput.AlignVCenter
// just reserve the space for the background // just reserve the space for the background
placeholderText: "0" placeholderText: "0"
@ -16,12 +20,16 @@ Control.TextField {
// horizontalAlignment: Control.TextField.AlignHCenter // horizontalAlignment: Control.TextField.AlignHCenter
font.family: DefaultStyle.defaultFont font.family: DefaultStyle.defaultFont
font.pointSize: inputSize / 1.5 font.pixelSize: inputSize / 2
font.weight: 300 * DefaultStyle.dp
background: Rectangle { background: Rectangle {
// id: background id: background
border.color: mainItem.activeFocus ? DefaultStyle.main1_500_main : DefaultStyle.digitInputColor border.width: Math.max(DefaultStyle.dp, 1)
radius: mainItem.inputSize / 8 border.color: mainItem.activeFocus ? DefaultStyle.main1_500_main : DefaultStyle.main2_500main
radius: mainItem.inputSize * 0.15
width: mainItem.inputSize * 0.9
height: mainItem.inputSize
} }
// cursorDelegate: Rectangle { // cursorDelegate: Rectangle {
// visible: mainItem.activeFocus // visible: mainItem.activeFocus

2
Linphone/view/Item/EffectImage.qml
View file

@ -40,6 +40,6 @@ Item {
source: effect source: effect
maskSource: effect maskSource: effect
colorizationColor: effect2.enabled ? mainItem.colorizationColor : 'black' colorizationColor: effect2.enabled ? mainItem.colorizationColor : 'black'
colorization: effect2.enabled ? 1.0 : 0.0 colorization: effect2.enabled ? 1.0: 0.0
} }
} }

15
Linphone/view/Item/Form/LoginForm.qml
View file

@ -6,27 +6,27 @@ import Linphone
ColumnLayout { ColumnLayout {
id: mainItem id: mainItem
spacing: 15 spacing: 15 * DefaultStyle.dp
signal connectionSucceed() signal connectionSucceed()
TextInput { TextInput {
id: username id: username
label: "Username" label: "Username"
mandatory: true mandatory: true
textInputWidth: 250 textInputWidth: 250 * DefaultStyle.dp
} }
TextInput { TextInput {
id: password id: password
label: "Password" label: "Password"
mandatory: true mandatory: true
hidden: true hidden: true
textInputWidth: 250 textInputWidth: 250 * DefaultStyle.dp
} }
Text { Text {
id: errorText id: errorText
text: "Connection has failed. Please verify your credentials" text: "Connection has failed. Please verify your credentials"
color: DefaultStyle.errorMessageColor color: DefaultStyle.danger_500main
opacity: 0 opacity: 0
states: [ states: [
State{ State{
@ -70,7 +70,7 @@ ColumnLayout {
id: lastFormLineLayout id: lastFormLineLayout
Button { Button {
text: "Log in" text: "Log in"
Layout.rightMargin: 20 Layout.rightMargin: 20 * DefaultStyle.dp
onClicked: { onClicked: {
username.errorMessage = "" username.errorMessage = ""
password.errorMessage = "" password.errorMessage = ""
@ -90,11 +90,12 @@ ColumnLayout {
visible: false visible: false
} }
contentItem: Text { contentItem: Text {
color: DefaultStyle.grayColor color: DefaultStyle.main2_500main
text: "Forgotten password?" text: "Forgotten password?"
font{ font{
underline: true underline: true
pointSize: DefaultStyle.indicatorMessageTextSize pixelSize: 13 * DefaultStyle.dp
weight : 600 * DefaultStyle.dp
} }
} }
onClicked: console.debug("[LoginForm]User: forgotten password button clicked") onClicked: console.debug("[LoginForm]User: forgotten password button clicked")

76
Linphone/view/Item/NumericPad.qml
View file

@ -10,6 +10,7 @@ Control.Popup {
signal buttonPressed(string text) signal buttonPressed(string text)
signal launchCall() signal launchCall()
signal wipe() signal wipe()
property bool closeButtonVisible: true
closePolicy: Control.Popup.CloseOnEscape closePolicy: Control.Popup.CloseOnEscape
leftPadding: closeButton.width leftPadding: closeButton.width
rightPadding: closeButton.width rightPadding: closeButton.width
@ -20,18 +21,21 @@ Control.Popup {
Rectangle { Rectangle {
id: numPadBackground id: numPadBackground
anchors.fill: parent anchors.fill: parent
color: DefaultStyle.numericPadBackgroundColor color: DefaultStyle.grey_100
radius: 10 radius: 20 * DefaultStyle.dp
} }
MultiEffect { MultiEffect {
id: effect id: effect
anchors.fill: parent anchors.fill: parent
source: numPadBackground source: numPadBackground
shadowEnabled: true shadowEnabled: true
shadowColor: DefaultStyle.numericPadShadowColor shadowColor: DefaultStyle.grey_1000
shadowOpacity: 0.1
shadowBlur: 1
} }
Button { Button {
id: closeButton id: closeButton
visible: mainItem.closeButtonVisible
anchors.right: parent.right anchors.right: parent.right
anchors.top: parent.top anchors.top: parent.top
background: Item { background: Item {
@ -41,8 +45,8 @@ Control.Popup {
contentItem: Image { contentItem: Image {
anchors.centerIn: parent anchors.centerIn: parent
source: AppIcons.closeX source: AppIcons.closeX
width: 10 width: 24 * DefaultStyle.dp
sourceSize.width: 10 sourceSize.width: 24 * DefaultStyle.dp
fillMode: Image.PreserveAspectFit fillMode: Image.PreserveAspectFit
} }
onClicked: mainItem.close() onClicked: mainItem.close()
@ -57,22 +61,25 @@ Control.Popup {
model: 9 model: 9
Button { Button {
id: numPadButton id: numPadButton
Layout.alignment: Qt.AlignHCenter
required property int index required property int index
implicitWidth: 40 implicitWidth: 60 * DefaultStyle.dp
implicitHeight: 40 implicitHeight: 60 * DefaultStyle.dp
background: Rectangle { background: Rectangle {
anchors.fill: parent anchors.fill: parent
color: numPadButton.down ? DefaultStyle.numericPadPressedButtonColor : DefaultStyle.grey_0 color: numPadButton.down ? DefaultStyle.numericPadPressedButtonColor : DefaultStyle.grey_0
radius: 20 radius: 71 * DefaultStyle.dp
} }
contentItem: Text { contentItem: Text {
id: innerText id: innerText
horizontalAlignment: Text.AlignHCenter horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter verticalAlignment: Text.AlignVCenter
anchors.fill: parent
anchors.centerIn: parent anchors.centerIn: parent
text: index + 1 text: index + 1
font.pointSize: DefaultStyle.numericPadButtonTextSize font {
pixelSize: 32 * DefaultStyle.dp
weight: 400 * DefaultStyle.dp
}
} }
onClicked: { onClicked: {
mainItem.buttonPressed(innerText.text) mainItem.buttonPressed(innerText.text)
@ -87,35 +94,38 @@ Control.Popup {
] ]
Button { Button {
id: digitButton id: digitButton
Layout.alignment: Qt.AlignHCenter
shadowEnabled: true shadowEnabled: true
implicitWidth: 40 implicitWidth: 60 * DefaultStyle.dp
implicitHeight: 40 implicitHeight: 60 * DefaultStyle.dp
background: Rectangle { background: Rectangle {
anchors.fill: parent anchors.fill: parent
color: digitButton.down ? DefaultStyle.numericPadPressedButtonColor : DefaultStyle.grey_0 color: digitButton.down ? DefaultStyle.numericPadPressedButtonColor : DefaultStyle.grey_0
radius: 20 radius: 71 * DefaultStyle.dp
} }
contentItem: Item { contentItem: Item {
anchors.fill: parent anchors.fill: parent
anchors.centerIn: parent
Text { Text {
id: pressText id: pressText
height: contentHeight
anchors.left: parent.left anchors.left: parent.left
anchors.right: parent.right anchors.right: parent.right
horizontalAlignment: Text.AlignHCenter horizontalAlignment: Text.AlignHCenter
width: parent.width Component.onCompleted: {if (modelData.longPressText === undefined) anchors.centerIn= parent}
text: modelData.pressText text: modelData.pressText
font.pointSize: DefaultStyle.numericPadButtonTextSize font.pixelSize: 32 * DefaultStyle.dp
} }
Text { Text {
id: longPressText id: longPressText
height: contentHeight
anchors.left: parent.left anchors.left: parent.left
anchors.right: parent.right anchors.right: parent.right
anchors.top: pressText.bottom y: digitButton.height/2
horizontalAlignment: Text.AlignHCenter horizontalAlignment: Text.AlignHCenter
visible: modelData.longPressText ? modelData.longPressText.length > 0 : false visible: modelData.longPressText ? modelData.longPressText.length > 0 : false
text: modelData.longPressText ? modelData.longPressText : "" text: modelData.longPressText ? modelData.longPressText : ""
font.pointSize: DefaultStyle.numericPadButtonSubtextSize font.pixelSize: 22 * DefaultStyle.dp
} }
} }
onClicked: mainItem.buttonPressed(pressText.text) onClicked: mainItem.buttonPressed(pressText.text)
@ -126,40 +136,42 @@ Control.Popup {
// Invisible item to move the last two buttons to the right // Invisible item to move the last two buttons to the right
} }
Button { Button {
leftPadding: 20 id: launchCallButton
rightPadding: 20 implicitWidth: 75 * DefaultStyle.dp
topPadding: 15 implicitHeight: 55 * DefaultStyle.dp
bottomPadding: 15 Layout.alignment: Qt.AlignHCenter
background: Rectangle { background: Rectangle {
anchors.fill: parent anchors.fill: parent
color: DefaultStyle.launchCallButtonColor color: DefaultStyle.success_500main
radius: 15 radius: 71 * DefaultStyle.dp
} }
contentItem: EffectImage { contentItem: EffectImage {
id: buttonIcon id: buttonIcon
image.source: AppIcons.phone image.source: AppIcons.phone
anchors.fill: parent
anchors.centerIn: parent anchors.centerIn: parent
width: 20 width: 24 * DefaultStyle.dp
height: 20 height: 24 * DefaultStyle.dp
image.fillMode: Image.PreserveAspectFit image.fillMode: Image.PreserveAspectFit
colorizationColor: DefaultStyle.grey_0 colorizationColor: DefaultStyle.grey_0
} }
onClicked: mainItem.launchCall() onClicked: mainItem.launchCall()
} }
Button { Button {
leftPadding: 5 leftPadding: 5 * DefaultStyle.dp
rightPadding: 5 rightPadding: 5 * DefaultStyle.dp
topPadding: 5 topPadding: 5 * DefaultStyle.dp
bottomPadding: 5 bottomPadding: 5 * DefaultStyle.dp
Layout.alignment: Qt.AlignHCenter
background: Item { background: Item {
visible: false visible: false
} }
contentItem: Image { contentItem: Image {
source: AppIcons.backspaceFill source: AppIcons.backspaceFill
anchors.centerIn: parent anchors.centerIn: parent
width: 24 * DefaultStyle.dp
height: 24 * DefaultStyle.dp
} }
onClicked: mainItem.wipe() onClicked: mainItem.wipe()
} }
} }
} }

149
Linphone/view/Item/PhoneNumberComboBox.qml
View file

@ -1,12 +1,12 @@
import QtQuick import QtQuick
import QtQuick.Controls as Control import QtQuick.Controls as Control
import QtQuick.Layouts 1.0 import QtQuick.Layouts 1.0
import QtQuick.Effects
import Linphone import Linphone
ColumnLayout { ColumnLayout {
id: mainItem id: mainItem
property string label: "" property string label: ""
property int backgroundWidth: 100
readonly property string currentText: combobox.model.getAt(combobox.currentIndex) ? combobox.model.getAt(combobox.currentIndex).countryCallingCode : "" readonly property string currentText: combobox.model.getAt(combobox.currentIndex) ? combobox.model.getAt(combobox.currentIndex).countryCallingCode : ""
property string defaultCallingCode: "" property string defaultCallingCode: ""
property bool enableBackgroundColors: false property bool enableBackgroundColors: false
@ -15,9 +15,10 @@ ColumnLayout {
visible: mainItem.label.length > 0 visible: mainItem.label.length > 0
verticalAlignment: Text.AlignVCenter verticalAlignment: Text.AlignVCenter
text: mainItem.label text: mainItem.label
color: combobox.activeFocus ? DefaultStyle.main1_500_main : DefaultStyle.formItemLabelColor color: combobox.activeFocus ? DefaultStyle.main1_500_main : DefaultStyle.main2_600
font { font {
pointSize: DefaultStyle.formItemLabelSize pixelSize: 13 * DefaultStyle.dp
weight: 700 * DefaultStyle.dp
bold: true bold: true
} }
} }
@ -31,38 +32,62 @@ ColumnLayout {
} }
} }
background: Rectangle { background: Rectangle {
implicitWidth: mainItem.backgroundWidth implicitWidth: mainItem.implicitWidth
implicitHeight: 30 implicitHeight: mainItem.implicitHeight
radius: 15 radius: 63 * DefaultStyle.dp
color: mainItem.enableBackgroundColor ? DefaultStyle.formItemBackgroundColor : "transparent" color: mainItem.enableBackgroundColor ? DefaultStyle.grey_100 : "transparent"
border.color: mainItem.enableBackgroundColors border.color: mainItem.enableBackgroundColors
? (mainItem.errorMessage.length > 0 ? (mainItem.errorMessage.length > 0
? DefaultStyle.errorMessageColor ? DefaultStyle.danger_500main
: textField.activeFocus : textField.activeFocus
? DefaultStyle.main1_500_main ? DefaultStyle.main1_500_main
: DefaultStyle.formItemBorderColor) : DefaultStyle.grey_200)
: "transparent" : "transparent"
} }
contentItem: Item { contentItem: Item {
anchors.fill: parent anchors.fill: parent
readonly property var currentItem: combobox.model.getAt(combobox.currentIndex) readonly property var currentItem: combobox.model.getAt(combobox.currentIndex)
anchors.leftMargin: 15 anchors.leftMargin: 15 * DefaultStyle.dp
Text { Text {
id: selectedItemFlag id: selectedItemFlag
visible: text.length > 0 visible: text.length > 0
font.pixelSize: 21 * DefaultStyle.dp
text: parent.currentItem ? parent.currentItem.flag : "" text: parent.currentItem ? parent.currentItem.flag : ""
font.family: DefaultStyle.emojiFont font.family: DefaultStyle.emojiFont
anchors.rightMargin: 5 anchors.rightMargin: 5 * DefaultStyle.dp
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
} }
// Rectangle{
// id: mask
// visible: false
// layer.enabled: true
// anchors.centerIn: selectedItemFlag
// radius: 600 * DefaultStyle.dp
// width: selectedItemFlag.width/2
// height: selectedItemFlag.height/2
// }
// MultiEffect {
// visible: selectedItemFlag.text.length > 0
// anchors.centerIn: selectedItemFlag
// clip: true
// source: selectedItemFlag
// maskEnabled: true
// width: selectedItemFlag.width/2
// height: selectedItemFlag.height/2
// maskSource: mask
// }
Text { Text {
leftPadding: 5 leftPadding: 5 * DefaultStyle.dp
text: parent.currentItem ? "+" + parent.currentItem.countryCallingCode : "" text: parent.currentItem ? "+" + parent.currentItem.countryCallingCode : ""
color: DefaultStyle.formItemLabelColor color: DefaultStyle.main2_600
anchors.right: parent.right anchors.right: parent.right
anchors.left: selectedItemFlag.right anchors.left: selectedItemFlag.right
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
elide: Text.ElideRight elide: Text.ElideRight
font {
pixelSize: 14 * DefaultStyle.dp
weight: 400 * DefaultStyle.dp
}
} }
} }
@ -75,60 +100,81 @@ ColumnLayout {
popup: Control.Popup { popup: Control.Popup {
id: listPopup id: listPopup
y: combobox.height - 1 y: combobox.height - 1
width: combobox.width width: 311 * DefaultStyle.dp
implicitHeight: contentItem.implicitHeight height: 198 * DefaultStyle.dp
implicitWidth: contentItem.implicitWidth
padding: 1
contentItem: ListView { contentItem: ListView {
id: listView id: listView
clip: true clip: true
implicitHeight: contentHeight anchors.fill: parent
implicitWidth: contentWidth
model: PhoneNumberProxy{} model: PhoneNumberProxy{}
currentIndex: combobox.highlightedIndex >= 0 ? combobox.highlightedIndex : 0 currentIndex: combobox.highlightedIndex >= 0 ? combobox.highlightedIndex : 0
highlightFollowsCurrentItem: true highlightFollowsCurrentItem: true
highlight: Rectangle { highlight: Rectangle {
anchors.left: parent.left
anchors.right: parent.right
width: listView.width width: listView.width
height: listView.height height: listView.height
color: DefaultStyle.comboBoxHighlightColor color: DefaultStyle.main2_300
radius: 15 radius: 15 * DefaultStyle.dp
y: listView.currentItem? listView.currentItem.y : 0 y: listView.currentItem? listView.currentItem.y : 0
} }
delegate: Item { delegate: Item {
width:combobox.width width: listView.width
height: combobox.height height: combobox.height
RowLayout {
anchors.fill: parent
anchors.leftMargin: 20 * DefaultStyle.dp
Text {
id: delegateImg
visible: text.length > 0
text: $modelData.flag
font {
pixelSize: 28 * DefaultStyle.dp
family: DefaultStyle.emojiFont
}
}
Text { Text {
id: delegateImg id: countryText
visible: text.length > 0 text: $modelData.country
text: $modelData.flag elide: Text.ElideRight
font.family: DefaultStyle.emojiFont color: DefaultStyle.main2_500main
anchors.left: parent.left font {
anchors.verticalCenter: parent.verticalCenter pixelSize: 14 * DefaultStyle.dp
anchors.leftMargin: 15 weight: 400 * DefaultStyle.dp
anchors.rightMargin: 5 }
}
Rectangle {
id: separator
width: 1 * DefaultStyle.dp
height: combobox.height / 2
color: DefaultStyle.main2_500main
}
Text {
text: "+" + $modelData.countryCallingCode
elide: Text.ElideRight
color: DefaultStyle.main2_500main
font {
pixelSize: 14 * DefaultStyle.dp
weight: 400 * DefaultStyle.dp
}
}
Item {
Layout.fillWidth: true
}
} }
Text {
text: "+" + $modelData.countryCallingCode
elide: Text.ElideRight
leftPadding: 5
anchors.left: delegateImg.right
anchors.right: parent.right
anchors.verticalCenter: parent.verticalCenter
color: DefaultStyle.formItemLabelColor
}
MouseArea { MouseArea {
anchors.fill: parent anchors.fill: parent
hoverEnabled: true hoverEnabled: true
Rectangle { Rectangle {
anchors.fill: parent anchors.fill: parent
opacity: 0.1 opacity: 0.1
radius: 15 radius: 15 * DefaultStyle.dp
color: DefaultStyle.comboBoxHoverColor color: DefaultStyle.main2_500main
visible: parent.containsMouse visible: parent.containsMouse
} }
onPressed: { onPressed: {
@ -145,10 +191,17 @@ ColumnLayout {
} }
background: Rectangle { background: Rectangle {
implicitWidth: mainItem.backgroundWidth anchors.fill: parent
implicitHeight: 30 radius: 15 * DefaultStyle.dp
radius: 15 color: DefaultStyle.grey_100
// color: DefaultStyle.formItemBackgroundColor }
MultiEffect {
anchors.fill: listPopup
source: listPopup
shadowEnabled: true
shadowColor: DefaultStyle.grey_1000
shadowBlur: 1
} }
} }
} }

32
Linphone/view/Item/PhoneNumberInput.qml
View file

@ -10,7 +10,7 @@ ColumnLayout {
property string errorMessage: "" property string errorMessage: ""
property string placeholderText : "" property string placeholderText : ""
property bool mandatory: false property bool mandatory: false
property int textInputWidth: 200 property int textInputWidth: 200 * DefaultStyle.dp
property string initialPhoneNumber property string initialPhoneNumber
readonly property string phoneNumber: textField.text readonly property string phoneNumber: textField.text
readonly property string countryCode: combobox.currentText readonly property string countryCode: combobox.currentText
@ -19,35 +19,35 @@ ColumnLayout {
visible: label.length > 0 visible: label.length > 0
verticalAlignment: Text.AlignVCenter verticalAlignment: Text.AlignVCenter
text: mainItem.label + (mainItem.mandatory ? "*" : "") text: mainItem.label + (mainItem.mandatory ? "*" : "")
color: (combobox.hasActiveFocus || textField.hasActiveFocus) ? DefaultStyle.main1_500_main : DefaultStyle.formItemLabelColor color: (combobox.hasActiveFocus || textField.hasActiveFocus) ? DefaultStyle.main1_500_main : DefaultStyle.main2_600
font { font {
pointSize: DefaultStyle.formItemLabelSize pixelSize: 13 * DefaultStyle.dp
bold: true weight: 700 * DefaultStyle.dp
} }
} }
Rectangle { Rectangle {
implicitWidth: mainItem.textInputWidth implicitWidth: mainItem.textInputWidth
implicitHeight: 30 implicitHeight: 49 * DefaultStyle.dp
radius: 20 radius: 63 * DefaultStyle.dp
color: DefaultStyle.formItemBackgroundColor color: DefaultStyle.grey_100
border.color: mainItem.errorMessage.length > 0 border.color: mainItem.errorMessage.length > 0
? DefaultStyle.errorMessageColor ? DefaultStyle.danger_500main
: (textField.hasActiveFocus || combobox.hasActiveFocus) : (textField.hasActiveFocus || combobox.hasActiveFocus)
? DefaultStyle.main1_500_main ? DefaultStyle.main1_500_main
: DefaultStyle.formItemBorderColor : DefaultStyle.grey_200
RowLayout { RowLayout {
anchors.fill: parent anchors.fill: parent
PhoneNumberComboBox { PhoneNumberComboBox {
id: combobox id: combobox
backgroundWidth: 100 implicitWidth: 110 * DefaultStyle.dp
} }
Rectangle { Rectangle {
Layout.preferredWidth: 1 Layout.preferredWidth: 1 * DefaultStyle.dp
Layout.fillHeight: true Layout.fillHeight: true
Layout.topMargin: 5 Layout.topMargin: 10 * DefaultStyle.dp
Layout.bottomMargin: 5 Layout.bottomMargin: 10 * DefaultStyle.dp
color: DefaultStyle.defaultTextColor color: DefaultStyle.main2_600
} }
TextInput { TextInput {
id: textField id: textField
@ -65,11 +65,11 @@ ColumnLayout {
visible: mainItem.errorMessage.length > 0 visible: mainItem.errorMessage.length > 0
verticalAlignment: Text.AlignVCenter verticalAlignment: Text.AlignVCenter
text: mainItem.errorMessage text: mainItem.errorMessage
color: DefaultStyle.errorMessageColor color: DefaultStyle.danger_500main
elide: Text.ElideRight elide: Text.ElideRight
wrapMode: Text.Wrap wrapMode: Text.Wrap
font { font {
pointSize: DefaultStyle.indicatorMessageTextSize pixelSize: 13 * DefaultStyle.dp
family: DefaultStyle.defaultFont family: DefaultStyle.defaultFont
bold: true bold: true
} }

36
Linphone/view/Item/RadioButton.qml
View file

@ -19,20 +19,20 @@ Control.RadioButton {
} }
background: Rectangle { background: Rectangle {
color: DefaultStyle.formItemBackgroundColor color: DefaultStyle.grey_100
border.color: mainItem.checked ? DefaultStyle.info_500_main : "transparent" border.color: mainItem.checked ? DefaultStyle.info_500_main : "transparent"
radius: 20 radius: 20 * DefaultStyle.dp
} }
indicator: RowLayout { indicator: RowLayout {
anchors.left: parent.left anchors.left: parent.left
anchors.leftMargin: 13 anchors.leftMargin: 13 * DefaultStyle.dp
anchors.top: parent.top anchors.top: parent.top
anchors.topMargin: 8 anchors.topMargin: 8 * DefaultStyle.dp
spacing: 4 spacing: 4 * DefaultStyle.dp
Rectangle { Rectangle {
implicitWidth: 16 implicitWidth: 16 * DefaultStyle.dp
implicitHeight: 16 implicitHeight: 16 * DefaultStyle.dp
radius: implicitWidth/2 radius: implicitWidth/2
border.color: mainItem.checked ? DefaultStyle.info_500_main : DefaultStyle.main1_500_main border.color: mainItem.checked ? DefaultStyle.info_500_main : DefaultStyle.main1_500_main
@ -50,7 +50,7 @@ Control.RadioButton {
text: mainItem.title text: mainItem.title
font.bold: true font.bold: true
color: DefaultStyle.grey_900 color: DefaultStyle.grey_900
font.pointSize: DefaultStyle.radioButtonTitleSize font.pixelSize: 16 * DefaultStyle.dp
} }
Control.Button { Control.Button {
padding: 0 padding: 0
@ -60,8 +60,8 @@ Control.RadioButton {
contentItem: Image { contentItem: Image {
fillMode: Image.PreserveAspectFit fillMode: Image.PreserveAspectFit
source: AppIcons.info source: AppIcons.info
width: 2 width: 2 * DefaultStyle.dp
height: 2 height: 2 * DefaultStyle.dp
} }
} }
} }
@ -71,27 +71,27 @@ Control.RadioButton {
anchors.bottom: parent.bottom anchors.bottom: parent.bottom
anchors.left: parent.left anchors.left: parent.left
anchors.right: parent.right anchors.right: parent.right
anchors.leftMargin: 13 anchors.leftMargin: 13 * DefaultStyle.dp
RowLayout { RowLayout {
Layout.fillWidth: true Layout.fillWidth: true
Layout.fillHeight: true Layout.fillHeight: true
Layout.bottomMargin: 10 Layout.bottomMargin: 10 * DefaultStyle.dp
Layout.rightMargin: 10 Layout.rightMargin: 10 * DefaultStyle.dp
Layout.alignment: Qt.AlignVCenter Layout.alignment: Qt.AlignVCenter
Text { Text {
id: innerText id: innerText
verticalAlignment: Text.AlignVCenter verticalAlignment: Text.AlignVCenter
Layout.preferredWidth: 220 Layout.preferredWidth: 220 * DefaultStyle.dp
Layout.preferredHeight: 100 Layout.preferredHeight: 100 * DefaultStyle.dp
font.pointSize: DefaultStyle.descriptionTextSize font.pixelSize: 14 * DefaultStyle.dp
text: mainItem.contentText text: mainItem.contentText
Layout.fillHeight: true Layout.fillHeight: true
} }
Image { Image {
id: image id: image
Layout.fillHeight: true Layout.fillHeight: true
Layout.preferredWidth: 100 Layout.preferredWidth: 100 * DefaultStyle.dp
Layout.preferredHeight: 100 Layout.preferredHeight: 100 * DefaultStyle.dp
fillMode: Image.PreserveAspectFit fillMode: Image.PreserveAspectFit
source: mainItem.imgUrl source: mainItem.imgUrl
} }

41
Linphone/view/Item/SearchBar.qml
View file

@ -7,39 +7,41 @@ import Linphone
Rectangle { Rectangle {
id: mainItem id: mainItem
property string placeholderText: "" property string placeholderText: ""
property int textInputWidth: 350 property int textInputWidth: 350 * DefaultStyle.dp
property color borderColor: "transparent" property color borderColor: "transparent"
property string text: textField.text property string text: textField.text
property var validator: RegularExpressionValidator{} property var validator: RegularExpressionValidator{}
property var numericPad property Control.Popup numericPad
property alias numericPadButton: dialerButton property alias numericPadButton: dialerButton
readonly property bool hasActiveFocus: textField.activeFocus readonly property bool hasActiveFocus: textField.activeFocus
signal numericPadButtonPressed(bool checked)
onVisibleChanged: if (!visible && numericPad) numericPad.close() onVisibleChanged: if (!visible && numericPad) numericPad.close()
Connections { Connections {
enabled: numericPad != undefined enabled: numericPad != undefined
target: numericPad ? numericPad : null target: numericPad ? numericPad : null
onAboutToHide: { searchBar.numericPadButton.checked = false } onAboutToHide: { mainItem.numericPadButton.checked = false }
onAboutToShow: { searchBar.numericPadButton.checked = true } onAboutToShow: { mainItem.numericPadButton.checked = true }
onButtonPressed: (text) => { onButtonPressed: (text) => {
textField.text += text textField.text += text
} }
onWipe: textField.text = textField.text.slice(0, -1) onWipe: textField.text = textField.text.slice(0, -1)
} }
implicitWidth: mainItem.textInputWidth implicitWidth: mainItem.textInputWidth
implicitHeight: 30 implicitHeight: 50 * DefaultStyle.dp
radius: 20 radius: 28 * DefaultStyle.dp
color: DefaultStyle.formItemBackgroundColor color: DefaultStyle.grey_100
border.color: textField.activeFocus ? DefaultStyle.searchBarFocusBorderColor : mainItem.borderColor border.color: textField.activeFocus ? DefaultStyle.main2_500main : mainItem.borderColor
Image { Image {
id: magnifier id: magnifier
anchors.left: parent.left anchors.left: parent.left
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
anchors.leftMargin: 10 anchors.leftMargin: 10 * DefaultStyle.dp
source: AppIcons.magnifier source: AppIcons.magnifier
width: 20 * DefaultStyle.dp
height: 20 * DefaultStyle.dp
} }
Control.TextField { Control.TextField {
id: textField id: textField
@ -49,9 +51,12 @@ Rectangle {
placeholderText: mainItem.placeholderText placeholderText: mainItem.placeholderText
width: mainItem.width - dialerButton.width width: mainItem.width - dialerButton.width
echoMode: (mainItem.hidden && !dialerButton.checked) ? TextInput.Password : TextInput.Normal echoMode: (mainItem.hidden && !dialerButton.checked) ? TextInput.Password : TextInput.Normal
font.family: DefaultStyle.defaultFont font {
font.pointSize: DefaultStyle.defaultFontPointSize pixelSize: 14 * DefaultStyle.dp
color: DefaultStyle.formItemLabelColor weight: 400 * DefaultStyle.dp
family: DefaultStyle.defaultFont
}
color: DefaultStyle.main2_600
selectByMouse: true selectByMouse: true
validator: mainItem.validator validator: mainItem.validator
background: Item { background: Item {
@ -60,7 +65,7 @@ Rectangle {
cursorDelegate: Rectangle { cursorDelegate: Rectangle {
visible: textField.activeFocus visible: textField.activeFocus
color: DefaultStyle.main1_500_main color: DefaultStyle.main1_500_main
width: 2 width: 2 * DefaultStyle.dp
} }
} }
Control.Button { Control.Button {
@ -78,7 +83,7 @@ Rectangle {
anchors.top: parent.top anchors.top: parent.top
anchors.bottom: parent.bottom anchors.bottom: parent.bottom
anchors.right: parent.right anchors.right: parent.right
anchors.rightMargin: 10 anchors.rightMargin: 10 * DefaultStyle.dp
onCheckedChanged: { onCheckedChanged: {
if (checked) mainItem.numericPad.open() if (checked) mainItem.numericPad.open()
else mainItem.numericPad.close() else mainItem.numericPad.close()
@ -87,8 +92,6 @@ Rectangle {
Control.Button { Control.Button {
id: clearTextButton id: clearTextButton
visible: textField.text.length > 0 visible: textField.text.length > 0
checkable: true
checked: false
background: Rectangle { background: Rectangle {
color: "transparent" color: "transparent"
} }
@ -99,8 +102,8 @@ Rectangle {
anchors.top: parent.top anchors.top: parent.top
anchors.bottom: parent.bottom anchors.bottom: parent.bottom
anchors.right: parent.right anchors.right: parent.right
anchors.rightMargin: 10 anchors.rightMargin: 10 * DefaultStyle.dp
onCheckedChanged: { onClicked: {
textField.clear() textField.clear()
} }
} }

14
Linphone/view/Item/TabBar.qml
View file

@ -9,7 +9,7 @@ Control.TabBar {
readonly property int originX: count > 0 readonly property int originX: count > 0
? itemAt(0).x ? itemAt(0).x
: 0 : 0
spacing: 40 spacing: 40 * DefaultStyle.dp
wheelEnabled: true wheelEnabled: true
background: Quick.Item { background: Quick.Item {
id: tabBarBackground id: tabBarBackground
@ -17,8 +17,8 @@ Control.TabBar {
Quick.Rectangle { Quick.Rectangle {
id: barBG id: barBG
height: 4 height: 4 * DefaultStyle.dp
color: DefaultStyle.lightGrayColor color: DefaultStyle.grey_200
anchors.bottom: parent.bottom anchors.bottom: parent.bottom
width: parent.width width: parent.width
} }
@ -58,7 +58,7 @@ Control.TabBar {
Quick.Rectangle { Quick.Rectangle {
visible: mainItem.currentIndex === index visible: mainItem.currentIndex === index
height: 4 height: 4 * DefaultStyle.dp
color: DefaultStyle.main1_500_main color: DefaultStyle.main1_500_main
anchors.bottom: parent.bottom anchors.bottom: parent.bottom
anchors.left: parent.left anchors.left: parent.left
@ -70,14 +70,14 @@ Control.TabBar {
id: tabText id: tabText
anchors.fill: parent anchors.fill: parent
font.bold: true font.bold: true
color: mainItem.currentIndex === index ? DefaultStyle.defaultTextColor : DefaultStyle.disableTextColor color: mainItem.currentIndex === index ? DefaultStyle.main2_600 : DefaultStyle.main2_400
font.family: DefaultStyle.defaultFont font.family: DefaultStyle.defaultFont
font.pointSize: DefaultStyle.tabButtonTextSize font.pixelSize: 22 * DefaultStyle.dp
elide: Quick.Text.ElideRight elide: Quick.Text.ElideRight
maximumLineCount: 1 maximumLineCount: 1
text: txtMeter.elidedText text: txtMeter.elidedText
// width: Math.min(txtMeter.advanceWidth, Math.max(50, mainItem.width - (x - mainItem.x))) // width: Math.min(txtMeter.advanceWidth, Math.max(50, mainItem.width - (x - mainItem.x)))
bottomPadding: 5 bottomPadding: 5 * DefaultStyle.dp
} }
Quick.TextMetrics { Quick.TextMetrics {

9
Linphone/view/Item/Text.qml
View file

@ -8,9 +8,12 @@ Quick.Text {
id: innerItem id: innerItem
// Layout.preferredWidth: mainItem.width // Layout.preferredWidth: mainItem.width
// width: mainItem.width // width: mainItem.width
font.family: DefaultStyle.defaultFont font {
font.pointSize: DefaultStyle.defaultFontPointSize family: DefaultStyle.defaultFont
color: DefaultStyle.defaultTextColor pixelSize: 10 * DefaultStyle.dp
weight: 400 * DefaultStyle.dp
}
color: DefaultStyle.main2_600
wrapMode: Quick.Text.Wrap wrapMode: Quick.Text.Wrap
elide: Quick.Text.ElideRight elide: Quick.Text.ElideRight
transformOrigin: Quick.Item.TopLeft transformOrigin: Quick.Item.TopLeft

31
Linphone/view/Item/TextInput.qml
View file

@ -11,7 +11,7 @@ ColumnLayout {
property string placeholderText: "" property string placeholderText: ""
property bool mandatory: false property bool mandatory: false
property bool hidden: false property bool hidden: false
property int textInputWidth: 200 property int textInputWidth: 346 * DefaultStyle.dp
property var validator: RegularExpressionValidator{} property var validator: RegularExpressionValidator{}
property bool fillWidth: false property bool fillWidth: false
property bool enableBackgroundColors: true property bool enableBackgroundColors: true
@ -32,14 +32,14 @@ ColumnLayout {
visible: mainItem.label.length > 0 visible: mainItem.label.length > 0
verticalAlignment: Text.AlignVCenter verticalAlignment: Text.AlignVCenter
text: mainItem.label + (mainItem.mandatory ? "*" : "") text: mainItem.label + (mainItem.mandatory ? "*" : "")
color: textField.activeFocus ? DefaultStyle.main1_500_main : DefaultStyle.formItemLabelColor color: textField.activeFocus ? DefaultStyle.main1_500_main : DefaultStyle.main2_600
elide: Text.ElideRight elide: Text.ElideRight
wrapMode: Text.Wrap wrapMode: Text.Wrap
maximumLineCount: 1 maximumLineCount: 1
font { font {
pointSize: DefaultStyle.formItemLabelSize pixelSize: 13 * DefaultStyle.dp
family: DefaultStyle.defaultFont family: DefaultStyle.defaultFont
bold: true weight: 700 * DefaultStyle.dp
} }
Layout.preferredWidth: mainItem.textInputWidth Layout.preferredWidth: mainItem.textInputWidth
} }
@ -51,15 +51,15 @@ ColumnLayout {
Layout.fillWidth = true Layout.fillWidth = true
} }
implicitWidth: mainItem.textInputWidth implicitWidth: mainItem.textInputWidth
implicitHeight: 30 implicitHeight: 49 * DefaultStyle.dp
radius: 20 radius: 79 * DefaultStyle.dp
color: mainItem.enableBackgroundColors ? DefaultStyle.formItemBackgroundColor : "transparent" color: mainItem.enableBackgroundColors ? DefaultStyle.grey_100 : "transparent"
border.color: mainItem.enableBackgroundColors border.color: mainItem.enableBackgroundColors
? (mainItem.errorMessage.length > 0 ? (mainItem.errorMessage.length > 0
? DefaultStyle.errorMessageColor ? DefaultStyle.danger_500main
: textField.activeFocus : textField.activeFocus
? DefaultStyle.main1_500_main ? DefaultStyle.main1_500_main
: DefaultStyle.formItemBorderColor) : DefaultStyle.grey_200)
: "transparent" : "transparent"
Control.TextField { Control.TextField {
id: textField id: textField
@ -69,8 +69,11 @@ ColumnLayout {
placeholderText: mainItem.placeholderText placeholderText: mainItem.placeholderText
echoMode: (mainItem.hidden && !eyeButton.checked) ? TextInput.Password : TextInput.Normal echoMode: (mainItem.hidden && !eyeButton.checked) ? TextInput.Password : TextInput.Normal
font.family: DefaultStyle.defaultFont font.family: DefaultStyle.defaultFont
font.pointSize: DefaultStyle.defaultFontPointSize font {
color: DefaultStyle.formItemLabelColor pixelSize: 14 * DefaultStyle.dp
weight: 400 * DefaultStyle.dp
}
color: DefaultStyle.main2_600
selectByMouse: true selectByMouse: true
validator: mainItem.validator validator: mainItem.validator
background: Item { background: Item {
@ -79,7 +82,7 @@ ColumnLayout {
cursorDelegate: Rectangle { cursorDelegate: Rectangle {
visible: textField.activeFocus visible: textField.activeFocus
color: DefaultStyle.main1_500_main color: DefaultStyle.main1_500_main
width: 2 width: 2 * DefaultStyle.dp
} }
} }
Control.Button { Control.Button {
@ -102,12 +105,12 @@ ColumnLayout {
visible: mainItem.errorMessage.length > 0 visible: mainItem.errorMessage.length > 0
verticalAlignment: Text.AlignVCenter verticalAlignment: Text.AlignVCenter
text: mainItem.errorMessage text: mainItem.errorMessage
color: DefaultStyle.errorMessageColor color: DefaultStyle.danger_500main
elide: Text.ElideRight elide: Text.ElideRight
wrapMode: Text.Wrap wrapMode: Text.Wrap
// maximumLineCount: 1 // maximumLineCount: 1
font { font {
pointSize: DefaultStyle.indicatorMessageTextSize pixelSize: 13 * DefaultStyle.dp
family: DefaultStyle.defaultFont family: DefaultStyle.defaultFont
bold: true bold: true
} }

6
Linphone/view/Item/ToolTip.qml
View file

@ -9,12 +9,12 @@ Control.ToolTip {
background: Rectangle { background: Rectangle {
id: tooltipBackground id: tooltipBackground
opacity: 0.7 opacity: 0.7
color: DefaultStyle.tooltipBackgroundColor color: DefaultStyle.main2_200
radius: 15 radius: 15 * DefaultStyle.dp
} }
contentItem: Text { contentItem: Text {
text: mainItem.text text: mainItem.text
color: DefaultStyle.defaultTextColor color: DefaultStyle.main2_600
width: tooltipBackground.width width: tooltipBackground.width
wrapMode: Text.Wrap wrapMode: Text.Wrap
elide: Text.ElideRight elide: Text.ElideRight

20
Linphone/view/Item/VerticalTabBar.qml
View file

@ -7,8 +7,8 @@ import Linphone
Control.TabBar { Control.TabBar {
id: mainItem id: mainItem
spacing: 15 spacing: 15 * DefaultStyle.dp
topPadding: 20 topPadding: 20 * DefaultStyle.dp
property var model property var model
@ -34,7 +34,7 @@ Control.TabBar {
Rectangle { Rectangle {
anchors.fill: parent anchors.fill: parent
color: DefaultStyle.main1_500_main color: DefaultStyle.main1_500_main
radius: 25 radius: 25 * DefaultStyle.dp
} }
Rectangle { Rectangle {
color: DefaultStyle.main1_500_main color: DefaultStyle.main1_500_main
@ -64,7 +64,7 @@ Control.TabBar {
width: tabButton.width width: tabButton.width
EffectImage { EffectImage {
id: buttonIcon id: buttonIcon
property int buttonSize: 20 property int buttonSize: 24 * DefaultStyle.dp
image.source: mainItem.currentIndex === index ? modelData.selectedIcon : modelData.icon image.source: mainItem.currentIndex === index ? modelData.selectedIcon : modelData.icon
Layout.preferredWidth: buttonSize Layout.preferredWidth: buttonSize
Layout.preferredHeight: buttonSize Layout.preferredHeight: buttonSize
@ -76,16 +76,16 @@ Control.TabBar {
id: buttonText id: buttonText
text: modelData.label text: modelData.label
font { font {
bold: mainItem.currentIndex === index weight: mainItem.currentIndex === index ? 800 * DefaultStyle.dp : 400 * DefaultStyle.dp
pointSize: DefaultStyle.verticalTabButtonTextSize pixelSize: 9 * DefaultStyle.dp
} }
color: DefaultStyle.verticalTabBarTextColor color: DefaultStyle.grey_0
Layout.fillWidth: true Layout.fillWidth: true
Layout.preferredHeight: txtMeter.height Layout.preferredHeight: txtMeter.height
Layout.alignment: Qt.AlignHCenter Layout.alignment: Qt.AlignHCenter
horizontalAlignment: Text.AlignHCenter horizontalAlignment: Text.AlignHCenter
leftPadding: 3 leftPadding: 3 * DefaultStyle.dp
rightPadding: 3 rightPadding: 3 * DefaultStyle.dp
} }
} }
TextMetrics { TextMetrics {
@ -93,7 +93,7 @@ Control.TabBar {
text: modelData.label text: modelData.label
font: buttonText.font font: buttonText.font
Component.onCompleted: { Component.onCompleted: {
font.bold= true font.weight = 800 * DefaultStyle.dp
mainItem.implicitWidth = Math.max(mainItem.implicitWidth, advanceWidth + buttonIcon.buttonSize) mainItem.implicitWidth = Math.max(mainItem.implicitWidth, advanceWidth + buttonIcon.buttonSize)
} }
} }

70
Linphone/view/Page/Login/LoginLayout.qml
View file

@ -1,70 +0,0 @@
/**
* Qml template used for welcome and login/register pages
**/
import QtQuick 2.15
import QtQuick.Layouts 1.3
import QtQuick.Controls 2.2 as Control
import Linphone
Item {
id: mainItem
property alias titleContent : titleLayout.children
property alias centerContent : centerLayout.children
ColumnLayout {
anchors.fill: parent
Layout.fillHeight: true
ColumnLayout {
Layout.rightMargin: 25
RowLayout {
Layout.fillWidth: true
Layout.preferredHeight: 50
Layout.topMargin: 20
Layout.bottomMargin: 20
Layout.alignment: Qt.AlignRight | Qt.AlignTop
Control.Button {
background: Rectangle {
color: "transparent"
}
contentItem: Image {
fillMode: Image.PreserveAspectFit
source: AppIcons.info
}
onClicked: console.debug("[LoginLayout] User: open about popup")
}
Text {
Layout.alignment: Qt.AlignRight |Qt.AlignVCenter
text: "About"
font.pixelSize: 12
color: DefaultStyle.grayColor
}
}
RowLayout {
id: titleLayout
Layout.leftMargin: 40
Layout.bottomMargin: 20
}
ColumnLayout {
id: centerLayout
Layout.leftMargin: 40
Layout.fillHeight: true
Layout.topMargin: 20
}
}
RowLayout {
Layout.alignment: Qt.AlignBottom
Image {
Layout.minimumHeight: 80
Layout.fillWidth: true
source: AppIcons.belledonne
fillMode: Image.Stretch
}
}
}
}

10
Linphone/view/Page/Login/LoginPage.qml
View file

@ -33,8 +33,10 @@ LoginLayout {
} }
Text { Text {
text: "Login" text: "Login"
font.pointSize: DefaultStyle.title2FontPointSize font {
font.bold: true pixelSize: 36 * DefaultStyle.dp
weight: 800 * DefaultStyle.dp
}
scaleLettersFactor: 1.1 scaleLettersFactor: 1.1
} }
Item { Item {
@ -43,11 +45,11 @@ LoginLayout {
Text { Text {
Layout.rightMargin: 15 * DefaultStyle.dp Layout.rightMargin: 15 * DefaultStyle.dp
text: "No account yet ?" text: "No account yet ?"
font.pointSize: DefaultStyle.indicatorMessageTextSize font.pixelSize: 14 * DefaultStyle.dp
font.weight: 400 * DefaultStyle.dp
} }
Button { Button {
Layout.alignment: Qt.AlignRight Layout.alignment: Qt.AlignRight
inversedColors: true
text: "Register" text: "Register"
onClicked: { onClicked: {
console.debug("[LoginPage] User: go to register") console.debug("[LoginPage] User: go to register")

45
Linphone/view/Page/Login/RegisterCheckingPage.qml
View file

@ -11,10 +11,10 @@ LoginLayout {
titleContent: RowLayout { titleContent: RowLayout {
Control.Button { Control.Button {
Layout.preferredHeight: 40 Layout.preferredHeight: 40 * DefaultStyle.dp
Layout.preferredWidth: 40 Layout.preferredWidth: 40 * DefaultStyle.dp
icon.width: 40 icon.width: 40 * DefaultStyle.dp
icon.height: 40 icon.height: 40 * DefaultStyle.dp
icon.source: AppIcons.returnArrow icon.source: AppIcons.returnArrow
background: Rectangle { background: Rectangle {
color: "transparent" color: "transparent"
@ -31,11 +31,13 @@ LoginLayout {
Text { Text {
wrapMode: Text.NoWrap wrapMode: Text.NoWrap
text: { text: {
var completeString = (mainItem.email.length > 0) ? "email" : "phone number" var completeString = (mainItem.email.length > 0) ? qsTr("email") : qsTr("numéro")
text = "Register | Register with your " + completeString text = qsTr("Inscription | Confirmer votre ") + completeString
}
font {
pixelSize: 36 * DefaultStyle.dp
weight: 800 * DefaultStyle.dp
} }
font.pointSize: DefaultStyle.title2FontPointSize
font.bold: true
scaleLettersFactor: 1.1 scaleLettersFactor: 1.1
} }
Item { Item {
@ -44,22 +46,26 @@ LoginLayout {
} }
centerContent: ColumnLayout { centerContent: ColumnLayout {
spacing: 2 spacing: 2 * DefaultStyle.dp
Text { Text {
Layout.alignment: Qt.AlignTop Layout.alignment: Qt.AlignTop
font.bold: true font.bold: true
font.pointSize: DefaultStyle.defaultFontPointSize font.pixelSize: DefaultStyle.defaultFontPointSize
color: DefaultStyle.questionTextColor color: DefaultStyle.main2_700
text: { text: {
var completeString = (mainItem.email.length > 0) ? ("email " + mainItem.email) : ("phone number " + mainItem.phoneNumber) var completeString = (mainItem.email.length > 0) ? ("email " + mainItem.email) : ("phone number " + mainItem.phoneNumber)
text = "We have sent a verification code on your " + completeString + " <br>Please enter the verification code below:" text = "We have sent a verification code on your " + completeString + " <br>Please enter the verification code below:"
} }
font {
pixelSize: 22 * DefaultStyle.dp
weight: 800 * DefaultStyle.dp
}
} }
RowLayout { RowLayout {
Layout.fillWidth: true Layout.fillWidth: true
Layout.margins: 10 Layout.margins: 10 * DefaultStyle.dp
ColumnLayout { ColumnLayout {
spacing: 70 spacing: 70 * DefaultStyle.dp
RowLayout { RowLayout {
Repeater { Repeater {
model: 4 model: 4
@ -75,17 +81,18 @@ LoginLayout {
if (index > 0) if (index > 0)
nextItemInFocusChain(false).forceActiveFocus() nextItemInFocusChain(false).forceActiveFocus()
} }
Layout.margins: 10 Layout.margins: 10 * DefaultStyle.dp
} }
} }
} }
RowLayout { RowLayout {
Layout.alignment: Qt.AlignBottom Layout.alignment: Qt.AlignBottom
Text { Text {
Layout.rightMargin: 15 Layout.rightMargin: 15 * DefaultStyle.dp
text: "Didn't receive the code ?" text: "Didn't receive the code ?"
color: DefaultStyle.questionTextColor color: DefaultStyle.main2_700
font.pointSize: DefaultStyle.indicatorMessageTextSize font.pixelSize: 14 * DefaultStyle.dp
font.weight: 400 * DefaultStyle.dp
} }
Button { Button {
Layout.alignment: Qt.AlignRight Layout.alignment: Qt.AlignRight
@ -101,8 +108,8 @@ LoginLayout {
Layout.fillWidth: true Layout.fillWidth: true
} }
Image { Image {
Layout.rightMargin: 40 Layout.rightMargin: 40 * DefaultStyle.dp
Layout.preferredWidth: 300 Layout.preferredWidth: 300 * DefaultStyle.dp
fillMode: Image.PreserveAspectFit fillMode: Image.PreserveAspectFit
source: AppIcons.verif_page_image source: AppIcons.verif_page_image
} }

65
Linphone/view/Page/Login/RegisterPage.qml
View file

@ -18,9 +18,11 @@ LoginLayout {
} }
Text { Text {
Layout.preferredWidth: width Layout.preferredWidth: width
text: "Register" text: qsTr("Register")
font.pointSize: DefaultStyle.title2FontPointSize font {
font.bold: true pixelSize: 36 * DefaultStyle.dp
weight: 800 * DefaultStyle.dp
}
wrapMode: Text.NoWrap wrapMode: Text.NoWrap
scaleLettersFactor: 1.1 scaleLettersFactor: 1.1
} }
@ -28,10 +30,13 @@ LoginLayout {
Layout.fillWidth: true Layout.fillWidth: true
} }
Text { Text {
Layout.rightMargin: 15 Layout.rightMargin: 15 * DefaultStyle.dp
color: DefaultStyle.questionTextColor color: DefaultStyle.main2_700
text: "Already have an account ?" text: qsTr("Already have an account ?")
font.pointSize: DefaultStyle.indicatorMessageTextSize font {
pixelSize: 14 * DefaultStyle.dp
weight: 400 * DefaultStyle.dp
}
} }
Button { Button {
// Layout.alignment: Qt.AlignRight // Layout.alignment: Qt.AlignRight
@ -45,6 +50,7 @@ LoginLayout {
} }
centerContent: ColumnLayout { centerContent: ColumnLayout {
Layout.topMargin: 40 * DefaultStyle.dp
TabBar { TabBar {
Layout.fillWidth: true Layout.fillWidth: true
id: bar id: bar
@ -56,12 +62,12 @@ LoginLayout {
ColumnLayout { ColumnLayout {
Layout.fillWidth: true Layout.fillWidth: true
Layout.fillHeight: true Layout.fillHeight: true
spacing: 15 spacing: 15 * DefaultStyle.dp
RowLayout { RowLayout {
TextInput { TextInput {
label: "Username" label: "Username"
mandatory: true mandatory: true
textInputWidth: 250 textInputWidth: 346 * DefaultStyle.dp
} }
ComboBox { ComboBox {
label: " " label: " "
@ -74,7 +80,7 @@ LoginLayout {
label: "Phone number" label: "Phone number"
mandatory: true mandatory: true
placeholderText: "Phone number" placeholderText: "Phone number"
textInputWidth: 250 textInputWidth: 346 * DefaultStyle.dp
} }
RowLayout { RowLayout {
ColumnLayout { ColumnLayout {
@ -82,12 +88,13 @@ LoginLayout {
label: "Password" label: "Password"
mandatory: true mandatory: true
hidden: true hidden: true
textInputWidth: 250 textInputWidth: 346 * DefaultStyle.dp
} }
Text { Text {
text: "The password must contain 6 characters minimum" text: "The password must contain 6 characters minimum"
font { font {
pointSize: DefaultStyle.indicatorMessageTextSize pixelSize: 12 * DefaultStyle.dp
weight: 300 * DefaultStyle.dp
} }
} }
} }
@ -96,12 +103,13 @@ LoginLayout {
label: "Confirm password" label: "Confirm password"
mandatory: true mandatory: true
hidden: true hidden: true
textInputWidth: 250 textInputWidth: 346 * DefaultStyle.dp
} }
Text { Text {
text: "The password must contain 6 characters minimum" text: "The password must contain 6 characters minimum"
font { font {
pointSize: DefaultStyle.indicatorMessageTextSize pixelSize: 12 * DefaultStyle.dp
weight: 300 * DefaultStyle.dp
} }
} }
} }
@ -117,7 +125,7 @@ LoginLayout {
CheckBox { CheckBox {
} }
Text { Text {
Layout.preferredWidth: 450 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: "I accept the Terms and Conditions : Read the Terms and Conditions. <br>I accept the Privacy policy : Read the Privacy policy."
} }
} }
@ -133,8 +141,8 @@ LoginLayout {
Layout.fillWidth: true Layout.fillWidth: true
} }
Image { Image {
Layout.rightMargin: 40 Layout.rightMargin: 40 * DefaultStyle.dp
Layout.preferredWidth: 300 Layout.preferredWidth: 300 * DefaultStyle.dp
fillMode: Image.PreserveAspectFit fillMode: Image.PreserveAspectFit
source: AppIcons.loginImage source: AppIcons.loginImage
} }
@ -143,12 +151,12 @@ LoginLayout {
ColumnLayout { ColumnLayout {
Layout.fillWidth: true Layout.fillWidth: true
Layout.fillHeight: true Layout.fillHeight: true
spacing: 15 spacing: 15 * DefaultStyle.dp
RowLayout { RowLayout {
TextInput { TextInput {
label: "Username" label: "Username"
mandatory: true mandatory: true
textInputWidth: 250 textInputWidth: 346 * DefaultStyle.dp
} }
ComboBox { ComboBox {
// if we don't set a label this item is offset // if we don't set a label this item is offset
@ -156,13 +164,14 @@ LoginLayout {
label: " " label: " "
enabled: false enabled: false
modelList: [{text:"@sip.linphone.org"}] modelList: [{text:"@sip.linphone.org"}]
backgroundWidth: 154 * DefaultStyle.dp
} }
} }
TextInput { TextInput {
id: emailInput id: emailInput
label: "Email" label: "Email"
mandatory: true mandatory: true
textInputWidth: 250 textInputWidth: 346 * DefaultStyle.dp
} }
RowLayout { RowLayout {
ColumnLayout { ColumnLayout {
@ -171,12 +180,13 @@ LoginLayout {
label: "Password" label: "Password"
mandatory: true mandatory: true
hidden: true hidden: true
textInputWidth: 250 textInputWidth: 346 * DefaultStyle.dp
} }
Text { Text {
text: "The password must contain 6 characters minimum" text: "The password must contain 6 characters minimum"
font { font {
pointSize: DefaultStyle.indicatorMessageTextSize pixelSize: 12 * DefaultStyle.dp
weight: 300 * DefaultStyle.dp
} }
} }
} }
@ -186,12 +196,13 @@ LoginLayout {
label: "Confirm password" label: "Confirm password"
mandatory: true mandatory: true
hidden: true hidden: true
textInputWidth: 250 textInputWidth: 346 * DefaultStyle.dp
} }
Text { Text {
text: "The password must contain 6 characters minimum" text: "The password must contain 6 characters minimum"
font { font {
pointSize: DefaultStyle.indicatorMessageTextSize pixelSize: 12 * DefaultStyle.dp
weight: 300 * DefaultStyle.dp
} }
} }
} }
@ -207,7 +218,7 @@ LoginLayout {
CheckBox { CheckBox {
} }
Text { Text {
Layout.preferredWidth: 450 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: "I accept the Terms and Conditions : Read the Terms and Conditions. <br>I accept the Privacy policy : Read the Privacy policy."
} }
} }
@ -227,8 +238,8 @@ LoginLayout {
Layout.fillWidth: true Layout.fillWidth: true
} }
Image { Image {
Layout.rightMargin: 40 Layout.rightMargin: 40 * DefaultStyle.dp
Layout.preferredWidth: 300 Layout.preferredWidth: 300 * DefaultStyle.dp
fillMode: Image.PreserveAspectFit fillMode: Image.PreserveAspectFit
source: AppIcons.loginImage source: AppIcons.loginImage
} }

362
Linphone/view/Page/Login/SIPLoginPage.qml
View file

@ -11,14 +11,17 @@ LoginLayout {
signal connectionSucceed() signal connectionSucceed()
titleContent: RowLayout { titleContent: RowLayout {
Control.Button { Button {
Layout.preferredHeight: 40 Layout.preferredHeight: 24 * DefaultStyle.dp
Layout.preferredWidth: 40 Layout.preferredWidth: 24 * DefaultStyle.dp
icon.width: 40 contentItem: Image {
icon.height: 40 anchors.fill: parent
icon.source: AppIcons.returnArrow source: AppIcons.returnArrow
background: Rectangle { width: 24 * DefaultStyle.dp
color: "transparent" height: 24 * DefaultStyle.dp
}
background: Item {
anchors.fill: parent
} }
onClicked: { onClicked: {
console.debug("[SIPLoginPage] User: return") console.debug("[SIPLoginPage] User: return")
@ -28,25 +31,34 @@ LoginLayout {
Image { Image {
fillMode: Image.PreserveAspectFit fillMode: Image.PreserveAspectFit
source: AppIcons.profile source: AppIcons.profile
Layout.preferredHeight: 34 * DefaultStyle.dp
Layout.preferredWidth: 34 * DefaultStyle.dp
sourceSize.width: 34 * DefaultStyle.dp
sourceSize.height: 34 * DefaultStyle.dp
} }
Text { Text {
text: "Use a SIP Account" text: qsTr("Compte SIP tiers")
font.pointSize: DefaultStyle.title2FontPointSize font {
font.bold: true pixelSize: 36 * DefaultStyle.dp
weight: 800 * DefaultStyle.dp
}
scaleLettersFactor: 1.1 scaleLettersFactor: 1.1
} }
Item { Item {
Layout.fillWidth: true Layout.fillWidth: true
} }
Text { Text {
Layout.rightMargin: 15 Layout.rightMargin: 15 * DefaultStyle.dp
text: "No account yet ?" text: qsTr("No account yet ?")
font.pointSize: DefaultStyle.indicatorMessageTextSize font {
pixelSize: 14 * DefaultStyle.dp
weight: 400 * DefaultStyle.dp
}
} }
Button { Button {
Layout.alignment: Qt.AlignRight Layout.alignment: Qt.AlignRight
inversedColors: true inversedColors: true
text: "Register" text: qsTr("Register")
onClicked: { onClicked: {
console.debug("[SIPLoginPage] User: go to register page") console.debug("[SIPLoginPage] User: go to register page")
mainItem.goToRegister() mainItem.goToRegister()
@ -54,173 +66,175 @@ LoginLayout {
} }
} }
centerContent: ColumnLayout { centerContent: RowLayout {
signal useSIPButtonClicked() signal useSIPButtonClicked()
RowLayout { Layout.topMargin: 85 * DefaultStyle.dp
Control.StackView { Control.StackView {
id: rootStackView id: rootStackView
initialItem: firstItem initialItem: firstItem
Layout.preferredWidth: 280 Layout.preferredWidth: 361 * DefaultStyle.dp
Layout.fillHeight: true Layout.fillHeight: true
Layout.alignment: Qt.AlignTop Layout.alignment: Qt.AlignVCenter
} clip: true
Component { }
id: firstItem Component {
ColumnLayout { id: firstItem
ColumnLayout { ColumnLayout {
Layout.bottomMargin: 60 Layout.alignment: Qt.AlignVCenter
Text { spacing: 10 * DefaultStyle.dp
Layout.fillWidth: true // Layout.bottomMargin: 20 * DefaultStyle.dp
Layout.preferredWidth: rootStackView.width Text {
width: rootStackView.width Layout.fillWidth: true
wrapMode: Text.WordWrap Layout.preferredWidth: rootStackView.width
color: DefaultStyle.darkGrayColor width: rootStackView.width
font.pointSize: DefaultStyle.descriptionTextSize wrapMode: Text.WordWrap
text: "<p>Some features require a Linphone account, such as group messaging, video conferences...</p> color: DefaultStyle.main2_600
<p>These features are hidden when you register with a third party SIP account.</p> font {
<p>To enable it in a commercial projet, please contact us. </p>" pixelSize: 14 * DefaultStyle.dp
} weight: 400* DefaultStyle.dp
Button {
text: "linphone.org/contact"
textSize: 8
inversedColors: true
leftPadding: 8
rightPadding: 8
topPadding: 5
bottomPadding: 5
onClicked: {
Qt.openUrlExternally(ConstantsCpp.ContactUrl)
}
}
} }
ColumnLayout { text: "<p>Some features require a Linphone account, such as group messaging, video conferences...</p>
spacing: 10 <p>These features are hidden when you register with a third party SIP account.</p>
Layout.bottomMargin: 20 <p>To enable it in a commercial projet, please contact us. </p>"
Button { }
Layout.fillWidth: true Button {
inversedColors: true text: "linphone.org/contact"
text: "I prefer creating an account" textSize: 13 * DefaultStyle.dp
onClicked: { inversedColors: true
console.debug("[SIPLoginPage] User: click register") leftPadding: 12 * DefaultStyle.dp
mainItem.goToRegister() rightPadding: 12 * DefaultStyle.dp
} topPadding: 6 * DefaultStyle.dp
} bottomPadding: 6 * DefaultStyle.dp
Button { onClicked: {
Layout.fillWidth: true Qt.openUrlExternally(ConstantsCpp.ContactUrl)
text: "I understand"
onClicked: {
rootStackView.replace(secondItem)
}
}
}
Item {
Layout.fillHeight: true
} }
} }
} Item {
Component { Layout.preferredHeight: 85 * DefaultStyle.dp
id: secondItem }
ColumnLayout { Button {
spacing: 10 Layout.fillWidth: true
TextInput { inversedColors: true
id: username text: "I prefer creating an account"
label: "Username" onClicked: {
mandatory: true console.debug("[SIPLoginPage] User: click register")
textInputWidth: 250 mainItem.goToRegister()
}
TextInput {
id: password
label: "Password"
mandatory: true
hidden: true
textInputWidth: 250
}
TextInput {
id: domain
label: "Domain"
mandatory: true
textInputWidth: 250
}
TextInput {
id: displayName
label: "Display Name"
textInputWidth: 250
}
ComboBox {
label: "Transport"
backgroundWidth: 250
modelList:[ "TCP", "UDP", "TLS"]
}
Text {
id: errorText
text: "Connection has failed. Please verify your credentials"
color: DefaultStyle.errorMessageColor
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()
} else if (LoginPageCpp.registrationState === LinphoneEnums.RegistrationState.Ok) {
mainItem.connectionSucceed()
}
}
}
}
Button {
Layout.topMargin: 20
Layout.bottomMargin: 20
text: "Log in"
onClicked: {
console.debug("[SIPLoginPage] User: Log in")
LoginPageCpp.login(username.inputText, password.inputText);
}
}
Item {
Layout.fillHeight: true
} }
} }
Button {
Layout.fillWidth: true
text: "I understand"
onClicked: {
rootStackView.replace(secondItem)
}
}
Item {
Layout.fillHeight: true
}
} }
Item { }
Layout.fillWidth: true Component {
} id: secondItem
Image { ColumnLayout {
Layout.alignment: Qt.AlignBottom spacing: 10 * DefaultStyle.dp
Layout.rightMargin: 40 TextInput {
Layout.preferredWidth: 300 id: username
fillMode: Image.PreserveAspectFit label: "Username"
source: AppIcons.loginImage mandatory: true
textInputWidth: 250 * DefaultStyle.dp
}
TextInput {
id: password
label: "Password"
mandatory: true
hidden: true
textInputWidth: 250 * DefaultStyle.dp
}
TextInput {
id: domain
label: "Domain"
mandatory: true
textInputWidth: 250 * DefaultStyle.dp
}
TextInput {
id: displayName
label: "Display Name"
textInputWidth: 250 * DefaultStyle.dp
}
ComboBox {
label: "Transport"
backgroundWidth: 250 * DefaultStyle.dp
modelList:[ "TCP", "UDP", "TLS"]
}
Text {
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()
} else if (LoginPageCpp.registrationState === LinphoneEnums.RegistrationState.Ok) {
mainItem.connectionSucceed()
}
}
}
}
Button {
Layout.topMargin: 20 * DefaultStyle.dp
Layout.bottomMargin: 20 * DefaultStyle.dp
text: "Log in"
onClicked: {
console.debug("[SIPLoginPage] User: Log in")
LoginPageCpp.login(username.inputText, password.inputText);
}
}
Item {
Layout.fillHeight: true
}
} }
}
Item {
Layout.fillWidth: true
}
Image {
Layout.alignment: Qt.AlignVCenter
Layout.rightMargin: 40 * DefaultStyle.dp
Layout.preferredWidth: 395 * DefaultStyle.dp
fillMode: Image.PreserveAspectFit
source: AppIcons.loginImage
} }
Item { Item {
Layout.fillHeight: true Layout.fillHeight: true

22
Linphone/view/Page/Login/SecurityModePage.qml
View file

@ -15,27 +15,31 @@ LoginLayout {
ColumnLayout { ColumnLayout {
Text { Text {
text: qsTr("Choisir votre mode") text: qsTr("Choisir votre mode")
font.pointSize: DefaultStyle.title2FontPointSize font {
font.bold: true pixelSize: 36 * DefaultStyle.dp
scaleLettersFactor: 1.1 weight: 800 * DefaultStyle.dp
}
} }
Text { Text {
text: qsTr("Vous pourrez changer de mode plus tard.") text: qsTr("Vous pourrez changer de mode plus tard.")
font.bold: true font.bold: true
scaleLettersFactor: 1.1 font {
pixelSize: 14 * DefaultStyle.dp
weight: 400 * DefaultStyle.dp
}
} }
} }
} }
centerContent: ColumnLayout { centerContent: ColumnLayout {
spacing: 80 spacing: 80 * DefaultStyle.dp
Layout.topMargin: 70 Layout.topMargin: 70 * DefaultStyle.dp
Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter
RowLayout { RowLayout {
id: radioButtonsLayout id: radioButtonsLayout
Layout.fillWidth: true Layout.fillWidth: true
Layout.alignment: Qt.AlignHCenter Layout.alignment: Qt.AlignHCenter
spacing: 70 spacing: 70 * DefaultStyle.dp
Repeater { Repeater {
model: [ model: [
{checked: true, title: qsTr("Chiffrement de bout en bout"), text: qsTr("Ce mode vous garanti la confidentialité de tous vos échanges. Notre technologie de chiffrement de bout en bout assure un niveau de sécurité maximal pour tous vos échanges."), imgUrl: AppIcons.chiffrement}, {checked: true, title: qsTr("Chiffrement de bout en bout"), text: qsTr("Ce mode vous garanti la confidentialité de tous vos échanges. Notre technologie de chiffrement de bout en bout assure un niveau de sécurité maximal pour tous vos échanges."), imgUrl: AppIcons.chiffrement},
@ -56,8 +60,8 @@ LoginLayout {
id: continueButton id: continueButton
property int selectedIndex: 0 property int selectedIndex: 0
Layout.alignment: Qt.AlignHCenter Layout.alignment: Qt.AlignHCenter
leftPadding: 100 leftPadding: 100 * DefaultStyle.dp
rightPadding: 100 rightPadding: 100 * DefaultStyle.dp
text: qsTr("Continuer") text: qsTr("Continuer")
onClicked: mainItem.modeSelected(selectedIndex) onClicked: mainItem.modeSelected(selectedIndex)
} }

101
Linphone/view/Page/Login/WelcomePage.qml
View file

@ -11,20 +11,24 @@ LoginLayout {
titleContent: RowLayout { titleContent: RowLayout {
Text { Text {
id: welcome id: welcome
text: "Welcome" text: qsTr("Bienvenue")
color: DefaultStyle.titleColor color: DefaultStyle.main2_800
font.pointSize: DefaultStyle.title1FontPointSize font {
font.bold: true pixelSize: 96 * DefaultStyle.dp
weight: 800 * DefaultStyle.dp
}
scaleLettersFactor: 1.1 scaleLettersFactor: 1.1
} }
Text { Text {
Layout.alignment: Qt.AlignBottom Layout.alignment: Qt.AlignBottom
Layout.leftMargin: 10 Layout.leftMargin: 10 * DefaultStyle.dp
Layout.bottomMargin: 5 Layout.bottomMargin: 5 * DefaultStyle.dp
color: DefaultStyle.titleColor color: DefaultStyle.main2_800
text: "in Linphone" text: qsTr("sur Linphone")
font.pointSize: DefaultStyle.title2FontPointSize font {
font.bold: true pixelSize: 36 * DefaultStyle.dp
weight: 800 * DefaultStyle.dp
}
scaleLettersFactor: 1.1 scaleLettersFactor: 1.1
} }
Item { Item {
@ -37,8 +41,12 @@ LoginLayout {
visible: false visible: false
} }
contentItem: Text { contentItem: Text {
text: "Skip" text: qsTr("Passer")
font.underline: true font {
underline: true
pixelSize: 13 * DefaultStyle.dp
weight: 600 * DefaultStyle.dp
}
} }
onClicked: { onClicked: {
console.debug("[WelcomePage] User: Click skip") console.debug("[WelcomePage] User: Click skip")
@ -47,14 +55,18 @@ LoginLayout {
} }
} }
centerContent: ColumnLayout { centerContent: ColumnLayout {
Layout.bottomMargin: 20 id: centerLayout
Layout.bottomMargin: 20 * DefaultStyle.dp
Layout.fillWidth: false
Layout.fillHeight: false
Layout.leftMargin: 250 * DefaultStyle.dp
Layout.topMargin: 165 * DefaultStyle.dp
RowLayout { RowLayout {
Layout.leftMargin: 100
Image { Image {
Layout.rightMargin: 40 id: carouselImg
Layout.topMargin: 20 Layout.rightMargin: 40 * DefaultStyle.dp
Layout.preferredWidth: 100 Layout.preferredWidth: 153.22 * DefaultStyle.dp
Layout.maximumWidth: 100 Layout.preferredHeight: 156 * DefaultStyle.dp
fillMode: Image.PreserveAspectFit fillMode: Image.PreserveAspectFit
source: carousel.currentIndex == 0 ? AppIcons.welcomeLinphoneLogo : carousel.currentIndex == 1 ? AppIcons.welcomeLock : AppIcons.welcomeOpenSource source: carousel.currentIndex == 0 ? AppIcons.welcomeLinphoneLogo : carousel.currentIndex == 1 ? AppIcons.welcomeLock : AppIcons.welcomeOpenSource
} }
@ -64,46 +76,45 @@ LoginLayout {
itemsList: Repeater { itemsList: Repeater {
id: slideRepeater id: slideRepeater
model: [ model: [
{title: "Linphone", text: "Une application de communication <b>sécurisée</b>,<br> <b>open source</b> et <b>française</b>."}, {title: qsTr("Linphone"), text: qsTr("Une application de communication <b>sécurisée</b>,<br> <b>open source</b> et <b>française</b>.")},
{title: "Sécurisé", text: "Vos communications sont en sécurité grâce aux <br><b>Chiffrement de bout en bout</b>."}, {title: qsTr("Sécurisé"), text: qsTr("Vos communications sont en sécurité grâce aux <br><b>Chiffrement de bout en bout</b>.")},
{title: "Open Source", text: "Une application open source et un <b>service gratuit</b> <br>depuis <b>2001</b>"}, {title: qsTr("Open Source"), text: qsTr("Une application open source et un <b>service gratuit</b> <br>depuis <b>2001</b>")},
] ]
Item { ColumnLayout {
ColumnLayout { spacing: 15 * DefaultStyle.dp
anchors.verticalCenter: parent.verticalCenter Text {
spacing: 15 id: title
Text { text: modelData.title
text: modelData.title font {
font.bold: true pixelSize: 29 * DefaultStyle.dp
font.pixelSize: 20 weight: 800 * DefaultStyle.dp
scaleLettersFactor: 1.1
}
Text {
Layout.maximumWidth: 361
wrapMode: Text.WordWrap
font.pixelSize: 11
text: modelData.text
} }
} }
Text {
id: txt
Layout.maximumWidth: 361 * DefaultStyle.dp
wrapMode: Text.WordWrap
font.pixelSize: 14 * DefaultStyle.dp
font.weight: 400 * DefaultStyle.dp
text: modelData.text
}
} }
} }
} }
} }
Button { Button {
Layout.topMargin: 20 Layout.topMargin: 20 * DefaultStyle.dp
Layout.bottomMargin: 20 Layout.bottomMargin: 20 * DefaultStyle.dp
Layout.leftMargin: 361 - width Layout.leftMargin: (centerLayout.width - width) * DefaultStyle.dp
Layout.alignment: Qt.AlignBottom Layout.alignment: Qt.AlignBottom | Qt.AlignRight
text: carousel.currentIndex < (carousel.itemsCount - 1) ? "Next" : "Start" y: centerLayout.implicitWidth - width
text: carousel.currentIndex < (carousel.itemsCount - 1) ? qsTr("Suivant") : qsTr("Commencer")
onClicked: { onClicked: {
if (carousel.currentIndex < 2) carousel.goToSlide(carousel.currentIndex + 1); if (carousel.currentIndex < 2) carousel.goToSlide(carousel.currentIndex + 1);
else mainItem.startButtonPressed(); else mainItem.startButtonPressed();
} }
} }
Item {
Layout.fillHeight: true
}
} }
} }

26
Linphone/view/Page/Main/AbstractMainPage.qml
View file

@ -25,18 +25,18 @@ Item {
anchors.fill: parent anchors.fill: parent
handle: Rectangle { handle: Rectangle {
implicitWidth: 8 implicitWidth: 8 * DefaultStyle.dp
color: Control.SplitHandle.hovered ? DefaultStyle.splitViewHoveredHandleColor : DefaultStyle.splitViewHandleColor color: Control.SplitHandle.hovered ? DefaultStyle.grey_200 : DefaultStyle.grey_100
} }
ColumnLayout { ColumnLayout {
id: leftPanel id: leftPanel
Control.SplitView.preferredWidth: 280 Control.SplitView.preferredWidth: 280 * DefaultStyle.dp
} }
Rectangle { Rectangle {
id: rightPanel id: rightPanel
clip: true clip: true
color: DefaultStyle.mainPageRightPanelBackgroundColor color: DefaultStyle.grey_100
StackLayout { StackLayout {
currentIndex: mainItem.showDefaultItem ? 0 : 1 currentIndex: mainItem.showDefaultItem ? 0 : 1
anchors.fill: parent anchors.fill: parent
@ -48,25 +48,28 @@ Item {
Layout.fillHeight: true Layout.fillHeight: true
Layout.fillWidth: true Layout.fillWidth: true
Layout.alignment: Qt.AlignHCenter Layout.alignment: Qt.AlignHCenter
spacing: 25
Item { Item {
Layout.fillWidth: true Layout.fillWidth: true
} }
ColumnLayout { ColumnLayout {
spacing: 30 * DefaultStyle.dp
Item { Item {
Layout.fillHeight: true Layout.fillHeight: true
} }
Image { Image {
Layout.alignment: Qt.AlignHCenter Layout.alignment: Qt.AlignHCenter
source: AppIcons.noItemImage source: AppIcons.noItemImage
Layout.preferredWidth: 250 Layout.preferredWidth: 359 * DefaultStyle.dp
Layout.preferredHeight: 250 Layout.preferredHeight: 314 * DefaultStyle.dp
fillMode: Image.PreserveAspectFit fillMode: Image.PreserveAspectFit
} }
Text { Text {
text: mainItem.emptyListText text: mainItem.emptyListText
Layout.alignment: Qt.AlignHCenter Layout.alignment: Qt.AlignHCenter
font.bold: true font {
pixelSize: 22 * DefaultStyle.dp
weight: 800 * DefaultStyle.dp
}
} }
Button { Button {
Layout.alignment: Qt.AlignHCenter Layout.alignment: Qt.AlignHCenter
@ -75,7 +78,8 @@ Item {
EffectImage { EffectImage {
colorizationColor: DefaultStyle.grey_0 colorizationColor: DefaultStyle.grey_0
image.source: mainItem.newItemIconSource image.source: mainItem.newItemIconSource
image.width: 20 image.width: 24 * DefaultStyle.dp
image.height: 24 * DefaultStyle.dp
image.fillMode: Image.PreserveAspectFit image.fillMode: Image.PreserveAspectFit
} }
Text { Text {
@ -83,8 +87,8 @@ Item {
wrapMode: Text.WordWrap wrapMode: Text.WordWrap
color: DefaultStyle.grey_0 color: DefaultStyle.grey_0
font { font {
bold: true weight: 600 * DefaultStyle.dp
pointSize: DefaultStyle.buttonTextSize pixelSize: 18 * DefaultStyle.dp
family: DefaultStyle.defaultFont family: DefaultStyle.defaultFont
} }
} }

48
Linphone/view/Page/Main/CallPage.qml
View file

@ -20,7 +20,7 @@ AbstractMainPage {
clip: true clip: true
initialItem: listItem initialItem: listItem
anchors.fill: parent anchors.fill: parent
property int sideMargin: 25 property int sideMargin: 25 * DefaultStyle.dp
// anchors.leftMargin: 25 // anchors.leftMargin: 25
// anchors.rightMargin: 25 // anchors.rightMargin: 25
} }
@ -34,9 +34,9 @@ AbstractMainPage {
Layout.rightMargin: listStackView.sideMargin Layout.rightMargin: listStackView.sideMargin
Text { Text {
text: qsTr("Appels") text: qsTr("Appels")
color: DefaultStyle.mainPageTitleColor color: DefaultStyle.main2_700
font.pointSize: DefaultStyle.mainPageTitleSize font.pixelSize: 29 * DefaultStyle.dp
font.bold: true font.weight: 800 * DefaultStyle.dp
} }
Item { Item {
Layout.fillWidth: true Layout.fillWidth: true
@ -56,8 +56,8 @@ AbstractMainPage {
} }
contentItem: Image { contentItem: Image {
source: AppIcons.newCall source: AppIcons.newCall
width: 30 width: 30 * DefaultStyle.dp
sourceSize.width: 30 sourceSize.width: 30 * DefaultStyle.dp
fillMode: Image.PreserveAspectFit fillMode: Image.PreserveAspectFit
} }
onClicked: { onClicked: {
@ -87,10 +87,13 @@ AbstractMainPage {
ColumnLayout { ColumnLayout {
Text { Text {
text: qsTr("Aucun appel") text: qsTr("Aucun appel")
font.bold: true font {
pixelSize: 16 * DefaultStyle.dp
weight: 800 * DefaultStyle.dp
}
visible: listView.count === 0 visible: listView.count === 0
Layout.alignment: Qt.AlignHCenter Layout.alignment: Qt.AlignHCenter
Layout.topMargin: 30 Layout.topMargin: 30 * DefaultStyle.dp
} }
ListView { ListView {
id: listView id: listView
@ -103,7 +106,7 @@ AbstractMainPage {
delegate: Item { delegate: Item {
required property int index required property int index
width:listView.width width:listView.width
height: 30 height: 30 * DefaultStyle.dp
// RectangleTest{} // RectangleTest{}
RowLayout { RowLayout {
anchors.fill: parent anchors.fill: parent
@ -127,15 +130,15 @@ AbstractMainPage {
Layout.fillWidth: true Layout.fillWidth: true
} }
Control.Button { Control.Button {
implicitWidth: 30 implicitWidth: 30 * DefaultStyle.dp
implicitHeight: 30 implicitHeight: 30 * DefaultStyle.dp
background: Item { background: Item {
visible: false visible: false
} }
contentItem: Image { contentItem: Image {
source: AppIcons.phone source: AppIcons.phone
width: 20 width: 20 * DefaultStyle.dp
sourceSize.width: 20 sourceSize.width: 20 * DefaultStyle.dp
fillMode: Image.PreserveAspectFit fillMode: Image.PreserveAspectFit
} }
} }
@ -145,8 +148,8 @@ AbstractMainPage {
Rectangle { Rectangle {
anchors.fill: parent anchors.fill: parent
opacity: 0.1 opacity: 0.1
radius: 15 radius: 15 * DefaultStyle.dp
color: DefaultStyle.comboBoxHoverColor color: DefaultStyle.main2_500main
visible: parent.containsMouse visible: parent.containsMouse
} }
onPressed: listView.currentIndex = parent.index onPressed: listView.currentIndex = parent.index
@ -190,9 +193,9 @@ AbstractMainPage {
} }
Text { Text {
text: qsTr("Nouvel appel") text: qsTr("Nouvel appel")
color: DefaultStyle.mainPageTitleColor color: DefaultStyle.main2_700
font.pointSize: DefaultStyle.mainPageTitleSize font.pixelSize: 29 * DefaultStyle.dp
font.bold: true font.weight: 800 * DefaultStyle.dp
} }
Item { Item {
Layout.fillWidth: true Layout.fillWidth: true
@ -203,17 +206,12 @@ AbstractMainPage {
Layout.fillHeight: true Layout.fillHeight: true
Layout.maximumWidth: parent.width Layout.maximumWidth: parent.width
groupCallVisible: true groupCallVisible: true
searchBarColor: DefaultStyle.contactListSearchBarColor searchBarColor: DefaultStyle.grey_100
onCallButtonPressed: (address) => { onCallButtonPressed: (address) => {
var addressEnd = "@sip.linphone.org" var addressEnd = "@sip.linphone.org"
if (!address.endsWith(addressEnd)) address += addressEnd if (!address.endsWith(addressEnd)) address += addressEnd
var callVarObject = UtilsCpp.createCall(address) var callVarObject = UtilsCpp.createCall(address)
// var windowComp = Qt.createComponent("CallsWindow.qml")
// var call = callVarObject.value
// var callWindow = windowComp.createObject(null, {callVarObject: callVarObject})
// callWindow.modality = Qt.ApplicationModal
// callWindow.show()
} }
} }
} }
@ -223,4 +221,4 @@ AbstractMainPage {
rightPanelContent: ColumnLayout { rightPanelContent: ColumnLayout {
} }
} }

86
Linphone/view/Style/DefaultStyle.qml
View file

@ -3,6 +3,7 @@ import QtQuick 2.15
QtObject { QtObject {
property color main1_500_main: "#FE5E00" property color main1_500_main: "#FE5E00"
property color main1_500_main_darker: "#C94C02"
property color main2_0: "#FAFEFF" property color main2_0: "#FAFEFF"
property color main2_100: "#EEF6F8" property color main2_100: "#EEF6F8"
@ -10,96 +11,35 @@ QtObject {
property color main2_300: "#C0D1D9" property color main2_300: "#C0D1D9"
property color main2_400: "#9AABB5" property color main2_400: "#9AABB5"
property color main2_500main: "#6C7A87" property color main2_500main: "#6C7A87"
property color main2_600: "#4E6074"
property color main2_700: "#364860" property color main2_700: "#364860"
property color main2_800: "#22334D"
property color warning_600: "#DBB820"
property color grey_0: "#FFFFFF" property color grey_0: "#FFFFFF"
property color grey_100: "#F9F9F9"
property color grey_200: "#EDEDED"
property color grey_400: "#949494"
property color grey_500: "#4E4E4E" property color grey_500: "#4E4E4E"
property color grey_600: "#2E3030" property color grey_600: "#2E3030"
property color grey_900: "#070707" property color grey_900: "#070707"
property color grey_1000: "#000000"
property color danger_500: "#DD5F5F" property color warning_600: "#DBB820"
property color danger_500main: "#DD5F5F"
property color success_500main: "#4FAE80"
property color info_500_main: "#4AA8FF" property color info_500_main: "#4AA8FF"
property color success_500main: "#4FAE80"
property double dp: 0.8 //1
property string emojiFont: "Noto Color Emoji" property string emojiFont: "Noto Color Emoji"
property color buttonPressedBackground: "#c74b02"
property color buttonPressedInversedBackground: "#fff1e8"
property int radioButtonTextSize: 8
property int radioButtonTitleSize: 9
property double checkboxBorderWidth: 2
property int buttonTextSize: 10
property color carouselLightGrayColor: "#DFECF2"
property color formItemLabelColor: "#4E6074"
property int formItemLabelSize: 8
property color formItemDisableColor: "#949494"
property color formItemDisableBackgroundColor: "#EDEDED"
property color formItemBackgroundColor: "#F9F9F9"
property color formItemBorderColor: "#EDEDED"
property int tabButtonTextSize: 11
property color verticalTabBarTextColor: "white"
property int verticalTabButtonTextSize: 6
property color comboBoxHighlightColor: "#C0D1D9"
property color comboBoxHoverColor: "#6C7A87"
property color aboutButtonTextColor: "#6C7A87"
property color questionTextColor: "#364860"
property color errorMessageColor: "#DD5F5F"
property color tooltipBackgroundColor: "#DFECF2"
property color digitInputColor: "#6C7A87"
property color darkBlueColor: "#22334D"
property color darkGrayColor: "#4E6074"
property color grayColor: "#6C7A87"
property color lightGrayColor: "#EDEDED"
property color defaultTextColor: "#4E6074"
property color disableTextColor: "#9AABB5"
property int descriptionTextSize: 7
property int indicatorMessageTextSize: 7
property string defaultFont: "Noto Sans" property string defaultFont: "Noto Sans"
property int defaultFontPointSize: 10
property int title1FontPointSize: 50
property int title2FontPointSize: 20
property color titleColor: "#22334D"
property color mainPageRightPanelBackgroundColor: "#F9F9F9"
property color mainPageTitleColor: "#364860"
property int mainPageTitleSize: 15
property color searchBarFocusBorderColor: "#6C7A87"
property color contactListSearchBarColor: "#F9F9F9"
property color callRightPanelSearchBarBorderColor: "#EDEDED"
property color numericPadBackgroundColor: "#F9F9F9"
property color numericPadShadowColor: Qt.rgba(0.0, 0.0, 0.0, 0.1)
property int numericPadButtonTextSize: 15
property int numericPadButtonSubtextSize: 6
property color numericPadPressedButtonColor: "#EEF7F8" property color numericPadPressedButtonColor: "#EEF7F8"
property color groupCallButtonColor: "#EEF7F8" property color groupCallButtonColor: "#EEF7F8"
property color launchCallButtonColor: "#4FAE80" property color launchCallButtonColor: "#4FAE80"
property color callCheckedButtonColor: "#9AABB5" property color callCheckedButtonColor: "#9AABB5"
property color splitViewHandleColor: "#F9F9F9"
property color splitViewHoveredHandleColor: "#EDEDED"
property color ongoingCallWindowColor: "#000000"
property color ongoingCallBackgroundColor: "#2E3030"
property int ongoingCallElapsedTimeSize: 15
property int ongoingCallNameSize: 10
property int ongoingCallAddressSize: 6
property color callRightPanelBackgroundColor: "#F9F9F9"
property color defaultAvatarBackgroundColor: "#DFECF2"
property double dp: 1.0//0.66
} }