QmlDesigner: Ensure Content library tabs always visible

Tabs are now responsive with the width of the view. Also a tooltip
makes sure user can view the name of the tab in case it is elided.
Also wrapped the message that appears when the materials view is empty.

Fixes: QDS-13795
Change-Id: I43c08124696e252b834c846ae24975dd837400c5
Reviewed-by: Shrief Gabr <shrief.gabr@qt.io>
Reviewed-by: Ali Kianian <ali.kianian@qt.io>
Reviewed-by: Miikka Heikkinen <miikka.heikkinen@qt.io>
This commit is contained in:
Mahmoud Badri
2024-10-15 15:22:53 +03:00
parent f93e12de2b
commit ff32c0ef68
3 changed files with 13 additions and 3 deletions

View File

@@ -133,6 +133,8 @@ HelperWidgets.ScrollView {
topPadding: 10 topPadding: 10
leftPadding: 10 leftPadding: 10
visible: root.materialsModel.isEmpty visible: root.materialsModel.isEmpty
wrapMode: Text.WordWrap
width: root.width - x
} }
} }
} }

View File

@@ -2,11 +2,12 @@
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR GPL-3.0-only WITH Qt-GPL-exception-1.0 // SPDX-License-Identifier: LicenseRef-Qt-Commercial OR GPL-3.0-only WITH Qt-GPL-exception-1.0
import QtQuick import QtQuick
import QtQuick.Layouts
import HelperWidgets 2.0 as HelperWidgets import HelperWidgets 2.0 as HelperWidgets
import StudioControls 1.0 as StudioControls import StudioControls 1.0 as StudioControls
import StudioTheme 1.0 as StudioTheme import StudioTheme 1.0 as StudioTheme
Row { RowLayout {
id: root id: root
property int currIndex: 0 property int currIndex: 0
@@ -24,6 +25,7 @@ Row {
icon: modelData.icon icon: modelData.icon
selected: root.currIndex === index selected: root.currIndex === index
onClicked: root.currIndex = index onClicked: root.currIndex = index
Layout.fillWidth: true
} }
} }
} }

View File

@@ -2,6 +2,7 @@
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR GPL-3.0-only WITH Qt-GPL-exception-1.0 // SPDX-License-Identifier: LicenseRef-Qt-Commercial OR GPL-3.0-only WITH Qt-GPL-exception-1.0
import QtQuick import QtQuick
import QtQuick.Controls
import HelperWidgets 2.0 as HelperWidgets import HelperWidgets 2.0 as HelperWidgets
import StudioControls 1.0 as StudioControls import StudioControls 1.0 as StudioControls
import StudioTheme 1.0 as StudioTheme import StudioTheme 1.0 as StudioTheme
@@ -16,7 +17,6 @@ Rectangle {
property bool selected: false property bool selected: false
height: button.height height: button.height
width: button.width + label.width + contentRow.spacing + 6
color: StudioTheme.Values.themeToolbarBackground color: StudioTheme.Values.themeToolbarBackground
radius: StudioTheme.Values.smallRadius radius: StudioTheme.Values.smallRadius
@@ -43,9 +43,9 @@ Rectangle {
color: StudioTheme.Values.themeTextColor color: StudioTheme.Values.themeTextColor
text: qsTr("Materials") text: qsTr("Materials")
font.pixelSize: StudioTheme.Values.baseFontSize font.pixelSize: StudioTheme.Values.baseFontSize
horizontalAlignment: Text.AlignLeft
verticalAlignment: Text.AlignVCenter verticalAlignment: Text.AlignVCenter
elide: Text.ElideRight elide: Text.ElideRight
width: root.width - x
} }
} }
@@ -56,6 +56,12 @@ Rectangle {
onClicked: root.clicked() onClicked: root.clicked()
} }
StudioControls.ToolTip {
visible: mouseArea.containsMouse
text: label.text
delay: 1000
}
states: [ states: [
State { State {
name: "default" name: "default"