diff --git a/linphone-desktop/assets/images/drop_down.svg b/linphone-desktop/assets/images/drop_down.svg
new file mode 100644
index 000000000..3e852d784
--- /dev/null
+++ b/linphone-desktop/assets/images/drop_down.svg
@@ -0,0 +1,12 @@
+
+
diff --git a/linphone-desktop/assets/languages/en.ts b/linphone-desktop/assets/languages/en.ts
index 1d593343e..361c3c0e1 100644
--- a/linphone-desktop/assets/languages/en.ts
+++ b/linphone-desktop/assets/languages/en.ts
@@ -851,6 +851,14 @@ Server url not configured.
savedVideosLabel
Saved videos folder
+
+ languagesTitle
+ Languages
+
+
+ languagesLabel
+ Language
+
SettingsWindow
diff --git a/linphone-desktop/assets/languages/fr.ts b/linphone-desktop/assets/languages/fr.ts
index 98b33137f..90e117183 100644
--- a/linphone-desktop/assets/languages/fr.ts
+++ b/linphone-desktop/assets/languages/fr.ts
@@ -861,6 +861,14 @@ Url du serveur non configurée.
savedVideosLabel
Dossier des captures vidéos
+
+ languagesTitle
+ Langues
+
+
+ languagesLabel
+ Langue
+
SettingsWindow
diff --git a/linphone-desktop/resources.qrc b/linphone-desktop/resources.qrc
index 5e87b31dd..c11aa5908 100644
--- a/linphone-desktop/resources.qrc
+++ b/linphone-desktop/resources.qrc
@@ -74,6 +74,7 @@
assets/images/delete_hovered.svg
assets/images/delete_normal.svg
assets/images/delete_pressed.svg
+ assets/images/drop_down.svg
assets/images/edit_hovered.svg
assets/images/edit_normal.svg
assets/images/edit_pressed.svg
@@ -183,6 +184,7 @@
ui/modules/Common/Form/Buttons/TextButtonA.qml
ui/modules/Common/Form/Buttons/TextButtonB.qml
ui/modules/Common/Form/CheckBoxText.qml
+ ui/modules/Common/Form/ComboBox.qml
ui/modules/Common/Form/DroppableTextArea.qml
ui/modules/Common/Form/Fields/NumericField.qml
ui/modules/Common/Form/Fields/TextAreaField.qml
@@ -203,7 +205,6 @@
ui/modules/Common/Form/Tab/TabBar.qml
ui/modules/Common/Form/Tab/TabButton.qml
ui/modules/Common/Form/Tab/TabContainer.qml
- ui/modules/Common/Form/TransparentComboBox.qml
ui/modules/Common/Form/TransparentTextInput.qml
ui/modules/Common/Helpers/InvertedMouseArea.qml
ui/modules/Common/Image/Icon.qml
@@ -231,6 +232,7 @@
ui/modules/Common/Styles/Form/Buttons/TextButtonAStyle.qml
ui/modules/Common/Styles/Form/Buttons/TextButtonBStyle.qml
ui/modules/Common/Styles/Form/CheckBoxTextStyle.qml
+ ui/modules/Common/Styles/Form/ComboBoxStyle.qml
ui/modules/Common/Styles/Form/DroppableTextAreaStyle.qml
ui/modules/Common/Styles/Form/Fields/NumericFieldStyle.qml
ui/modules/Common/Styles/Form/Fields/TextAreaFieldStyle.qml
@@ -245,7 +247,6 @@
ui/modules/Common/Styles/Form/SwitchStyle.qml
ui/modules/Common/Styles/Form/Tab/TabButtonStyle.qml
ui/modules/Common/Styles/Form/Tab/TabContainerStyle.qml
- ui/modules/Common/Styles/Form/TransparentComboBoxStyle.qml
ui/modules/Common/Styles/Form/TransparentTextInputStyle.qml
ui/modules/Common/Styles/Menu/ActionMenuStyle.qml
ui/modules/Common/Styles/Menu/MenuStyle.qml
diff --git a/linphone-desktop/ui/modules/Common/Form/ComboBox.qml b/linphone-desktop/ui/modules/Common/Form/ComboBox.qml
new file mode 100644
index 000000000..29004747d
--- /dev/null
+++ b/linphone-desktop/ui/modules/Common/Form/ComboBox.qml
@@ -0,0 +1,73 @@
+import QtQuick 2.7
+import QtQuick.Controls 2.0
+
+import Common 1.0
+import Common.Styles 1.0
+
+// =============================================================================
+
+ComboBox {
+ id: comboBox
+
+ textRole: 'key'
+
+ // ---------------------------------------------------------------------------
+
+ background: Rectangle {
+ border {
+ color: ComboBoxStyle.background.border.color
+ width: ComboBoxStyle.background.border.width
+ }
+
+ color: ComboBoxStyle.background.color
+ radius: ComboBoxStyle.background.radius
+
+ implicitHeight: ComboBoxStyle.background.height
+ implicitWidth: ComboBoxStyle.background.width
+ }
+
+ indicator: Icon {
+ icon: 'drop_down'
+ iconSize: ComboBoxStyle.background.iconSize
+
+ x: comboBox.width - width - comboBox.rightPadding
+ y: comboBox.topPadding + (comboBox.availableHeight - height) / 2
+ }
+
+ // ---------------------------------------------------------------------------
+
+ delegate: ItemDelegate {
+ id: item
+
+ background: Rectangle {
+ color: item.hovered
+ ? ComboBoxStyle.delegate.color.hovered
+ : ComboBoxStyle.delegate.color.normal
+
+ Rectangle {
+ anchors.left: parent.left
+ color: ComboBoxStyle.delegate.indicator.color
+
+ height: parent.height
+ width: ComboBoxStyle.delegate.indicator.width
+
+ visible: item.hovered
+ }
+
+ Rectangle {
+ anchors.bottom: parent.bottom
+ color: ComboBoxStyle.delegate.separator.color
+
+ height: ComboBoxStyle.delegate.separator.height
+ width: parent.width
+
+ visible: comboBox.count !== index + 1
+ }
+ }
+
+ font.bold: comboBox.currentIndex === index
+ hoverEnabled: true
+ text: key
+ width: comboBox.width
+ }
+}
diff --git a/linphone-desktop/ui/modules/Common/Form/TransparentComboBox.qml b/linphone-desktop/ui/modules/Common/Form/TransparentComboBox.qml
deleted file mode 100644
index 0d3ad7858..000000000
--- a/linphone-desktop/ui/modules/Common/Form/TransparentComboBox.qml
+++ /dev/null
@@ -1,33 +0,0 @@
-import QtQuick 2.7
-import QtQuick.Controls 2.0
-
-import Common.Styles 1.0
-
-// =============================================================================
-// Discrete ComboBox that can be integrated in text.
-// =============================================================================
-
-ComboBox {
- id: comboBox
-
- background: Rectangle {
- // No Style constant, see component name.
- // It's a `transparent` ComboBox.
- color: 'transparent'
- }
- delegate: ItemDelegate {
- id: item
-
- background: Rectangle {
- color: item.down
- ? TransparentComboBoxStyle.item.color.pressed
- : (comboBox.currentIndex === index
- ? TransparentComboBoxStyle.item.color.selected
- : TransparentComboBoxStyle.item.color.normal
- )
- }
- font.bold: comboBox.currentIndex === index
- text: key || modelData
- width: comboBox.width
- }
-}
diff --git a/linphone-desktop/ui/modules/Common/Styles/Form/ComboBoxStyle.qml b/linphone-desktop/ui/modules/Common/Styles/Form/ComboBoxStyle.qml
new file mode 100644
index 000000000..ee15fee45
--- /dev/null
+++ b/linphone-desktop/ui/modules/Common/Styles/Form/ComboBoxStyle.qml
@@ -0,0 +1,38 @@
+pragma Singleton
+import QtQuick 2.7
+
+import Common 1.0
+
+// =============================================================================
+
+QtObject {
+ property QtObject background: QtObject {
+ property color color: Colors.k
+ property int height: 36
+ property int iconSize: 10
+ property int radius: 4
+ property int width: 400
+
+ property QtObject border: QtObject {
+ property color color: Colors.c
+ property int width: 1
+ }
+ }
+
+ property QtObject delegate: QtObject {
+ property QtObject color: QtObject {
+ property color hovered: Colors.y
+ property color normal: Colors.k
+ }
+
+ property QtObject indicator: QtObject {
+ property color color: Colors.i
+ property int width: 5
+ }
+
+ property QtObject separator: QtObject {
+ property color color: Colors.c
+ property int height: 1
+ }
+ }
+}
diff --git a/linphone-desktop/ui/modules/Common/Styles/Form/TransparentComboBoxStyle.qml b/linphone-desktop/ui/modules/Common/Styles/Form/TransparentComboBoxStyle.qml
deleted file mode 100644
index ee80396cd..000000000
--- a/linphone-desktop/ui/modules/Common/Styles/Form/TransparentComboBoxStyle.qml
+++ /dev/null
@@ -1,16 +0,0 @@
-pragma Singleton
-import QtQuick 2.7
-
-import Common 1.0
-
-// =============================================================================
-
-QtObject {
- property QtObject item: QtObject {
- property QtObject color: QtObject {
- property color normal: Colors.k
- property color pressed: Colors.i
- property color selected: Colors.k
- }
- }
-}
diff --git a/linphone-desktop/ui/modules/Common/Styles/qmldir b/linphone-desktop/ui/modules/Common/Styles/qmldir
index 052097cd8..afae90bb1 100644
--- a/linphone-desktop/ui/modules/Common/Styles/qmldir
+++ b/linphone-desktop/ui/modules/Common/Styles/qmldir
@@ -8,6 +8,15 @@ singleton BusyIndicatorStyle 1.0 Animations/BusyIndicatorStyle.qml
singleton DialogStyle 1.0 Dialog/DialogStyle.qml
+singleton ActionBarStyle 1.0 Form/ActionBarStyle.qml
+singleton CheckBoxTextStyle 1.0 Form/CheckBoxTextStyle.qml
+singleton ComboBoxStyle 1.0 Form/ComboBoxStyle.qml
+singleton DroppableTextAreaStyle 1.0 Form/DroppableTextAreaStyle.qml
+singleton ListFormStyle 1.0 Form/ListFormStyle.qml
+singleton SearchBoxStyle 1.0 Form/SearchBoxStyle.qml
+singleton SwitchStyle 1.0 Form/SwitchStyle.qml
+singleton TransparentTextInputStyle 1.0 Form/TransparentTextInputStyle.qml
+
singleton AbstractTextButtonStyle 1.0 Form/Buttons/AbstractTextButtonStyle.qml
singleton ExclusiveButtonsStyle 1.0 Form/Buttons/ExclusiveButtonsStyle.qml
singleton FileChooserButtonStyle 1.0 Form/Buttons/FileChooserButtonStyle.qml
@@ -28,15 +37,6 @@ singleton FormStyle 1.0 Form/Placements/FormStyle.qml
singleton TabButtonStyle 1.0 Form/Tab/TabButtonStyle.qml
singleton TabContainerStyle 1.0 Form/Tab/TabContainerStyle.qml
-singleton ActionBarStyle 1.0 Form/ActionBarStyle.qml
-singleton CheckBoxTextStyle 1.0 Form/CheckBoxTextStyle.qml
-singleton DroppableTextAreaStyle 1.0 Form/DroppableTextAreaStyle.qml
-singleton ListFormStyle 1.0 Form/ListFormStyle.qml
-singleton SearchBoxStyle 1.0 Form/SearchBoxStyle.qml
-singleton SwitchStyle 1.0 Form/SwitchStyle.qml
-singleton TransparentComboBoxStyle 1.0 Form/TransparentComboBoxStyle.qml
-singleton TransparentTextInputStyle 1.0 Form/TransparentTextInputStyle.qml
-
singleton ActionMenuStyle 1.0 Menu/ActionMenuStyle.qml
singleton MenuStyle 1.0 Menu/MenuStyle.qml
diff --git a/linphone-desktop/ui/modules/Common/qmldir b/linphone-desktop/ui/modules/Common/qmldir
index 130dba8a2..e291216af 100644
--- a/linphone-desktop/ui/modules/Common/qmldir
+++ b/linphone-desktop/ui/modules/Common/qmldir
@@ -20,12 +20,12 @@ ActionBar 1.0 Form/ActionBar.qml
ActionButton 1.0 Form/ActionButton.qml
ActionSwitch 1.0 Form/ActionSwitch.qml
CheckBoxText 1.0 Form/CheckBoxText.qml
+ComboBox 1.0 Form/ComboBox.qml
DroppableTextArea 1.0 Form/DroppableTextArea.qml
ListForm 1.0 Form/ListForm.qml
SearchBox 1.0 Form/SearchBox.qml
StaticListForm 1.0 Form/StaticListForm.qml
Switch 1.0 Form/Switch.qml
-TransparentComboBox 1.0 Form/TransparentComboBox.qml
TransparentTextInput 1.0 Form/TransparentTextInput.qml
ExclusiveButtons 1.0 Form/Buttons/ExclusiveButtons.qml
diff --git a/linphone-desktop/ui/views/App/Settings/SettingsUi.qml b/linphone-desktop/ui/views/App/Settings/SettingsUi.qml
index 0d10e03a4..a32a9b16f 100644
--- a/linphone-desktop/ui/views/App/Settings/SettingsUi.qml
+++ b/linphone-desktop/ui/views/App/Settings/SettingsUi.qml
@@ -15,7 +15,23 @@ TabContainer {
// Languages.
// -------------------------------------------------------------------------
- // TODO
+ Form {
+ title: qsTr('languagesTitle')
+ width: parent.width
+
+ FormLine {
+ FormGroup {
+ label: qsTr('languagesLabel')
+
+ ComboBox {
+ model: ListModel {
+ ListElement { key: 'English'; value: 0 }
+ ListElement { key: 'Français'; value: 1 }
+ }
+ }
+ }
+ }
+ }
// -------------------------------------------------------------------------
// Paths.