mirrors/linphone-desktop
1
0
Fork 0
mirror of https://gitlab.linphone.org/BC/public/linphone-desktop.git synced 2026-04-17 20:08:28 +00:00
Code Issues Projects Releases Packages Wiki Activity

Improve ui to access chat header buttons when window is at its minimum width

Browse source
This commit is contained in:
Gaelle Braud 2026-02-24 15:13:27 +01:00
parent 9da9c25dba
commit 447e82097b
7 changed files with 33 additions and 114 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
Linphone/view/Control/Display/Chat/ChatListView.qml
View file

@ -180,8 +180,8 @@ ListView {
id: friendAddress id: friendAddress
Layout.fillWidth: true Layout.fillWidth: true
maximumLineCount: 1 maximumLineCount: 1
text: modelData? UtilsCpp.encodeEmojiToQmlRichFormat(modelData.core.title) : "" text: modelData ? modelData.core.title : ""
textFormat: Text.RichText textFormat: Text.PlainText
color: DefaultStyle.main2_800 color: DefaultStyle.main2_800
font { font {
pixelSize: Typography.p1.pixelSize pixelSize: Typography.p1.pixelSize

17
Linphone/view/Page/Form/Chat/SelectedChatView.qml
View file

@ -90,14 +90,20 @@ FocusScope {
header.bottomPadding: Utils.getSizeWithScreenRatio(searchBarLayout.visible ? 3 : 6) header.bottomPadding: Utils.getSizeWithScreenRatio(searchBarLayout.visible ? 3 : 6)
header.contentItem: ColumnLayout { header.contentItem: ColumnLayout {
id: chatHeader
Layout.fillWidth: true Layout.fillWidth: true
Layout.leftMargin: mainItem.call ? 0 : Utils.getSizeWithScreenRatio(31) Layout.leftMargin: mainItem.call ? 0 : Utils.getSizeWithScreenRatio(31)
Layout.rightMargin: Utils.getSizeWithScreenRatio(41) Layout.rightMargin: Utils.getSizeWithScreenRatio(41)
spacing: searchBarLayout.visible ? Utils.getSizeWithScreenRatio(9) : 0 spacing: searchBarLayout.visible ? Utils.getSizeWithScreenRatio(9) : 0
RowLayout { property real minimumWidthForSwitchintToRowLayout: headerInfos.implicitWidth + headerActionButtons.implicitWidth
property var useVerticalLayout: width < minimumWidthForSwitchintToRowLayout
GridLayout {
columns: chatHeader.useVerticalLayout ? 1 : children.length
rows: 1
RowLayout { RowLayout {
id: chatHeader id: headerInfos
spacing: Utils.getSizeWithScreenRatio(12) spacing: Utils.getSizeWithScreenRatio(12)
// property int childrenWidth:
Avatar { Avatar {
property var contactObj: mainItem.chat ? UtilsCpp.findFriendByAddress(mainItem.chat?.core.peerAddress) : null property var contactObj: mainItem.chat ? UtilsCpp.findFriendByAddress(mainItem.chat?.core.peerAddress) : null
contact: contactObj?.value || null contact: contactObj?.value || null
@ -108,10 +114,10 @@ FocusScope {
} }
ColumnLayout { ColumnLayout {
Text { Text {
Layout.fillWidth: true
text: UtilsCpp.encodeEmojiToQmlRichFormat(mainItem.chat?.core.title) || "" text: UtilsCpp.encodeEmojiToQmlRichFormat(mainItem.chat?.core.title) || ""
color: DefaultStyle.main2_600 color: DefaultStyle.main2_600
maximumLineCount: 1 maximumLineCount: 1
textFormat: Text.RichText
font { font {
pixelSize: Typography.h4.pixelSize pixelSize: Typography.h4.pixelSize
weight: Utils.getSizeWithScreenRatio(400) weight: Utils.getSizeWithScreenRatio(400)
@ -121,7 +127,7 @@ FocusScope {
visible: mainItem.chat?.core.ephemeralEnabled || false visible: mainItem.chat?.core.ephemeralEnabled || false
EffectImage { EffectImage {
colorizationColor: DefaultStyle.main1_500_main colorizationColor: DefaultStyle.main1_500_main
Layout.preferredWidth: Utils.getSizeWithScreenRatio(14) Layout.preferredWidth: visible ? Utils.getSizeWithScreenRatio(14) : 0
Layout.preferredHeight: Utils.getSizeWithScreenRatio(14) Layout.preferredHeight: Utils.getSizeWithScreenRatio(14)
imageSource: AppIcons.clockCountDown imageSource: AppIcons.clockCountDown
} }
@ -160,8 +166,8 @@ FocusScope {
imageSource: AppIcons.bellSlash imageSource: AppIcons.bellSlash
} }
} }
Item{Layout.fillWidth: true}
RowLayout { RowLayout {
id: headerActionButtons
spacing: Utils.getSizeWithScreenRatio(16) spacing: Utils.getSizeWithScreenRatio(16)
RoundButton { RoundButton {
visible: !mainItem.call && !mainItem.chat?.core.isReadOnly visible: !mainItem.call && !mainItem.chat?.core.isReadOnly
@ -198,6 +204,7 @@ FocusScope {
visible: !mainItem.call visible: !mainItem.call
style: ButtonStyle.noBackground style: ButtonStyle.noBackground
checkable: true checkable: true
Layout.preferredWidth: width
checkedImageColor: DefaultStyle.main1_500_main checkedImageColor: DefaultStyle.main1_500_main
icon.source: AppIcons.info icon.source: AppIcons.info
checked: detailsPanel.visible checked: detailsPanel.visible

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

@ -25,122 +25,30 @@ FocusScope {
property int rightPanelStackBottomMargin: 0 property int rightPanelStackBottomMargin: 0
signal noItemButtonPressed() signal noItemButtonPressed()
// Control.SplitView { Control.SplitView {
// id: splitView id: splitView
// anchors.fill: parent
// anchors.topMargin: Utils.getSizeWithScreenRatio(10)
// handle: Rectangle {
// implicitWidth: Utils.getSizeWithScreenRatio(8)
// color: Control.SplitHandle.hovered ? DefaultStyle.grey_200 : DefaultStyle.grey_100
// }
// ColumnLayout {
// id: leftPanel
// Control.SplitView.preferredWidth: Utils.getSizeWithScreenRatio(350)
// Control.SplitView.minimumWidth: Utils.getSizeWithScreenRatio(350)
// }
// Rectangle {
// id: rightPanel
// clip: true
// color: DefaultStyle.grey_100
// StackLayout {
// currentIndex: mainItem.showDefaultItem ? 0 : 1
// anchors.fill: parent
// ColumnLayout {
// id: defaultItem
// Layout.fillWidth: true
// Layout.fillHeight: true
// RowLayout {
// Layout.fillHeight: true
// Layout.fillWidth: true
// Layout.alignment: Qt.AlignHCenter
// Item {
// Layout.fillWidth: true
// }
// ColumnLayout {
// spacing: Utils.getSizeWithScreenRatio(30)
// Item {
// Layout.fillHeight: true
// }
// Image {
// Layout.alignment: Qt.AlignHCenter
// source: AppIcons.noItemImage
// Layout.preferredWidth: Utils.getSizeWithScreenRatio(359)
// Layout.preferredHeight: Utils.getSizeWithScreenRatio(314)
// fillMode: Image.PreserveAspectFit
// }
// Text {
// text: mainItem.emptyListText
// Layout.alignment: Qt.AlignHCenter
// font {
// pixelSize: Utils.getSizeWithScreenRatio(22)
// weight: Utils.getSizeWithScreenRatio(800)
// }
// }
// Button {
// Layout.alignment: Qt.AlignHCenter
// contentItem: RowLayout {
// Layout.alignment: Qt.AlignVCenter
// EffectImage {
// colorizationColor: DefaultStyle.grey_0
// source: mainItem.newItemIconSource
// width: Utils.getSizeWithScreenRatio(24)
// height: Utils.getSizeWithScreenRatio(24)
// fillMode: Image.PreserveAspectFit
// }
// Text {
// text: mainItem.noItemButtonText
// wrapMode: Text.WordWrap
// color: DefaultStyle.grey_0
// font {
// weight: Utils.getSizeWithScreenRatio(600)
// pixelSize: Utils.getSizeWithScreenRatio(18)
// family: DefaultStyle.defaultFont
// }
// }
// }
// onPressed: mainItem.noItemButtonPressed()
// }
// Item {
// Layout.fillHeight: true
// }
// }
// Item {
// Layout.fillWidth: true
// }
// }
// }
// ColumnLayout {
// id: rightPanelItem
// Layout.fillWidth: true
// Layout.fillHeight: true
// }
// }
// }
// }
RowLayout {
anchors.fill: parent anchors.fill: parent
spacing: 0 anchors.topMargin: Utils.getSizeWithScreenRatio(10)
handle: Rectangle {
implicitWidth: Utils.getSizeWithScreenRatio(6)
color: Control.SplitHandle.hovered ? DefaultStyle.main2_200 : DefaultStyle.grey_200
}
ColumnLayout { ColumnLayout {
id: leftPanel id: leftPanel
Layout.preferredWidth: Utils.getSizeWithScreenRatio(404)
Layout.fillWidth:false
spacing:0 spacing:0
} // Control.SplitView.fillWidth:false
Rectangle { Control.SplitView.fillHeight: true
Layout.fillHeight: true Control.SplitView.preferredWidth: Utils.getSizeWithScreenRatio(404)
Layout.preferredWidth: Utils.getSizeWithScreenRatio(1) Control.SplitView.minimumWidth: Utils.getSizeWithScreenRatio(200)
color: DefaultStyle.main2_200 Control.SplitView.maximumWidth: Utils.getSizeWithScreenRatio(500)
} }
Rectangle { Rectangle {
id: rightPanel id: rightPanel
clip: true clip: true
color: mainItem.rightPanelColor color: mainItem.rightPanelColor
Layout.fillWidth: true Control.SplitView.fillWidth: true
Layout.fillHeight: true Control.SplitView.fillHeight: true
StackLayout { StackLayout {
currentIndex: mainItem.showDefaultItem ? 0 : 1 currentIndex: mainItem.showDefaultItem ? 0 : 1

1
Linphone/view/Page/Main/Call/CallPage.qml
View file

@ -148,6 +148,7 @@ AbstractMainPage {
Layout.fillWidth: true Layout.fillWidth: true
//: "Appels" //: "Appels"
text: qsTr("call_history_call_list_title") text: qsTr("call_history_call_list_title")
maximumLineCount: 1
color: DefaultStyle.main2_700 color: DefaultStyle.main2_700
font.pixelSize: Typography.h2.pixelSize font.pixelSize: Typography.h2.pixelSize
font.weight: Typography.h2.weight font.weight: Typography.h2.weight

1
Linphone/view/Page/Main/Chat/ChatPage.qml
View file

@ -129,6 +129,7 @@ AbstractMainPage {
Layout.fillWidth: true Layout.fillWidth: true
//: "Conversations" //: "Conversations"
text: qsTr("chat_list_title") text: qsTr("chat_list_title")
maximumLineCount: 1
color: DefaultStyle.main2_700 color: DefaultStyle.main2_700
font.pixelSize: Typography.h2.pixelSize font.pixelSize: Typography.h2.pixelSize
font.weight: Typography.h2.weight font.weight: Typography.h2.weight

1
Linphone/view/Page/Main/Contact/ContactPage.qml
View file

@ -233,6 +233,7 @@ AbstractMainPage {
Layout.fillWidth: true Layout.fillWidth: true
//: "Contacts" //: "Contacts"
text: qsTr("bottom_navigation_contacts_label") text: qsTr("bottom_navigation_contacts_label")
maximumLineCount: 1
color: DefaultStyle.main2_700 color: DefaultStyle.main2_700
font.pixelSize: Typography.h2.pixelSize font.pixelSize: Typography.h2.pixelSize
font.weight: Typography.h2.weight font.weight: Typography.h2.weight

1
Linphone/view/Page/Main/Meeting/MeetingPage.qml
View file

@ -160,6 +160,7 @@ AbstractMainPage {
//: Réunions //: Réunions
text: qsTr("meetings_list_title") text: qsTr("meetings_list_title")
color: DefaultStyle.main2_700 color: DefaultStyle.main2_700
maximumLineCount: 1
font.pixelSize: Typography.h2.pixelSize font.pixelSize: Typography.h2.pixelSize
font.weight: Typography.h2.weight font.weight: Typography.h2.weight
} }