diff --git a/linphone-desktop/assets/languages/en.ts b/linphone-desktop/assets/languages/en.ts
index 0ab95f7c5..cffac255c 100644
--- a/linphone-desktop/assets/languages/en.ts
+++ b/linphone-desktop/assets/languages/en.ts
@@ -639,6 +639,22 @@ Server url not configured.
videoRtpUdpPortLabel
Video RTP UDP port
+
+ portsHeader
+ Port
+
+
+ portHeader
+ Port
+
+
+ randomPortHeader
+ Use a random port
+
+
+ enabledPortHeader
+ Enabled port
+
SettingsWindow
diff --git a/linphone-desktop/assets/languages/fr.ts b/linphone-desktop/assets/languages/fr.ts
index 3c25d759d..d487eeefa 100644
--- a/linphone-desktop/assets/languages/fr.ts
+++ b/linphone-desktop/assets/languages/fr.ts
@@ -649,6 +649,22 @@ Url du serveur non configurée.
videoRtpUdpPortLabel
Port Vidéo RTP UDP
+
+ portsHeader
+ Port
+
+
+ portHeader
+ Port
+
+
+ randomPortHeader
+ Utiliser un port aléatoire
+
+
+ enabledPortHeader
+ Port activé
+
SettingsWindow
diff --git a/linphone-desktop/resources.qrc b/linphone-desktop/resources.qrc
index 15a38c45a..de33ae446 100644
--- a/linphone-desktop/resources.qrc
+++ b/linphone-desktop/resources.qrc
@@ -184,6 +184,9 @@
ui/modules/Common/Form/ListForm.qml
ui/modules/Common/Form/Placements/FormEntry.qml
ui/modules/Common/Form/Placements/FormGroup.qml
+ ui/modules/Common/Form/Placements/FormHeaderEntry.qml
+ ui/modules/Common/Form/Placements/FormHeaderGroup.qml
+ ui/modules/Common/Form/Placements/FormHeader.qml
ui/modules/Common/Form/Placements/FormLine.qml
ui/modules/Common/Form/Placements/Form.qml
ui/modules/Common/Form/SmallButton.qml
@@ -224,6 +227,8 @@
ui/modules/Common/Styles/Form/Fields/TextFieldStyle.qml
ui/modules/Common/Styles/Form/ListFormStyle.qml
ui/modules/Common/Styles/Form/Placements/FormGroupStyle.qml
+ ui/modules/Common/Styles/Form/Placements/FormHeaderGroupStyle.qml
+ ui/modules/Common/Styles/Form/Placements/FormHeaderStyle.qml
ui/modules/Common/Styles/Form/Placements/FormLineStyle.qml
ui/modules/Common/Styles/Form/Placements/FormStyle.qml
ui/modules/Common/Styles/Form/SmallButtonStyle.qml
diff --git a/linphone-desktop/ui/modules/Common/Form/Placements/FormEntry.qml b/linphone-desktop/ui/modules/Common/Form/Placements/FormEntry.qml
index fabacd2ae..314f187c7 100644
--- a/linphone-desktop/ui/modules/Common/Form/Placements/FormEntry.qml
+++ b/linphone-desktop/ui/modules/Common/Form/Placements/FormEntry.qml
@@ -5,26 +5,38 @@ import Common.Styles 1.0
// =============================================================================
// Like a `FormGroup` but without label.
+// Must be used in a `FormLine`.
// =============================================================================
-RowLayout {
+Item {
default property alias _content: content.data
// ---------------------------------------------------------------------------
- spacing: 0
- width: FormGroupStyle.content.width
+ implicitHeight: content.height
+ width: FormGroupStyle.content.width
Item {
id: content
readonly property int currentHeight: _content[0] ? _content[0].height : 0
+ readonly property int currentWidth: _content[0] ? _content[0].width : 0
- Layout.alignment: (
- currentHeight < FormGroupStyle.legend.height ? Qt.AlignVCenter : Qt.AlignTop
- ) | Qt.AlignHCenter
+ anchors {
+ horizontalCenter: parent.horizontalCenter
- Layout.preferredHeight: currentHeight
- Layout.maximumWidth: FormGroupStyle.content.width
+ top: width > FormGroupStyle.legend.width
+ ? parent.top
+ : undefined
+
+ verticalCenter: width > FormGroupStyle.legend.width
+ ? undefined
+ : parent.verticalCenter
+ }
+
+ height: currentHeight
+ width: currentWidth > FormGroupStyle.content.width
+ ? FormGroupStyle.content.width
+ : currentWidth
}
}
diff --git a/linphone-desktop/ui/modules/Common/Form/Placements/FormGroup.qml b/linphone-desktop/ui/modules/Common/Form/Placements/FormGroup.qml
index 1d03850d0..f8272a09b 100644
--- a/linphone-desktop/ui/modules/Common/Form/Placements/FormGroup.qml
+++ b/linphone-desktop/ui/modules/Common/Form/Placements/FormGroup.qml
@@ -3,6 +3,9 @@ import QtQuick.Layouts 1.3
import Common.Styles 1.0
+// =============================================================================
+// Display a form component with a legend.
+// Must be used in a `FormLine`.
// =============================================================================
RowLayout {
diff --git a/linphone-desktop/ui/modules/Common/Form/Placements/FormHeader.qml b/linphone-desktop/ui/modules/Common/Form/Placements/FormHeader.qml
new file mode 100644
index 000000000..792d3d61f
--- /dev/null
+++ b/linphone-desktop/ui/modules/Common/Form/Placements/FormHeader.qml
@@ -0,0 +1,10 @@
+import Common.Styles 1.0
+
+// =============================================================================
+// Like a `FormLine` but used as form header.
+// =============================================================================
+
+FormLine {
+ height: FormHeaderStyle.height
+ width: parent.width
+}
diff --git a/linphone-desktop/ui/modules/Common/Form/Placements/FormHeaderEntry.qml b/linphone-desktop/ui/modules/Common/Form/Placements/FormHeaderEntry.qml
new file mode 100644
index 000000000..1febaf1a8
--- /dev/null
+++ b/linphone-desktop/ui/modules/Common/Form/Placements/FormHeaderEntry.qml
@@ -0,0 +1,28 @@
+import QtQuick 2.7
+
+import Common.Styles 1.0
+
+// =============================================================================
+// Display a title on a `FormEntry`.
+// Must be used in a `FormHeader`.
+// =============================================================================
+
+Item {
+ property alias text: text.text
+
+ height: parent.height
+ width: FormGroupStyle.content.width
+
+ Text {
+ id: text
+
+ anchors.centerIn: parent
+ color: FormHeaderGroupStyle.text.color
+ elide: Text.ElideRight
+
+ font {
+ bold: true
+ pointSize: FormHeaderGroupStyle.text.fontSize
+ }
+ }
+}
diff --git a/linphone-desktop/ui/modules/Common/Form/Placements/FormHeaderGroup.qml b/linphone-desktop/ui/modules/Common/Form/Placements/FormHeaderGroup.qml
new file mode 100644
index 000000000..2460c2a9c
--- /dev/null
+++ b/linphone-desktop/ui/modules/Common/Form/Placements/FormHeaderGroup.qml
@@ -0,0 +1,34 @@
+import QtQuick 2.7
+
+import Common.Styles 1.0
+
+// =============================================================================
+// Display a title on a `FormGroup`.
+// Must be used in a `FormHeader`.
+// =============================================================================
+
+Item {
+ property alias text: text.text
+
+ height: parent.height
+ width: FormGroupStyle.spacing + FormGroupStyle.legend.width + FormGroupStyle.content.width
+
+ Text {
+ id: text
+
+ anchors {
+ fill: parent
+ leftMargin: FormGroupStyle.spacing + FormGroupStyle.legend.width
+ }
+
+ color: FormHeaderGroupStyle.text.color
+ elide: Text.ElideRight
+ font {
+ bold: true
+ pointSize: FormHeaderGroupStyle.text.fontSize
+ }
+
+ horizontalAlignment: Text.AlignHCenter
+ verticalAlignment: Text.AlignVCenter
+ }
+}
diff --git a/linphone-desktop/ui/modules/Common/Form/Placements/FormLine.qml b/linphone-desktop/ui/modules/Common/Form/Placements/FormLine.qml
index fbafb8e3a..cf34c47bd 100644
--- a/linphone-desktop/ui/modules/Common/Form/Placements/FormLine.qml
+++ b/linphone-desktop/ui/modules/Common/Form/Placements/FormLine.qml
@@ -2,8 +2,11 @@ import QtQuick 2.7
import Common.Styles 1.0
+// =============================================================================
+// A line of `FormGroup`/`FormEntry`.
// =============================================================================
Row {
spacing: FormLineStyle.spacing
+ width: parent.width
}
diff --git a/linphone-desktop/ui/modules/Common/Styles/Form/Placements/FormHeaderGroupStyle.qml b/linphone-desktop/ui/modules/Common/Styles/Form/Placements/FormHeaderGroupStyle.qml
new file mode 100644
index 000000000..34ee9c3f0
--- /dev/null
+++ b/linphone-desktop/ui/modules/Common/Styles/Form/Placements/FormHeaderGroupStyle.qml
@@ -0,0 +1,13 @@
+pragma Singleton
+import QtQuick 2.7
+
+import Common 1.0
+
+// =============================================================================
+
+QtObject {
+ property QtObject text: QtObject {
+ property color color: Colors.j
+ property int fontSize: 10
+ }
+}
diff --git a/linphone-desktop/ui/modules/Common/Styles/Form/Placements/FormHeaderStyle.qml b/linphone-desktop/ui/modules/Common/Styles/Form/Placements/FormHeaderStyle.qml
new file mode 100644
index 000000000..86856f975
--- /dev/null
+++ b/linphone-desktop/ui/modules/Common/Styles/Form/Placements/FormHeaderStyle.qml
@@ -0,0 +1,8 @@
+pragma Singleton
+import QtQuick 2.7
+
+// =============================================================================
+
+QtObject {
+ property int height: 30
+}
diff --git a/linphone-desktop/ui/modules/Common/Styles/qmldir b/linphone-desktop/ui/modules/Common/Styles/qmldir
index d12322347..b4fae47fc 100644
--- a/linphone-desktop/ui/modules/Common/Styles/qmldir
+++ b/linphone-desktop/ui/modules/Common/Styles/qmldir
@@ -18,6 +18,8 @@ singleton NumericFieldStyle 1.0 Form/Fields/NumericFieldStyle.qml
singleton TextFieldStyle 1.0 Form/Fields/TextFieldStyle.qml
singleton FormGroupStyle 1.0 Form/Placements/FormGroupStyle.qml
+singleton FormHeaderStyle 1.0 Form/Placements/FormHeaderStyle.qml
+singleton FormHeaderGroupStyle 1.0 Form/Placements/FormHeaderGroupStyle.qml
singleton FormLineStyle 1.0 Form/Placements/FormLineStyle.qml
singleton FormStyle 1.0 Form/Placements/FormStyle.qml
diff --git a/linphone-desktop/ui/modules/Common/qmldir b/linphone-desktop/ui/modules/Common/qmldir
index 1ed2d4656..424bd4d10 100644
--- a/linphone-desktop/ui/modules/Common/qmldir
+++ b/linphone-desktop/ui/modules/Common/qmldir
@@ -37,6 +37,9 @@ TextField 1.0 Form/Fields/TextField.qml
Form 1.0 Form/Placements/Form.qml
FormEntry 1.0 Form/Placements/FormEntry.qml
FormGroup 1.0 Form/Placements/FormGroup.qml
+FormHeader 1.0 Form/Placements/FormHeader.qml
+FormHeaderEntry 1.0 Form/Placements/FormHeaderEntry.qml
+FormHeaderGroup 1.0 Form/Placements/FormHeaderGroup.qml
FormLine 1.0 Form/Placements/FormLine.qml
TabBar 1.0 Form/Tab/TabBar.qml
diff --git a/linphone-desktop/ui/views/App/Settings/SettingsCallsChat.qml b/linphone-desktop/ui/views/App/Settings/SettingsCallsChat.qml
index 7a7d116f1..10bcc12da 100644
--- a/linphone-desktop/ui/views/App/Settings/SettingsCallsChat.qml
+++ b/linphone-desktop/ui/views/App/Settings/SettingsCallsChat.qml
@@ -15,16 +15,18 @@ TabContainer {
title: qsTr('callsTitle')
width: parent.width
- FormGroup {
- label: qsTr('encryptionLabel')
+ FormLine {
+ FormGroup {
+ label: qsTr('encryptionLabel')
- ExclusiveButtons {
- texts: [
- qsTr('noEncryption'),
- 'SRTP',
- 'ZRTP',
- 'DTLS'
- ]
+ ExclusiveButtons {
+ texts: [
+ qsTr('noEncryption'),
+ 'SRTP',
+ 'ZRTP',
+ 'DTLS'
+ ]
+ }
}
}
@@ -51,21 +53,25 @@ TabContainer {
title: qsTr('chatTitle')
width: parent.width
- FormGroup {
- label: qsTr('fileServerLabel')
+ FormLine {
+ FormGroup {
+ label: qsTr('fileServerLabel')
- TextField {}
+ TextField {}
+ }
}
- FormGroup {
- label: qsTr('encryptWithLimeLabel')
+ FormLine {
+ FormGroup {
+ label: qsTr('encryptWithLimeLabel')
- ExclusiveButtons {
- texts: [
- qsTr('limeDisabled'),
- qsTr('limeRequired'),
- qsTr('limePreferred')
- ]
+ ExclusiveButtons {
+ texts: [
+ qsTr('limeDisabled'),
+ qsTr('limeRequired'),
+ qsTr('limePreferred')
+ ]
+ }
}
}
}
diff --git a/linphone-desktop/ui/views/App/Settings/SettingsNetwork.qml b/linphone-desktop/ui/views/App/Settings/SettingsNetwork.qml
index ed746a95a..ab9757ac5 100644
--- a/linphone-desktop/ui/views/App/Settings/SettingsNetwork.qml
+++ b/linphone-desktop/ui/views/App/Settings/SettingsNetwork.qml
@@ -58,6 +58,20 @@ TabContainer {
title: qsTr('networkProtocolAndPortsTitle')
width: parent.width
+ FormHeader {
+ FormHeaderGroup {
+ text: qsTr('portHeader')
+ }
+
+ FormHeaderEntry {
+ text: qsTr('randomPortHeader')
+ }
+
+ FormHeaderEntry {
+ text: qsTr('enabledPortHeader')
+ }
+ }
+
FormLine {
FormGroup {
label: qsTr('sipUdpPortLabel')