Fix vertical tabbar width
This commit is contained in:
parent
b316074feb
commit
bf99675d08
3 changed files with 20 additions and 18 deletions
|
|
@ -21,7 +21,6 @@ Item {
|
||||||
VerticalTabBar {
|
VerticalTabBar {
|
||||||
id: tabbar
|
id: tabbar
|
||||||
Layout.fillHeight: true
|
Layout.fillHeight: true
|
||||||
Layout.preferredWidth: width
|
|
||||||
model: [
|
model: [
|
||||||
{icon: AppIcons.phone, selectedIcon: AppIcons.phoneSelected, label: qsTr("Appels")},
|
{icon: AppIcons.phone, selectedIcon: AppIcons.phoneSelected, label: qsTr("Appels")},
|
||||||
{icon: AppIcons.adressBook, selectedIcon: AppIcons.adressBookSelected, label: qsTr("Contacts")},
|
{icon: AppIcons.adressBook, selectedIcon: AppIcons.adressBookSelected, label: qsTr("Contacts")},
|
||||||
|
|
|
||||||
|
|
@ -9,11 +9,9 @@ Control.TabBar {
|
||||||
id: mainItem
|
id: mainItem
|
||||||
spacing: 15
|
spacing: 15
|
||||||
topPadding: 20
|
topPadding: 20
|
||||||
// leftPadding: 15
|
|
||||||
// rightPadding: 15
|
|
||||||
|
|
||||||
property var model
|
property var model
|
||||||
|
|
||||||
contentItem: ListView {
|
contentItem: ListView {
|
||||||
model: mainItem.contentModel
|
model: mainItem.contentModel
|
||||||
currentIndex: mainItem.currentIndex
|
currentIndex: mainItem.currentIndex
|
||||||
|
|
@ -55,31 +53,35 @@ Control.TabBar {
|
||||||
}
|
}
|
||||||
|
|
||||||
Repeater {
|
Repeater {
|
||||||
|
id: actionsRepeater
|
||||||
model: mainItem.model
|
model: mainItem.model
|
||||||
Control.TabButton {
|
Control.TabButton {
|
||||||
id: tabButton
|
id: tabButton
|
||||||
anchors.left: parent.left
|
width: mainItem.width
|
||||||
anchors.right: parent.right
|
|
||||||
|
|
||||||
contentItem: ColumnLayout {
|
contentItem: ColumnLayout {
|
||||||
anchors.fill: parent
|
height: tabButton.height
|
||||||
|
width: tabButton.width
|
||||||
EffectImage {
|
EffectImage {
|
||||||
id: buttonIcon
|
id: buttonIcon
|
||||||
|
property int buttonSize: 20
|
||||||
image.source: mainItem.currentIndex === index ? modelData.selectedIcon : modelData.icon
|
image.source: mainItem.currentIndex === index ? modelData.selectedIcon : modelData.icon
|
||||||
Layout.preferredWidth: 20
|
Layout.preferredWidth: buttonSize
|
||||||
Layout.preferredHeight: 20
|
Layout.preferredHeight: buttonSize
|
||||||
Layout.alignment: Qt.AlignHCenter
|
Layout.alignment: Qt.AlignHCenter
|
||||||
image.sourceSize.width: 20
|
image.sourceSize.width: buttonSize
|
||||||
image.fillMode: Image.PreserveAspectFit
|
image.fillMode: Image.PreserveAspectFit
|
||||||
effect.brightness: 1.0
|
effect.brightness: 1.0
|
||||||
}
|
}
|
||||||
Text {
|
Text {
|
||||||
id: buttonText
|
id: buttonText
|
||||||
text: modelData.label
|
text: modelData.label
|
||||||
font.bold: mainItem.currentIndex === index
|
font {
|
||||||
font.pointSize: DefaultStyle.verticalTabButtonTextSize
|
bold: mainItem.currentIndex === index
|
||||||
|
pointSize: DefaultStyle.verticalTabButtonTextSize
|
||||||
|
}
|
||||||
color: DefaultStyle.verticalTabBarTextColor
|
color: DefaultStyle.verticalTabBarTextColor
|
||||||
Layout.preferredWidth: txtMeter.width
|
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
|
||||||
|
|
@ -91,11 +93,14 @@ Control.TabBar {
|
||||||
id: txtMeter
|
id: txtMeter
|
||||||
text: modelData.label
|
text: modelData.label
|
||||||
font: buttonText.font
|
font: buttonText.font
|
||||||
Component.onCompleted: mainItem.width = Math.max(mainItem.width, advanceWidth)
|
Component.onCompleted: {
|
||||||
|
font.bold= true
|
||||||
|
mainItem.implicitWidth = Math.max(mainItem.implicitWidth, advanceWidth + buttonIcon.buttonSize)
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
background: Item {
|
background: Item {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -29,11 +29,9 @@ Item {
|
||||||
color: Control.SplitHandle.hovered ? DefaultStyle.splitViewHoveredHandleColor : DefaultStyle.splitViewHandleColor
|
color: Control.SplitHandle.hovered ? DefaultStyle.splitViewHoveredHandleColor : DefaultStyle.splitViewHandleColor
|
||||||
}
|
}
|
||||||
|
|
||||||
Component.onCompleted: {
|
|
||||||
leftPanel.implicitWidth = 280
|
|
||||||
}
|
|
||||||
ColumnLayout {
|
ColumnLayout {
|
||||||
id: leftPanel
|
id: leftPanel
|
||||||
|
Control.SplitView.preferredWidth: 280
|
||||||
}
|
}
|
||||||
Rectangle {
|
Rectangle {
|
||||||
id: rightPanel
|
id: rightPanel
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue