feedc0de/qt-creator
1
0
Fork 0
forked from qt-creator/qt-creator
Code Pull Requests Activity

QmlDesigner: Implement new control design

Browse Source 
* Update creator theme files and related enum
* Remove unused ActionIndicator functionality
* Update all controls (Colors, Positions, Sizes)
* Add global hover state and cleanup all other states
* Add global hover functionality to ButtonRow
* Add missing states
* Add new MenuItemWithIcon
* Add checkers.png for StateDelegate preview background
* Update copyright headers
* Replace AnchorButtons spacing
* Make ADS title bar buttons and tab bar buttons themeable
* Fix replace CSS colors to allow specifing alpha
* Fix replace CSS overwritting consecutive variables
* Make navigator icons and other elements themeable
* Make connection view themeable
* Make item library themeable
* Fix item library import path
* Update all HelperWidgets
* Fix GradientDialogPopup

Task-number: QDS-3768
Change-Id: I28a5fed178c95d098db052b8c2eabaa083d37b81
Reviewed-by: Alessandro Portale <alessandro.portale@qt.io>
This commit is contained in:
Henning Gruendl
2021-03-02 13:35:07 +01:00
committed by Tim Jenssen
parent 05701491a1
commit db6ad528bb
104 changed files with 3262 additions and 1682 deletions
Download Patch File Download Diff File Expand all files Collapse all files

60
share/qtcreator/qmldesigner/itemLibraryQmlSources/AddImport.qml
View File

@@ -26,6 +26,8 @@
import QtQuick 2.15 import QtQuick 2.15
import QtQuick.Controls 2.15 import QtQuick.Controls 2.15
import QtQuickDesignerTheme 1.0 import QtQuickDesignerTheme 1.0
import HelperWidgets 2.0
import StudioTheme 1.0 as StudioTheme
Column { Column {
id: root id: root
@@ -33,7 +35,7 @@ Column {
Text { Text {
id: header id: header
text: qsTr("Select a Module to Add") text: qsTr("Select a Module to Add")
color: "#ffffff" color: StudioTheme.Values.themeTextColor
font.pixelSize: 16 font.pixelSize: 16
width: parent.width width: parent.width
height: 50 height: 50
@@ -54,17 +56,16 @@ Column {
model: addImportModel model: addImportModel
delegate: Rectangle { delegate: Rectangle {
id: itemBackground
width: listView.width width: listView.width
height: isSeparator ? 4 : 25 height: isSeparator ? 4 : 25
color: isSeparator ? Theme.color(Theme.BackgroundColorNormal) color: StudioTheme.Values.themeListItemBackground
: mouseArea.containsMouse
? Qt.lighter(Theme.qmlDesignerButtonColor(), 1.3)
: Theme.qmlDesignerButtonColor()
visible: importVisible visible: importVisible
Text { Text {
id: itemText
text: importUrl text: importUrl
color: Theme.color(Theme.PanelTextColorLight) color: StudioTheme.Values.themeListItemText
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
anchors.left: parent.left anchors.left: parent.left
anchors.right: parent.right anchors.right: parent.right
@@ -79,6 +80,53 @@ Column {
onClicked: rootView.handleAddImport(index) onClicked: rootView.handleAddImport(index)
enabled: !isSeparator enabled: !isSeparator
} }
states: [
State {
name: "default"
when: !isSeparator && !mouseArea.containsMouse && !mouseArea.pressed
PropertyChanges {
target: itemBackground
color: StudioTheme.Values.themeListItemBackground
}
PropertyChanges {
target: itemText
color: StudioTheme.Values.themeListItemText
}
},
State {
name: "separator"
when: isSeparator
PropertyChanges {
target: itemBackground
color: StudioTheme.Values.themePanelBackground
}
},
State {
name: "hover"
when: !isSeparator && mouseArea.containsMouse && !mouseArea.containsPress
PropertyChanges {
target: itemBackground
color: StudioTheme.Values.themeListItemBackgroundHover
}
PropertyChanges {
target: itemText
color: StudioTheme.Values.themeListItemTextHover
}
},
State {
name: "press"
when: !isSeparator && mouseArea.containsPress
PropertyChanges {
target: itemBackground
color: StudioTheme.Values.themeListItemBackgroundPress
}
PropertyChanges {
target: itemText
color: StudioTheme.Values.themeListItemTextPress
}
}
]
} }
} }
} }

5
share/qtcreator/qmldesigner/itemLibraryQmlSources/ItemDelegate.qml
View File

@@ -27,6 +27,7 @@ import QtQuick 2.15
import QtQuick.Controls 2.15 import QtQuick.Controls 2.15
import QtQuickDesignerTheme 1.0 import QtQuickDesignerTheme 1.0
import HelperWidgets 2.0 import HelperWidgets 2.0
import StudioTheme 1.0 as StudioTheme
Item { Item {
id: delegateRoot id: delegateRoot
@@ -37,7 +38,7 @@ Item {
anchors.topMargin: 1 anchors.topMargin: 1
anchors.fill: parent anchors.fill: parent
color: Theme.qmlDesignerButtonColor() color: StudioTheme.Values.themePanelBackground
Image { Image {
id: itemIcon // to be set by model id: itemIcon // to be set by model
@@ -68,7 +69,7 @@ Item {
verticalAlignment: Qt.AlignVCenter verticalAlignment: Qt.AlignVCenter
horizontalAlignment: Qt.AlignHCenter horizontalAlignment: Qt.AlignHCenter
text: itemName // to be set by model text: itemName // to be set by model
color: Theme.color(Theme.PanelTextColorLight) color: StudioTheme.Values.themeTextColor
renderType: Text.NativeRendering renderType: Text.NativeRendering
} }

8
share/qtcreator/qmldesigner/itemLibraryQmlSources/ItemsView.qml
View File

@@ -193,8 +193,12 @@ ScrollView {
Grid { Grid {
id: itemGrid id: itemGrid
columns: parent.width / styleConstants.cellWidth property real actualWidth: parent.width - itemGrid.leftPadding -itemGrid.rightPadding
property int flexibleWidth: (parent.width - styleConstants.cellWidth * columns) / columns property int flexibleWidth: (itemGrid.actualWidth / columns) - styleConstants.cellWidth
leftPadding: 6
rightPadding: 6
columns: itemGrid.actualWidth / styleConstants.cellWidth
Repeater { Repeater {
model: itemModel model: itemModel

106
share/qtcreator/qmldesigner/itemLibraryQmlSources/LibraryHeader.qml
View File

@@ -26,6 +26,7 @@
import QtQuick 2.15 import QtQuick 2.15
import QtQuick.Controls 2.15 import QtQuick.Controls 2.15
import QtQuickDesignerTheme 1.0 import QtQuickDesignerTheme 1.0
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
@@ -47,7 +48,7 @@ Item {
Column { Column {
anchors.left: parent.left anchors.left: parent.left
anchors.right: parent.right anchors.right: parent.right
spacing: 10 spacing: 9
TabBar { TabBar {
id: tabBar id: tabBar
@@ -58,7 +59,7 @@ Item {
spacing: 40 spacing: 40
background: Rectangle { background: Rectangle {
color: Theme.color(Theme.QmlDesigner_BackgroundColorDarkAlternate) color: StudioTheme.Values.themePanelBackground
} }
Repeater { Repeater {
@@ -74,8 +75,9 @@ Item {
Text { // TabButton text Text { // TabButton text
text: modelData.title text: modelData.title
font.pixelSize: 13 font.pixelSize: 13
font.bold: true font.bold: false
color: tabBar.currentIndex === index ? "#0094ce" : "#dadada" color: tabBar.currentIndex === index ? StudioTheme.Values.themeInteraction
: StudioTheme.Values.themeTextColor
anchors.left: parent.left anchors.left: parent.left
anchors.top: parent.top anchors.top: parent.top
anchors.bottom: parent.bottom anchors.bottom: parent.bottom
@@ -93,11 +95,8 @@ Item {
anchors.topMargin: 1 anchors.topMargin: 1
width: 24 width: 24
height: 24 height: 24
color: mouseArea.containsMouse ? "#353535" : "#262626" color: mouseArea.containsMouse ? StudioTheme.Values.themeControlBackgroundHover
: StudioTheme.Values.themeControlBackground
ToolTip.delay: 500
ToolTip.text: modelData.addToolTip
ToolTip.visible: mouseArea.containsMouse
Label { // + sign Label { // + sign
text: StudioTheme.Constants.plus text: StudioTheme.Constants.plus
@@ -106,15 +105,17 @@ Item {
verticalAlignment: Text.AlignVCenter verticalAlignment: Text.AlignVCenter
horizontalAlignment: Text.AlignHCenter horizontalAlignment: Text.AlignHCenter
anchors.centerIn: parent anchors.centerIn: parent
color: tabBar.currentIndex === index ? "#0094ce" : "#a8a8a8" color: tabBar.currentIndex === index ? StudioTheme.Values.themeIconColorSelected
: StudioTheme.Values.themeIconColor
} }
MouseArea { HelperWidgets.ToolTipArea {
id: mouseArea id: mouseArea
anchors.fill: parent anchors.fill: parent
hoverEnabled: true hoverEnabled: true
onClicked: index == 0 ? rootView.handleAddModule() onClicked: index == 0 ? rootView.handleAddModule()
: rootView.handleAddAsset() : rootView.handleAddAsset()
tooltip: modelData.addToolTip
} }
} }
} }
@@ -124,7 +125,8 @@ Item {
anchors.bottom: parent.bottom anchors.bottom: parent.bottom
width: parent.width width: parent.width
height: 2 height: 2
color: tabBar.currentIndex === index ? "#0094ce" : "#a8a8a8" color: tabBar.currentIndex === index ? StudioTheme.Values.themeInteraction
: StudioTheme.Values.themeTextColor
} }
} }
@@ -136,29 +138,50 @@ Item {
TextField { // filter TextField { // filter
id: searchFilterText id: searchFilterText
placeholderText: qsTr("Search") placeholderText: qsTr("Search")
placeholderTextColor: "#a8a8a8" placeholderTextColor: StudioTheme.Values.themePlaceholderTextColor
color: "#dadada" color: StudioTheme.Values.themeTextColor
selectedTextColor: "#0094ce" selectionColor: StudioTheme.Values.themeTextSelectionColor
selectedTextColor: StudioTheme.Values.themeTextSelectedTextColor
background: Rectangle { background: Rectangle {
color: "#111111" id: textFieldBackground
border.color: "#666666" color: StudioTheme.Values.themeControlBackground
border.color: StudioTheme.Values.themeControlOutline
border.width: StudioTheme.Values.border
} }
height: StudioTheme.Values.defaultControlHeight
leftPadding: 32
rightPadding: 30
anchors.left: parent.left anchors.left: parent.left
anchors.right: parent.right anchors.right: parent.right
anchors.leftMargin: 5 anchors.leftMargin: 5
anchors.rightMargin: 5 anchors.rightMargin: 5
selectByMouse: true selectByMouse: true
hoverEnabled: true
onTextChanged: rootView.handleSearchfilterChanged(text) onTextChanged: rootView.handleSearchfilterChanged(text)
Label {
text: StudioTheme.Constants.search
font.family: StudioTheme.Constants.iconFont.family
font.pixelSize: 16
anchors.left: parent.left
anchors.leftMargin: 7
anchors.verticalCenter: parent.verticalCenter
color: StudioTheme.Values.themeIconColor
}
Rectangle { // x button Rectangle { // x button
width: 15 width: 16
height: 15 height: 15
anchors.right: parent.right anchors.right: parent.right
anchors.rightMargin: 5 anchors.rightMargin: 5
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
visible: searchFilterText.text !== "" visible: searchFilterText.text !== ""
color: xMouseArea.containsMouse ? "#353535" : "transparent" color: xMouseArea.containsMouse ? StudioTheme.Values.themePanelBackground
: "transparent"
Label { Label {
text: StudioTheme.Constants.closeCross text: StudioTheme.Constants.closeCross
@@ -167,7 +190,7 @@ Item {
verticalAlignment: Text.AlignVCenter verticalAlignment: Text.AlignVCenter
horizontalAlignment: Text.AlignHCenter horizontalAlignment: Text.AlignHCenter
anchors.centerIn: parent anchors.centerIn: parent
color: "#dadada" color: StudioTheme.Values.themeIconColor
} }
MouseArea { MouseArea {
@@ -177,6 +200,49 @@ Item {
onClicked: searchFilterText.text = "" onClicked: searchFilterText.text = ""
} }
} }
states: [
State {
name: "default"
when: !searchFilterText.hovered && !searchFilterText.activeFocus
PropertyChanges {
target: textFieldBackground
color: StudioTheme.Values.themeControlBackground
border.color: StudioTheme.Values.themeControlOutline
}
PropertyChanges {
target: searchFilterText
placeholderTextColor: StudioTheme.Values.themePlaceholderTextColor
}
},
State {
name: "hover"
when: searchFilterText.hovered && !searchFilterText.activeFocus
PropertyChanges {
target: textFieldBackground
color: StudioTheme.Values.themeControlBackgroundHover
border.color: StudioTheme.Values.themeControlOutline
}
PropertyChanges {
target: searchFilterText
placeholderTextColor: StudioTheme.Values.themePlaceholderTextColor
}
},
State {
name: "edit"
when: searchFilterText.activeFocus
PropertyChanges {
target: textFieldBackground
color: StudioTheme.Values.themeControlBackgroundInteraction
border.color: StudioTheme.Values.themeControlOutlineInteraction
}
PropertyChanges {
target: searchFilterText
placeholderTextColor: StudioTheme.Values.themePlaceholderTextColorInteraction
}
}
]
} }
} }
} }

2
share/qtcreator/qmldesigner/propertyEditorQmlSources/QtQuick/ItemPane.qml
View File

@@ -71,6 +71,7 @@ Rectangle {
Label { Label {
anchors.fill: parent anchors.fill: parent
anchors.leftMargin: StudioTheme.Values.inputHorizontalPadding anchors.leftMargin: StudioTheme.Values.inputHorizontalPadding
anchors.topMargin: StudioTheme.Values.typeLabelVerticalShift
text: backendValues.className.value text: backendValues.className.value
} }
ToolTipArea { ToolTipArea {
@@ -338,6 +339,7 @@ Rectangle {
SecondColumnLayout { SecondColumnLayout {
SpinBox { SpinBox {
width: StudioTheme.Values.squareComponentWidth * 4
sliderIndicatorVisible: true sliderIndicatorVisible: true
backendValue: backendValues.opacity backendValue: backendValues.opacity
decimals: 2 decimals: 2

1
share/qtcreator/qmldesigner/propertyEditorQmlSources/QtQuick/QtObjectPane.qml
View File

@@ -68,6 +68,7 @@ Rectangle {
Label { Label {
anchors.fill: parent anchors.fill: parent
anchors.leftMargin: StudioTheme.Values.inputHorizontalPadding anchors.leftMargin: StudioTheme.Values.inputHorizontalPadding
anchors.topMargin: StudioTheme.Values.typeLabelVerticalShift
text: backendValues.className.value text: backendValues.className.value
} }
ToolTipArea { ToolTipArea {

1
share/qtcreator/qmldesigner/propertyEditorQmlSources/QtQuick3D/Object3DPane.qml
View File

@@ -68,6 +68,7 @@ Rectangle {
Label { Label {
anchors.fill: parent anchors.fill: parent
anchors.leftMargin: StudioTheme.Values.inputHorizontalPadding anchors.leftMargin: StudioTheme.Values.inputHorizontalPadding
anchors.topMargin: StudioTheme.Values.typeLabelVerticalShift
text: backendValues.className.value text: backendValues.className.value
} }
ToolTipArea { ToolTipArea {

3
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/AligmentHorizontalButtons.qml
View File

@@ -39,7 +39,8 @@ Row {
property bool baseStateFlag: isBaseState; property bool baseStateFlag: isBaseState;
property color __currentColor: blueHighlight ? StudioTheme.Values.themeInteraction : StudioTheme.Values.themeTextColor property color __currentColor: blueHighlight ? StudioTheme.Values.themeIconColorInteraction
: StudioTheme.Values.themeIconColor
onValueChanged: { onValueChanged: {
buttonAlignLeft.checked = true buttonAlignLeft.checked = true

3
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/AligmentVerticalButtons.qml
View File

@@ -39,7 +39,8 @@ Row {
property bool baseStateFlag: isBaseState; property bool baseStateFlag: isBaseState;
property color __currentColor: blueHighlight ? StudioTheme.Values.themeInteraction : StudioTheme.Values.themeTextColor property color __currentColor: blueHighlight ? StudioTheme.Values.themeIconColorInteraction
: StudioTheme.Values.themeIconColor
onValueChanged: { onValueChanged: {
buttonAlignTop.checked = true buttonAlignTop.checked = true

10
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/AnchorButtons.qml
View File

@@ -124,8 +124,9 @@ StudioControls.ButtonRow {
} }
} }
AbstractButton { Item {
enabled: false width: 16 + 2 * StudioTheme.Values.border
height: 5
} }
AbstractButton { AbstractButton {
@@ -147,8 +148,9 @@ StudioControls.ButtonRow {
} }
} }
AbstractButton { Item {
enabled: false width: 16 + 2 * StudioTheme.Values.border
height: 5
} }
AbstractButton { AbstractButton {

3
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/BoolButtonRowButton.qml
View File

@@ -34,7 +34,8 @@ StudioControls.Button {
property variant backendValue property variant backendValue
property bool isHighlighted: false property bool isHighlighted: false
iconColor: isHighlighted ? StudioTheme.Values.themeInteraction : StudioTheme.Values.themeTextColor iconColor: isHighlighted ? StudioTheme.Values.themeIconColorInteraction
: StudioTheme.Values.themeIconColor
actionIndicatorVisible: true actionIndicatorVisible: true
checkable: true checkable: true

2
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/Button.qml
View File

@@ -72,7 +72,7 @@ T.AbstractButton {
when: myButton.hovered && !myButton.pressed when: myButton.hovered && !myButton.pressed
PropertyChanges { PropertyChanges {
target: buttonBackground target: buttonBackground
color: StudioTheme.Values.themeHoverHighlight color: StudioTheme.Values.themeControlBackgroundHover
} }
}, },
State { State {

10
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/ButtonRowButton.qml
View File

@@ -26,6 +26,7 @@
import QtQuick 2.15 import QtQuick 2.15
import QtQuick.Layouts 1.15 import QtQuick.Layouts 1.15
import QtQuickDesignerTheme 1.0 import QtQuickDesignerTheme 1.0
import StudioTheme 1.0 as StudioTheme
Item { Item {
id: buttonRowButton id: buttonRowButton
@@ -41,8 +42,8 @@ Item {
property alias tooltip: toolTipArea.tooltip property alias tooltip: toolTipArea.tooltip
width: 24 + leftPadding width: StudioTheme.Values.height + leftPadding
height: 24 height: StudioTheme.Values.height
property int leftPadding: 0 property int leftPadding: 0
@@ -69,7 +70,7 @@ Item {
anchors.fill: parent anchors.fill: parent
visible: checked visible: checked
color: Theme.qmlDesignerBackgroundColorDarker() color: StudioTheme.Values.themeControlBackgroundInteraction
} }
RoundedPanel { RoundedPanel {
@@ -77,7 +78,7 @@ Item {
anchors.fill: parent anchors.fill: parent
visible: !checked visible: !checked
color: Theme.qmlDesignerButtonColor() color: StudioTheme.Values.themeControlBackground
} }
} }
@@ -102,6 +103,5 @@ Item {
buttonRowButton.clicked() buttonRowButton.clicked()
} }
onDoubleClicked: buttonRowButton.doubleClicked() onDoubleClicked: buttonRowButton.doubleClicked()
} }
} }

79
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/ColorButton.qml
View File

@@ -24,6 +24,7 @@
****************************************************************************/ ****************************************************************************/
import QtQuick 2.1 import QtQuick 2.1
import StudioTheme 1.0 as StudioTheme
Item { Item {
id: colorButton id: colorButton
@@ -229,10 +230,10 @@ Item {
} }
Rectangle { Rectangle {
anchors.fill: parent anchors.fill: parent
anchors.margins: -1 anchors.margins: -StudioTheme.Values.border
color: "#00000000" color: "#00000000"
border.color: "black" border.color: StudioTheme.Values.themeControlOutline
border.width: 1 border.width: StudioTheme.Values.border
} }
} }
@@ -249,20 +250,24 @@ Item {
onClicked: colorButton.updateColor() onClicked: colorButton.updateColor()
} }
Row { Column {
anchors.left: hueSlider.right anchors.left: hueSlider.right
anchors.margins: colorButton.sliderMargins anchors.margins: colorButton.sliderMargins
spacing: 10 spacing: StudioTheme.Values.sectionRowSpacing
Row {
spacing: 20
Column { Column {
spacing: 10 spacing: StudioTheme.Values.sectionRowSpacing
Row { Row {
z: 3 z: 3
spacing: 1 spacing: 1
Label { Label {
text: "R" text: "R"
width: 16 width: 16
color: "#eee" color: StudioTheme.Values.themeTextColor
elide: Text.ElideRight elide: Text.ElideRight
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
} }
@@ -291,7 +296,7 @@ Item {
Label { Label {
text: "G" text: "G"
width: 16 width: 16
color: "#eee" color: StudioTheme.Values.themeTextColor
elide: Text.ElideRight elide: Text.ElideRight
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
} }
@@ -320,7 +325,7 @@ Item {
Label { Label {
text: "B" text: "B"
width: 16 width: 16
color: "#eee" color: StudioTheme.Values.themeTextColor
elide: Text.ElideRight elide: Text.ElideRight
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
} }
@@ -342,40 +347,18 @@ Item {
} }
} }
} }
Row {
z: 0
spacing: 1
Label {
text: "A"
width: 16
color: "#eee"
elide: Text.ElideRight
anchors.verticalCenter: parent.verticalCenter
}
DoubleSpinBox {
id: alphaSlider
sliderIndicatorVisible: true
width: 68
onValueModified: {
if (colorButton.alpha !== alphaSlider.value && !colorButton.block) {
colorButton.alpha = alphaSlider.value
colorButton.updateColor()
}
}
}
}
} }
Column { Column {
spacing: 10 spacing: StudioTheme.Values.sectionRowSpacing
Row { Row {
z: 3 z: 3
spacing: 1 spacing: 1
Label { Label {
text: "H" text: "H"
width: 16 width: 16
color: "#eee" color: StudioTheme.Values.themeTextColor
elide: Text.ElideRight elide: Text.ElideRight
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
} }
@@ -397,7 +380,7 @@ Item {
Label { Label {
text: "S" text: "S"
width: 16 width: 16
color: "#eee" color: StudioTheme.Values.themeTextColor
elide: Text.ElideRight elide: Text.ElideRight
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
} }
@@ -419,7 +402,7 @@ Item {
Label { Label {
text: "L" text: "L"
width: 16 width: 16
color: "#eee" color: StudioTheme.Values.themeTextColor
elide: Text.ElideRight elide: Text.ElideRight
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
} }
@@ -436,4 +419,28 @@ Item {
} }
} }
} }
Row {
z: 0
spacing: 1
Label {
text: "A"
width: 16
color: StudioTheme.Values.themeTextColor
elide: Text.ElideRight
anchors.verticalCenter: parent.verticalCenter
}
DoubleSpinBox {
id: alphaSlider
sliderIndicatorVisible: true
width: 169
onValueModified: {
if (colorButton.alpha !== alphaSlider.value && !colorButton.block) {
colorButton.alpha = alphaSlider.value
colorButton.updateColor()
}
}
}
}
}
} }

19
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/ColorCheckButton.qml
View File

@@ -24,34 +24,35 @@
****************************************************************************/ ****************************************************************************/
import QtQuick 2.1 import QtQuick 2.1
import StudioTheme 1.0 as StudioTheme
Item { Item {
id: root id: root
property bool checked: false property bool checked: false
property alias buttonColor: checkBox.color property alias buttonColor: checkBox.color
width: 30 width: StudioTheme.Values.height
height: 24 height: StudioTheme.Values.height
signal rightMouseButtonClicked signal rightMouseButtonClicked
Rectangle { Rectangle {
id: backgroundBox id: backgroundBox
width: 24 width: StudioTheme.Values.height
height: 24 height: StudioTheme.Values.height
anchors.right: parent.right anchors.right: parent.right
color: "white" color: "white"
border.color: "white" border.color: "white"
border.width: 1 border.width: StudioTheme.Values.border
Rectangle { Rectangle {
id: checkBox id: checkBox
width: 22 width: StudioTheme.Values.height - 2 * StudioTheme.Values.border
height: 22 height: StudioTheme.Values.height - 2 * StudioTheme.Values.border
anchors.centerIn: parent anchors.centerIn: parent
border.color: "black" border.color: "black"
border.width: 1 border.width: StudioTheme.Values.border
} }
} }
@@ -62,7 +63,7 @@ Item {
source: "image://icons/down-arrow" source: "image://icons/down-arrow"
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
anchors.right: backgroundBox.left anchors.right: backgroundBox.left
anchors.rightMargin: 2 anchors.rightMargin: 4
opacity: colorToolTip.containsMouse ? 1 : 0.8 opacity: colorToolTip.containsMouse ? 1 : 0.8
rotation: root.checked ? 0.0 : 270.0 rotation: root.checked ? 0.0 : 270.0
} }

143
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/ColorEditor.qml
View File

@@ -27,6 +27,7 @@ import QtQuick 2.1
import QtQuick.Layouts 1.0 import QtQuick.Layouts 1.0
import QtQuickDesignerTheme 1.0 import QtQuickDesignerTheme 1.0
import QtQuick.Dialogs 1.3 import QtQuick.Dialogs 1.3
import StudioTheme 1.0 as StudioTheme
import StudioControls 1.0 as StudioControls import StudioControls 1.0 as StudioControls
Column { Column {
@@ -214,6 +215,10 @@ Column {
SecondColumnLayout { SecondColumnLayout {
Item {
width: 6
}
ColorCheckButton { ColorCheckButton {
id: checkButton id: checkButton
buttonColor: colorEditor.color buttonColor: colorEditor.color
@@ -260,7 +265,6 @@ Column {
} }
ButtonRow { ButtonRow {
id: buttonRow id: buttonRow
exclusive: true exclusive: true
@@ -303,30 +307,20 @@ Column {
GradientDialogPopup { GradientDialogPopup {
id: gradientDialogPopupLinear id: gradientDialogPopupLinear
dialogHeight: 80 dialogHeight: 110
content: GridLayout { content: Column {
rowSpacing: 4 spacing: StudioTheme.Values.sectionRowSpacing
anchors.fill: parent
height: 40
columns: 4
rows: 2
anchors.leftMargin: 12
anchors.rightMargin: 6
anchors.topMargin: 28
anchors.bottomMargin: 6
RowLayout {
Label { Label {
text: "X1" text: "X1"
width: 18 width: 18
tooltip: qsTr("Defines the start point for color interpolation.") tooltip: qsTr("Defines the start point for color interpolation.")
} }
GradientPropertySpinBox { GradientPropertySpinBox { propertyName: "x1" }
propertyName: "x1"
} Item { width: StudioTheme.Values.controlLabelGap }
Label { Label {
text: "X2" text: "X2"
@@ -334,19 +328,19 @@ Column {
tooltip: qsTr("Defines the end point for color interpolation.") tooltip: qsTr("Defines the end point for color interpolation.")
} }
GradientPropertySpinBox { GradientPropertySpinBox { propertyName: "x2" }
propertyName: "x2"
} }
RowLayout {
Label { Label {
text: "y1" text: "Y1"
width: 18 width: 18
tooltip: qsTr("Defines the start point for color interpolation.") tooltip: qsTr("Defines the start point for color interpolation.")
} }
GradientPropertySpinBox { GradientPropertySpinBox { propertyName: "y1" }
propertyName: "y1"
} Item { width: StudioTheme.Values.controlLabelGap }
Label { Label {
text: "Y2" text: "Y2"
@@ -354,8 +348,7 @@ Column {
tooltip: qsTr("Defines the end point for color interpolation.") tooltip: qsTr("Defines the end point for color interpolation.")
} }
GradientPropertySpinBox { GradientPropertySpinBox { propertyName: "y2" }
propertyName: "y2"
} }
} }
} }
@@ -384,78 +377,67 @@ Column {
GradientDialogPopup { GradientDialogPopup {
id: gradientDialogPopupRadial id: gradientDialogPopupRadial
dialogHeight: 140 dialogHeight: 140
content: GridLayout { content: Column {
rowSpacing: 4 spacing: StudioTheme.Values.sectionRowSpacing
anchors.fill: parent
height: 40
columns: 4
rows: 3
anchors.leftMargin: 12
anchors.rightMargin: 6
anchors.topMargin: 28
anchors.bottomMargin: 6
RowLayout {
Label { Label {
text: "CenterX" text: "CenterX"
width: 64 width: 74
tooltip: qsTr("Defines the center point.") tooltip: qsTr("Defines the center point.")
} }
GradientPropertySpinBox { GradientPropertySpinBox { propertyName: "centerX" }
propertyName: "centerX"
} Item { width: StudioTheme.Values.controlLabelGap }
Label { Label {
text: "CenterY" text: "CenterY"
width: 64 width: 74
tooltip: qsTr("Defines the center point.") tooltip: qsTr("Defines the center point.")
} }
GradientPropertySpinBox { GradientPropertySpinBox { propertyName: "centerY" }
propertyName: "centerY"
} }
RowLayout {
Label { Label {
text: "FocalX" text: "FocalX"
width: 64 width: 74
tooltip: qsTr("Defines the focal point.") tooltip: qsTr("Defines the focal point.")
} }
GradientPropertySpinBox { GradientPropertySpinBox { propertyName: "focalX" }
propertyName: "focalX"
} Item { width: StudioTheme.Values.controlLabelGap }
Label { Label {
text: "FocalY" text: "FocalY"
width: 64 width: 74
tooltip: qsTr("Defines the focal point.") tooltip: qsTr("Defines the focal point.")
} }
GradientPropertySpinBox { GradientPropertySpinBox { propertyName: "focalY" }
propertyName: "focalY"
} }
RowLayout {
Label { Label {
text: "Center Radius" text: "Center Radius"
width: 64 width: 74
tooltip: qsTr("Defines the center point.") tooltip: qsTr("Defines the center point.")
} }
GradientPropertySpinBox { GradientPropertySpinBox { propertyName: "centerRadius" }
propertyName: "centerRadius"
} Item { width: StudioTheme.Values.controlLabelGap }
Label { Label {
text: "Focal Radius" text: "Focal Radius"
width: 64 width: 74
tooltip: qsTr("Defines the focal radius. Set to 0 for simple radial gradients.") tooltip: qsTr("Defines the focal radius. Set to 0 for simple radial gradients.")
} }
GradientPropertySpinBox { GradientPropertySpinBox { propertyName: "focalRadius" }
propertyName: "focalRadius"
} }
} }
} }
@@ -484,30 +466,20 @@ Column {
GradientDialogPopup { GradientDialogPopup {
id: gradientDialogPopupConical id: gradientDialogPopupConical
dialogHeight: 80 dialogHeight: 110
content: GridLayout { content: Column {
rowSpacing: 4 spacing: StudioTheme.Values.sectionRowSpacing
anchors.fill: parent
height: 40
columns: 4
rows: 2
anchors.leftMargin: 12
anchors.rightMargin: 6
anchors.topMargin: 28
anchors.bottomMargin: 6
RowLayout {
Label { Label {
text: "CenterX" text: "CenterX"
width: 64 width: 64
tooltip: qsTr("Defines the center point.") tooltip: qsTr("Defines the center point.")
} }
GradientPropertySpinBox { GradientPropertySpinBox { propertyName: "centerX" }
propertyName: "centerX"
} Item { width: StudioTheme.Values.controlLabelGap }
Label { Label {
text: "CenterY" text: "CenterY"
@@ -515,18 +487,17 @@ Column {
tooltip: qsTr("Defines the center point.") tooltip: qsTr("Defines the center point.")
} }
GradientPropertySpinBox { GradientPropertySpinBox { propertyName: "centerY" }
propertyName: "centerY"
} }
RowLayout {
Label { Label {
text: "Angle" text: "Angle"
width: 64 width: 64
tooltip: qsTr("Defines the start angle for the conical gradient. The value is in degrees (0-360).") tooltip: qsTr("Defines the start angle for the conical gradient. The value is in degrees (0-360).")
} }
GradientPropertySpinBox { GradientPropertySpinBox { propertyName: "angle" }
propertyName: "angle"
} }
} }
} }
@@ -546,13 +517,13 @@ Column {
Rectangle { Rectangle {
id: gradientPickerButton id: gradientPickerButton
width: 20 width: StudioTheme.Values.height
height: 20 height: StudioTheme.Values.height
visible: colorEditor.supportGradient visible: colorEditor.supportGradient
color: Theme.qmlDesignerButtonColor() color: StudioTheme.Values.themeControlBackground
border.color: Theme.qmlDesignerBorderColor() border.color: StudioTheme.Values.themeControlOutline
border.width: 1 border.width: StudioTheme.Values.border
ToolTipArea { ToolTipArea {
anchors.fill: parent anchors.fill: parent

5
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/ColorLine.qml
View File

@@ -25,6 +25,7 @@
import QtQuick 2.1 import QtQuick 2.1
import HelperWidgets 2.0 import HelperWidgets 2.0
import StudioTheme 1.0 as StudioTheme
Item { Item {
width: 300 width: 300
@@ -42,8 +43,8 @@ Item {
Rectangle { Rectangle {
height: 16 height: 16
width: parent.width width: parent.width
border.color: "#555555" border.color: StudioTheme.Values.themeControlOutline
border.width: 1 border.width: StudioTheme.Values.border
id: colorLine id: colorLine
color: "white" color: "white"

3
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/ComboBox.qml
View File

@@ -32,7 +32,8 @@ StudioControls.ComboBox {
property variant backendValue property variant backendValue
labelColor: edit && !colorLogic.errorState ? StudioTheme.Values.themeTextColor : colorLogic.textColor labelColor: edit && !colorLogic.errorState ? StudioTheme.Values.themeTextColor
: colorLogic.textColor
property string scope: "Qt" property string scope: "Qt"
enum ValueType { String, Integer, Enum } enum ValueType { String, Integer, Enum }

4
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/EditableListView.qml
View File

@@ -181,7 +181,9 @@ Rectangle {
id: actionIndicator id: actionIndicator
width: actionIndicator.visible ? __actionIndicatorWidth : 0 width: actionIndicator.visible ? __actionIndicatorWidth : 0
height: actionIndicator.visible ? __actionIndicatorHeight : 0 height: actionIndicator.visible ? __actionIndicatorHeight : 0
showBackground: true
border.width: StudioTheme.Values.border
border.color: StudioTheme.Values.themeControlOutline
icon.color: extFuncLogic.color icon.color: extFuncLogic.color
icon.text: extFuncLogic.glyph icon.text: extFuncLogic.glyph

18
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/ExpressionTextField.qml
View File

@@ -66,9 +66,9 @@ StudioControls.TextField {
Popup { Popup {
id: textFieldPopup id: textFieldPopup
x: textField.x x: StudioTheme.Values.border
y: textField.height - StudioTheme.Values.border y: textField.height
width: textField.width width: textField.width - (StudioTheme.Values.border * 2)
// TODO Setting the height on the popup solved the problem with the popup of height 0, // TODO Setting the height on the popup solved the problem with the popup of height 0,
// but it has the problem that it sometimes extend over the border of the actual window // but it has the problem that it sometimes extend over the border of the actual window
// and is then cut off. // and is then cut off.
@@ -106,11 +106,14 @@ StudioControls.TextField {
padding: 0 padding: 0
text: itemDelegateText.text text: itemDelegateText.text
highlighted: listView.currentIndex === index
contentItem: Text { contentItem: Text {
id: itemDelegateText id: itemDelegateText
leftPadding: 8 leftPadding: 8
text: modelData text: modelData
color: StudioTheme.Values.themeTextColor color: highlighted ? StudioTheme.Values.themeTextSelectedTextColor
: StudioTheme.Values.themeTextColor
font: textField.font font: textField.font
elide: Text.ElideRight elide: Text.ElideRight
verticalAlignment: Text.AlignVCenter verticalAlignment: Text.AlignVCenter
@@ -144,9 +147,8 @@ StudioControls.TextField {
} }
background: Rectangle { background: Rectangle {
color: StudioTheme.Values.themeControlBackground color: StudioTheme.Values.themePopupBackground
border.color: StudioTheme.Values.themeInteraction border.width: 0
border.width: StudioTheme.Values.border
} }
enter: Transition { enter: Transition {
@@ -155,7 +157,7 @@ StudioControls.TextField {
} }
} }
verticalAlignment: Text.AlignTop verticalAlignment: Text.AlignVCenter
onPressed: listView.model = null onPressed: listView.model = null

2
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/FontSection.qml
View File

@@ -124,7 +124,6 @@ Section {
StudioControls.ComboBox { StudioControls.ComboBox {
id: sizeType id: sizeType
model: ["pixels", "points"] model: ["pixels", "points"]
property color textColor: Theme.color(Theme.PanelTextColorLight)
actionIndicatorVisible: false actionIndicatorVisible: false
onActivated: { onActivated: {
@@ -148,7 +147,6 @@ Section {
text: qsTr("Font style") text: qsTr("Font style")
} }
FontStyleButtons { FontStyleButtons {
bold: fontSection.boldStyle bold: fontSection.boldStyle
italic: fontSection.italicStyle italic: fontSection.italicStyle
underline: fontSection.underlineStyle underline: fontSection.underlineStyle

15
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/GradientDialogPopup.qml
View File

@@ -44,7 +44,7 @@ Loader {
property Component content property Component content
property int dialogHeight: 240 property int dialogHeight: 240
property int dialogWidth: 440 property int dialogWidth: 400
sourceComponent: Component { sourceComponent: Component {
FocusScope { FocusScope {
@@ -61,8 +61,7 @@ Loader {
Rectangle { Rectangle {
anchors.fill: parent anchors.fill: parent
color: Theme.qmlDesignerBackgroundColorDarker() color: StudioTheme.Values.themePopupOverlayColor
opacity: 0.6
} }
MouseArea { MouseArea {
@@ -84,10 +83,11 @@ Loader {
width: parent.width - 8 - xOffset width: parent.width - 8 - xOffset
height: gradientDialogLoader.dialogHeight height: gradientDialogLoader.dialogHeight
color: Theme.qmlDesignerBackgroundColorDarkAlternate() color: StudioTheme.Values.themePanelBackground
border.color: Theme.qmlDesignerBorderColor() border.color: StudioTheme.Values.themeControlOutline
Label { Label {
id: title
x: 8 x: 8
y: 6 y: 6
font.bold: true font.bold: true
@@ -106,7 +106,10 @@ Loader {
} }
Loader { Loader {
anchors.fill: parent anchors.top: title.bottom
anchors.topMargin: 8
anchors.left: parent.left
anchors.leftMargin: 8
sourceComponent: gradientDialogLoader.content sourceComponent: gradientDialogLoader.content
} }
} }

2
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/GradientPresetList.qml
View File

@@ -68,7 +68,7 @@ Dialog {
anchors.fill: parent anchors.fill: parent
anchors.margins: -12 anchors.margins: -12
anchors.bottomMargin: -70 anchors.bottomMargin: -70
color: StudioTheme.Values.themeColumnBackground color: StudioTheme.Values.themePanelBackground
ColumnLayout { ColumnLayout {
anchors.fill: parent anchors.fill: parent

11
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/GradientPresetTabContent.qml
View File

@@ -53,11 +53,12 @@ Rectangle {
Layout.fillHeight: true Layout.fillHeight: true
anchors.fill: parent anchors.fill: parent
anchors.leftMargin: 10 anchors.leftMargin: 10
rightMargin: StudioTheme.Values.scrollBarThickness
clip: true clip: true
delegate: gradientDelegate delegate: gradientDelegate
property int gridColumns: width / tabBackground.gridCellWidth; property int gridColumns: (width - rightMargin) / tabBackground.gridCellWidth;
cellWidth: width / gridColumns cellWidth: (width - rightMargin) / gridColumns
cellHeight: 185 cellHeight: 185
property bool bothVisible: horizontal.scrollBarVisible && vertical.scrollBarVisible property bool bothVisible: horizontal.scrollBarVisible && vertical.scrollBarVisible
@@ -133,7 +134,7 @@ Rectangle {
PropertyChanges { PropertyChanges {
target: backgroundCard target: backgroundCard
color: StudioTheme.Values.themeControlBackgroundPressed color: StudioTheme.Values.themeControlBackgroundPressed
border.width: 1 border.width: StudioTheme.Values.border
border.color: StudioTheme.Values.themeInteraction border.color: StudioTheme.Values.themeInteraction
} }
}, },
@@ -143,7 +144,7 @@ Rectangle {
PropertyChanges { PropertyChanges {
target: backgroundCard target: backgroundCard
color:StudioTheme.Values.themeInteraction color:StudioTheme.Values.themeInteraction
border.width: 1 border.width: StudioTheme.Values.border
border.color: StudioTheme.Values.themeControlBackgroundPressed border.color: StudioTheme.Values.themeControlBackgroundPressed
} }
} }
@@ -312,7 +313,7 @@ Rectangle {
target: nameBackgroundColor target: nameBackgroundColor
color: StudioTheme.Values.themeControlBackgroundPressed color: StudioTheme.Values.themeControlBackgroundPressed
border.color: StudioTheme.Values.themeInteraction border.color: StudioTheme.Values.themeInteraction
border.width: 1 border.width: StudioTheme.Values.border
} }
PropertyChanges { target: nameText; visible: false } PropertyChanges { target: nameText; visible: false }
PropertyChanges { target: nameInput; visible: true } PropertyChanges { target: nameInput; visible: true }

2
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/HorizontalScrollBar.qml
View File

@@ -41,7 +41,7 @@ ScrollBar {
padding: 0 padding: 0
background: Rectangle { background: Rectangle {
color: StudioTheme.Values.themeSectionHeadBackground color: StudioTheme.Values.themeScrollBarTrack
} }
contentItem: Rectangle { contentItem: Rectangle {

3
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/HueSlider.qml
View File

@@ -24,6 +24,7 @@
****************************************************************************/ ****************************************************************************/
import QtQuick 2.1 import QtQuick 2.1
import StudioTheme 1.0 as StudioTheme
Item { Item {
id: colorSlider id: colorSlider
@@ -63,7 +64,7 @@ Item {
Rectangle { Rectangle {
anchors.fill: track anchors.fill: track
anchors.margins: -1 anchors.margins: -1
color: "darkGray" color: StudioTheme.Values.themeControlOutline
} }
Rectangle { Rectangle {

2
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/Label.qml
View File

@@ -38,7 +38,7 @@ Label {
width: Math.max(Math.min(240, parent.width - 280), 50) width: Math.max(Math.min(240, parent.width - 280), 50)
color: ((label.disabledState || label.disabledStateSoft) color: ((label.disabledState || label.disabledStateSoft)
? StudioTheme.Values.themeDisabledTextColor ? StudioTheme.Values.themeTextColorDisabled
: StudioTheme.Values.themeTextColor) : StudioTheme.Values.themeTextColor)
elide: Text.ElideRight elide: Text.ElideRight

6
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/OriginControl.qml
View File

@@ -35,12 +35,12 @@ Item {
property variant backendValue property variant backendValue
property color borderColorSelected: colorLogic.textColor property color borderColorSelected: colorLogic.textColor
property color borderColor: Theme.qmlDesignerBorderColor() property color borderColor: StudioTheme.Values.themeControlOutline
property bool showTranslateCheckBox: true property bool showTranslateCheckBox: true
readonly property color selectedColor: Theme.qmlDesignerBackgroundColorDarkAlternate() readonly property color selectedColor: StudioTheme.Values.themeControlBackgroundInteraction
readonly property color unselectedColor: Theme.qmlDesignerBackgroundColorDarker() readonly property color unselectedColor: StudioTheme.Values.themeControlBackground
property bool enabled: true property bool enabled: true

9
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/RoundedPanel.qml
View File

@@ -26,6 +26,7 @@
import QtQuick 2.1 import QtQuick 2.1
import QtQuick.Layouts 1.0 import QtQuick.Layouts 1.0
import QtQuickDesignerTheme 1.0 import QtQuickDesignerTheme 1.0
import StudioTheme 1.0 as StudioTheme
Rectangle { Rectangle {
id: panel id: panel
@@ -43,8 +44,8 @@ Rectangle {
*/ */
border.width: roundLeft || roundRight ? 1 : 0 border.width: roundLeft || roundRight ? 1 : 0
color: Theme.qmlDesignerButtonColor() color: StudioTheme.Values.themeControlBackground
border.color: Theme.qmlDesignerBorderColor() border.color: StudioTheme.Values.themeControlOutline
Rectangle { Rectangle {
anchors.fill: parent anchors.fill: parent
@@ -71,7 +72,7 @@ Rectangle {
} }
Rectangle { Rectangle {
color: Theme.qmlDesignerBorderColor() color: StudioTheme.Values.themeControlOutline
anchors.top: parent.top anchors.top: parent.top
anchors.left: parent.left anchors.left: parent.left
anchors.right: parent.right anchors.right: parent.right
@@ -81,7 +82,7 @@ Rectangle {
} }
Rectangle { Rectangle {
color: Theme.qmlDesignerBorderColor() color: StudioTheme.Values.themeControlOutline
anchors.bottom: parent.bottom anchors.bottom: parent.bottom
anchors.left: parent.left anchors.left: parent.left
anchors.right: parent.right anchors.right: parent.right

26
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/Section.qml
View File

@@ -1,6 +1,6 @@
/**************************************************************************** /****************************************************************************
** **
** Copyright (C) 2016 The Qt Company Ltd. ** Copyright (C) 2021 The Qt Company Ltd.
** Contact: https://www.qt.io/licensing/ ** Contact: https://www.qt.io/licensing/
** **
** This file is part of Qt Creator. ** This file is part of Qt Creator.
@@ -62,7 +62,7 @@ Item {
Rectangle { Rectangle {
id: header id: header
height: 20 height: StudioTheme.Values.sectionHeadHeight
anchors.left: parent.left anchors.left: parent.left
anchors.right: parent.right anchors.right: parent.right
color: Qt.lighter(StudioTheme.Values.themeSectionHeadBackground, 1.0 + (0.2 * level)) color: Qt.lighter(StudioTheme.Values.themeSectionHeadBackground, 1.0 + (0.2 * level))
@@ -82,8 +82,8 @@ Item {
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
color: StudioTheme.Values.themeTextColor color: StudioTheme.Values.themeTextColor
x: 22 + (level * levelShift) x: 22 + (level * levelShift)
font.bold: true
font.pixelSize: StudioTheme.Values.myFontSize font.pixelSize: StudioTheme.Values.myFontSize
font.capitalization: Font.AllUppercase
} }
MouseArea { MouseArea {
@@ -112,15 +112,20 @@ Item {
anchors.rightMargin: 5 + leftPadding anchors.rightMargin: 5 + leftPadding
anchors.leftMargin: 5 - leftPadding anchors.leftMargin: 5 - leftPadding
visible: false visible: false
color: "#666666" color: StudioTheme.Values.themeControlOutline
} }
default property alias __content: row.children default property alias __content: row.children
readonly property alias contentItem: row readonly property alias contentItem: row
implicitHeight: Math.round(row.height + header.height implicitHeight: Math.round(row.height + header.height + topRow.height + bottomRow.height)
+ section.topPadding + section.bottomPadding)
Row {
id: topRow
height: StudioTheme.Values.sectionHeadSpacerHeight
anchors.top: header.bottom
}
Row { Row {
id: row id: row
@@ -128,8 +133,13 @@ Item {
anchors.leftMargin: section.leftPadding anchors.leftMargin: section.leftPadding
anchors.right: parent.right anchors.right: parent.right
anchors.rightMargin: section.rightPadding anchors.rightMargin: section.rightPadding
anchors.top: header.bottom anchors.top: topRow.bottom
anchors.topMargin: section.topPadding }
Row {
id: bottomRow
height: StudioTheme.Values.sectionHeadSpacerHeight
anchors.top: row.bottom
} }
states: [ states: [

14
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/StandardTextSection.qml
View File

@@ -127,20 +127,18 @@ Section {
text: qsTr("Alignment") text: qsTr("Alignment")
} }
AligmentHorizontalButtons { Row {
AligmentHorizontalButtons {}
} Item {
Label {
visible: showVerticalAlignment visible: showVerticalAlignment
text: ("") width: 20
height: 2
} }
AligmentVerticalButtons { AligmentVerticalButtons { visible: showVerticalAlignment }
visible: showVerticalAlignment
} }
Label { Label {
visible: showFormatProperty visible: showFormatProperty
text: qsTr("Format") text: qsTr("Format")

86
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/UrlChooser.qml
View File

@@ -23,7 +23,7 @@
** **
****************************************************************************/ ****************************************************************************/
import QtQuick 2.1 import QtQuick 2.15
import HelperWidgets 2.0 import HelperWidgets 2.0
import StudioControls 1.0 as StudioControls import StudioControls 1.0 as StudioControls
import StudioTheme 1.0 as StudioTheme import StudioTheme 1.0 as StudioTheme
@@ -35,7 +35,8 @@ RowLayout {
id: urlChooser id: urlChooser
property variant backendValue property variant backendValue
property color textColor: colorLogic.highlight ? colorLogic.textColor : "white" property color textColor: colorLogic.highlight ? colorLogic.textColor
: StudioTheme.Values.themeTextColor
property string filter: "*.png *.gif *.jpg *.bmp *.jpeg *.svg *.pbm *.pgm *.ppm *.xbm *.xpm *.hdr *.webp" property string filter: "*.png *.gif *.jpg *.bmp *.jpeg *.svg *.pbm *.pgm *.ppm *.xbm *.xpm *.hdr *.webp"
FileResourcesModel { FileResourcesModel {
@@ -57,50 +58,85 @@ RowLayout {
property int hoverIndex: -1 property int hoverIndex: -1
ToolTip { ToolTip {
visible: comboBox.hovered id: toolTip
visible: comboBox.hovered && toolTip.text !== ""
text: urlChooser.backendValue.valueToString text: urlChooser.backendValue.valueToString
delay: 1000 delay: StudioTheme.Values.toolTipDelay
height: StudioTheme.Values.toolTipHeight
background: Rectangle {
color: StudioTheme.Values.themeToolTipBackground
border.color: StudioTheme.Values.themeToolTipOutline
border.width: StudioTheme.Values.border
}
contentItem: Label {
color: StudioTheme.Values.themeToolTipText
text: toolTip.text
verticalAlignment: Text.AlignVCenter
}
} }
delegate: ItemDelegate { delegate: ItemDelegate {
id: delegateItem id: delegateItem
width: parent.width width: parent.width
height: 20 height: StudioTheme.Values.height - 2 * StudioTheme.Values.border
highlighted: comboBox.hoverIndex === index padding: 0
highlighted: comboBox.highlightedIndex === index
indicator: Label { // selected item check mark indicator: Item {
padding: 5 id: itemDelegateIconArea
y: (parent.height - height) / 2 width: delegateItem.height
height: delegateItem.height
Label {
id: itemDelegateIcon
text: StudioTheme.Constants.tickIcon text: StudioTheme.Constants.tickIcon
font.pixelSize: 10 color: delegateItem.highlighted ? StudioTheme.Values.themeTextSelectedTextColor
: StudioTheme.Values.themeTextColor
font.family: StudioTheme.Constants.iconFont.family font.family: StudioTheme.Constants.iconFont.family
color: Theme.color(comboBox.hoverIndex === index ? Theme.PanelTextColorLight font.pixelSize: StudioTheme.Values.spinControlIconSizeMulti
: Theme.QmlDesigner_HighlightColor) visible: comboBox.currentIndex === index ? true : false
visible: comboBox.currentIndex === index anchors.fill: parent
renderType: Text.NativeRendering
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter
}
} }
contentItem: Label { contentItem: Text {
leftPadding: 10 leftPadding: itemDelegateIconArea.width
text: modelData text: modelData
anchors.top: parent.top color: delegateItem.highlighted ? StudioTheme.Values.themeTextSelectedTextColor
color: Theme.color(Theme.PanelTextColorLight) : StudioTheme.Values.themeTextColor
font.pixelSize: 13 font: comboBox.font
elide: Text.ElideRight
verticalAlignment: Text.AlignVCenter
} }
background: Rectangle { background: Rectangle {
anchors.fill: parent id: itemDelegateBackground
color: parent.highlighted ? Theme.color(Theme.QmlDesigner_HighlightColor) : "transparent" x: 0
y: 0
width: delegateItem.width
height: delegateItem.height
color: delegateItem.highlighted ? StudioTheme.Values.themeInteraction : "transparent"
} }
ToolTip { ToolTip {
id: itemToolTip
visible: delegateItem.hovered && comboBox.highlightedIndex === index visible: delegateItem.hovered && comboBox.highlightedIndex === index
text: fileModel.fullPathModel[index] text: fileModel.fullPathModel[index]
delay: 1000 delay: StudioTheme.Values.toolTipDelay
height: StudioTheme.Values.toolTipHeight
background: Rectangle {
color: StudioTheme.Values.themeToolTipBackground
border.color: StudioTheme.Values.themeToolTipOutline
border.width: StudioTheme.Values.border
}
contentItem: Label {
color: StudioTheme.Values.themeToolTipText
text: itemToolTip.text
verticalAlignment: Text.AlignVCenter
} }
onHoveredChanged: {
if (hovered)
comboBox.hoverIndex = index
} }
} }

2
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/VerticalScrollBar.qml
View File

@@ -41,7 +41,7 @@ ScrollBar {
padding: 0 padding: 0
background: Rectangle { background: Rectangle {
color: StudioTheme.Values.themeSectionHeadBackground color: StudioTheme.Values.themeScrollBarTrack
} }
contentItem: Rectangle { contentItem: Rectangle {

78
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioControls/AbstractButton.qml
View File

@@ -1,6 +1,6 @@
/**************************************************************************** /****************************************************************************
** **
** Copyright (C) 2019 The Qt Company Ltd. ** Copyright (C) 2021 The Qt Company Ltd.
** Contact: https://www.qt.io/licensing/ ** Contact: https://www.qt.io/licensing/
** **
** This file is part of Qt Creator. ** This file is part of Qt Creator.
@@ -30,12 +30,15 @@ import StudioTheme 1.0 as StudioTheme
T.AbstractButton { T.AbstractButton {
id: myButton id: myButton
property bool globalHover: false
property alias buttonIcon: buttonIcon.text property alias buttonIcon: buttonIcon.text
property alias iconColor: buttonIcon.color property alias iconColor: buttonIcon.color
property alias iconFont: buttonIcon.font.family property alias iconFont: buttonIcon.font.family
property alias iconSize: buttonIcon.font.pixelSize property alias iconSize: buttonIcon.font.pixelSize
property alias iconItalic: buttonIcon.font.italic property alias iconItalic: buttonIcon.font.italic
property alias iconBold: buttonIcon.font.bold property alias iconBold: buttonIcon.font.bold
property alias iconRotation: buttonIcon.rotation
property alias backgroundVisible: buttonBackground.visible property alias backgroundVisible: buttonBackground.visible
property alias backgroundRadius: buttonBackground.radius property alias backgroundRadius: buttonBackground.radius
@@ -49,14 +52,14 @@ T.AbstractButton {
activeFocusOnTab: false activeFocusOnTab: false
onHoveredChanged: { onHoveredChanged: {
if (parent !== undefined && parent.hover !== undefined) if (parent !== undefined && parent.hoverCallback !== undefined)
parent.hover = hovered parent.hoverCallback()
} }
background: Rectangle { background: Rectangle {
id: buttonBackground id: buttonBackground
color: myButton.checked ? StudioTheme.Values.themeControlBackgroundChecked : StudioTheme.Values.themeControlBackground color: StudioTheme.Values.themeControlBackground
border.color: myButton.checked ? StudioTheme.Values.themeInteraction : StudioTheme.Values.themeControlOutline border.color: StudioTheme.Values.themeControlOutline
border.width: StudioTheme.Values.border border.width: StudioTheme.Values.border
} }
@@ -75,14 +78,49 @@ T.AbstractButton {
horizontalAlignment: Text.AlignHCenter horizontalAlignment: Text.AlignHCenter
anchors.fill: parent anchors.fill: parent
renderType: Text.QtRendering renderType: Text.QtRendering
states: [
State {
name: "default"
when: myButton.enabled && !myButton.pressed && !myButton.checked
PropertyChanges {
target: buttonIcon
color: StudioTheme.Values.themeIconColor
}
},
State {
name: "press"
when: myButton.enabled && myButton.pressed
PropertyChanges {
target: buttonIcon
color: StudioTheme.Values.themeIconColorInteraction
}
},
State {
name: "select"
when: myButton.enabled && !myButton.pressed && myButton.checked
PropertyChanges {
target: buttonIcon
color: StudioTheme.Values.themeIconColorSelected
}
},
State {
name: "disable"
when: !myButton.enabled
PropertyChanges {
target: buttonIcon
color: StudioTheme.Values.themeTextColorDisabled
}
}
]
} }
} }
states: [ states: [
State { State {
name: "default" name: "default"
when: myButton.enabled && !myButton.hovered && !myButton.pressed when: myButton.enabled && !myButton.globalHover && !myButton.hovered
&& !myButton.checked && !myButton.pressed && !myButton.checked
PropertyChanges { PropertyChanges {
target: buttonBackground target: buttonBackground
color: StudioTheme.Values.themeControlBackground color: StudioTheme.Values.themeControlBackground
@@ -93,38 +131,42 @@ T.AbstractButton {
} }
}, },
State { State {
name: "hovered" name: "globalHover"
when: myButton.hovered && !myButton.pressed when: myButton.globalHover && !myButton.hovered && !myButton.pressed
PropertyChanges { PropertyChanges {
target: buttonBackground target: buttonBackground
color: StudioTheme.Values.themeHoverHighlight color: StudioTheme.Values.themeControlBackgroundGlobalHover
} }
}, },
State { State {
name: "pressed" name: "hover"
when: myButton.hovered && !myButton.pressed
PropertyChanges {
target: buttonBackground
color: StudioTheme.Values.themeControlBackgroundHover
}
},
State {
name: "press"
when: myButton.hovered && myButton.pressed when: myButton.hovered && myButton.pressed
PropertyChanges { PropertyChanges {
target: buttonBackground target: buttonBackground
color: StudioTheme.Values.themeControlBackgroundPressed color: StudioTheme.Values.themeControlBackgroundInteraction
border.color: StudioTheme.Values.themeInteraction border.color: StudioTheme.Values.themeInteraction
} }
PropertyChanges { PropertyChanges {
target: myButton target: myButton
z: 10 z: 100
} }
}, },
State { State {
name: "disabled" name: "disable"
when: !myButton.enabled when: !myButton.enabled
PropertyChanges { PropertyChanges {
target: buttonBackground target: buttonBackground
color: StudioTheme.Values.themeControlBackgroundDisabled color: StudioTheme.Values.themeControlBackgroundDisabled
border.color: StudioTheme.Values.themeControlOutlineDisabled border.color: StudioTheme.Values.themeControlOutlineDisabled
} }
PropertyChanges {
target: buttonIcon
color: StudioTheme.Values.themeTextColorDisabled
}
} }
] ]
} }

69
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioControls/ActionIndicator.qml
View File

@@ -1,6 +1,6 @@
/**************************************************************************** /****************************************************************************
** **
** Copyright (C) 2019 The Qt Company Ltd. ** Copyright (C) 2021 The Qt Company Ltd.
** Contact: https://www.qt.io/licensing/ ** Contact: https://www.qt.io/licensing/
** **
** This file is part of Qt Creator. ** This file is part of Qt Creator.
@@ -32,18 +32,16 @@ Rectangle {
property Item myControl property Item myControl
property bool showBackground: StudioTheme.Constants.showActionIndicatorBackground
property alias icon: actionIndicatorIcon property alias icon: actionIndicatorIcon
property bool hover: false property bool hover: false
property bool pressed: false property bool pressed: false
property bool forceVisible: false property bool forceVisible: false
color: actionIndicator.showBackground ? StudioTheme.Values.themeControlBackground : "transparent" color: "transparent"
border.color: actionIndicator.showBackground ? StudioTheme.Values.themeControlOutline : "transparent"
implicitWidth: StudioTheme.Values.height implicitWidth: StudioTheme.Values.actionIndicatorWidth
implicitHeight: StudioTheme.Values.height implicitHeight: StudioTheme.Values.actionIndicatorHeight
signal clicked signal clicked
z: 10 z: 10
@@ -65,7 +63,7 @@ Rectangle {
states: [ states: [
State { State {
name: "hovered" name: "hover"
when: actionIndicator.hover && !actionIndicator.pressed when: actionIndicator.hover && !actionIndicator.pressed
&& (!myControl || (!myControl.edit && !myControl.drag)) && (!myControl || (!myControl.edit && !myControl.drag))
&& actionIndicator.enabled && actionIndicator.enabled
@@ -76,7 +74,7 @@ Rectangle {
} }
}, },
State { State {
name: "disabled" name: "disable"
when: !actionIndicator.enabled when: !actionIndicator.enabled
PropertyChanges { PropertyChanges {
target: actionIndicatorIcon target: actionIndicatorIcon
@@ -93,59 +91,4 @@ Rectangle {
onContainsMouseChanged: actionIndicator.hover = containsMouse onContainsMouseChanged: actionIndicator.hover = containsMouse
onClicked: actionIndicator.clicked() onClicked: actionIndicator.clicked()
} }
states: [
State {
name: "default"
when: myControl !== undefined && myControl.enabled && !actionIndicator.hover
&& !actionIndicator.pressed && !myControl.hover
&& !myControl.edit && !myControl.drag && actionIndicator.showBackground
PropertyChanges {
target: actionIndicator
color: StudioTheme.Values.themeControlBackground
border.color: StudioTheme.Values.themeControlOutline
}
},
State {
name: "globalHover"
when: myControl !== undefined && myControl.hover !== undefined
&& myControl.hover && !actionIndicator.hover && !actionIndicator.pressed
&& myControl.edit !== undefined && !myControl.edit && myControl.drag !== undefined
&& !myControl.drag && actionIndicator.showBackground
PropertyChanges {
target: actionIndicator
color: StudioTheme.Values.themeHoverHighlight
border.color: StudioTheme.Values.themeControlOutline
}
},
State {
name: "edit"
when: myControl !== undefined && myControl.edit !== undefined
&& myControl.edit && actionIndicator.showBackground
PropertyChanges {
target: actionIndicator
color: StudioTheme.Values.themeFocusEdit
border.color: StudioTheme.Values.themeInteraction
}
},
State {
name: "drag"
when: myControl !== undefined && myControl.drag !== undefined
&& myControl.drag && actionIndicator.showBackground
PropertyChanges {
target: actionIndicator
color: StudioTheme.Values.themeFocusDrag
border.color: StudioTheme.Values.themeInteraction
}
},
State {
name: "disabled"
when: myControl !== undefined && !myControl.enabled && actionIndicator.showBackground
PropertyChanges {
target: actionIndicator
color: StudioTheme.Values.themeControlBackgroundDisabled
border.color: StudioTheme.Values.themeControlOutlineDisabled
}
}
]
} }

3
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioControls/Button.qml
View File

@@ -1,6 +1,6 @@
/**************************************************************************** /****************************************************************************
** **
** Copyright (C) 2019 The Qt Company Ltd. ** Copyright (C) 2021 The Qt Company Ltd.
** Contact: https://www.qt.io/licensing/ ** Contact: https://www.qt.io/licensing/
** **
** This file is part of Qt Creator. ** This file is part of Qt Creator.
@@ -32,6 +32,7 @@ ButtonRow {
property alias buttonIcon: myAbstractButton.buttonIcon property alias buttonIcon: myAbstractButton.buttonIcon
property alias iconColor: myAbstractButton.iconColor property alias iconColor: myAbstractButton.iconColor
property alias iconRotation: myAbstractButton.iconRotation
property alias checkable: myAbstractButton.checkable property alias checkable: myAbstractButton.checkable
property alias checked: myAbstractButton.checked property alias checked: myAbstractButton.checked

2
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioControls/ButtonGroup.qml
View File

@@ -1,6 +1,6 @@
/**************************************************************************** /****************************************************************************
** **
** Copyright (C) 2019 The Qt Company Ltd. ** Copyright (C) 2021 The Qt Company Ltd.
** Contact: https://www.qt.io/licensing/ ** Contact: https://www.qt.io/licensing/
** **
** This file is part of Qt Creator. ** This file is part of Qt Creator.

31
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioControls/ButtonRow.qml
View File

@@ -1,6 +1,6 @@
/**************************************************************************** /****************************************************************************
** **
** Copyright (C) 2019 The Qt Company Ltd. ** Copyright (C) 2021 The Qt Company Ltd.
** Contact: https://www.qt.io/licensing/ ** Contact: https://www.qt.io/licensing/
** **
** This file is part of Qt Creator. ** This file is part of Qt Creator.
@@ -31,22 +31,41 @@ import StudioTheme 1.0 as StudioTheme
Row { Row {
id: myButtonRow id: myButtonRow
property bool hover: false property bool hover: actionIndicator.hover || myButtonRow.childHover
property bool childHover: false
property alias actionIndicator: actionIndicator property alias actionIndicator: actionIndicator
property alias actionIndicatorVisible: actionIndicator.visible property alias actionIndicatorVisible: actionIndicator.visible
property real __actionIndicatorWidth: StudioTheme.Values.squareComponentWidth property real __actionIndicatorWidth: StudioTheme.Values.actionIndicatorWidth
property real __actionIndicatorHeight: StudioTheme.Values.height property real __actionIndicatorHeight: StudioTheme.Values.actionIndicatorHeight
ActionIndicator { ActionIndicator {
id: actionIndicator id: actionIndicator
myControl: myButtonRow myControl: myButtonRow
x: 0 x: 0
y: 0 y: 0
width: actionIndicator.visible ? __actionIndicatorWidth : 0 // + StudioTheme.Values.border on width because of negative spacing on the row
height: actionIndicator.visible ? __actionIndicatorHeight : 0 width: actionIndicator.visible ? myButtonRow.__actionIndicatorWidth + StudioTheme.Values.border : 0
height: actionIndicator.visible ? myButtonRow.__actionIndicatorHeight : 0
} }
spacing: -StudioTheme.Values.border spacing: -StudioTheme.Values.border
function hoverCallback() {
var hover = false
for (var i = 0; i < children.length; ++i) {
if (children[i].hovered !== undefined)
hover = hover || children[i].hovered
}
myButtonRow.childHover = hover
}
onHoverChanged: {
for (var i = 0; i < children.length; ++i)
if (children[i].globalHover !== undefined)
children[i].globalHover = myButtonRow.hover
}
} }

90
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioControls/CheckBox.qml
View File

@@ -1,6 +1,6 @@
/**************************************************************************** /****************************************************************************
** **
** Copyright (C) 2019 The Qt Company Ltd. ** Copyright (C) 2021 The Qt Company Ltd.
** Contact: https://www.qt.io/licensing/ ** Contact: https://www.qt.io/licensing/
** **
** This file is part of Qt Creator. ** This file is part of Qt Creator.
@@ -32,23 +32,22 @@ T.CheckBox {
property alias actionIndicator: actionIndicator property alias actionIndicator: actionIndicator
// This property is used to indicate the global hover state
property bool hover: myCheckBox.hovered property bool hover: myCheckBox.hovered
property bool edit: false property bool edit: false
property alias actionIndicatorVisible: actionIndicator.visible property alias actionIndicatorVisible: actionIndicator.visible
property real __actionIndicatorWidth: StudioTheme.Values.squareComponentWidth property real __actionIndicatorWidth: StudioTheme.Values.actionIndicatorWidth
property real __actionIndicatorHeight: StudioTheme.Values.height property real __actionIndicatorHeight: StudioTheme.Values.actionIndicatorHeight
property alias labelVisible: checkBoxLabel.visible property alias labelVisible: checkBoxLabel.visible
property alias labelColor: checkBoxLabel.color property alias labelColor: checkBoxLabel.color
font.pixelSize: StudioTheme.Values.myFontSize font.pixelSize: StudioTheme.Values.myFontSize
implicitWidth: Math.max( implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset,
implicitBackgroundWidth + leftInset + rightInset,
implicitContentWidth + leftPadding + rightPadding) implicitContentWidth + leftPadding + rightPadding)
implicitHeight: Math.max( implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset,
implicitBackgroundHeight + topInset + bottomInset,
implicitContentHeight + topPadding + bottomPadding, implicitContentHeight + topPadding + bottomPadding,
implicitIndicatorHeight + topPadding + bottomPadding) implicitIndicatorHeight + topPadding + bottomPadding)
@@ -58,15 +57,14 @@ T.CheckBox {
ActionIndicator { ActionIndicator {
id: actionIndicator id: actionIndicator
myControl: myCheckBox // TODO global hover issue. Can be solved with extra property in ActionIndicator myControl: myCheckBox
width: actionIndicator.visible ? __actionIndicatorWidth : 0 width: actionIndicator.visible ? myCheckBox.__actionIndicatorWidth : 0
height: actionIndicator.visible ? __actionIndicatorHeight : 0 height: actionIndicator.visible ? myCheckBox.__actionIndicatorHeight : 0
} }
indicator: Rectangle { indicator: Rectangle {
id: checkBoxBackground id: checkBoxBackground
x: actionIndicator.x + actionIndicator.width x: actionIndicator.width
- (actionIndicator.visible ? StudioTheme.Values.border : 0)
y: 0 y: 0
z: 5 z: 5
implicitWidth: StudioTheme.Values.height implicitWidth: StudioTheme.Values.height
@@ -112,33 +110,75 @@ T.CheckBox {
states: [ states: [
State { State {
name: "default" name: "default"
when: myCheckBox.enabled && !myCheckBox.hovered when: myCheckBox.enabled && !myCheckBox.hover
&& !myCheckBox.pressed && !myCheckBox.pressed && !actionIndicator.hover
PropertyChanges { PropertyChanges {
target: checkBoxBackground target: checkBoxBackground
color: StudioTheme.Values.themeControlBackground color: StudioTheme.Values.themeControlBackground
border.color: StudioTheme.Values.themeControlOutline
}
PropertyChanges {
target: checkedIcon
color: StudioTheme.Values.themeIconColor
}
PropertyChanges {
target: partiallyCheckedIcon
color: StudioTheme.Values.themeIconColor
} }
}, },
State { State {
name: "hovered" name: "globalHover"
when: myCheckBox.hovered && !myCheckBox.pressed when: actionIndicator.hover && myCheckBox.hover && !myCheckBox.pressed
&& !actionIndicator.hover
PropertyChanges { PropertyChanges {
target: checkBoxBackground target: checkBoxBackground
color: StudioTheme.Values.themeHoverHighlight color: StudioTheme.Values.themeControlBackgroundGlobalHover
border.color: StudioTheme.Values.themeControlOutline
}
PropertyChanges {
target: checkedIcon
color: StudioTheme.Values.themeIconColor
}
PropertyChanges {
target: partiallyCheckedIcon
color: StudioTheme.Values.themeIconColor
} }
}, },
State { State {
name: "pressed" name: "hover"
when: myCheckBox.hovered && myCheckBox.pressed when: myCheckBox.hover && !actionIndicator.hover && !myCheckBox.pressed
PropertyChanges { PropertyChanges {
target: checkBoxBackground target: checkBoxBackground
color: StudioTheme.Values.themeFocusEdit color: StudioTheme.Values.themeControlBackgroundHover
border.color: StudioTheme.Values.themeInteraction border.color: StudioTheme.Values.themeControlOutline
}
PropertyChanges {
target: checkedIcon
color: StudioTheme.Values.themeIconColor // TODO naming
}
PropertyChanges {
target: partiallyCheckedIcon
color: StudioTheme.Values.themeIconColor
} }
}, },
State { State {
name: "disabled" name: "press"
when: myCheckBox.hover && myCheckBox.pressed
PropertyChanges {
target: checkBoxBackground
color: StudioTheme.Values.themeControlBackgroundInteraction
border.color: StudioTheme.Values.themeControlOutlineInteraction
}
PropertyChanges {
target: checkedIcon
color: StudioTheme.Values.themeIconColorInteraction
}
PropertyChanges {
target: partiallyCheckedIcon
color: StudioTheme.Values.themeIconColorInteraction
}
},
State {
name: "disable"
when: !myCheckBox.enabled when: !myCheckBox.enabled
PropertyChanges { PropertyChanges {
target: checkBoxBackground target: checkBoxBackground
@@ -147,11 +187,11 @@ T.CheckBox {
} }
PropertyChanges { PropertyChanges {
target: checkedIcon target: checkedIcon
color: StudioTheme.Values.themeTextColorDisabled color: StudioTheme.Values.themeIconColorDisabled
} }
PropertyChanges { PropertyChanges {
target: partiallyCheckedIcon target: partiallyCheckedIcon
color: StudioTheme.Values.themeTextColorDisabled color: StudioTheme.Values.themeIconColorDisabled
} }
PropertyChanges { PropertyChanges {
target: checkBoxLabel target: checkBoxLabel

88
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioControls/CheckIndicator.qml
View File

@@ -1,6 +1,6 @@
/**************************************************************************** /****************************************************************************
** **
** Copyright (C) 2019 The Qt Company Ltd. ** Copyright (C) 2021 The Qt Company Ltd.
** Contact: https://www.qt.io/licensing/ ** Contact: https://www.qt.io/licensing/
** **
** This file is part of Qt Creator. ** This file is part of Qt Creator.
@@ -33,27 +33,33 @@ Rectangle {
property T.Control myControl property T.Control myControl
property T.Popup myPopup property T.Popup myPopup
property bool hover: false property bool hover: checkIndicatorMouseArea.containsMouse
property bool pressed: checkIndicatorMouseArea.containsPress
property bool checked: false property bool checked: false
color: StudioTheme.Values.themeControlBackground color: StudioTheme.Values.themeControlBackground
border.color: StudioTheme.Values.themeControlOutline border.width: 0
state: "default"
Connections { Connections {
target: myPopup target: myPopup
onClosed: checkIndicator.checked = false function onClosed() { checkIndicator.checked = false }
onOpened: checkIndicator.checked = true function onOpened() { checkIndicator.checked = true }
} }
MouseArea { MouseArea {
id: checkIndicatorMouseArea id: checkIndicatorMouseArea
anchors.fill: parent anchors.fill: parent
hoverEnabled: true hoverEnabled: true
onContainsMouseChanged: checkIndicator.hover = checkIndicatorMouseArea.containsMouse
onPressed: { onPressed: {
myControl.forceActiveFocus() // TODO if (myPopup.opened) {
myPopup.opened ? myPopup.close() : myPopup.open() myPopup.close()
} else {
myPopup.open()
myPopup.forceActiveFocus()
}
if (myControl.activeFocus)
myControl.focus = false
} }
} }
@@ -71,63 +77,87 @@ Rectangle {
states: [ states: [
State { State {
name: "default" name: "default"
when: myControl.enabled && !(checkIndicator.hover when: myControl.enabled && checkIndicator.enabled && !myControl.edit
|| myControl.hover) && !checkIndicator.hover && !myControl.hover && !myControl.drag
&& !checkIndicator.checked && !myControl.edit && !checkIndicator.checked
&& !myControl.drag
PropertyChanges { PropertyChanges {
target: checkIndicator target: checkIndicator
color: StudioTheme.Values.themeControlBackground color: StudioTheme.Values.themeControlBackground
border.color: StudioTheme.Values.themeControlOutline
} }
}, },
State { State {
name: "hovered" name: "globalHover"
when: (checkIndicator.hover || myControl.hover) when: myControl.enabled && checkIndicator.enabled && !myControl.drag
&& !checkIndicator.checked && !myControl.edit && !checkIndicator.hover && myControl.hover && !myControl.edit
&& !myControl.drag && !checkIndicator.checked
PropertyChanges { PropertyChanges {
target: checkIndicator target: checkIndicator
color: StudioTheme.Values.themeHoverHighlight color: StudioTheme.Values.themeControlBackgroundGlobalHover
border.color: StudioTheme.Values.themeControlOutline
} }
}, },
State { State {
name: "checked" name: "hover"
when: myControl.enabled && checkIndicator.enabled && !myControl.drag
&& checkIndicator.hover && myControl.hover && !checkIndicator.pressed
&& !checkIndicator.checked
PropertyChanges {
target: checkIndicator
color: StudioTheme.Values.themeControlBackgroundHover
}
},
State {
name: "check"
when: checkIndicator.checked when: checkIndicator.checked
PropertyChanges {
target: checkIndicatorIcon
color: StudioTheme.Values.themeIconColorInteraction
}
PropertyChanges { PropertyChanges {
target: checkIndicator target: checkIndicator
color: StudioTheme.Values.themeInteraction color: StudioTheme.Values.themeInteraction
border.color: StudioTheme.Values.themeInteraction
} }
}, },
State { State {
name: "edit" name: "edit"
when: myControl.edit && !checkIndicator.checked when: myControl.edit && !checkIndicator.checked
&& !(checkIndicator.hover && myControl.hover) && !(checkIndicator.hover && myControl.hover)
PropertyChanges {
target: checkIndicatorIcon
color: StudioTheme.Values.themeTextColor
}
PropertyChanges { PropertyChanges {
target: checkIndicator target: checkIndicator
color: StudioTheme.Values.themeFocusEdit color: StudioTheme.Values.themeControlBackground
border.color: StudioTheme.Values.themeInteraction }
},
State {
name: "press"
when: myControl.enabled && checkIndicator.enabled && !myControl.drag
&& checkIndicator.pressed
PropertyChanges {
target: checkIndicatorIcon
color: StudioTheme.Values.themeIconColorInteraction
}
PropertyChanges {
target: checkIndicator
color: StudioTheme.Values.themeInteraction
} }
}, },
State { State {
name: "drag" name: "drag"
when: myControl.drag && !checkIndicator.checked when: (myControl.drag !== undefined && myControl.drag) && !checkIndicator.checked
&& !(checkIndicator.hover && myControl.hover) && !(checkIndicator.hover && myControl.hover)
PropertyChanges { PropertyChanges {
target: checkIndicator target: checkIndicator
color: StudioTheme.Values.themeFocusDrag color: StudioTheme.Values.themeControlBackgroundInteraction
border.color: StudioTheme.Values.themeInteraction
} }
}, },
State { State {
name: "disabled" name: "disable"
when: !myControl.enabled when: !myControl.enabled
PropertyChanges { PropertyChanges {
target: checkIndicator target: checkIndicator
color: StudioTheme.Values.themeControlBackgroundDisabled color: StudioTheme.Values.themeControlBackgroundDisabled
border.color: StudioTheme.Values.themeControlOutlineDisabled
} }
PropertyChanges { PropertyChanges {
target: checkIndicatorIcon target: checkIndicatorIcon

81
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioControls/ComboBox.qml
View File

@@ -1,8 +1,6 @@
/**************************************************************************** /****************************************************************************
** **
** Copyright (C) 2019 The Qt Company Ltd. ** Copyright (C) 2021 The Qt Company Ltd.
** Contact: https://www.qt.io/licensing/ ** Contact: https://www.qt.io/licensing/
** **
** This file is part of Qt Creator. ** This file is part of Qt Creator.
@@ -35,14 +33,16 @@ T.ComboBox {
property alias actionIndicator: actionIndicator property alias actionIndicator: actionIndicator
property alias labelColor: comboBoxInput.color property alias labelColor: comboBoxInput.color
property bool hover: false // This property is used to indicate the global hover state // This property is used to indicate the global hover state
property bool edit: myComboBox.activeFocus property bool hover: comboBoxInput.hover || actionIndicator.hover || popupIndicator.hover
property bool edit: myComboBox.activeFocus && myComboBox.editable
property bool open: comboBoxPopup.opened
property bool dirty: false // user modification flag property bool dirty: false // user modification flag
property alias actionIndicatorVisible: actionIndicator.visible property alias actionIndicatorVisible: actionIndicator.visible
property real __actionIndicatorWidth: StudioTheme.Values.squareComponentWidth property real __actionIndicatorWidth: StudioTheme.Values.actionIndicatorWidth
property real __actionIndicatorHeight: StudioTheme.Values.height property real __actionIndicatorHeight: StudioTheme.Values.actionIndicatorHeight
property alias textInput: comboBoxInput property alias textInput: comboBoxInput
@@ -50,12 +50,11 @@ T.ComboBox {
enum ActivatedReason { EditingFinished, Other } enum ActivatedReason { EditingFinished, Other }
width: StudioTheme.Values.squareComponentWidth * 5 width: StudioTheme.Values.defaultControlWidth
height: StudioTheme.Values.height height: StudioTheme.Values.defaultControlHeight
leftPadding: actionIndicator.width leftPadding: actionIndicator.width
- (myComboBox.actionIndicatorVisible ? StudioTheme.Values.border : 0) rightPadding: popupIndicator.width + StudioTheme.Values.border
rightPadding: popupIndicator.width - StudioTheme.Values.border
font.pixelSize: StudioTheme.Values.myFontSize font.pixelSize: StudioTheme.Values.myFontSize
wheelEnabled: false wheelEnabled: false
@@ -94,19 +93,18 @@ T.ComboBox {
id: popupIndicator id: popupIndicator
myControl: myComboBox myControl: myComboBox
myPopup: myComboBox.popup myPopup: myComboBox.popup
x: comboBoxInput.x + comboBoxInput.width - StudioTheme.Values.border x: comboBoxInput.x + comboBoxInput.width
y: 0 y: StudioTheme.Values.border
width: StudioTheme.Values.squareComponentWidth width: StudioTheme.Values.checkIndicatorWidth - StudioTheme.Values.border
height: StudioTheme.Values.height height: StudioTheme.Values.checkIndicatorHeight - (StudioTheme.Values.border * 2)
} }
background: Rectangle { background: Rectangle {
id: comboBoxBackground id: comboBoxBackground
color: StudioTheme.Values.themeControlOutline color: StudioTheme.Values.themeControlBackground
border.color: StudioTheme.Values.themeControlOutline border.color: StudioTheme.Values.themeControlOutline
border.width: StudioTheme.Values.border border.width: StudioTheme.Values.border
x: actionIndicator.width x: actionIndicator.width
- (myComboBox.actionIndicatorVisible ? StudioTheme.Values.border : 0)
width: myComboBox.width - actionIndicator.width width: myComboBox.width - actionIndicator.width
height: myComboBox.height height: myComboBox.height
} }
@@ -138,7 +136,8 @@ T.ComboBox {
contentItem: Text { contentItem: Text {
leftPadding: itemDelegateIconArea.width leftPadding: itemDelegateIconArea.width
text: myComboBox.textRole ? (Array.isArray(myComboBox.model) ? modelData[myComboBox.textRole] : model[myComboBox.textRole]) : modelData text: myComboBox.textRole ? (Array.isArray(myComboBox.model) ? modelData[myComboBox.textRole] : model[myComboBox.textRole]) : modelData
color: StudioTheme.Values.themeTextColor color: myItemDelegate.highlighted ? StudioTheme.Values.themeTextSelectedTextColor
: StudioTheme.Values.themeTextColor
font: myComboBox.font font: myComboBox.font
elide: Text.ElideRight elide: Text.ElideRight
verticalAlignment: Text.AlignVCenter verticalAlignment: Text.AlignVCenter
@@ -152,7 +151,8 @@ T.ComboBox {
T.Label { T.Label {
id: itemDelegateIcon id: itemDelegateIcon
text: StudioTheme.Constants.tickIcon text: StudioTheme.Constants.tickIcon
color: myItemDelegate.highlighted ? StudioTheme.Values.themeTextColor : StudioTheme.Values.themeInteraction color: myItemDelegate.highlighted ? StudioTheme.Values.themeTextSelectedTextColor
: StudioTheme.Values.themeTextColor
font.family: StudioTheme.Constants.iconFont.family font.family: StudioTheme.Constants.iconFont.family
font.pixelSize: StudioTheme.Values.spinControlIconSizeMulti font.pixelSize: StudioTheme.Values.spinControlIconSizeMulti
visible: myComboBox.currentIndex === index ? true : false visible: myComboBox.currentIndex === index ? true : false
@@ -177,9 +177,9 @@ T.ComboBox {
popup: T.Popup { popup: T.Popup {
id: comboBoxPopup id: comboBoxPopup
x: comboBoxInput.x x: actionIndicator.width + StudioTheme.Values.border
y: myComboBox.height - StudioTheme.Values.border y: myComboBox.height
width: comboBoxInput.width + popupIndicator.width - StudioTheme.Values.border width: myComboBox.width - actionIndicator.width - (StudioTheme.Values.border * 2)
// TODO Setting the height on the popup solved the problem with the popup of height 0, // TODO Setting the height on the popup solved the problem with the popup of height 0,
// but it has the problem that it sometimes extend over the border of the actual window // but it has the problem that it sometimes extend over the border of the actual window
// and is then cut off. // and is then cut off.
@@ -205,9 +205,8 @@ T.ComboBox {
} }
background: Rectangle { background: Rectangle {
color: StudioTheme.Values.themeControlBackground color: StudioTheme.Values.themePopupBackground
border.color: StudioTheme.Values.themeInteraction border.width: 0
border.width: StudioTheme.Values.border
} }
enter: Transition { enter: Transition {
@@ -219,7 +218,8 @@ T.ComboBox {
states: [ states: [
State { State {
name: "default" name: "default"
when: !myComboBox.hover && !myComboBox.edit when: myComboBox.enabled && !myComboBox.hover && !myComboBox.edit && !myComboBox.open
&& !myComboBox.activeFocus
PropertyChanges { PropertyChanges {
target: myComboBox target: myComboBox
wheelEnabled: false wheelEnabled: false
@@ -230,13 +230,16 @@ T.ComboBox {
} }
PropertyChanges { PropertyChanges {
target: comboBoxBackground target: comboBoxBackground
color: StudioTheme.Values.themeControlOutline color: StudioTheme.Values.themeControlBackground
border.color: StudioTheme.Values.themeControlOutline border.color: StudioTheme.Values.themeControlOutline
} }
}, },
// This state is intended for ComboBoxes which aren't editable, but have focus e.g. via
// tab focus. It is therefor possible to use the mouse wheel to scroll through the items.
State { State {
name: "focus" name: "focus"
when: myComboBox.edit && !myComboBox.editable when: myComboBox.enabled && myComboBox.activeFocus && !myComboBox.editable
&& !myComboBox.open
PropertyChanges { PropertyChanges {
target: myComboBox target: myComboBox
wheelEnabled: true wheelEnabled: true
@@ -248,7 +251,7 @@ T.ComboBox {
}, },
State { State {
name: "edit" name: "edit"
when: myComboBox.edit && myComboBox.editable && !comboBoxPopup.opened when: myComboBox.enabled && myComboBox.edit && myComboBox.editable && !myComboBox.open
PropertyChanges { PropertyChanges {
target: myComboBox target: myComboBox
wheelEnabled: true wheelEnabled: true
@@ -260,8 +263,8 @@ T.ComboBox {
} }
PropertyChanges { PropertyChanges {
target: comboBoxBackground target: comboBoxBackground
color: StudioTheme.Values.themeInteraction color: StudioTheme.Values.themeControlBackgroundInteraction
border.color: StudioTheme.Values.themeInteraction border.color: StudioTheme.Values.themeControlOutline
} }
StateChangeScript { StateChangeScript {
script: comboBoxPopup.close() script: comboBoxPopup.close()
@@ -269,7 +272,7 @@ T.ComboBox {
}, },
State { State {
name: "popup" name: "popup"
when: myComboBox.edit && comboBoxPopup.opened when: myComboBox.enabled && myComboBox.open
PropertyChanges { PropertyChanges {
target: myComboBox target: myComboBox
wheelEnabled: true wheelEnabled: true
@@ -279,6 +282,20 @@ T.ComboBox {
selectByMouse: false selectByMouse: false
readOnly: true readOnly: true
} }
PropertyChanges {
target: comboBoxBackground
color: StudioTheme.Values.themeControlBackgroundInteraction
border.color: StudioTheme.Values.themeControlOutlineInteraction
}
},
State {
name: "disable"
when: !myComboBox.enabled
PropertyChanges {
target: comboBoxBackground
color: StudioTheme.Values.themeControlBackgroundDisabled
border.color: StudioTheme.Values.themeControlOutlineDisabled
}
} }
] ]

67
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioControls/ComboBoxInput.qml
View File

@@ -1,6 +1,6 @@
/**************************************************************************** /****************************************************************************
** **
** Copyright (C) 2019 The Qt Company Ltd. ** Copyright (C) 2021 The Qt Company Ltd.
** Contact: https://www.qt.io/licensing/ ** Contact: https://www.qt.io/licensing/
** **
** This file is part of Qt Creator. ** This file is part of Qt Creator.
@@ -33,7 +33,7 @@ TextInput {
property T.Control myControl property T.Control myControl
property bool edit: textInput.activeFocus property bool edit: textInput.activeFocus
property bool drag: false property bool hover: mouseArea.containsMouse
z: 2 z: 2
font: myControl.font font: myControl.font
@@ -54,15 +54,14 @@ TextInput {
clip: true clip: true
Rectangle { Rectangle {
id: textInputArea id: textInputBackground
x: 0 x: StudioTheme.Values.border
y: 0 y: StudioTheme.Values.border
z: -1 z: -1
width: textInput.width width: textInput.width
height: StudioTheme.Values.height height: StudioTheme.Values.height - (StudioTheme.Values.border * 2)
color: StudioTheme.Values.themeControlBackground color: StudioTheme.Values.themeControlBackground
border.color: StudioTheme.Values.themeControlOutline border.width: 0
border.width: StudioTheme.Values.border
} }
TapHandler { TapHandler {
@@ -73,6 +72,7 @@ TextInput {
if (textInput.readOnly) { if (textInput.readOnly) {
if (myControl.popup.opened) { if (myControl.popup.opened) {
myControl.popup.close() myControl.popup.close()
myControl.focus = false
} else { } else {
myControl.forceActiveFocus() myControl.forceActiveFocus()
myControl.popup.open() myControl.popup.open()
@@ -91,20 +91,17 @@ TextInput {
propagateComposedEvents: true propagateComposedEvents: true
acceptedButtons: Qt.LeftButton acceptedButtons: Qt.LeftButton
cursorShape: Qt.PointingHandCursor cursorShape: Qt.PointingHandCursor
// Sets the global hover
onContainsMouseChanged: myControl.hover = containsMouse
onPressed: mouse.accepted = false onPressed: mouse.accepted = false
} }
states: [ states: [
State { State {
name: "default" name: "default"
when: myControl.enabled && !textInput.edit when: myControl.enabled && !textInput.edit && !textInput.hover && !myControl.hover
&& !mouseArea.containsMouse && !myControl.drag && !myControl.open
PropertyChanges { PropertyChanges {
target: textInputArea target: textInputBackground
color: StudioTheme.Values.themeControlBackground color: StudioTheme.Values.themeControlBackground
border.color: StudioTheme.Values.themeControlOutline
} }
PropertyChanges { PropertyChanges {
target: tapHandler target: tapHandler
@@ -116,27 +113,38 @@ TextInput {
} }
}, },
State { State {
name: "hovered" name: "globalHover"
when: myControl.hover && !textInput.edit && !myControl.drag when: myControl.hover && !textInput.hover && !textInput.edit && !myControl.open
PropertyChanges { PropertyChanges {
target: textInputArea target: textInputBackground
color: StudioTheme.Values.themeHoverHighlight color: StudioTheme.Values.themeControlBackgroundGlobalHover
border.color: StudioTheme.Values.themeControlOutline
} }
}, },
State {
name: "hover"
when: textInput.hover && myControl.hover && !textInput.edit
PropertyChanges {
target: textInputBackground
color: StudioTheme.Values.themeControlBackgroundHover
}
},
// This state is intended for ComboBoxes which aren't editable, but have focus e.g. via
// tab focus. It is therefor possible to use the mouse wheel to scroll through the items.
State { State {
name: "focus" name: "focus"
when: textInput.edit && !myControl.editable when: textInput.edit && !myControl.editable
PropertyChanges { PropertyChanges {
target: textInputArea target: textInputBackground
color: StudioTheme.Values.themeFocusEdit color: StudioTheme.Values.themeControlBackgroundInteraction
border.color: StudioTheme.Values.themeInteraction
} }
}, },
State { State {
name: "edit" name: "edit"
when: textInput.edit && myControl.editable when: textInput.edit && myControl.editable
extend: "focus" PropertyChanges {
target: textInputBackground
color: StudioTheme.Values.themeControlBackgroundInteraction
}
PropertyChanges { PropertyChanges {
target: tapHandler target: tapHandler
enabled: false enabled: false
@@ -147,12 +155,19 @@ TextInput {
} }
}, },
State { State {
name: "disabled" name: "popup"
when: myControl.open
PropertyChanges {
target: textInputBackground
color: StudioTheme.Values.themeControlBackgroundHover
}
},
State {
name: "disable"
when: !myControl.enabled when: !myControl.enabled
PropertyChanges { PropertyChanges {
target: textInputArea target: textInputBackground
color: StudioTheme.Values.themeControlBackgroundDisabled color: StudioTheme.Values.themeControlBackgroundDisabled
border.color: StudioTheme.Values.themeControlOutlineDisabled
} }
PropertyChanges { PropertyChanges {
target: textInput target: textInput

2
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioControls/ContextMenu.qml
View File

@@ -1,6 +1,6 @@
/**************************************************************************** /****************************************************************************
** **
** Copyright (C) 2019 The Qt Company Ltd. ** Copyright (C) 2021 The Qt Company Ltd.
** Contact: https://www.qt.io/licensing/ ** Contact: https://www.qt.io/licensing/
** **
** This file is part of Qt Creator. ** This file is part of Qt Creator.

2
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioControls/ExpandingSpacer.qml
View File

@@ -1,6 +1,6 @@
/**************************************************************************** /****************************************************************************
** **
** Copyright (C) 2019 The Qt Company Ltd. ** Copyright (C) 2021 The Qt Company Ltd.
** Contact: https://www.qt.io/licensing/ ** Contact: https://www.qt.io/licensing/
** **
** This file is part of Qt Creator. ** This file is part of Qt Creator.

2
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioControls/ItemDelegate.qml
View File

@@ -1,6 +1,6 @@
/**************************************************************************** /****************************************************************************
** **
** Copyright (C) 2019 The Qt Company Ltd. ** Copyright (C) 2021 The Qt Company Ltd.
** Contact: https://www.qt.io/licensing/ ** Contact: https://www.qt.io/licensing/
** **
** This file is part of Qt Creator. ** This file is part of Qt Creator.

5
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioControls/Menu.qml
View File

@@ -1,8 +1,6 @@
/**************************************************************************** /****************************************************************************
** **
** Copyright (C) 2019 The Qt Company Ltd. ** Copyright (C) 2021 The Qt Company Ltd.
** Contact: https://www.qt.io/licensing/ ** Contact: https://www.qt.io/licensing/
** **
** This file is part of Qt Creator. ** This file is part of Qt Creator.
@@ -24,6 +22,7 @@
** be met: https://www.gnu.org/licenses/gpl-3.0.html. ** be met: https://www.gnu.org/licenses/gpl-3.0.html.
** **
****************************************************************************/ ****************************************************************************/
import QtQuick 2.12 import QtQuick 2.12
import QtQuick.Window 2.12 import QtQuick.Window 2.12
import QtQuick.Templates 2.12 as T import QtQuick.Templates 2.12 as T

12
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioControls/MenuItem.qml
View File

@@ -1,6 +1,6 @@
/**************************************************************************** /****************************************************************************
** **
** Copyright (C) 2019 The Qt Company Ltd. ** Copyright (C) 2021 The Qt Company Ltd.
** Contact: https://www.qt.io/licensing/ ** Contact: https://www.qt.io/licensing/
** **
** This file is part of Qt Creator. ** This file is part of Qt Creator.
@@ -35,8 +35,7 @@ T.MenuItem {
implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset, implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset,
implicitContentWidth + leftPadding + rightPadding) implicitContentWidth + leftPadding + rightPadding)
implicitHeight: Math.max( implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset,
implicitBackgroundHeight + topInset + bottomInset,
implicitContentHeight + topPadding + bottomPadding, implicitContentHeight + topPadding + bottomPadding,
implicitIndicatorHeight + topPadding + bottomPadding) implicitIndicatorHeight + topPadding + bottomPadding)
@@ -50,7 +49,8 @@ T.MenuItem {
id: textLabel id: textLabel
text: control.text text: control.text
font: control.font font: control.font
color: control.enabled ? StudioTheme.Values.themeTextColor : StudioTheme.Values.themeTextColorDisabled color: control.enabled ? StudioTheme.Values.themeTextColor
: StudioTheme.Values.themeTextColorDisabled
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
} }
@@ -78,6 +78,8 @@ T.MenuItem {
y: StudioTheme.Values.border y: StudioTheme.Values.border
width: control.menu.width - (StudioTheme.Values.border * 2) width: control.menu.width - (StudioTheme.Values.border * 2)
height: control.height - (StudioTheme.Values.border * 2) height: control.height - (StudioTheme.Values.border * 2)
color: control.down ? control.palette.midlight : control.highlighted ? StudioTheme.Values.themeInteraction : "transparent" color: control.down ? control.palette.midlight
: control.highlighted ? StudioTheme.Values.themeInteraction
: "transparent"
} }
} }

79
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioControls/MenuItemWithIcon.qml Normal file
View File

@@ -0,0 +1,79 @@
/****************************************************************************
**
** Copyright (C) 2021 The Qt Company Ltd.
** Contact: https://www.qt.io/licensing/
**
** This file is part of Qt Creator.
**
** Commercial License Usage
** Licensees holding valid commercial Qt licenses may use this file in
** accordance with the commercial license agreement provided with the
** Software or, alternatively, in accordance with the terms contained in
** a written agreement between you and The Qt Company. For licensing terms
** and conditions see https://www.qt.io/terms-conditions. For further
** information use the contact form at https://www.qt.io/contact-us.
**
** GNU General Public License Usage
** Alternatively, this file may be used under the terms of the GNU
** General Public License version 3 as published by the Free Software
** Foundation with exceptions as appearing in the file LICENSE.GPL3-EXCEPT
** included in the packaging of this file. Please review the following
** information to ensure the GNU General Public License requirements will
** be met: https://www.gnu.org/licenses/gpl-3.0.html.
**
****************************************************************************/
import QtQuick 2.12
import QtQuick.Templates 2.12 as T
import StudioTheme 1.0 as StudioTheme
import QtQuick.Controls 2.12
T.MenuItem {
id: control
property int labelSpacing: StudioTheme.Values.contextMenuLabelSpacing
implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset,
implicitContentWidth + leftPadding + rightPadding)
implicitHeight: Math.max(
implicitBackgroundHeight + topInset + bottomInset,
implicitContentHeight + topPadding + bottomPadding,
implicitIndicatorHeight + topPadding + bottomPadding)
padding: 0
spacing: 0
horizontalPadding: StudioTheme.Values.contextMenuHorizontalPadding
action: Action {}
contentItem: Item {
Text {
id: iconLabel
text: control.checked ? StudioTheme.Constants.tickIcon : ""
visible: true
color: control.enabled ? StudioTheme.Values.themeTextColor : StudioTheme.Values.themeTextColorDisabled
font.family: StudioTheme.Constants.iconFont.family
font.pixelSize: StudioTheme.Values.myIconFontSize
anchors.verticalCenter: parent.verticalCenter
}
Text {
id: textLabel
x: StudioTheme.Values.height
text: control.text
font: control.font
color: control.enabled ? StudioTheme.Values.themeTextColor : StudioTheme.Values.themeTextColorDisabled
anchors.verticalCenter: parent.verticalCenter
}
}
background: Rectangle {
implicitWidth: iconLabel.implicitWidth + textLabel.implicitWidth + control.labelSpacing
+ control.leftPadding + control.rightPadding
implicitHeight: StudioTheme.Values.height
x: StudioTheme.Values.border
y: StudioTheme.Values.border
width: control.menu.width - (StudioTheme.Values.border * 2)
height: control.height - (StudioTheme.Values.border * 2)
color: control.down ? control.palette.midlight : control.highlighted ? StudioTheme.Values.themeInteraction : "transparent"
}
}

2
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioControls/MenuSeparator.qml
View File

@@ -1,6 +1,6 @@
/**************************************************************************** /****************************************************************************
** **
** Copyright (C) 2019 The Qt Company Ltd. ** Copyright (C) 2021 The Qt Company Ltd.
** Contact: https://www.qt.io/licensing/ ** Contact: https://www.qt.io/licensing/
** **
** This file is part of Qt Creator. ** This file is part of Qt Creator.

11
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioControls/RealSliderPopup.qml
View File

@@ -1,6 +1,6 @@
/**************************************************************************** /****************************************************************************
** **
** Copyright (C) 2019 The Qt Company Ltd. ** Copyright (C) 2021 The Qt Company Ltd.
** Contact: https://www.qt.io/licensing/ ** Contact: https://www.qt.io/licensing/
** **
** This file is part of Qt Creator. ** This file is part of Qt Creator.
@@ -32,14 +32,16 @@ T.Popup {
property T.Control myControl property T.Control myControl
property bool drag: slider.pressed
dim: false dim: false
closePolicy: T.Popup.CloseOnPressOutside | T.Popup.CloseOnPressOutsideParent closePolicy: T.Popup.CloseOnPressOutside | T.Popup.CloseOnPressOutsideParent
| T.Popup.CloseOnEscape | T.Popup.CloseOnReleaseOutside | T.Popup.CloseOnEscape | T.Popup.CloseOnReleaseOutside
| T.Popup.CloseOnReleaseOutsideParent | T.Popup.CloseOnReleaseOutsideParent
background: Rectangle { background: Rectangle {
color: StudioTheme.Values.themeControlBackground color: StudioTheme.Values.themePopupBackground
border.color: StudioTheme.Values.themeInteraction border.width: 0
} }
contentItem: T.Slider { contentItem: T.Slider {
@@ -63,7 +65,8 @@ T.Popup {
width: StudioTheme.Values.sliderHandleWidth width: StudioTheme.Values.sliderHandleWidth
height: StudioTheme.Values.sliderHandleHeight height: StudioTheme.Values.sliderHandleHeight
radius: 0 radius: 0
color: slider.pressed ? StudioTheme.Values.themeInteraction : StudioTheme.Values.themeControlOutline color: slider.pressed ? StudioTheme.Values.themeSliderHandleInteraction
: StudioTheme.Values.themeSliderHandle
} }
background: Rectangle { background: Rectangle {

83
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioControls/RealSpinBox.qml
View File

@@ -1,6 +1,6 @@
/**************************************************************************** /****************************************************************************
** **
** Copyright (C) 2019 The Qt Company Ltd. ** Copyright (C) 2021 The Qt Company Ltd.
** Contact: https://www.qt.io/licensing/ ** Contact: https://www.qt.io/licensing/
** **
** This file is part of Qt Creator. ** This file is part of Qt Creator.
@@ -50,8 +50,10 @@ T.SpinBox {
} }
property bool edit: spinBoxInput.activeFocus property bool edit: spinBoxInput.activeFocus
property bool hover: false // This property is used to indicate the global hover state // This property is used to indicate the global hover state
property bool hover: mySpinBox.hovered || actionIndicator.hover
property bool drag: false property bool drag: false
property bool sliderDrag: sliderPopup.drag
property bool dirty: false // user modification flag property bool dirty: false // user modification flag
@@ -59,18 +61,16 @@ T.SpinBox {
property real realDragRange: mySpinBox.realTo - mySpinBox.realFrom property real realDragRange: mySpinBox.realTo - mySpinBox.realFrom
property alias actionIndicatorVisible: actionIndicator.visible property alias actionIndicatorVisible: actionIndicator.visible
property real __actionIndicatorWidth: StudioTheme.Values.squareComponentWidth property real __actionIndicatorWidth: StudioTheme.Values.actionIndicatorWidth
property real __actionIndicatorHeight: StudioTheme.Values.height property real __actionIndicatorHeight: StudioTheme.Values.actionIndicatorHeight
property bool spinBoxIndicatorVisible: true property bool spinBoxIndicatorVisible: true
property real __spinBoxIndicatorWidth: StudioTheme.Values.smallRectWidth - 2 property real __spinBoxIndicatorWidth: StudioTheme.Values.spinBoxIndicatorWidth
* StudioTheme.Values.border property real __spinBoxIndicatorHeight: StudioTheme.Values.spinBoxIndicatorHeight
property real __spinBoxIndicatorHeight: StudioTheme.Values.height / 2
- StudioTheme.Values.border
property alias sliderIndicatorVisible: sliderIndicator.visible property alias sliderIndicatorVisible: sliderIndicator.visible
property real __sliderIndicatorWidth: StudioTheme.Values.squareComponentWidth property real __sliderIndicatorWidth: StudioTheme.Values.sliderIndicatorWidth
property real __sliderIndicatorHeight: StudioTheme.Values.height property real __sliderIndicatorHeight: StudioTheme.Values.sliderIndicatorHeight
property alias compressedValueTimer: myTimer property alias compressedValueTimer: myTimer
@@ -83,13 +83,13 @@ T.SpinBox {
// Use custom wheel handling due to bugs // Use custom wheel handling due to bugs
property bool __wheelEnabled: false property bool __wheelEnabled: false
wheelEnabled: false wheelEnabled: false
hoverEnabled: true
width: StudioTheme.Values.squareComponentWidth * 5 width: StudioTheme.Values.defaultControlWidth
height: StudioTheme.Values.height height: StudioTheme.Values.defaultControlHeight
leftPadding: spinBoxIndicatorDown.x + spinBoxIndicatorDown.width leftPadding: spinBoxIndicatorDown.x + spinBoxIndicatorDown.width
- (spinBoxIndicatorVisible ? 0 : StudioTheme.Values.border) rightPadding: sliderIndicator.width + StudioTheme.Values.border
rightPadding: sliderIndicator.width - (sliderIndicatorVisible ? StudioTheme.Values.border : 0)
font.pixelSize: StudioTheme.Values.myFontSize font.pixelSize: StudioTheme.Values.myFontSize
editable: true editable: true
@@ -113,8 +113,8 @@ T.SpinBox {
myControl: mySpinBox myControl: mySpinBox
x: 0 x: 0
y: 0 y: 0
width: actionIndicator.visible ? __actionIndicatorWidth : 0 width: actionIndicator.visible ? mySpinBox.__actionIndicatorWidth : 0
height: actionIndicator.visible ? __actionIndicatorHeight : 0 height: actionIndicator.visible ? mySpinBox.__actionIndicatorHeight : 0
} }
up.indicator: RealSpinBoxIndicator { up.indicator: RealSpinBoxIndicator {
@@ -124,12 +124,13 @@ T.SpinBox {
visible: mySpinBox.spinBoxIndicatorVisible visible: mySpinBox.spinBoxIndicatorVisible
onRealReleased: mySpinBox.realIncrease() onRealReleased: mySpinBox.realIncrease()
onRealPressAndHold: mySpinBox.realIncrease() onRealPressAndHold: mySpinBox.realIncrease()
x: actionIndicator.width + (mySpinBox.actionIndicatorVisible ? 0 : StudioTheme.Values.border) x: actionIndicator.width + StudioTheme.Values.border
y: StudioTheme.Values.border y: StudioTheme.Values.border
width: mySpinBox.spinBoxIndicatorVisible ? mySpinBox.__spinBoxIndicatorWidth : 0 width: mySpinBox.spinBoxIndicatorVisible ? mySpinBox.__spinBoxIndicatorWidth : 0
height: mySpinBox.spinBoxIndicatorVisible ? mySpinBox.__spinBoxIndicatorHeight : 0 height: mySpinBox.spinBoxIndicatorVisible ? mySpinBox.__spinBoxIndicatorHeight : 0
realEnabled: (mySpinBox.realFrom < mySpinBox.realTo) ? (mySpinBox.realValue < mySpinBox.realTo) : (mySpinBox.realValue > mySpinBox.realTo) realEnabled: (mySpinBox.realFrom < mySpinBox.realTo) ? (mySpinBox.realValue < mySpinBox.realTo)
: (mySpinBox.realValue > mySpinBox.realTo)
} }
down.indicator: RealSpinBoxIndicator { down.indicator: RealSpinBoxIndicator {
@@ -138,12 +139,13 @@ T.SpinBox {
visible: mySpinBox.spinBoxIndicatorVisible visible: mySpinBox.spinBoxIndicatorVisible
onRealReleased: mySpinBox.realDecrease() onRealReleased: mySpinBox.realDecrease()
onRealPressAndHold: mySpinBox.realDecrease() onRealPressAndHold: mySpinBox.realDecrease()
x: actionIndicator.width + (mySpinBox.actionIndicatorVisible ? 0 : StudioTheme.Values.border) x: actionIndicator.width + StudioTheme.Values.border
y: spinBoxIndicatorUp.y + spinBoxIndicatorUp.height y: spinBoxIndicatorUp.y + spinBoxIndicatorUp.height
width: mySpinBox.spinBoxIndicatorVisible ? mySpinBox.__spinBoxIndicatorWidth : 0 width: mySpinBox.spinBoxIndicatorVisible ? mySpinBox.__spinBoxIndicatorWidth : 0
height: mySpinBox.spinBoxIndicatorVisible ? mySpinBox.__spinBoxIndicatorHeight : 0 height: mySpinBox.spinBoxIndicatorVisible ? mySpinBox.__spinBoxIndicatorHeight : 0
realEnabled: (mySpinBox.realFrom < mySpinBox.realTo) ? (mySpinBox.realValue > mySpinBox.realFrom) : (mySpinBox.realValue < mySpinBox.realFrom) realEnabled: (mySpinBox.realFrom < mySpinBox.realTo) ? (mySpinBox.realValue > mySpinBox.realFrom)
: (mySpinBox.realValue < mySpinBox.realFrom)
} }
contentItem: RealSpinBoxInput { contentItem: RealSpinBoxInput {
@@ -173,7 +175,7 @@ T.SpinBox {
color: StudioTheme.Values.themeControlOutline color: StudioTheme.Values.themeControlOutline
border.color: StudioTheme.Values.themeControlOutline border.color: StudioTheme.Values.themeControlOutline
border.width: StudioTheme.Values.border border.width: StudioTheme.Values.border
x: actionIndicator.width - (mySpinBox.actionIndicatorVisible ? StudioTheme.Values.border : 0) x: actionIndicator.width
width: mySpinBox.width - actionIndicator.width width: mySpinBox.width - actionIndicator.width
height: mySpinBox.height height: mySpinBox.height
} }
@@ -182,18 +184,19 @@ T.SpinBox {
id: sliderIndicator id: sliderIndicator
myControl: mySpinBox myControl: mySpinBox
myPopup: sliderPopup myPopup: sliderPopup
x: spinBoxInput.x + spinBoxInput.width - StudioTheme.Values.border x: spinBoxInput.x + spinBoxInput.width
width: sliderIndicator.visible ? mySpinBox.__sliderIndicatorWidth : 0 y: StudioTheme.Values.border
height: sliderIndicator.visible ? mySpinBox.__sliderIndicatorHeight : 0 width: sliderIndicator.visible ? mySpinBox.__sliderIndicatorWidth - StudioTheme.Values.border : 0
height: sliderIndicator.visible ? mySpinBox.__sliderIndicatorHeight - (StudioTheme.Values.border * 2) : 0
visible: false // reasonable default visible: false // reasonable default
} }
RealSliderPopup { RealSliderPopup {
id: sliderPopup id: sliderPopup
myControl: mySpinBox myControl: mySpinBox
x: spinBoxInput.x x: actionIndicator.width + StudioTheme.Values.border
y: StudioTheme.Values.height - StudioTheme.Values.border y: StudioTheme.Values.height
width: spinBoxInput.width + sliderIndicator.width - StudioTheme.Values.border width: mySpinBox.width - actionIndicator.width - (StudioTheme.Values.border * 2)
height: StudioTheme.Values.sliderHeight height: StudioTheme.Values.sliderHeight
enter: Transition { enter: Transition {
@@ -203,6 +206,7 @@ T.SpinBox {
} }
textFromValue: function (value, locale) { textFromValue: function (value, locale) {
locale.numberOptions = Locale.OmitGroupSeparator
return Number(mySpinBox.realValue).toLocaleString(locale, 'f', mySpinBox.decimals) return Number(mySpinBox.realValue).toLocaleString(locale, 'f', mySpinBox.decimals)
} }
@@ -214,8 +218,8 @@ T.SpinBox {
states: [ states: [
State { State {
name: "default" name: "default"
when: mySpinBox.enabled && !mySpinBox.hover when: mySpinBox.enabled && !mySpinBox.hover && !mySpinBox.hovered
&& !mySpinBox.edit && !mySpinBox.drag && !mySpinBox.edit && !mySpinBox.drag && !mySpinBox.sliderDrag
PropertyChanges { PropertyChanges {
target: mySpinBox target: mySpinBox
__wheelEnabled: false __wheelEnabled: false
@@ -226,7 +230,7 @@ T.SpinBox {
} }
PropertyChanges { PropertyChanges {
target: spinBoxBackground target: spinBoxBackground
color: StudioTheme.Values.themeControlOutline color: StudioTheme.Values.themeControlBackground
border.color: StudioTheme.Values.themeControlOutline border.color: StudioTheme.Values.themeControlOutline
} }
}, },
@@ -243,21 +247,21 @@ T.SpinBox {
} }
PropertyChanges { PropertyChanges {
target: spinBoxBackground target: spinBoxBackground
color: StudioTheme.Values.themeInteraction color: StudioTheme.Values.themeControlBackgroundInteraction
border.color: StudioTheme.Values.themeInteraction border.color: StudioTheme.Values.themeControlOutline
} }
}, },
State { State {
name: "drag" name: "drag"
when: mySpinBox.drag when: mySpinBox.drag || mySpinBox.sliderDrag
PropertyChanges { PropertyChanges {
target: spinBoxBackground target: spinBoxBackground
color: StudioTheme.Values.themeInteraction color: StudioTheme.Values.themeControlBackgroundInteraction
border.color: StudioTheme.Values.themeInteraction border.color: StudioTheme.Values.themeControlOutlineInteraction
} }
}, },
State { State {
name: "disabled" name: "disable"
when: !mySpinBox.enabled when: !mySpinBox.enabled
PropertyChanges { PropertyChanges {
target: spinBoxBackground target: spinBoxBackground
@@ -296,12 +300,8 @@ T.SpinBox {
} }
onDisplayTextChanged: spinBoxInput.text = mySpinBox.displayText onDisplayTextChanged: spinBoxInput.text = mySpinBox.displayText
onActiveFocusChanged: { onActiveFocusChanged: {
if (mySpinBox.activeFocus) if (mySpinBox.activeFocus) // QTBUG-75862 && mySpinBox.focusReason === Qt.TabFocusReason)
// QTBUG-75862 && mySpinBox.focusReason === Qt.TabFocusReason)
spinBoxInput.selectAll() spinBoxInput.selectAll()
if (sliderPopup.opened && !mySpinBox.activeFocus)
sliderPopup.close()
} }
Keys.onPressed: { Keys.onPressed: {
@@ -336,7 +336,6 @@ T.SpinBox {
} }
function setValueFromInput() { function setValueFromInput() {
if (!mySpinBox.dirty) if (!mySpinBox.dirty)
return return

127
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioControls/RealSpinBoxIndicator.qml
View File

@@ -1,6 +1,6 @@
/**************************************************************************** /****************************************************************************
** **
** Copyright (C) 2019 The Qt Company Ltd. ** Copyright (C) 2021 The Qt Company Ltd.
** Contact: https://www.qt.io/licensing/ ** Contact: https://www.qt.io/licensing/
** **
** This file is part of Qt Creator. ** This file is part of Qt Creator.
@@ -32,8 +32,8 @@ Rectangle {
property T.Control myControl property T.Control myControl
property bool hover: false property bool hover: spinBoxIndicatorMouseArea.containsMouse
property bool pressed: false property bool pressed: spinBoxIndicatorMouseArea.containsPress
property bool released: false property bool released: false
property bool realEnabled: true property bool realEnabled: true
@@ -77,15 +77,12 @@ Rectangle {
property bool pressedAndHeld: false property bool pressedAndHeld: false
anchors.fill: parent anchors.fill: parent
// Shift the MouseArea down by 1 pixel due to potentially overlapping areas
anchors.topMargin: iconFlip < 0 ? 0 : 1
anchors.bottomMargin: iconFlip < 0 ? 1 : 0
hoverEnabled: true hoverEnabled: true
pressAndHoldInterval: 500 pressAndHoldInterval: 500
onContainsMouseChanged: spinBoxIndicator.hover = containsMouse
onContainsPressChanged: spinBoxIndicator.pressed = containsPress
onPressed: { onPressed: {
myControl.forceActiveFocus() if (myControl.activeFocus)
spinBoxIndicator.forceActiveFocus()
spinBoxIndicator.realPressed() spinBoxIndicator.realPressed()
mouse.accepted = true mouse.accepted = true
} }
@@ -130,15 +127,42 @@ Rectangle {
states: [ states: [
State { State {
name: "default" name: "globalHover"
when: myControl.enabled && spinBoxIndicator.enabled when: myControl.enabled && spinBoxIndicator.enabled && !myControl.drag
&& !spinBoxIndicator.hover && myControl.hover && !myControl.edit
PropertyChanges { PropertyChanges {
target: spinBoxIndicatorIcon target: spinBoxIndicatorIcon
color: StudioTheme.Values.themeTextColor color: StudioTheme.Values.themeTextColor
} }
}, },
State { State {
name: "disabled" name: "hover"
when: myControl.enabled && spinBoxIndicator.enabled && !myControl.drag
&& spinBoxIndicator.hover && myControl.hover && !spinBoxIndicator.pressed
PropertyChanges {
target: spinBoxIndicatorIcon
color: StudioTheme.Values.themeIconColorHover
}
},
State {
name: "press"
when: myControl.enabled && spinBoxIndicator.enabled && !myControl.drag
&& spinBoxIndicator.pressed
PropertyChanges {
target: spinBoxIndicatorIcon
color: "#323232" // TODO
}
},
State {
name: "edit"
when: myControl.edit
PropertyChanges {
target: spinBoxIndicatorIcon
color: StudioTheme.Values.themeTextColor
}
},
State {
name: "disable"
when: !myControl.enabled || !spinBoxIndicator.enabled when: !myControl.enabled || !spinBoxIndicator.enabled
PropertyChanges { PropertyChanges {
target: spinBoxIndicatorIcon target: spinBoxIndicatorIcon
@@ -151,55 +175,102 @@ Rectangle {
states: [ states: [
State { State {
name: "default" name: "default"
when: myControl.enabled && !(spinBoxIndicator.hover when: myControl.enabled && !myControl.edit
|| myControl.hover) && !spinBoxIndicator.hover && !myControl.hover && !myControl.drag
&& !spinBoxIndicator.pressed && !myControl.edit PropertyChanges {
&& !myControl.drag target: spinBoxIndicatorIcon
visible: false
}
PropertyChanges { PropertyChanges {
target: spinBoxIndicator target: spinBoxIndicator
color: StudioTheme.Values.themeControlBackground color: StudioTheme.Values.themeControlBackground
} }
}, },
State { State {
name: "hovered" name: "globalHover"
when: (spinBoxIndicator.hover || myControl.hover) when: myControl.enabled && spinBoxIndicator.enabled && !myControl.drag
&& !spinBoxIndicator.pressed && !myControl.edit && !spinBoxIndicator.hover && myControl.hover && !myControl.edit
&& !myControl.drag PropertyChanges {
target: spinBoxIndicatorIcon
visible: true
}
PropertyChanges { PropertyChanges {
target: spinBoxIndicator target: spinBoxIndicator
color: StudioTheme.Values.themeHoverHighlight color: StudioTheme.Values.themeControlBackgroundGlobalHover
} }
}, },
State { State {
name: "pressed" name: "hover"
when: spinBoxIndicator.pressed when: myControl.enabled && !myControl.drag
&& spinBoxIndicator.hover && myControl.hover && !spinBoxIndicator.pressed
PropertyChanges {
target: spinBoxIndicatorIcon
visible: true
}
PropertyChanges { PropertyChanges {
target: spinBoxIndicator target: spinBoxIndicator
color: StudioTheme.Values.themeInteraction color: StudioTheme.Values.themeControlBackgroundHover
}
},
State {
name: "press"
when: myControl.enabled && spinBoxIndicator.enabled && !myControl.drag
&& spinBoxIndicator.pressed
PropertyChanges {
target: spinBoxIndicatorIcon
visible: true
}
PropertyChanges {
target: spinBoxIndicator
color: "#2aafd3" // TODO
} }
}, },
State { State {
name: "edit" name: "edit"
when: myControl.edit when: myControl.edit
PropertyChanges {
target: spinBoxIndicatorIcon
visible: true
}
PropertyChanges { PropertyChanges {
target: spinBoxIndicator target: spinBoxIndicator
color: StudioTheme.Values.themeFocusEdit color: StudioTheme.Values.themeControlBackground
} }
}, },
State { State {
name: "drag" name: "drag"
when: myControl.drag when: myControl.drag
PropertyChanges {
target: spinBoxIndicatorIcon
visible: false
}
PropertyChanges { PropertyChanges {
target: spinBoxIndicator target: spinBoxIndicator
color: StudioTheme.Values.themeFocusDrag color: StudioTheme.Values.themeControlBackgroundInteraction
} }
}, },
State { State {
name: "disabled" name: "disable"
when: !myControl.enabled when: !myControl.enabled
PropertyChanges {
target: spinBoxIndicatorIcon
visible: false
}
PropertyChanges { PropertyChanges {
target: spinBoxIndicator target: spinBoxIndicator
color: StudioTheme.Values.themeControlBackgroundDisabled color: StudioTheme.Values.themeControlBackground
}
},
State {
name: "limit"
when: !spinBoxIndicator.enabled && !spinBoxIndicator.realEnabled && myControl.hover
PropertyChanges {
target: spinBoxIndicatorIcon
visible: true
}
PropertyChanges {
target: spinBoxIndicator
color: StudioTheme.Values.themeControlBackground
} }
} }
] ]

72
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioControls/RealSpinBoxInput.qml
View File

@@ -1,6 +1,6 @@
/**************************************************************************** /****************************************************************************
** **
** Copyright (C) 2019 The Qt Company Ltd. ** Copyright (C) 2021 The Qt Company Ltd.
** Contact: https://www.qt.io/licensing/ ** Contact: https://www.qt.io/licensing/
** **
** This file is part of Qt Creator. ** This file is part of Qt Creator.
@@ -34,6 +34,7 @@ TextInput {
property bool edit: textInput.activeFocus property bool edit: textInput.activeFocus
property bool drag: false property bool drag: false
property bool hover: mouseArea.containsMouse
z: 2 z: 2
font: myControl.font font: myControl.font
@@ -59,15 +60,14 @@ TextInput {
onActiveFocusChanged: textInput.focus = activeFocus onActiveFocusChanged: textInput.focus = activeFocus
Rectangle { Rectangle {
id: textInputArea id: textInputBackground
color: StudioTheme.Values.themeControlBackground
border.color: StudioTheme.Values.themeControlOutline
border.width: StudioTheme.Values.border
x: 0 x: 0
y: 0 y: StudioTheme.Values.border
z: -1 z: -1
width: textInput.width width: textInput.width
height: StudioTheme.Values.height height: StudioTheme.Values.height - (StudioTheme.Values.border * 2)
color: StudioTheme.Values.themeControlBackground
border.width: 0
} }
Item { Item {
@@ -118,8 +118,6 @@ TextInput {
propagateComposedEvents: true propagateComposedEvents: true
acceptedButtons: Qt.LeftButton acceptedButtons: Qt.LeftButton
cursorShape: Qt.PointingHandCursor cursorShape: Qt.PointingHandCursor
// Sets the global hover
onContainsMouseChanged: myControl.hover = containsMouse
onPositionChanged: { onPositionChanged: {
if (!mouseArea.dragging if (!mouseArea.dragging
@@ -238,12 +236,11 @@ TextInput {
states: [ states: [
State { State {
name: "default" name: "default"
when: myControl.enabled && !textInput.edit when: myControl.enabled && !textInput.edit && !textInput.hover && !myControl.hover
&& !mouseArea.containsMouse && !myControl.drag && !myControl.drag && !myControl.sliderDrag
PropertyChanges { PropertyChanges {
target: textInputArea target: textInputBackground
color: StudioTheme.Values.themeControlBackground color: StudioTheme.Values.themeControlBackground
border.color: StudioTheme.Values.themeControlOutline
} }
PropertyChanges { PropertyChanges {
target: mouseArea target: mouseArea
@@ -251,21 +248,28 @@ TextInput {
} }
}, },
State { State {
name: "hovered" name: "globalHover"
when: myControl.hover && !textInput.edit && !myControl.drag when: myControl.hover && !textInput.hover
&& !textInput.edit && !myControl.drag
PropertyChanges { PropertyChanges {
target: textInputArea target: textInputBackground
color: StudioTheme.Values.themeHoverHighlight color: StudioTheme.Values.themeControlBackgroundGlobalHover
border.color: StudioTheme.Values.themeControlOutline }
},
State {
name: "hover"
when: textInput.hover && myControl.hover && !textInput.edit && !myControl.drag
PropertyChanges {
target: textInputBackground
color: StudioTheme.Values.themeControlBackgroundHover
} }
}, },
State { State {
name: "edit" name: "edit"
when: textInput.edit && !myControl.drag when: textInput.edit && !myControl.drag
PropertyChanges { PropertyChanges {
target: textInputArea target: textInputBackground
color: StudioTheme.Values.themeFocusEdit color: StudioTheme.Values.themeControlBackgroundInteraction
border.color: StudioTheme.Values.themeInteraction
} }
PropertyChanges { PropertyChanges {
target: mouseArea target: mouseArea
@@ -276,18 +280,32 @@ TextInput {
name: "drag" name: "drag"
when: myControl.drag when: myControl.drag
PropertyChanges { PropertyChanges {
target: textInputArea target: textInputBackground
color: StudioTheme.Values.themeFocusDrag color: StudioTheme.Values.themeControlBackgroundInteraction
border.color: StudioTheme.Values.themeInteraction }
PropertyChanges {
target: textInput
color: StudioTheme.Values.themeInteraction
} }
}, },
State { State {
name: "disabled" name: "sliderDrag"
when: myControl.sliderDrag
PropertyChanges {
target: textInputBackground
color: StudioTheme.Values.themeControlBackground
}
PropertyChanges {
target: textInput
color: StudioTheme.Values.themeInteraction
}
},
State {
name: "disable"
when: !myControl.enabled when: !myControl.enabled
PropertyChanges { PropertyChanges {
target: textInputArea target: textInputBackground
color: StudioTheme.Values.themeControlBackgroundDisabled color: StudioTheme.Values.themeControlBackgroundDisabled
border.color: StudioTheme.Values.themeControlOutlineDisabled
} }
PropertyChanges { PropertyChanges {
target: textInput target: textInput

2
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioControls/ScrollBar.qml
View File

@@ -1,6 +1,6 @@
/**************************************************************************** /****************************************************************************
** **
** Copyright (C) 2019 The Qt Company Ltd. ** Copyright (C) 2021 The Qt Company Ltd.
** Contact: https://www.qt.io/licensing/ ** Contact: https://www.qt.io/licensing/
** **
** This file is part of Qt Creator. ** This file is part of Qt Creator.

2
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioControls/ScrollView.qml
View File

@@ -1,6 +1,6 @@
/**************************************************************************** /****************************************************************************
** **
** Copyright (C) 2019 The Qt Company Ltd. ** Copyright (C) 2021 The Qt Company Ltd.
** Contact: https://www.qt.io/licensing/ ** Contact: https://www.qt.io/licensing/
** **
** This file is part of Qt Creator. ** This file is part of Qt Creator.

4
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioControls/SecondColumnLayout.qml
View File

@@ -1,6 +1,6 @@
/**************************************************************************** /****************************************************************************
** **
** Copyright (C) 2019 The Qt Company Ltd. ** Copyright (C) 2021 The Qt Company Ltd.
** Contact: https://www.qt.io/licensing/ ** Contact: https://www.qt.io/licensing/
** **
** This file is part of Qt Creator. ** This file is part of Qt Creator.
@@ -28,5 +28,5 @@ import QtQuick.Layouts 1.12
RowLayout { RowLayout {
Layout.fillWidth: true Layout.fillWidth: true
spacing: 4 spacing: 0
} }

45
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioControls/Section.qml
View File

@@ -1,6 +1,6 @@
/**************************************************************************** /****************************************************************************
** **
** Copyright (C) 2019 The Qt Company Ltd. ** Copyright (C) 2021 The Qt Company Ltd.
** Contact: https://www.qt.io/licensing/ ** Contact: https://www.qt.io/licensing/
** **
** This file is part of Qt Creator. ** This file is part of Qt Creator.
@@ -34,7 +34,7 @@ Item {
property int topPadding: 4 property int topPadding: 4
property int rightPadding: 0 property int rightPadding: 0
property int animationDuration: 0 property int animationDuration: 120
property bool expanded: true property bool expanded: true
@@ -42,28 +42,27 @@ Item {
Rectangle { Rectangle {
id: header id: header
height: StudioTheme.Values.height height: StudioTheme.Values.sectionHeadHeight
anchors.left: parent.left anchors.left: parent.left
anchors.right: parent.right anchors.right: parent.right
color: StudioTheme.Values.themeControlBackground color: StudioTheme.Values.themeSectionHeadBackground
SectionLabel { SectionLabel {
id: label id: label
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
color: StudioTheme.Values.themeTextColor color: StudioTheme.Values.themeTextColor
x: 22 x: 22
//font.bold: true
font.pixelSize: StudioTheme.Values.myFontSize font.pixelSize: StudioTheme.Values.myFontSize
// TODO font size? font.capitalization: Font.AllUppercase
} }
SectionLabel { SectionLabel {
id: arrow id: arrow
width: StudioTheme.Values.spinControlIconSizeMulti width: StudioTheme.Values.spinControlIconSizeMulti
height: StudioTheme.Values.spinControlIconSizeMulti height: StudioTheme.Values.spinControlIconSizeMulti
text: StudioTheme.Constants.upDownSquare2 text: StudioTheme.Constants.startNode
color: StudioTheme.Values.themeTextColor color: StudioTheme.Values.themeTextColor
renderType: Text.NativeRendering renderType: Text.NativeRendering
anchors.left: parent.left anchors.left: parent.left
@@ -74,7 +73,7 @@ Item {
Behavior on rotation { Behavior on rotation {
NumberAnimation { NumberAnimation {
easing.type: Easing.OutCubic easing.type: Easing.OutCubic
duration: animationDuration duration: section.animationDuration
} }
} }
} }
@@ -82,7 +81,6 @@ Item {
MouseArea { MouseArea {
anchors.fill: parent anchors.fill: parent
onClicked: { onClicked: {
section.animationDuration = 120
section.expanded = !section.expanded section.expanded = !section.expanded
if (!section.expanded) // TODO if (!section.expanded) // TODO
section.forceActiveFocus() section.forceActiveFocus()
@@ -94,7 +92,13 @@ Item {
readonly property alias contentItem: row readonly property alias contentItem: row
implicitHeight: Math.round(row.height + header.height) implicitHeight: Math.round(row.height + header.height + topRow.height + bottomRow.height)
Row {
id: topRow
height: StudioTheme.Values.sectionHeadSpacerHeight
anchors.top: header.bottom
}
Row { Row {
id: row id: row
@@ -102,18 +106,31 @@ Item {
anchors.leftMargin: leftPadding anchors.leftMargin: leftPadding
anchors.right: parent.right anchors.right: parent.right
anchors.rightMargin: rightPadding anchors.rightMargin: rightPadding
anchors.top: header.bottom anchors.top: topRow.bottom
anchors.topMargin: topPadding }
Row {
id: bottomRow
height: StudioTheme.Values.sectionHeadSpacerHeight
anchors.top: row.bottom
} }
Behavior on implicitHeight { Behavior on implicitHeight {
NumberAnimation { NumberAnimation {
easing.type: Easing.OutCubic easing.type: Easing.OutCubic
duration: animationDuration duration: section.animationDuration
} }
} }
states: [ states: [
State {
name: "Expanded"
when: section.expanded
PropertyChanges {
target: arrow
rotation: 90
}
},
State { State {
name: "Collapsed" name: "Collapsed"
when: !section.expanded when: !section.expanded
@@ -123,7 +140,7 @@ Item {
} }
PropertyChanges { PropertyChanges {
target: arrow target: arrow
rotation: -90 rotation: 0
} }
} }
] ]

4
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioControls/SectionLabel.qml
View File

@@ -1,6 +1,6 @@
/**************************************************************************** /****************************************************************************
** **
** Copyright (C) 2019 The Qt Company Ltd. ** Copyright (C) 2021 The Qt Company Ltd.
** Contact: https://www.qt.io/licensing/ ** Contact: https://www.qt.io/licensing/
** **
** This file is part of Qt Creator. ** This file is part of Qt Creator.
@@ -35,7 +35,7 @@ T.Label {
// workaround because PictureSpecifics.qml still use this // workaround because PictureSpecifics.qml still use this
//property alias toolTip: toolTipArea.tooltip //property alias toolTip: toolTipArea.tooltip
width: Math.max(Math.min(240, parent.width - 220), 80) width: Math.max(Math.min(240, parent.width - 220), 90)
color: StudioTheme.Values.themeTextColor color: StudioTheme.Values.themeTextColor
font.pixelSize: StudioTheme.Values.myFontSize // TODO font.pixelSize: StudioTheme.Values.myFontSize // TODO
elide: Text.ElideRight elide: Text.ElideRight

9
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioControls/SectionLayout.qml
View File

@@ -1,6 +1,6 @@
/**************************************************************************** /****************************************************************************
** **
** Copyright (C) 2019 The Qt Company Ltd. ** Copyright (C) 2021 The Qt Company Ltd.
** Contact: https://www.qt.io/licensing/ ** Contact: https://www.qt.io/licensing/
** **
** This file is part of Qt Creator. ** This file is part of Qt Creator.
@@ -25,10 +25,11 @@
import QtQuick 2.12 import QtQuick 2.12
import QtQuick.Layouts 1.12 import QtQuick.Layouts 1.12
import StudioTheme 1.0 as StudioTheme
GridLayout { GridLayout {
columns: 2 columns: 2
columnSpacing: 12 columnSpacing: StudioTheme.Values.sectionColumnSpacing
rowSpacing: 4 rowSpacing: StudioTheme.Values.sectionRowSpacing
width: parent.width - 16 width: parent.width - 16 // TODO parameterize
} }

10
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioControls/Slider.qml
View File

@@ -1,6 +1,6 @@
/**************************************************************************** /****************************************************************************
** **
** Copyright (C) 2019 The Qt Company Ltd. ** Copyright (C) 2021 The Qt Company Ltd.
** Contact: https://www.qt.io/licensing/ ** Contact: https://www.qt.io/licensing/
** **
** This file is part of Qt Creator. ** This file is part of Qt Creator.
@@ -50,8 +50,8 @@ T.Slider {
property bool edit: slider.activeFocus property bool edit: slider.activeFocus
property alias actionIndicatorVisible: actionIndicator.visible property alias actionIndicatorVisible: actionIndicator.visible
property real __actionIndicatorWidth: StudioTheme.Values.squareComponentWidth property real __actionIndicatorWidth: StudioTheme.Values.actionIndicatorWidth
property real __actionIndicatorHeight: StudioTheme.Values.height property real __actionIndicatorHeight: StudioTheme.Values.actionIndicatorHeight
implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset, implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset,
implicitHandleWidth + leftPadding + rightPadding) implicitHandleWidth + leftPadding + rightPadding)
@@ -231,7 +231,7 @@ T.Slider {
} }
}, },
State { State {
name: "hovered" name: "hover"
when: slider.enabled && slider.hover && !slider.edit when: slider.enabled && slider.hover && !slider.edit
PropertyChanges { PropertyChanges {
target: slider target: slider
@@ -258,7 +258,7 @@ T.Slider {
} }
}, },
State { State {
name: "disabled" name: "disable"
when: !slider.enabled when: !slider.enabled
PropertyChanges { PropertyChanges {
target: tickmarkFromLabel target: tickmarkFromLabel

15
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioControls/SliderPopup.qml
View File

@@ -1,6 +1,6 @@
/**************************************************************************** /****************************************************************************
** **
** Copyright (C) 2019 The Qt Company Ltd. ** Copyright (C) 2021 The Qt Company Ltd.
** Contact: https://www.qt.io/licensing/ ** Contact: https://www.qt.io/licensing/
** **
** This file is part of Qt Creator. ** This file is part of Qt Creator.
@@ -32,12 +32,16 @@ T.Popup {
property T.Control myControl property T.Control myControl
property bool drag: slider.pressed
dim: false dim: false
closePolicy: T.Popup.CloseOnEscape | T.Popup.CloseOnPressOutsideParent closePolicy: T.Popup.CloseOnPressOutside | T.Popup.CloseOnPressOutsideParent
| T.Popup.CloseOnEscape | T.Popup.CloseOnReleaseOutside
| T.Popup.CloseOnReleaseOutsideParent
background: Rectangle { background: Rectangle {
color: StudioTheme.Values.themeControlBackground color: StudioTheme.Values.themePopupBackground
border.color: StudioTheme.Values.themeInteraction border.width: 0
} }
contentItem: T.Slider { contentItem: T.Slider {
@@ -61,7 +65,8 @@ T.Popup {
width: StudioTheme.Values.sliderHandleWidth width: StudioTheme.Values.sliderHandleWidth
height: StudioTheme.Values.sliderHandleHeight height: StudioTheme.Values.sliderHandleHeight
radius: 0 radius: 0
color: slider.pressed ? StudioTheme.Values.themeInteraction : StudioTheme.Values.themeControlOutline color: slider.pressed ? StudioTheme.Values.themeSliderHandleInteraction
: StudioTheme.Values.themeSliderHandle
} }
background: Rectangle { background: Rectangle {

97
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioControls/SpinBox.qml
View File

@@ -1,6 +1,6 @@
/**************************************************************************** /****************************************************************************
** **
** Copyright (C) 2019 The Qt Company Ltd. ** Copyright (C) 2021 The Qt Company Ltd.
** Contact: https://www.qt.io/licensing/ ** Contact: https://www.qt.io/licensing/
** **
** This file is part of Qt Creator. ** This file is part of Qt Creator.
@@ -40,35 +40,35 @@ T.SpinBox {
property real maxStepSize: 10 property real maxStepSize: 10
property bool edit: spinBoxInput.activeFocus property bool edit: spinBoxInput.activeFocus
property bool hover: false // This property is used to indicate the global hover state // This property is used to indicate the global hover state
property bool hover: mySpinBox.hovered || actionIndicator.hover
property bool drag: false property bool drag: false
property bool sliderDrag: sliderPopup.drag
property alias actionIndicatorVisible: actionIndicator.visible property alias actionIndicatorVisible: actionIndicator.visible
property real __actionIndicatorWidth: StudioTheme.Values.squareComponentWidth property real __actionIndicatorWidth: StudioTheme.Values.actionIndicatorWidth
property real __actionIndicatorHeight: StudioTheme.Values.height property real __actionIndicatorHeight: StudioTheme.Values.actionIndicatorHeight
property bool spinBoxIndicatorVisible: true property bool spinBoxIndicatorVisible: true
property real __spinBoxIndicatorWidth: StudioTheme.Values.smallRectWidth - (2 property real __spinBoxIndicatorWidth: StudioTheme.Values.spinBoxIndicatorWidth
* StudioTheme.Values.border) property real __spinBoxIndicatorHeight: StudioTheme.Values.spinBoxIndicatorHeight
property real __spinBoxIndicatorHeight: (StudioTheme.Values.height / 2)
- StudioTheme.Values.border
property alias sliderIndicatorVisible: sliderIndicator.visible property alias sliderIndicatorVisible: sliderIndicator.visible
property real __sliderIndicatorWidth: StudioTheme.Values.squareComponentWidth property real __sliderIndicatorWidth: StudioTheme.Values.sliderIndicatorWidth
property real __sliderIndicatorHeight: StudioTheme.Values.height property real __sliderIndicatorHeight: StudioTheme.Values.sliderIndicatorHeight
signal compressedValueModified signal compressedValueModified
// Use custom wheel handling due to bugs // Use custom wheel handling due to bugs
property bool __wheelEnabled: false property bool __wheelEnabled: false
wheelEnabled: false wheelEnabled: false
hoverEnabled: true // TODO
width: StudioTheme.Values.squareComponentWidth * 5 width: StudioTheme.Values.defaultControlWidth
height: StudioTheme.Values.height height: StudioTheme.Values.defaultControlHeight
leftPadding: spinBoxIndicatorDown.x + spinBoxIndicatorDown.width leftPadding: spinBoxIndicatorDown.x + spinBoxIndicatorDown.width
- (spinBoxIndicatorVisible ? 0 : StudioTheme.Values.border) rightPadding: sliderIndicator.width + StudioTheme.Values.border
rightPadding: sliderIndicator.width - (sliderIndicatorVisible ? StudioTheme.Values.border : 0)
font.pixelSize: StudioTheme.Values.myFontSize font.pixelSize: StudioTheme.Values.myFontSize
editable: true editable: true
@@ -93,44 +93,41 @@ T.SpinBox {
ActionIndicator { ActionIndicator {
id: actionIndicator id: actionIndicator
myControl: mySpinBox myControl: mySpinBox
x: 0 x: 0
y: 0 y: 0
width: actionIndicator.visible ? __actionIndicatorWidth : 0 width: actionIndicator.visible ? mySpinBox.__actionIndicatorWidth : 0
height: actionIndicator.visible ? __actionIndicatorHeight : 0 height: actionIndicator.visible ? mySpinBox.__actionIndicatorHeight : 0
} }
up.indicator: SpinBoxIndicator { up.indicator: SpinBoxIndicator {
id: spinBoxIndicatorUp id: spinBoxIndicatorUp
myControl: mySpinBox myControl: mySpinBox
iconFlip: -1
visible: spinBoxIndicatorVisible visible: mySpinBox.spinBoxIndicatorVisible
//hover: mySpinBox.up.hovered // TODO QTBUG-74688 //hover: mySpinBox.up.hovered // TODO QTBUG-74688
pressed: mySpinBox.up.pressed pressed: mySpinBox.up.pressed
iconFlip: -1 x: actionIndicator.width + StudioTheme.Values.border
x: actionIndicator.width + (actionIndicatorVisible ? 0 : StudioTheme.Values.border)
y: StudioTheme.Values.border y: StudioTheme.Values.border
width: spinBoxIndicatorVisible ? __spinBoxIndicatorWidth : 0 width: spinBoxIndicatorVisible ? mySpinBox.__spinBoxIndicatorWidth : 0
height: spinBoxIndicatorVisible ? __spinBoxIndicatorHeight : 0 height: spinBoxIndicatorVisible ? mySpinBox.__spinBoxIndicatorHeight : 0
enabled: (mySpinBox.from < mySpinBox.to) ? mySpinBox.value < mySpinBox.to : mySpinBox.value > mySpinBox.to enabled: (mySpinBox.from < mySpinBox.to) ? mySpinBox.value < mySpinBox.to
: mySpinBox.value > mySpinBox.to
} }
down.indicator: SpinBoxIndicator { down.indicator: SpinBoxIndicator {
id: spinBoxIndicatorDown id: spinBoxIndicatorDown
myControl: mySpinBox myControl: mySpinBox
visible: mySpinBox.spinBoxIndicatorVisible
visible: spinBoxIndicatorVisible
//hover: mySpinBox.down.hovered // TODO QTBUG-74688 //hover: mySpinBox.down.hovered // TODO QTBUG-74688
pressed: mySpinBox.down.pressed pressed: mySpinBox.down.pressed
x: actionIndicator.width + StudioTheme.Values.border
x: actionIndicator.width + (actionIndicatorVisible ? 0 : StudioTheme.Values.border)
y: spinBoxIndicatorUp.y + spinBoxIndicatorUp.height y: spinBoxIndicatorUp.y + spinBoxIndicatorUp.height
width: spinBoxIndicatorVisible ? __spinBoxIndicatorWidth : 0 width: spinBoxIndicatorVisible ? mySpinBox.__spinBoxIndicatorWidth : 0
height: spinBoxIndicatorVisible ? __spinBoxIndicatorHeight : 0 height: spinBoxIndicatorVisible ? mySpinBox.__spinBoxIndicatorHeight : 0
enabled: (mySpinBox.from < mySpinBox.to) ? mySpinBox.value > mySpinBox.from : mySpinBox.value < mySpinBox.from enabled: (mySpinBox.from < mySpinBox.to) ? mySpinBox.value > mySpinBox.from
: mySpinBox.value < mySpinBox.from
} }
contentItem: SpinBoxInput { contentItem: SpinBoxInput {
@@ -143,7 +140,7 @@ T.SpinBox {
color: StudioTheme.Values.themeControlOutline color: StudioTheme.Values.themeControlOutline
border.color: StudioTheme.Values.themeControlOutline border.color: StudioTheme.Values.themeControlOutline
border.width: StudioTheme.Values.border border.width: StudioTheme.Values.border
x: actionIndicator.width - (actionIndicatorVisible ? StudioTheme.Values.border : 0) x: actionIndicator.width
width: mySpinBox.width - actionIndicator.width width: mySpinBox.width - actionIndicator.width
height: mySpinBox.height height: mySpinBox.height
} }
@@ -152,20 +149,19 @@ T.SpinBox {
id: sliderIndicator id: sliderIndicator
myControl: mySpinBox myControl: mySpinBox
myPopup: sliderPopup myPopup: sliderPopup
x: spinBoxInput.x + spinBoxInput.width
x: spinBoxInput.x + spinBoxInput.width - StudioTheme.Values.border y: StudioTheme.Values.border
width: sliderIndicator.visible ? __sliderIndicatorWidth : 0 width: sliderIndicator.visible ? mySpinBox.__sliderIndicatorWidth - StudioTheme.Values.border : 0
height: sliderIndicator.visible ? __sliderIndicatorHeight : 0 height: sliderIndicator.visible ? mySpinBox.__sliderIndicatorHeight - (StudioTheme.Values.border * 2) : 0
visible: false // reasonable default visible: false // reasonable default
} }
SliderPopup { SliderPopup {
id: sliderPopup id: sliderPopup
myControl: mySpinBox myControl: mySpinBox
x: actionIndicator.width + StudioTheme.Values.border
x: spinBoxInput.x y: StudioTheme.Values.height
y: StudioTheme.Values.height - StudioTheme.Values.border width: mySpinBox.width - actionIndicator.width - (StudioTheme.Values.border * 2)
width: spinBoxInput.width + sliderIndicator.width - StudioTheme.Values.border
height: StudioTheme.Values.sliderHeight height: StudioTheme.Values.sliderHeight
enter: Transition { enter: Transition {
@@ -175,6 +171,7 @@ T.SpinBox {
} }
textFromValue: function (value, locale) { textFromValue: function (value, locale) {
locale.numberOptions = Locale.OmitGroupSeparator
return Number(value / mySpinBox.factor).toLocaleString(locale, 'f', return Number(value / mySpinBox.factor).toLocaleString(locale, 'f',
mySpinBox.decimals) mySpinBox.decimals)
} }
@@ -186,8 +183,8 @@ T.SpinBox {
states: [ states: [
State { State {
name: "default" name: "default"
when: mySpinBox.enabled && !mySpinBox.hover when: mySpinBox.enabled && !mySpinBox.hover && !mySpinBox.hovered
&& !mySpinBox.edit && !mySpinBox.drag && !mySpinBox.edit && !mySpinBox.drag && !mySpinBox.sliderDrag
PropertyChanges { PropertyChanges {
target: mySpinBox target: mySpinBox
__wheelEnabled: false __wheelEnabled: false
@@ -198,7 +195,7 @@ T.SpinBox {
} }
PropertyChanges { PropertyChanges {
target: spinBoxBackground target: spinBoxBackground
color: StudioTheme.Values.themeControlOutline color: StudioTheme.Values.themeControlBackground
border.color: StudioTheme.Values.themeControlOutline border.color: StudioTheme.Values.themeControlOutline
} }
}, },
@@ -215,21 +212,21 @@ T.SpinBox {
} }
PropertyChanges { PropertyChanges {
target: spinBoxBackground target: spinBoxBackground
color: StudioTheme.Values.themeInteraction color: StudioTheme.Values.themeControlBackgroundInteraction
border.color: StudioTheme.Values.themeInteraction border.color: StudioTheme.Values.themeControlOutline
} }
}, },
State { State {
name: "drag" name: "drag"
when: mySpinBox.drag when: mySpinBox.drag || mySpinBox.sliderDrag
PropertyChanges { PropertyChanges {
target: spinBoxBackground target: spinBoxBackground
color: StudioTheme.Values.themeInteraction color: StudioTheme.Values.themeControlBackgroundInteraction
border.color: StudioTheme.Values.themeInteraction border.color: StudioTheme.Values.themeControlOutlineInteraction
} }
}, },
State { State {
name: "disabled" name: "disable"
when: !mySpinBox.enabled when: !mySpinBox.enabled
PropertyChanges { PropertyChanges {
target: spinBoxBackground target: spinBoxBackground

168
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioControls/SpinBoxIndicator.qml
View File

@@ -1,6 +1,6 @@
/**************************************************************************** /****************************************************************************
** **
** Copyright (C) 2019 The Qt Company Ltd. ** Copyright (C) 2021 The Qt Company Ltd.
** Contact: https://www.qt.io/licensing/ ** Contact: https://www.qt.io/licensing/
** **
** This file is part of Qt Creator. ** This file is part of Qt Creator.
@@ -32,8 +32,8 @@ Rectangle {
property T.Control myControl property T.Control myControl
property bool hover: false property bool hover: spinBoxIndicatorMouseArea.containsMouse
property bool pressed: false property bool pressed: spinBoxIndicatorMouseArea.containsPress
property alias iconFlip: spinBoxIndicatorIconScale.yScale property alias iconFlip: spinBoxIndicatorIconScale.yScale
@@ -46,9 +46,10 @@ Rectangle {
id: spinBoxIndicatorMouseArea id: spinBoxIndicatorMouseArea
anchors.fill: parent anchors.fill: parent
hoverEnabled: true hoverEnabled: true
onContainsMouseChanged: spinBoxIndicator.hover = containsMouse
onPressed: { onPressed: {
myControl.forceActiveFocus() if (myControl.activeFocus)
spinBoxIndicator.forceActiveFocus()
mouse.accepted = false mouse.accepted = false
} }
} }
@@ -69,65 +70,154 @@ Rectangle {
origin.y: spinBoxIndicatorIcon.height / 2 origin.y: spinBoxIndicatorIcon.height / 2
yScale: 1 yScale: 1
} }
}
states: [ states: [
State { State {
name: "default" name: "globalHover"
when: myControl.enabled && !(spinBoxIndicator.hover when: myControl.enabled && spinBoxIndicator.enabled && !myControl.drag
|| myControl.hover) && !spinBoxIndicator.hover && myControl.hover && !myControl.edit
&& !spinBoxIndicator.pressed && !myControl.edit
&& !myControl.drag && spinBoxIndicator.enabled
PropertyChanges { PropertyChanges {
target: spinBoxIndicator target: spinBoxIndicatorIcon
color: StudioTheme.Values.themeControlBackground color: StudioTheme.Values.themeTextColor
} }
}, },
State { State {
name: "hovered" name: "hover"
when: (spinBoxIndicator.hover || myControl.hover) when: myControl.enabled && spinBoxIndicator.enabled && !myControl.drag
&& !spinBoxIndicator.pressed && !myControl.edit && spinBoxIndicator.hover && myControl.hover && !spinBoxIndicator.pressed
&& !myControl.drag && spinBoxIndicator.enabled
PropertyChanges { PropertyChanges {
target: spinBoxIndicator target: spinBoxIndicatorIcon
color: StudioTheme.Values.themeHoverHighlight color: StudioTheme.Values.themeIconColorHover
} }
}, },
State { State {
name: "pressed" name: "press"
when: spinBoxIndicator.pressed && spinBoxIndicator.enabled when: myControl.enabled && spinBoxIndicator.enabled && !myControl.drag
&& spinBoxIndicator.pressed
PropertyChanges { PropertyChanges {
target: spinBoxIndicator target: spinBoxIndicatorIcon
color: StudioTheme.Values.themeInteraction color: "#323232" // TODO
} }
}, },
State { State {
name: "edit" name: "edit"
when: myControl.edit && spinBoxIndicator.enabled when: myControl.edit
PropertyChanges { PropertyChanges {
target: spinBoxIndicator target: spinBoxIndicatorIcon
color: StudioTheme.Values.themeFocusEdit color: StudioTheme.Values.themeTextColor
} }
}, },
State { State {
name: "drag" name: "disable"
when: myControl.drag && spinBoxIndicator.enabled
PropertyChanges {
target: spinBoxIndicator
color: StudioTheme.Values.themeFocusDrag
}
},
State {
name: "disabled"
when: !myControl.enabled || !spinBoxIndicator.enabled when: !myControl.enabled || !spinBoxIndicator.enabled
PropertyChanges {
target: spinBoxIndicator
color: StudioTheme.Values.themeControlBackgroundDisabled
}
PropertyChanges { PropertyChanges {
target: spinBoxIndicatorIcon target: spinBoxIndicatorIcon
color: StudioTheme.Values.themeTextColorDisabled color: StudioTheme.Values.themeTextColorDisabled
} }
} }
] ]
}
states: [
State {
name: "default"
when: myControl.enabled && !myControl.edit
&& !spinBoxIndicator.hover && !myControl.hover && !myControl.drag
PropertyChanges {
target: spinBoxIndicatorIcon
visible: false
}
PropertyChanges {
target: spinBoxIndicator
color: StudioTheme.Values.themeControlBackground
}
},
State {
name: "globalHover"
when: myControl.enabled && spinBoxIndicator.enabled && !myControl.drag
&& !spinBoxIndicator.hover && myControl.hover && !myControl.edit
PropertyChanges {
target: spinBoxIndicatorIcon
visible: true
}
PropertyChanges {
target: spinBoxIndicator
color: StudioTheme.Values.themeControlBackgroundGlobalHover
}
},
State {
name: "hover"
when: myControl.enabled && !myControl.drag
&& spinBoxIndicator.hover && myControl.hover && !spinBoxIndicator.pressed
PropertyChanges {
target: spinBoxIndicatorIcon
visible: true
}
PropertyChanges {
target: spinBoxIndicator
color: StudioTheme.Values.themeControlBackgroundHover
}
},
State {
name: "press"
when: myControl.enabled && spinBoxIndicator.enabled && !myControl.drag
&& spinBoxIndicator.pressed
PropertyChanges {
target: spinBoxIndicatorIcon
visible: true
}
PropertyChanges {
target: spinBoxIndicator
color: "#2aafd3" // TODO
}
},
State {
name: "edit"
when: myControl.edit
PropertyChanges {
target: spinBoxIndicatorIcon
visible: true
}
PropertyChanges {
target: spinBoxIndicator
color: StudioTheme.Values.themeControlBackground
}
},
State {
name: "drag"
when: myControl.drag
PropertyChanges {
target: spinBoxIndicatorIcon
visible: false
}
PropertyChanges {
target: spinBoxIndicator
color: StudioTheme.Values.themeControlBackgroundInteraction
}
},
State {
name: "disable"
when: !myControl.enabled
PropertyChanges {
target: spinBoxIndicatorIcon
visible: false
}
PropertyChanges {
target: spinBoxIndicator
color: StudioTheme.Values.themeControlBackground
}
},
State {
name: "limit"
when: !spinBoxIndicator.enabled && !spinBoxIndicator.realEnabled && myControl.hover
PropertyChanges {
target: spinBoxIndicatorIcon
visible: true
}
PropertyChanges {
target: spinBoxIndicator
color: StudioTheme.Values.themeControlBackground
}
}
]
} }

76
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioControls/SpinBoxInput.qml
View File

@@ -1,6 +1,6 @@
/**************************************************************************** /****************************************************************************
** **
** Copyright (C) 2019 The Qt Company Ltd. ** Copyright (C) 2021 The Qt Company Ltd.
** Contact: https://www.qt.io/licensing/ ** Contact: https://www.qt.io/licensing/
** **
** This file is part of Qt Creator. ** This file is part of Qt Creator.
@@ -34,6 +34,7 @@ TextInput {
property bool edit: textInput.activeFocus property bool edit: textInput.activeFocus
property bool drag: false property bool drag: false
property bool hover: mouseArea.containsMouse
z: 2 z: 2
font: myControl.font font: myControl.font
@@ -59,17 +60,14 @@ TextInput {
onActiveFocusChanged: textInput.focus = activeFocus onActiveFocusChanged: textInput.focus = activeFocus
Rectangle { Rectangle {
id: textInputArea id: textInputBackground
color: StudioTheme.Values.themeControlBackground
border.color: StudioTheme.Values.themeControlOutline
border.width: StudioTheme.Values.border
x: 0 x: 0
y: 0 y: StudioTheme.Values.border
z: -1 z: -1
width: textInput.width width: textInput.width
height: StudioTheme.Values.height height: StudioTheme.Values.height - (StudioTheme.Values.border * 2)
color: StudioTheme.Values.themeControlBackground
border.width: 0
} }
DragHandler { DragHandler {
@@ -117,8 +115,6 @@ TextInput {
propagateComposedEvents: true propagateComposedEvents: true
acceptedButtons: Qt.LeftButton acceptedButtons: Qt.LeftButton
cursorShape: Qt.PointingHandCursor cursorShape: Qt.PointingHandCursor
// Sets the global hover
onContainsMouseChanged: myControl.hover = containsMouse
onPressed: mouse.accepted = false onPressed: mouse.accepted = false
onWheel: { onWheel: {
if (!myControl.__wheelEnabled) if (!myControl.__wheelEnabled)
@@ -139,12 +135,11 @@ TextInput {
states: [ states: [
State { State {
name: "default" name: "default"
when: myControl.enabled && !textInput.edit when: myControl.enabled && !textInput.edit && !textInput.hover && !myControl.hover
&& !mouseArea.containsMouse && !myControl.drag && !myControl.drag && !myControl.sliderDrag
PropertyChanges { PropertyChanges {
target: textInputArea target: textInputBackground
color: StudioTheme.Values.themeControlBackground color: StudioTheme.Values.themeControlBackground
border.color: StudioTheme.Values.themeControlOutline
} }
PropertyChanges { PropertyChanges {
target: dragHandler target: dragHandler
@@ -160,21 +155,28 @@ TextInput {
} }
}, },
State { State {
name: "hovered" name: "globalHover"
when: myControl.hover && !textInput.edit && !myControl.drag when: myControl.hover && !textInput.hover && !textInput.edit && !myControl.drag
PropertyChanges { PropertyChanges {
target: textInputArea target: textInputBackground
color: StudioTheme.Values.themeHoverHighlight color: StudioTheme.Values.themeControlBackgroundGlobalHover
border.color: StudioTheme.Values.themeControlOutline }
},
State {
name: "hover"
when: textInput.hover && myControl.hover
&& !textInput.edit && !myControl.drag
PropertyChanges {
target: textInputBackground
color: StudioTheme.Values.themeControlBackgroundHover
} }
}, },
State { State {
name: "edit" name: "edit"
when: textInput.edit when: textInput.edit && !myControl.drag
PropertyChanges { PropertyChanges {
target: textInputArea target: textInputBackground
color: StudioTheme.Values.themeFocusEdit color: StudioTheme.Values.themeControlBackgroundInteraction
border.color: StudioTheme.Values.themeInteraction
} }
PropertyChanges { PropertyChanges {
target: dragHandler target: dragHandler
@@ -193,18 +195,32 @@ TextInput {
name: "drag" name: "drag"
when: myControl.drag when: myControl.drag
PropertyChanges { PropertyChanges {
target: textInputArea target: textInputBackground
color: StudioTheme.Values.themeFocusDrag color: StudioTheme.Values.themeControlBackgroundInteraction
border.color: StudioTheme.Values.themeInteraction }
PropertyChanges {
target: textInput
color: StudioTheme.Values.themeInteraction
} }
}, },
State { State {
name: "disabled" name: "sliderDrag"
when: myControl.sliderDrag
PropertyChanges {
target: textInputBackground
color: StudioTheme.Values.themeControlBackground
}
PropertyChanges {
target: textInput
color: StudioTheme.Values.themeInteraction
}
},
State {
name: "disable"
when: !myControl.enabled when: !myControl.enabled
PropertyChanges { PropertyChanges {
target: textInputArea target: textInputBackground
color: StudioTheme.Values.themeControlBackgroundDisabled color: StudioTheme.Values.themeControlBackgroundDisabled
border.color: StudioTheme.Values.themeControlOutlineDisabled
} }
PropertyChanges { PropertyChanges {
target: textInput target: textInput

6
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioControls/TabBar.qml
View File

@@ -1,6 +1,6 @@
/**************************************************************************** /****************************************************************************
** **
** Copyright (C) 2020 The Qt Company Ltd. ** Copyright (C) 2021 The Qt Company Ltd.
** Contact: https://www.qt.io/licensing/ ** Contact: https://www.qt.io/licensing/
** **
** This file is part of Qt Creator. ** This file is part of Qt Creator.
@@ -36,7 +36,7 @@ T.TabBar {
implicitContentHeight + topPadding + bottomPadding) implicitContentHeight + topPadding + bottomPadding)
spacing: 0 spacing: 0
bottomPadding: 4 bottomPadding: 2
contentItem: ListView { contentItem: ListView {
model: myButton.contentModel model: myButton.contentModel
@@ -50,6 +50,6 @@ T.TabBar {
} }
background: Rectangle { background: Rectangle {
color: StudioTheme.Values.themeTabLight color: StudioTheme.Values.themeTabActiveBackground
} }
} }

9
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioControls/TabButton.qml
View File

@@ -1,6 +1,6 @@
/**************************************************************************** /****************************************************************************
** **
** Copyright (C) 2020 The Qt Company Ltd. ** Copyright (C) 2021 The Qt Company Ltd.
** Contact: https://www.qt.io/licensing/ ** Contact: https://www.qt.io/licensing/
** **
** This file is part of Qt Creator. ** This file is part of Qt Creator.
@@ -39,14 +39,15 @@ T.TabButton {
background: Rectangle { background: Rectangle {
id: buttonBackground id: buttonBackground
color: myButton.checked ? StudioTheme.Values.themeTabLight : StudioTheme.Values.themeTabDark color: myButton.checked ? StudioTheme.Values.themeTabActiveBackground
border.color: StudioTheme.Values.themeControlOutline : StudioTheme.Values.themeTabInactiveBackground
border.width: 0 border.width: 0
} }
contentItem: T.Label { contentItem: T.Label {
id: buttonIcon id: buttonIcon
color: myButton.checked ? StudioTheme.Values.themeTabDark : StudioTheme.Values.themeTabLight color: myButton.checked ? StudioTheme.Values.themeTabActiveText
: StudioTheme.Values.themeTabInactiveText
font.weight: Font.Bold font.weight: Font.Bold
//font.family: StudioTheme.Constants.font.family //font.family: StudioTheme.Constants.font.family
font.pixelSize: StudioTheme.Values.myFontSize font.pixelSize: StudioTheme.Values.myFontSize

4
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioControls/TextArea.qml
View File

@@ -1,6 +1,6 @@
/**************************************************************************** /****************************************************************************
** **
** Copyright (C) 2019 The Qt Company Ltd. ** Copyright (C) 2021 The Qt Company Ltd.
** Contact: https://www.qt.io/licensing/ ** Contact: https://www.qt.io/licensing/
** **
** This file is part of Qt Creator. ** This file is part of Qt Creator.
@@ -43,7 +43,7 @@ TextField {
width: myTextField.popupWidth width: myTextField.popupWidth
height: scrollView.height height: scrollView.height
background: Rectangle { background: Rectangle {
color: StudioTheme.Values.themeFocusEdit color: StudioTheme.Values.themePopupBackground
border.color: StudioTheme.Values.themeInteraction border.color: StudioTheme.Values.themeInteraction
border.width: StudioTheme.Values.border border.width: StudioTheme.Values.border
} }

71
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioControls/TextField.qml
View File

@@ -1,6 +1,6 @@
/**************************************************************************** /****************************************************************************
** **
** Copyright (C) 2019 The Qt Company Ltd. ** Copyright (C) 2021 The Qt Company Ltd.
** Contact: https://www.qt.io/licensing/ ** Contact: https://www.qt.io/licensing/
** **
** This file is part of Qt Creator. ** This file is part of Qt Creator.
@@ -33,16 +33,18 @@ T.TextField {
property alias actionIndicator: actionIndicator property alias actionIndicator: actionIndicator
property alias translationIndicator: translationIndicator property alias translationIndicator: translationIndicator
// This property is used to indicate the global hover state
property bool hover: actionIndicator.hover || mouseArea.containsMouse
|| translationIndicator.hover
property bool edit: myTextField.activeFocus property bool edit: myTextField.activeFocus
property bool hover: false // This property is used to indicate the global hover state
property alias actionIndicatorVisible: actionIndicator.visible property alias actionIndicatorVisible: actionIndicator.visible
property real __actionIndicatorWidth: StudioTheme.Values.squareComponentWidth property real __actionIndicatorWidth: StudioTheme.Values.actionIndicatorWidth
property real __actionIndicatorHeight: StudioTheme.Values.height property real __actionIndicatorHeight: StudioTheme.Values.actionIndicatorHeight
property alias translationIndicatorVisible: translationIndicator.visible property alias translationIndicatorVisible: translationIndicator.visible
property real __translationIndicatorWidth: StudioTheme.Values.squareComponentWidth property real __translationIndicatorWidth: StudioTheme.Values.translationIndicatorWidth
property real __translationIndicatorHeight: StudioTheme.Values.height property real __translationIndicatorHeight: StudioTheme.Values.translationIndicatorHeight
horizontalAlignment: Qt.AlignLeft horizontalAlignment: Qt.AlignLeft
verticalAlignment: Qt.AlignVCenter verticalAlignment: Qt.AlignVCenter
@@ -58,14 +60,12 @@ T.TextField {
persistentSelection: focus // QTBUG-73807 persistentSelection: focus // QTBUG-73807
clip: true clip: true
width: StudioTheme.Values.height * 5 width: StudioTheme.Values.defaultControlWidth
height: StudioTheme.Values.height height: StudioTheme.Values.defaultControlHeight
implicitHeight: StudioTheme.Values.height implicitHeight: StudioTheme.Values.defaultControlHeight
leftPadding: StudioTheme.Values.inputHorizontalPadding + actionIndicator.width leftPadding: StudioTheme.Values.inputHorizontalPadding + actionIndicator.width
- (actionIndicatorVisible ? StudioTheme.Values.border : 0)
rightPadding: StudioTheme.Values.inputHorizontalPadding + translationIndicator.width rightPadding: StudioTheme.Values.inputHorizontalPadding + translationIndicator.width
- (translationIndicatorVisible ? StudioTheme.Values.border : 0)
MouseArea { MouseArea {
id: mouseArea id: mouseArea
@@ -75,7 +75,6 @@ T.TextField {
propagateComposedEvents: true propagateComposedEvents: true
acceptedButtons: Qt.LeftButton | Qt.RightButton acceptedButtons: Qt.LeftButton | Qt.RightButton
cursorShape: Qt.PointingHandCursor cursorShape: Qt.PointingHandCursor
onContainsMouseChanged: myTextField.hover = containsMouse // Sets the global hover
onPressed: { onPressed: {
if (mouse.button === Qt.RightButton) if (mouse.button === Qt.RightButton)
contextMenu.popup(myTextField) contextMenu.popup(myTextField)
@@ -104,8 +103,8 @@ T.TextField {
myControl: myTextField myControl: myTextField
x: 0 x: 0
y: 0 y: 0
width: actionIndicator.visible ? __actionIndicatorWidth : 0 width: actionIndicator.visible ? myTextField.__actionIndicatorWidth : 0
height: actionIndicator.visible ? __actionIndicatorHeight : 0 height: actionIndicator.visible ? myTextField.__actionIndicatorHeight : 0
} }
background: Rectangle { background: Rectangle {
@@ -113,7 +112,7 @@ T.TextField {
color: StudioTheme.Values.themeControlBackground color: StudioTheme.Values.themeControlBackground
border.color: StudioTheme.Values.themeControlOutline border.color: StudioTheme.Values.themeControlOutline
border.width: StudioTheme.Values.border border.width: StudioTheme.Values.border
x: actionIndicator.width - (actionIndicatorVisible ? StudioTheme.Values.border : 0) x: actionIndicator.width
width: myTextField.width - actionIndicator.width width: myTextField.width - actionIndicator.width
height: myTextField.height height: myTextField.height
} }
@@ -136,27 +135,53 @@ T.TextField {
color: StudioTheme.Values.themeControlBackground color: StudioTheme.Values.themeControlBackground
border.color: StudioTheme.Values.themeControlOutline border.color: StudioTheme.Values.themeControlOutline
} }
PropertyChanges {
target: myTextField
color: StudioTheme.Values.themeTextColor
}
PropertyChanges { PropertyChanges {
target: mouseArea target: mouseArea
cursorShape: Qt.PointingHandCursor cursorShape: Qt.PointingHandCursor
} }
}, },
State { State {
name: "hovered" name: "globalHover"
when: myTextField.hover && !myTextField.edit when: (actionIndicator.hover || translationIndicator.hover) && !myTextField.edit
PropertyChanges { PropertyChanges {
target: textFieldBackground target: textFieldBackground
color: StudioTheme.Values.themeHoverHighlight color: StudioTheme.Values.themeControlBackgroundGlobalHover
border.color: StudioTheme.Values.themeControlOutline border.color: StudioTheme.Values.themeControlOutline
} }
PropertyChanges {
target: myTextField
color: StudioTheme.Values.themeTextColor
}
},
State {
name: "hover"
when: mouseArea.containsMouse && !actionIndicator.hover && !translationIndicator.hover
&& !myTextField.edit
PropertyChanges {
target: textFieldBackground
color: StudioTheme.Values.themeControlBackgroundHover
border.color: StudioTheme.Values.themeControlOutline
}
PropertyChanges {
target: myTextField
color: StudioTheme.Values.themeTextColor
}
}, },
State { State {
name: "edit" name: "edit"
when: myTextField.edit when: myTextField.edit
PropertyChanges { PropertyChanges {
target: textFieldBackground target: textFieldBackground
color: StudioTheme.Values.themeFocusEdit color: StudioTheme.Values.themeControlBackgroundInteraction
border.color: StudioTheme.Values.themeInteraction border.color: StudioTheme.Values.themeControlOutlineInteraction
}
PropertyChanges {
target: myTextField
color: StudioTheme.Values.themeTextColor
} }
PropertyChanges { PropertyChanges {
target: mouseArea target: mouseArea
@@ -164,13 +189,17 @@ T.TextField {
} }
}, },
State { State {
name: "disabled" name: "disable"
when: !myTextField.enabled when: !myTextField.enabled
PropertyChanges { PropertyChanges {
target: textFieldBackground target: textFieldBackground
color: StudioTheme.Values.themeControlBackgroundDisabled color: StudioTheme.Values.themeControlBackgroundDisabled
border.color: StudioTheme.Values.themeControlOutlineDisabled border.color: StudioTheme.Values.themeControlOutlineDisabled
} }
PropertyChanges {
target: myTextField
color: StudioTheme.Values.themeTextColorDisabled
}
} }
] ]

96
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioControls/TranslationIndicator.qml
View File

@@ -1,6 +1,6 @@
/**************************************************************************** /****************************************************************************
** **
** Copyright (C) 2019 The Qt Company Ltd. ** Copyright (C) 2021 The Qt Company Ltd.
** Contact: https://www.qt.io/licensing/ ** Contact: https://www.qt.io/licensing/
** **
** This file is part of Qt Creator. ** This file is part of Qt Creator.
@@ -32,35 +32,29 @@ Item {
property Item myControl property Item myControl
property bool hover: false property bool hover: translationIndicatorMouseArea.containsMouse
property bool pressed: false property bool pressed: translationIndicatorMouseArea.pressed
property bool checked: false property bool checked: false
signal clicked signal clicked
state: "default"
Rectangle { Rectangle {
id: translationIndicatorBackground id: translationIndicatorBackground
color: StudioTheme.Values.themeColumnBackground // TODO create extra variable, this one is used color: StudioTheme.Values.themeControlBackground
border.color: StudioTheme.Values.themeTranslationIndicatorBorder border.color: StudioTheme.Values.themeControlOutline
border.width: StudioTheme.Values.border
anchors.centerIn: parent anchors.centerIn: parent
width: matchParity(translationIndicator.height, width: matchParity(translationIndicator.height, StudioTheme.Values.smallRectWidth)
StudioTheme.Values.smallRectWidth) height: matchParity(translationIndicator.height, StudioTheme.Values.smallRectWidth)
height: matchParity(translationIndicator.height,
StudioTheme.Values.smallRectWidth)
function matchParity(root, value) { function matchParity(root, value) {
// TODO maybe not necessary
var v = Math.round(value) var v = Math.round(value)
if (root % 2 == 0) if (root % 2 == 0)
// even
return (v % 2 == 0) ? v : v - 1 return (v % 2 == 0) ? v : v - 1
else else
// odd
return (v % 2 == 0) ? v - 1 : v return (v % 2 == 0) ? v - 1 : v
} }
@@ -68,7 +62,6 @@ Item {
id: translationIndicatorMouseArea id: translationIndicatorMouseArea
anchors.fill: parent anchors.fill: parent
hoverEnabled: true hoverEnabled: true
onContainsMouseChanged: translationIndicator.hover = containsMouse
onPressed: mouse.accepted = true // TODO onPressed: mouse.accepted = true // TODO
onClicked: { onClicked: {
translationIndicator.checked = !translationIndicator.checked translationIndicator.checked = !translationIndicator.checked
@@ -87,6 +80,43 @@ Item {
verticalAlignment: Text.AlignVCenter verticalAlignment: Text.AlignVCenter
horizontalAlignment: Text.AlignHCenter horizontalAlignment: Text.AlignHCenter
anchors.fill: parent anchors.fill: parent
states: [
State {
name: "default"
when: translationIndicator.enabled && !translationIndicator.pressed
&& !translationIndicator.checked
PropertyChanges {
target: translationIndicatorIcon
color: StudioTheme.Values.themeIconColor
}
},
State {
name: "press"
when: translationIndicator.enabled && translationIndicator.pressed
PropertyChanges {
target: translationIndicatorIcon
color: StudioTheme.Values.themeIconColorInteraction
}
},
State {
name: "check"
when: translationIndicator.enabled && !translationIndicator.pressed
&& translationIndicator.checked
PropertyChanges {
target: translationIndicatorIcon
color: StudioTheme.Values.themeIconColorSelected
}
},
State {
name: "disable"
when: !myControl.enabled
PropertyChanges {
target: translationIndicatorIcon
color: StudioTheme.Values.themeTextColorDisabled
}
}
]
} }
states: [ states: [
@@ -94,44 +124,48 @@ Item {
name: "default" name: "default"
when: myControl.enabled && !translationIndicator.hover when: myControl.enabled && !translationIndicator.hover
&& !translationIndicator.pressed && !myControl.hover && !translationIndicator.pressed && !myControl.hover
&& !myControl.edit && !myControl.drag && !myControl.edit && !translationIndicator.checked
&& !translationIndicator.checked
PropertyChanges { PropertyChanges {
target: translationIndicatorBackground target: translationIndicatorBackground
color: StudioTheme.Values.themeColumnBackground color: StudioTheme.Values.themeControlBackground
border.color: StudioTheme.Values.themeTranslationIndicatorBorder border.color: StudioTheme.Values.themeControlOutline
} }
}, },
State { State {
name: "checked" name: "globalHover"
when: translationIndicator.checked when: myControl.hover && !translationIndicator.hover
PropertyChanges { PropertyChanges {
target: translationIndicatorBackground target: translationIndicatorBackground
color: StudioTheme.Values.themeInteraction // TODO color: StudioTheme.Values.themeControlBackgroundGlobalHover
border.color: StudioTheme.Values.themeControlOutline
} }
}, },
State { State {
name: "hovered" name: "hover"
when: translationIndicator.hover && !translationIndicator.pressed when: translationIndicator.hover && !translationIndicator.pressed
&& !myControl.edit && !myControl.drag && !myControl.drag
PropertyChanges { PropertyChanges {
target: translationIndicatorBackground target: translationIndicatorBackground
color: StudioTheme.Values.themeFocusDrag // TODO color: StudioTheme.Values.themeControlBackgroundHover
border.color: StudioTheme.Values.themeControlOutline
} }
}, },
State { State {
name: "disabled" name: "press"
when: translationIndicator.hover && translationIndicator.pressed
PropertyChanges {
target: translationIndicatorBackground
color: StudioTheme.Values.themeControlBackgroundInteraction
border.color: StudioTheme.Values.themeControlOutlineInteraction
}
},
State {
name: "disable"
when: !myControl.enabled when: !myControl.enabled
PropertyChanges { PropertyChanges {
target: translationIndicatorBackground target: translationIndicatorBackground
color: StudioTheme.Values.themeControlBackgroundDisabled color: StudioTheme.Values.themeControlBackgroundDisabled
border.color: StudioTheme.Values.themeControlOutlineDisabled border.color: StudioTheme.Values.themeControlOutlineDisabled
} }
PropertyChanges {
target: translationIndicatorIcon
color: StudioTheme.Values.themeTextColorDisabled
}
} }
] ]
} }

1
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioControls/qmldir
View File

@@ -12,6 +12,7 @@ ExpandingSpacer 1.0 ExpandingSpacer.qml
ItemDelegate 1.0 ItemDelegate.qml ItemDelegate 1.0 ItemDelegate.qml
Menu 1.0 Menu.qml Menu 1.0 Menu.qml
MenuItem 1.0 MenuItem.qml MenuItem 1.0 MenuItem.qml
MenuItemWithIcon 1.0 MenuItemWithIcon.qml
MenuSeparator 1.0 MenuSeparator.qml MenuSeparator 1.0 MenuSeparator.qml
RealSliderPopup 1.0 RealSliderPopup.qml RealSliderPopup 1.0 RealSliderPopup.qml
RealSpinBox 1.0 RealSpinBox.qml RealSpinBox 1.0 RealSpinBox.qml

2
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioTheme/Constants.qml
View File

@@ -1,6 +1,6 @@
/**************************************************************************** /****************************************************************************
** **
** Copyright (C) 2020 The Qt Company Ltd. ** Copyright (C) 2021 The Qt Company Ltd.
** Contact: https://www.qt.io/licensing/ ** Contact: https://www.qt.io/licensing/
** **
** This file is part of Qt Creator. ** This file is part of Qt Creator.

189
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioTheme/InternalConstants.qml
View File

@@ -1,6 +1,6 @@
/**************************************************************************** /****************************************************************************
** **
** Copyright (C) 2020 The Qt Company Ltd. ** Copyright (C) 2021 The Qt Company Ltd.
** Contact: https://www.qt.io/licensing/ ** Contact: https://www.qt.io/licensing/
** **
** This file is part of Qt Creator. ** This file is part of Qt Creator.
@@ -48,94 +48,101 @@ QtObject {
readonly property string adsClose: "\u0029" readonly property string adsClose: "\u0029"
readonly property string adsDetach: "\u002A" readonly property string adsDetach: "\u002A"
readonly property string adsDropDown: "\u002B" readonly property string adsDropDown: "\u002B"
readonly property string aliasAnimated: "\u002C" readonly property string alias: "\u002C"
readonly property string aliasProperty: "\u002D" readonly property string aliasAnimated: "\u002D"
readonly property string alignBottom: "\u002E" readonly property string aliasProperty: "\u002E"
readonly property string alignCenterHorizontal: "\u002F" readonly property string alignBottom: "\u002F"
readonly property string alignCenterVertical: "\u0030" readonly property string alignCenterHorizontal: "\u0030"
readonly property string alignLeft: "\u0031" readonly property string alignCenterVertical: "\u0031"
readonly property string alignRight: "\u0032" readonly property string alignLeft: "\u0032"
readonly property string alignTo: "\u0033" readonly property string alignRight: "\u0033"
readonly property string alignTop: "\u0034" readonly property string alignTo: "\u0034"
readonly property string anchorBaseline: "\u0035" readonly property string alignTop: "\u0035"
readonly property string anchorBottom: "\u0036" readonly property string anchorBaseline: "\u0036"
readonly property string anchorFill: "\u0037" readonly property string anchorBottom: "\u0037"
readonly property string anchorLeft: "\u0038" readonly property string anchorFill: "\u0038"
readonly property string anchorRight: "\u0039" readonly property string anchorLeft: "\u0039"
readonly property string anchorTop: "\u003A" readonly property string anchorRight: "\u003A"
readonly property string animatedProperty: "\u003B" readonly property string anchorTop: "\u003B"
readonly property string annotationBubble: "\u003C" readonly property string animatedProperty: "\u003C"
readonly property string annotationDecal: "\u003D" readonly property string annotationBubble: "\u003D"
readonly property string assign: "\u003E" readonly property string annotationDecal: "\u003E"
readonly property string centerHorizontal: "\u003F" readonly property string assign: "\u003F"
readonly property string centerVertical: "\u0040" readonly property string centerHorizontal: "\u0040"
readonly property string closeCross: "\u0041" readonly property string centerVertical: "\u0041"
readonly property string curveDesigner: "\u0042" readonly property string closeCross: "\u0042"
readonly property string curveEditor: "\u0043" readonly property string curveDesigner: "\u0043"
readonly property string decisionNode: "\u0044" readonly property string curveEditor: "\u0044"
readonly property string deleteColumn: "\u0045" readonly property string decisionNode: "\u0045"
readonly property string deleteRow: "\u0046" readonly property string deleteColumn: "\u0046"
readonly property string deleteTable: "\u0047" readonly property string deleteRow: "\u0047"
readonly property string detach: "\u0048" readonly property string deleteTable: "\u0048"
readonly property string distributeBottom: "\u0049" readonly property string detach: "\u0049"
readonly property string distributeCenterHorizontal: "\u004A" readonly property string distributeBottom: "\u004A"
readonly property string distributeCenterVertical: "\u004B" readonly property string distributeCenterHorizontal: "\u004B"
readonly property string distributeLeft: "\u004C" readonly property string distributeCenterVertical: "\u004C"
readonly property string distributeOriginBottomRight: "\u004D" readonly property string distributeLeft: "\u004D"
readonly property string distributeOriginCenter: "\u004E" readonly property string distributeOriginBottomRight: "\u004E"
readonly property string distributeOriginNone: "\u004F" readonly property string distributeOriginCenter: "\u004F"
readonly property string distributeOriginTopLeft: "\u0050" readonly property string distributeOriginNone: "\u0050"
readonly property string distributeRight: "\u0051" readonly property string distributeOriginTopLeft: "\u0051"
readonly property string distributeSpacingHorizontal: "\u0052" readonly property string distributeRight: "\u0052"
readonly property string distributeSpacingVertical: "\u0053" readonly property string distributeSpacingHorizontal: "\u0053"
readonly property string distributeTop: "\u0054" readonly property string distributeSpacingVertical: "\u0054"
readonly property string edit: "\u0055" readonly property string distributeTop: "\u0055"
readonly property string flowAction: "\u0056" readonly property string edit: "\u0056"
readonly property string flowTransition: "\u0057" readonly property string flowAction: "\u0057"
readonly property string fontStyleBold: "\u0058" readonly property string flowTransition: "\u0058"
readonly property string fontStyleItalic: "\u0059" readonly property string fontStyleBold: "\u0059"
readonly property string fontStyleStrikethrough: "\u005A" readonly property string fontStyleItalic: "\u005A"
readonly property string fontStyleUnderline: "\u005B" readonly property string fontStyleStrikethrough: "\u005B"
readonly property string gridView: "\u005C" readonly property string fontStyleUnderline: "\u005C"
readonly property string idAliasOff: "\u005D" readonly property string gridView: "\u005D"
readonly property string idAliasOn: "\u005E" readonly property string idAliasOff: "\u005E"
readonly property string listView: "\u005F" readonly property string idAliasOn: "\u005F"
readonly property string lockOff: "\u0060" readonly property string keyframe: "\u0060"
readonly property string lockOn: "\u0061" readonly property string linkTriangle: "\u0061"
readonly property string mergeCells: "\u0062" readonly property string linked: "\u0062"
readonly property string minus: "\u0063" readonly property string listView: "\u0063"
readonly property string pin: "\u0064" readonly property string lockOff: "\u0064"
readonly property string plus: "\u0065" readonly property string lockOn: "\u0065"
readonly property string redo: "\u0066" readonly property string mergeCells: "\u0066"
readonly property string rotationFill: "\u0067" readonly property string minus: "\u0067"
readonly property string rotationOutline: "\u0068" readonly property string mirror: "\u0068"
readonly property string search: "\u0069" readonly property string pin: "\u0069"
readonly property string splitColumns: "\u006A" readonly property string plus: "\u006A"
readonly property string splitRows: "\u006B" readonly property string promote: "\u006B"
readonly property string startNode: "\u006C" readonly property string redo: "\u006C"
readonly property string testIcon: "\u006D" readonly property string rotationFill: "\u006D"
readonly property string textAlignBottom: "\u006E" readonly property string rotationOutline: "\u006E"
readonly property string textAlignCenter: "\u006F" readonly property string search: "\u006F"
readonly property string textAlignLeft: "\u0070" readonly property string splitColumns: "\u0070"
readonly property string textAlignMiddle: "\u0071" readonly property string splitRows: "\u0071"
readonly property string textAlignRight: "\u0072" readonly property string startNode: "\u0072"
readonly property string textAlignTop: "\u0073" readonly property string testIcon: "\u0073"
readonly property string textBulletList: "\u0074" readonly property string textAlignBottom: "\u0074"
readonly property string textFullJustification: "\u0075" readonly property string textAlignCenter: "\u0075"
readonly property string textNumberedList: "\u0076" readonly property string textAlignLeft: "\u0076"
readonly property string tickIcon: "\u0077" readonly property string textAlignMiddle: "\u0077"
readonly property string triState: "\u0078" readonly property string textAlignRight: "\u0078"
readonly property string undo: "\u0079" readonly property string textAlignTop: "\u0079"
readonly property string unpin: "\u007A" readonly property string textBulletList: "\u007A"
readonly property string upDownIcon: "\u007B" readonly property string textFullJustification: "\u007B"
readonly property string upDownSquare2: "\u007C" readonly property string textNumberedList: "\u007C"
readonly property string visibilityOff: "\u007D" readonly property string tickIcon: "\u007D"
readonly property string visibilityOn: "\u007E" readonly property string triState: "\u007E"
readonly property string wildcard: "\u007F" readonly property string unLinked: "\u007F"
readonly property string zoomAll: "\u0080" readonly property string undo: "\u0080"
readonly property string zoomIn: "\u0081" readonly property string unpin: "\u0081"
readonly property string zoomOut: "\u0082" readonly property string upDownIcon: "\u0082"
readonly property string zoomSelection: "\u0083" readonly property string upDownSquare2: "\u0083"
readonly property string visibilityOff: "\u0084"
readonly property string visibilityOn: "\u0085"
readonly property string wildcard: "\u0086"
readonly property string zoomAll: "\u0087"
readonly property string zoomIn: "\u0088"
readonly property string zoomOut: "\u0089"
readonly property string zoomSelection: "\u008A"
readonly property font iconFont: Qt.font({ readonly property font iconFont: Qt.font({
"family": controlIcons.name, "family": controlIcons.name,
@@ -151,8 +158,4 @@ QtObject {
"family": mySystemFont.name, "family": mySystemFont.name,
"pointSize": Qt.application.font.pixelSize * 1.6 "pointSize": Qt.application.font.pixelSize * 1.6
}) })
readonly property color backgroundColor: "#c2c2c2"
readonly property bool showActionIndicatorBackground: false
} }

160
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioTheme/Values.qml
View File

@@ -1,6 +1,6 @@
/**************************************************************************** /****************************************************************************
** **
** Copyright (C) 2019 The Qt Company Ltd. ** Copyright (C) 2021 The Qt Company Ltd.
** Contact: https://www.qt.io/licensing/ ** Contact: https://www.qt.io/licensing/
** **
** This file is part of Qt Creator. ** This file is part of Qt Creator.
@@ -30,11 +30,11 @@ import QtQuickDesignerTheme 1.0
QtObject { QtObject {
id: values id: values
property real baseHeight: 20 property real baseHeight: 29
property real baseFont: 12 property real baseFont: 12
property real baseIconFont: 10 property real baseIconFont: 12
property real scaleFactor: 1.1 property real scaleFactor: 1.0
property real height: Math.round(values.baseHeight * values.scaleFactor) property real height: Math.round(values.baseHeight * values.scaleFactor)
property real myFontSize: Math.round(values.baseFont * values.scaleFactor) property real myFontSize: Math.round(values.baseFont * values.scaleFactor)
@@ -54,9 +54,9 @@ QtObject {
property real spinControlIconSize: 8 property real spinControlIconSize: 8
property real spinControlIconSizeMulti: values.spinControlIconSize * values.scaleFactor property real spinControlIconSizeMulti: values.spinControlIconSize * values.scaleFactor
property real sliderTrackHeight: values.height / 4 property real sliderTrackHeight: values.height / 3
property real sliderHandleHeight: values.sliderTrackHeight * 2 property real sliderHandleHeight: values.sliderTrackHeight * 1.8
property real sliderHandleWidth: values.sliderTrackHeight property real sliderHandleWidth: values.sliderTrackHeight * 0.5
property real sliderFontSize: Math.round(8 * values.scaleFactor) property real sliderFontSize: Math.round(8 * values.scaleFactor)
property real sliderPadding: Math.round(6 * values.scaleFactor) property real sliderPadding: Math.round(6 * values.scaleFactor)
property real sliderMargin: Math.round(3 * values.scaleFactor) property real sliderMargin: Math.round(3 * values.scaleFactor)
@@ -77,52 +77,126 @@ QtObject {
property real contextMenuLabelSpacing: Math.round(30 * values.scaleFactor) property real contextMenuLabelSpacing: Math.round(30 * values.scaleFactor)
property real contextMenuHorizontalPadding: Math.round(6 * values.scaleFactor) property real contextMenuHorizontalPadding: Math.round(6 * values.scaleFactor)
property real inputHorizontalPadding: Math.round(4 * values.scaleFactor) property real inputHorizontalPadding: Math.round(6 * values.scaleFactor)
property real typeLabelVerticalShift: Math.round(5 * values.scaleFactor)
property real scrollBarThickness: 10 property real scrollBarThickness: 10
property real toolTipHeight: 25
property int toolTipDelay: 1000
// Layout sizes
property real sectionColumnSpacing: 30 // distance between label and sliderControlSize
property real sectionRowSpacing: 5
property real sectionHeadGap: 15
property real sectionHeadHeight: 21 // tab and section
property real sectionHeadSpacerHeight: 15
property real controlLabelWidth: 15
property real controlLabelGap: 5
property real controlGap: 5 // TODO different name
property real columnGap: 10
property real iconAreaWidth: Math.round(21 * values.scaleFactor)
// Control sizes
property real defaultControlWidth: values.squareComponentWidth * 5
property real defaultControlHeight: values.height
property real actionIndicatorWidth: values.iconAreaWidth //StudioTheme.Values.squareComponentWidth
property real actionIndicatorHeight: values.height
property real spinBoxIndicatorWidth: values.smallRectWidth - 2 * values.border
property real spinBoxIndicatorHeight: values.height / 2 - values.border
property real sliderIndicatorWidth: values.squareComponentWidth
property real sliderIndicatorHeight: values.height
property real translationIndicatorWidth: values.squareComponentWidth
property real translationIndicatorHeight: values.height
property real checkIndicatorWidth: values.squareComponentWidth
property real checkIndicatorHeight: values.height
// Theme Colors // Theme Colors
// COLORS NOW COME FROM THE THEME FILES
property string themeControlBackground: Theme.color(Theme.DScontrolBackground)
property string themeControlOutline: Theme.color(Theme.DScontrolOutline)
property string themeTextColor: Theme.color(Theme.DStextColor)
property string themeDisabledTextColor: Theme.color(Theme.DSdisabledTextColor)
property string themePanelBackground: Theme.color(Theme.DSpanelBackground) property string themePanelBackground: Theme.color(Theme.DSpanelBackground)
property string themeHoverHighlight: Theme.color(Theme.DShoverHighlight)
property string themeColumnBackground: Theme.color(Theme.DScolumnBackground)
property string themeFocusEdit: Theme.color(Theme.DSfocusEdit)
property string themeFocusDrag: Theme.color(Theme.DSfocusDrag)
property string themeControlBackgroundPressed: Theme.color(Theme.DScontrolBackgroundPressed)
property string themeControlBackgroundChecked: Theme.color(Theme.DScontrolBackgroundChecked)
property string themeInteraction: Theme.color(Theme.DSinteraction)
property string themeSliderActiveTrack: Theme.color(Theme.DSsliderActiveTrack)
property string themeSliderInactiveTrack: Theme.color(Theme.DSsliderInactiveTrack)
property string themeSliderHandle: Theme.color(Theme.DSsliderHandle)
property string themeSliderActiveTrackHover: Theme.color(Theme.DSactiveTrackHover)
property string themeSliderInactiveTrackHover: Theme.color(Theme.DSsliderInactiveTrackHover)
property string themeSliderHandleHover: Theme.color(Theme.DSsliderHandleHover)
property string themeSliderActiveTrackFocus: Theme.color(Theme.DSsliderActiveTrackFocus)
property string themeSliderInactiveTrackFocus:Theme.color(Theme.DSsliderInactiveTrackFocus)
property string themeSliderHandleFocus: Theme.color(Theme.DSsliderHandleFocus)
property string themeErrorColor: Theme.color(Theme.DSerrorColor)
// NEW NEW NEW NEW NEW property string themeInteraction: Theme.color(Theme.DSinteraction)
property string themeError: Theme.color(Theme.DSerrorColor)
property string themeDisabled: Theme.color(Theme.DSdisabledColor)
// Control colors
property string themeControlBackground: Theme.color(Theme.DScontrolBackground)
property string themeControlBackgroundInteraction: Theme.color(Theme.DScontrolBackgroundInteraction)
property string themeControlBackgroundDisabled: Theme.color(Theme.DScontrolBackgroundDisabled) property string themeControlBackgroundDisabled: Theme.color(Theme.DScontrolBackgroundDisabled)
property string themeControlBackgroundGlobalHover: Theme.color(Theme.DScontrolBackgroundGlobalHover)
property string themeControlBackgroundHover: Theme.color(Theme.DScontrolBackgroundHover)
property string themeControlOutline: Theme.color(Theme.DScontrolOutline)
property string themeControlOutlineInteraction: Theme.color(Theme.DScontrolOutlineInteraction)
property string themeControlOutlineDisabled: Theme.color(Theme.DScontrolOutlineDisabled) property string themeControlOutlineDisabled: Theme.color(Theme.DScontrolOutlineDisabled)
// Text colors
property string themeTextColor: Theme.color(Theme.DStextColor)
property string themeTextColorDisabled: Theme.color(Theme.DStextColorDisabled) property string themeTextColorDisabled: Theme.color(Theme.DStextColorDisabled)
property string themeTextSelectionColor: Theme.color(Theme.DStextSelectionColor) property string themeTextSelectionColor: Theme.color(Theme.DStextSelectionColor)
property string themeTextSelectedTextColor:Theme.color(Theme.DStextSelectedTextColor) property string themeTextSelectedTextColor: Theme.color(Theme.DStextSelectedTextColor)
property string themePlaceholderTextColor: Theme.color(Theme.DSplaceholderTextColor)
property string themePlaceholderTextColorInteraction: Theme.color(Theme.DSplaceholderTextColorInteraction)
// Icon colors
property string themeIconColor: Theme.color(Theme.DSiconColor)
property string themeIconColorHover: Theme.color(Theme.DSiconColorHover)
property string themeIconColorInteraction: Theme.color(Theme.DSiconColorInteraction)
property string themeIconColorDisabled: Theme.color(Theme.DSiconColorDisabled)
property string themeIconColorSelected: Theme.color(Theme.DSiconColorSelected)
property string themeLinkIndicatorColor: Theme.color(Theme.DSlinkIndicatorColor)
property string themeLinkIndicatorColorHover: Theme.color(Theme.DSlinkIndicatorColorHover)
property string themeLinkIndicatorColorInteraction: Theme.color(Theme.DSlinkIndicatorColorInteraction)
property string themeLinkIndicatorColorDisabled: Theme.color(Theme.DSlinkIndicatorColorDisabled)
// Popup background color (ComboBox, SpinBox, TextArea)
property string themePopupBackground: Theme.color(Theme.DSpopupBackground)
// GradientPopupDialog modal overly color
property string themePopupOverlayColor: Theme.color(Theme.DSpopupOverlayColor)
// ToolTip (UrlChooser)
property string themeToolTipBackground: Theme.color(Theme.DStoolTipBackground)
property string themeToolTipOutline: Theme.color(Theme.DStoolTipOutline)
property string themeToolTipText: Theme.color(Theme.DStoolTipText)
// Slider colors
property string themeSliderActiveTrack: Theme.color(Theme.DSsliderActiveTrack)
property string themeSliderActiveTrackHover: Theme.color(Theme.DSactiveTrackHover)
property string themeSliderActiveTrackFocus: Theme.color(Theme.DSsliderActiveTrackFocus)
property string themeSliderInactiveTrack: Theme.color(Theme.DSsliderInactiveTrack)
property string themeSliderInactiveTrackHover: Theme.color(Theme.DSsliderInactiveTrackHover)
property string themeSliderInactiveTrackFocus: Theme.color(Theme.DSsliderInactiveTrackFocus)
property string themeSliderHandle: Theme.color(Theme.DSsliderHandle)
property string themeSliderHandleHover: Theme.color(Theme.DSsliderHandleHover)
property string themeSliderHandleFocus: Theme.color(Theme.DSsliderHandleFocus)
property string themeSliderHandleInteraction: Theme.color(Theme.DSsliderHandleInteraction)
property string themeScrollBarTrack: Theme.color(Theme.DSscrollBarTrack) property string themeScrollBarTrack: Theme.color(Theme.DSscrollBarTrack)
property string themeScrollBarHandle: Theme.color(Theme.DSscrollBarHandle) property string themeScrollBarHandle: Theme.color(Theme.DSscrollBarHandle)
property string themeControlBackgroundInteraction: Theme.color(Theme.DScontrolBackgroundInteraction) // TODO Name. Right now themeFocusEdit is used for all 'edit' states. Is that correct? Different color!
property string themeTranslationIndicatorBorder: Theme.color(Theme.DStranlsationIndicatorBorder)
property string themeSectionHeadBackground: Theme.color(Theme.DSsectionHeadBackground) property string themeSectionHeadBackground: Theme.color(Theme.DSsectionHeadBackground)
property string themeTabDark: Theme.color(Theme.QmlDesigner_TabDark) property string themeTabActiveBackground: Theme.color(Theme.DStabActiveBackground)
property string themeTabLight: Theme.color(Theme.QmlDesigner_TabLight) property string themeTabActiveText: Theme.color(Theme.DStabActiveText)
property string themeTabInactiveBackground: Theme.color(Theme.DStabInactiveBackground)
property string themeTabInactiveText: Theme.color(Theme.DStabInactiveText)
property string themeStateDefaultHighlight: "#ffe400" property string themeStateDefaultHighlight: Theme.color(Theme.DSstateDefaultHighlight)
property string themeStateSeparator: Theme.color(Theme.DSstateSeparatorColor)
property string themeStateBackground: Theme.color(Theme.DSstateBackgroundColor)
property string themeStatePreviewOutline: Theme.color(Theme.DSstatePreviewOutline)
// Taken out of Constants.js // Taken out of Constants.js
property string themeChangedStateText: Theme.color(Theme.DSchangedStateText) property string themeChangedStateText: Theme.color(Theme.DSchangedStateText)
@@ -131,4 +205,16 @@ QtObject {
property string theme3DAxisXColor: Theme.color(Theme.DS3DAxisXColor) property string theme3DAxisXColor: Theme.color(Theme.DS3DAxisXColor)
property string theme3DAxisYColor: Theme.color(Theme.DS3DAxisYColor) property string theme3DAxisYColor: Theme.color(Theme.DS3DAxisYColor)
property string theme3DAxisZColor: Theme.color(Theme.DS3DAxisZColor) property string theme3DAxisZColor: Theme.color(Theme.DS3DAxisZColor)
property string themeActionBinding: Theme.color(Theme.DSactionBinding)
property string themeActionAlias: Theme.color(Theme.DSactionAlias)
property string themeActionKeyframe: Theme.color(Theme.DSactionKeyframe)
property string themeActionJIT: Theme.color(Theme.DSactionJIT)
property string themeListItemBackground: Theme.color(Theme.DSnavigatorItemBackground)
property string themeListItemBackgroundHover: Theme.color(Theme.DSnavigatorItemBackgroundHover)
property string themeListItemBackgroundPress: Theme.color(Theme.DSnavigatorItemBackgroundSelected)
property string themeListItemText: Theme.color(Theme.DSnavigatorText)
property string themeListItemTextHover: Theme.color(Theme.DSnavigatorTextHover)
property string themeListItemTextPress: Theme.color(Theme.DSnavigatorTextSelected)
} }

BIN
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioTheme/icons.ttf
View File

Binary file not shown.

30
share/qtcreator/qmldesigner/statesEditorQmlSources/StatesDelegate.qml
View File

@@ -170,7 +170,7 @@ Rectangle {
Rectangle { Rectangle {
anchors.margins: (isDefaultState || (isBaseState && !modelHasDefaultState)) ? -myRoot.highlightBorderWidth : 0 anchors.margins: (isDefaultState || (isBaseState && !modelHasDefaultState)) ? -myRoot.highlightBorderWidth : 0
anchors.fill: column anchors.fill: column
color: Theme.color(Theme.DSsliderActiveTrackFocus) color: StudioTheme.Values.themeStateSeparator
border.color: StudioTheme.Values.themeStateDefaultHighlight border.color: StudioTheme.Values.themeStateDefaultHighlight
border.width: (isDefaultState || (isBaseState && !modelHasDefaultState)) ? myRoot.highlightBorderWidth : 0 border.width: (isDefaultState || (isBaseState && !modelHasDefaultState)) ? myRoot.highlightBorderWidth : 0
} }
@@ -188,14 +188,14 @@ Rectangle {
width: myRoot.width - 2 * myRoot.stateMargin width: myRoot.width - 2 * myRoot.stateMargin
height: myRoot.topAreaHeight height: myRoot.topAreaHeight
color: Theme.color(Theme.DShoverHighlight) color: StudioTheme.Values.themeStateBackground
StudioControls.TextField { StudioControls.TextField {
id: stateNameField id: stateNameField
property string oldValue property string oldValue
width: StudioTheme.Values.height * 7 width: StudioTheme.Values.height * 5.5
anchors.top: parent.top anchors.top: parent.top
anchors.topMargin: myRoot.textFieldMargin anchors.topMargin: myRoot.textFieldMargin
@@ -247,7 +247,7 @@ Rectangle {
anchors.rightMargin: myRoot.previewMargin anchors.rightMargin: myRoot.previewMargin
anchors.verticalCenter: stateNameField.verticalCenter anchors.verticalCenter: stateNameField.verticalCenter
color: Theme.color(Theme.DStextColor) color: StudioTheme.Values.themeTextColor
font.italic: true font.italic: true
font.pixelSize: StudioTheme.Values.myFontSize font.pixelSize: StudioTheme.Values.myFontSize
font.family: StudioTheme.Constants.font font.family: StudioTheme.Constants.font
@@ -261,27 +261,29 @@ Rectangle {
Rectangle { Rectangle {
id: stateImageArea id: stateImageArea
width: myRoot.width - 2 * myRoot.stateMargin width: myRoot.width - 2 * myRoot.stateMargin
height: myRoot.bottomAreaHeight height: myRoot.bottomAreaHeight
color: StudioTheme.Values.themeStateBackground
color: Theme.color(Theme.DShoverHighlight)
visible: expanded visible: expanded
Image {
anchors.fill: stateImageBackground
source: "images/checkers.png"
fillMode: Image.Tile
}
Rectangle { Rectangle {
border.width: StudioTheme.Values.border id: stateImageBackground
border.color: Theme.color(Theme.DSsliderActiveTrackFocus)
color: Theme.color(Theme.DSsliderInactiveTrack)
anchors.centerIn: parent anchors.centerIn: parent
width: Math.round(stateImage.paintedWidth) + 2 * StudioTheme.Values.border width: Math.round(stateImage.paintedWidth) + 2 * StudioTheme.Values.border
height: Math.round(stateImage.paintedHeight) + 2 * StudioTheme.Values.border height: Math.round(stateImage.paintedHeight) + 2 * StudioTheme.Values.border
color: "transparent"
border.width: StudioTheme.Values.border
border.color: StudioTheme.Values.themeStatePreviewOutline
} }
Image { Image {
id: stateImage id: stateImage
anchors.margins: myRoot.previewMargin anchors.margins: myRoot.previewMargin
anchors.centerIn: parent anchors.centerIn: parent
anchors.fill: parent anchors.fill: parent

8
share/qtcreator/qmldesigner/statesEditorQmlSources/StatesList.qml
View File

@@ -33,7 +33,7 @@ import StudioTheme 1.0 as StudioTheme
FocusScope { FocusScope {
id: root id: root
property int delegateTopAreaHeight: 30 property int delegateTopAreaHeight: StudioTheme.Values.height + 8
property int delegateBottomAreaHeight: 200 property int delegateBottomAreaHeight: 200
property int delegateColumnSpacing: 2 property int delegateColumnSpacing: 2
property int delegateStateMargin: 16 property int delegateStateMargin: 16
@@ -72,7 +72,7 @@ FocusScope {
Rectangle { Rectangle {
id: background id: background
anchors.fill: parent anchors.fill: parent
color: Theme.color(Theme.QmlDesigner_BackgroundColorDarkAlternate) color: StudioTheme.Values.themePanelBackground
} }
MouseArea { MouseArea {
@@ -137,7 +137,7 @@ FocusScope {
} }
Rectangle { Rectangle {
color: Theme.color(Theme.DSsliderActiveTrackFocus) color: StudioTheme.Values.themeStateSeparator
x: root.padding x: root.padding
y: root.padding y: root.padding
width: Math.min((root.delegateWidth * flickable.count) + (2 * (flickable.count - 1)), width: Math.min((root.delegateWidth * flickable.count) + (2 * (flickable.count - 1)),
@@ -168,7 +168,7 @@ FocusScope {
height: root.delegateHeight height: root.delegateHeight
isBaseState: 0 === internalNodeId isBaseState: 0 === internalNodeId
isCurrentState: root.currentStateInternalId === internalNodeId isCurrentState: root.currentStateInternalId === internalNodeId
baseColor: isCurrentState ? Theme.color(Theme.DSinteraction) : background.color baseColor: isCurrentState ? StudioTheme.Values.themeInteraction : background.color
delegateStateName: stateName delegateStateName: stateName
delegateStateImageSource: stateImageSource delegateStateImageSource: stateImageSource
delegateStateImageSize: stateImageSize delegateStateImageSize: stateImageSize

BIN
share/qtcreator/qmldesigner/statesEditorQmlSources/images/checkers.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 80 B

160
share/qtcreator/themes/dark.creatortheme
View File

@@ -22,44 +22,136 @@ backgroundColorDisabled=ff444444
qmlDesignerButtonColor=ff3c3e40 qmlDesignerButtonColor=ff3c3e40
[Colors] [Colors]
;DS controls theme START ;DS controls theme START
DScontrolBackground=ff404040 DSpanelBackground=ff323232
DScontrolOutline=ff595959
DStextColor=ffffffff DSinteraction=ff2aafd3
DSdisabledTextColor=ff909090
DSpanelBackground=ff454444
DShoverHighlight=ff313131
DScolumnBackground=ff363636
DSfocusEdit=ff444444
DSfocusDrag=ff565656
DScontrolBackgroundPressed=ff7a7a7a
DScontrolBackgroundChecked=ff565656
DSinteraction=ff3f91c4
DSsliderActiveTrack=ff7a7a7a
DSsliderInactiveTrack=ff4d4d4d
DSsliderHandle=ff505050
DSsliderActiveTrackHover=ff7f7f7f
DSsliderInactiveTrackHover=ff505050
DSsliderHandleHover=ff7a7a7a
DSsliderActiveTrackFocus=ffaaaaaa
DSsliderInactiveTrackFocus=ff7a7a7a
DSsliderHandleFocus=ff3f91c4
DSerrorColor=ffdf3a3a DSerrorColor=ffdf3a3a
DScontrolBackgroundDisabled=ff363636 DSdisabledColor=ff707070
DScontrolOutlineDisabled=ff4d4d4d
DStextColorDisabled=ff7a7a7a DScontrolBackground=ff323232
DStextSelectionColor=ff3f91c4 DScontrolBackgroundInteraction=ff595959
DStextSelectedTextColor=ffffffff DScontrolBackgroundDisabled=ff323232
DSscrollBarTrack=ff4d4d4d DScontrolBackgroundGlobalHover=ff474747
DScontrolBackgroundHover=ff666666
DScontrolOutline=ff1f1f1f
DScontrolOutlineInteraction=ff2aafd3
DScontrolOutlineDisabled=ff707070
DStextColor=ffffffff
DStextColorDisabled=ff707070
DStextSelectionColor=ff2aafd3
DStextSelectedTextColor=ff000000
DSplaceholderTextColor=ffffffff
DSplaceholderTextColorInteraction=ffababab
DSiconColor=ffffffff
DSiconColorHover=ff262626
DSiconColorInteraction=ff707070
DSiconColorDisabled=ff707070
DSiconColorSelected=ff2aafd3
DSlinkIndicatorColor=ff808080
DSlinkIndicatorColorHover=ffffffff
DSlinkIndicatorColorInteraction=ff2aafd3
DSlinkIndicatorColorDisabled=ff707070
DSpopupBackground=ff474747
DSpopupOverlayColor=99191919
DSsliderActiveTrack=ff7c7b7b
DSsliderActiveTrackHover=ff000000
DSsliderActiveTrackFocus=ffaaaaaa
DSsliderInactiveTrack=ff595959
DSsliderInactiveTrackHover=ff505050
DSsliderInactiveTrackFocus=ff606060
DSsliderHandle=ff1f1f1f
DSsliderHandleHover=ff606060
DSsliderHandleFocus=ff0492c9
DSsliderHandleInteraction=ff2aafd3
DSscrollBarTrack=ff404040
DSscrollBarHandle=ff505050 DSscrollBarHandle=ff505050
DScontrolBackgroundInteraction=ff4d4d4d
DStranslationIndicatorBorder=ff7f7f7f DSsectionHeadBackground=ff1f1f1f
DSsectionHeadBackground=ff424242
DSstateDefaultHighlight=ffffe400
DSstateSeparatorColor=ff7c7b7b
DSstateBackgroundColor=ff383838
DSstatePreviewOutline=ffaaaaaa
DSchangedStateText=ff99ccff DSchangedStateText=ff99ccff
DS3DAxisXColor=ffe00000
DS3DAxisXColor=ffd00000
DS3DAxisYColor=ff009900 DS3DAxisYColor=ff009900
DS3DAxisZColor=ff6060ff DS3DAxisZColor=ff5050ff
DSactionBinding=ff2aafd3
DSactionAlias=fff93a3a
DSactionKeyframe=ffe0e01b
DSactionJIT=ff2db543
DStableHeaderBackground=ffff0000
DStableHeaderText=ff00ff00
DSdockContainerBackground=ff323232
DSdockContainerSplitter=ff323232
DSdockAreaBackground=ff262728
DSdockWidgetBackground=ff00ff00
DSdockWidgetSplitter=ff595959
DSdockWidgetTitleBar=ff1f1f1f
DStitleBarText=ffdadada
DStitleBarIcon=ffffffff
DStitleBarButtonHover=40ffffff
DStitleBarButtonPress=60ffffff
DStabContainerBackground=ff0000ff
DStabSplitter=ff595959
DStabInactiveBackground=ff1f1f1f
DStabInactiveText=ffdadada
DStabInactiveIcon=ffffffff
DStabInactiveButtonHover=ff1f1f1f
DStabInactiveButtonPress=ff1f1f1f
DStabActiveBackground=ffdadada
DStabActiveText=ff111111
DStabActiveIcon=ff000000
DStabActiveButtonHover=ffdadada
DStabActiveButtonPress=ffdadada
DStabFocusBackground=ff2aafd3
DStabFocusText=ff111111
DStabFocusIcon=ff000000
DStabFocusButtonHover=ff2aafd3
DStabFocusButtonPress=ff2aafd3
DSnavigatorBranch=ff7c7b7b
DSnavigatorBranchIndicator=ff7c7b7b
DSnavigatorItemBackground=ff262626
DSnavigatorItemBackgroundHover=ff666666
DSnavigatorItemBackgroundSelected=ff1f1f1f
DSnavigatorText=ffffffff
DSnavigatorTextHover=ff1f1f1f
DSnavigatorTextSelected=ff2aafd3
DSnavigatorIcon=ffffffff
DSnavigatorIconHover=ff1f1f1f
DSnavigatorIconSelected=ff7c7b7b
DSnavigatorAliasIconChecked=ffff0000
DSnavigatorDropIndicatorBackground=ff2aafd3
DSnavigatorDropIndicatorOutline=ff2aafd3
DSheaderViewBackground=ff1f1f1f
DStableViewAlternateBackground=ff00ff00
DStoolTipBackground=ff111111
DStoolTipOutline=ffdadada
DStoolTipText=ffdadada
;DS controls theme END ;DS controls theme END
BackgroundColorAlternate=alternateBackground BackgroundColorAlternate=alternateBackground
@@ -263,7 +355,7 @@ QmlDesigner_BackgroundColor=qmlDesignerButtonColor
QmlDesigner_HighlightColor=ff46a2da QmlDesigner_HighlightColor=ff46a2da
QmlDesigner_FormEditorSelectionColor=ff4ba2ff QmlDesigner_FormEditorSelectionColor=ff4ba2ff
QmlDesigner_FormEditorForegroundColor=ffffffff QmlDesigner_FormEditorForegroundColor=ffffffff
QmlDesigner_BackgroundColorDarkAlternate=qmlDesignerButtonColor QmlDesigner_BackgroundColorDarkAlternate=ff323232
QmlDesigner_BackgroundColorDarker=ff151515 QmlDesigner_BackgroundColorDarker=ff151515
QmlDesigner_BorderColor=splitterColor QmlDesigner_BorderColor=splitterColor
QmlDesigner_ButtonColor=ff505050 QmlDesigner_ButtonColor=ff505050

162
share/qtcreator/themes/default.creatortheme
View File

@@ -13,44 +13,136 @@ splitterColor=ff151515
qmlDesignerButtonColor=ff4c4e50 qmlDesignerButtonColor=ff4c4e50
[Colors] [Colors]
;DS controls theme START ;DS controls theme START
DScontrolBackground=ff404040 DSpanelBackground=ffeaeaea
DScontrolOutline=ff595959
DStextColor=ffffffff DSinteraction=ff2aafd3
DSdisabledTextColor=ff909090
DSpanelBackground=ff454444
DShoverHighlight=ff313131
DScolumnBackground=ff363636
DSfocusEdit=ff444444
DSfocusDrag=ff565656
DScontrolBackgroundPressed=ff7a7a7a
DScontrolBackgroundChecked=ff565656
DSinteraction=ff3f91c4
DSsliderActiveTrack=ff7a7a7a
DSsliderInactiveTrack=ff4d4d4d
DSsliderHandle=ff505050
DSsliderActiveTrackHover=ff7f7f7f
DSsliderInactiveTrackHover=ff505050
DSsliderHandleHover=ff7a7a7a
DSsliderActiveTrackFocus=ffaaaaaa
DSsliderInactiveTrackFocus=ff7a7a7a
DSsliderHandleFocus=ff3f91c4
DSerrorColor=ffdf3a3a DSerrorColor=ffdf3a3a
DScontrolBackgroundDisabled=ff363636 DSdisabledColor=ff8e8e8e
DScontrolOutlineDisabled=ff4d4d4d
DStextColorDisabled=ff7a7a7a DScontrolBackground=ffeaeaea
DStextSelectionColor=ff3f91c4 DScontrolBackgroundInteraction=ffc9c9c9
DStextSelectedTextColor=ffffffff DScontrolBackgroundDisabled=ff8e8e8e
DSscrollBarTrack=ff4d4d4d DScontrolBackgroundGlobalHover=ffe5e5e5
DSscrollBarHandle=ff505050 DScontrolBackgroundHover=ffd1d1d1
DScontrolBackgroundInteraction=ff4d4d4d
DStranslationIndicatorBorder=ff7f7f7f DScontrolOutline=ffcecccc
DSsectionHeadBackground=ff424242 DScontrolOutlineInteraction=ff2aafd3
DScontrolOutlineDisabled=ff707070
DStextColor=ff262626
DStextColorDisabled=ff707070
DStextSelectionColor=ff2aafd3
DStextSelectedTextColor=ff000000
DSplaceholderTextColor=ff262626
DSplaceholderTextColorInteraction=ffababab
DSiconColor=ff262626
DSiconColorHover=ff191919
DSiconColorInteraction=ffffffff
DSiconColorDisabled=ff707070
DSiconColorSelected=ff2aafd3
DSlinkIndicatorColor=ff808080
DSlinkIndicatorColorHover=ff1f1f1f
DSlinkIndicatorColorInteraction=ff2aafd3
DSlinkIndicatorColorDisabled=ff707070
DSpopupBackground=ffd3d3d3
DSpopupOverlayColor=99191919
DSsliderActiveTrack=ff7c7b7b
DSsliderActiveTrackHover=ff000000
DSsliderActiveTrackFocus=ffaaaaaa
DSsliderInactiveTrack=ffaaaaaa
DSsliderInactiveTrackHover=ff505050
DSsliderInactiveTrackFocus=ff606060
DSsliderHandle=ff1f1f1f
DSsliderHandleHover=ff606060
DSsliderHandleFocus=ff0492c9
DSsliderHandleInteraction=ff2aafd3
DSscrollBarTrack=ffb5b4b4
DSscrollBarHandle=ff9b9b9b
DSsectionHeadBackground=ffd8d8d8
DSstateDefaultHighlight=ffffe400
DSstateSeparatorColor=ffadadad
DSstateBackgroundColor=ffe0e0e0
DSstatePreviewOutline=ff363636
DSchangedStateText=ff99ccff DSchangedStateText=ff99ccff
DS3DAxisXColor=ffe00000
DS3DAxisXColor=ffd00000
DS3DAxisYColor=ff009900 DS3DAxisYColor=ff009900
DS3DAxisZColor=ff6060ff DS3DAxisZColor=ff5050ff
DSactionBinding=ff2aafd3
DSactionAlias=fff93a3a
DSactionKeyframe=ffe0e01b
DSactionJIT=ff2db543
DStableHeaderBackground=ffff0000
DStableHeaderText=ff00ff00
DSdockContainerBackground=ff323232
DSdockContainerSplitter=ff323232
DSdockAreaBackground=ff262728
DSdockWidgetBackground=ff00ff00
DSdockWidgetSplitter=ff595959
DSdockWidgetTitleBar=ffeaeaea
DStitleBarText=ffdadada
DStitleBarIcon=f4f5052
DStitleBarButtonHover=40ffffff
DStitleBarButtonPress=60ffffff
DStabContainerBackground=ff0000ff
DStabSplitter=ff595959
DStabInactiveBackground=ff999999
DStabInactiveText=ff262626
DStabInactiveIcon=ffffffff
DStabInactiveButtonHover=ff1f1f1f
DStabInactiveButtonPress=ff1f1f1f
DStabActiveBackground=ffdadada
DStabActiveText=ff111111
DStabActiveIcon=ff000000
DStabActiveButtonHover=ffdadada
DStabActiveButtonPress=ffdadada
DStabFocusBackground=ff2aafd3
DStabFocusText=ff111111
DStabFocusIcon=ff000000
DStabFocusButtonHover=ff2aafd3
DStabFocusButtonPress=ff2aafd3
DSnavigatorBranch=ff7c7b7b
DSnavigatorBranchIndicator=ff7c7b7b
DSnavigatorItemBackground=ffd8d8d8
DSnavigatorItemBackgroundHover=ffc2c2c2
DSnavigatorItemBackgroundSelected=ffffffff
DSnavigatorText=ff262626
DSnavigatorTextHover=ff1f1f1f
DSnavigatorTextSelected=ff2aafd3
DSnavigatorIcon=ff1f1f1f
DSnavigatorIconHover=ff1f1f1f
DSnavigatorIconSelected=ff7c7b7b
DSnavigatorAliasIconChecked=ffff0000
DSnavigatorDropIndicatorBackground=ff2aafd3
DSnavigatorDropIndicatorOutline=ff2aafd3
DSheaderViewBackground=ffd8d8d8
DStableViewAlternateBackground=ff00ff00
DStoolTipBackground=ff111111
DStoolTipOutline=ffdadada
DStoolTipText=ffdadada
;DS controls theme END ;DS controls theme END
BackgroundColorAlternate=ff3d3d3d BackgroundColorAlternate=ff3d3d3d
@@ -232,7 +324,7 @@ QmlDesigner_BackgroundColor=qmlDesignerButtonColor
QmlDesigner_HighlightColor=ff46a2da QmlDesigner_HighlightColor=ff46a2da
QmlDesigner_FormEditorSelectionColor=ff4ba2ff QmlDesigner_FormEditorSelectionColor=ff4ba2ff
QmlDesigner_FormEditorForegroundColor=brightText QmlDesigner_FormEditorForegroundColor=brightText
QmlDesigner_BackgroundColorDarkAlternate=qmlDesignerButtonColor QmlDesigner_BackgroundColorDarkAlternate=ffeaeaea
QmlDesigner_BackgroundColorDarker=ff4e4e4e QmlDesigner_BackgroundColorDarker=ff4e4e4e
QmlDesigner_BorderColor=splitterColor QmlDesigner_BorderColor=splitterColor
QmlDesigner_ButtonColor=ff7a7a7a QmlDesigner_ButtonColor=ff7a7a7a

167
share/qtcreator/themes/design-light.creatortheme
View File

@@ -24,53 +24,146 @@ splitter=ffbdbebf
qmlDesignerButtonColor=fff8f8f8 qmlDesignerButtonColor=fff8f8f8
textColorLink=ff007af4 textColorLink=ff007af4
textColorLinkVisited=ffa57aff textColorLinkVisited=ffa57aff
backgroundColorDisabled=ff444444 backgroundColorDisabled=ff8e8e8e
[Colors] [Colors]
;DS controls theme START ;DS controls theme START
DScontrolBackground=ffffffff DSpanelBackground=ffeaeaea
DScontrolOutline=ff777777
DStextColor=ff242424 DSinteraction=ff2aafd3
DSdisabledTextColor=ff505050
DSpanelBackground=fff2f2f2
DShoverHighlight=ffe6e6e6
DScolumnBackground=ffaaaaaa
DSfocusEdit=ffeaeaea
DSfocusDrag=ffd1d1d1
DScontrolBackgroundPressed=ff505050
DScontrolBackgroundChecked=ff5e5e5e
DSinteraction=ff0492c9
DSsliderActiveTrack=ff363636
DSsliderInactiveTrack=ffe6e6e6
DSsliderHandle=ff777777
DSsliderActiveTrackHover=ff7f7f7f
DSsliderInactiveTrackHover=ff5e5e5e
DSsliderHandleHover=ff505050
DSsliderActiveTrackFocus=ff363636
DSsliderInactiveTrackFocus=ff505050
DSsliderHandleFocus=ff0492c9
DSerrorColor=ffdf3a3a DSerrorColor=ffdf3a3a
DScontrolBackgroundDisabled=ffaaaaaa DSdisabledColor=ff8e8e8e
DScontrolOutlineDisabled=ff777777
DStextColorDisabled=ff505050 DScontrolBackground=ffeaeaea
DStextSelectionColor=ff0492c9 DScontrolBackgroundInteraction=ffc9c9c9
DStextSelectedTextColor=ffffffff DScontrolBackgroundDisabled=ff8e8e8e
DSscrollBarTrack=ff777777 DScontrolBackgroundGlobalHover=ffe5e5e5
DSscrollBarHandle=ff505050 DScontrolBackgroundHover=ffd1d1d1
DScontrolBackgroundInteraction=ff777777
DStranslationIndicatorBorder=ffebebeb DScontrolOutline=ffcecccc
DSsectionHeadBackground=ffebebeb DScontrolOutlineInteraction=ff2aafd3
DScontrolOutlineDisabled=ff707070
DStextColor=ff262626
DStextColorDisabled=ff707070
DStextSelectionColor=ff2aafd3
DStextSelectedTextColor=ff000000
DSplaceholderTextColor=ff262626
DSplaceholderTextColorInteraction=ffababab
DSiconColor=ff262626
DSiconColorHover=ff191919
DSiconColorInteraction=ffffffff
DSiconColorDisabled=ff707070
DSiconColorSelected=ff2aafd3
DSlinkIndicatorColor=ff808080
DSlinkIndicatorColorHover=ff1f1f1f
DSlinkIndicatorColorInteraction=ff2aafd3
DSlinkIndicatorColorDisabled=ff707070
DSpopupBackground=ffd3d3d3
DSpopupOverlayColor=99191919
DSsliderActiveTrack=ff7c7b7b
DSsliderActiveTrackHover=ff000000
DSsliderActiveTrackFocus=ffaaaaaa
DSsliderInactiveTrack=ffaaaaaa
DSsliderInactiveTrackHover=ff505050
DSsliderInactiveTrackFocus=ff606060
DSsliderHandle=ff1f1f1f
DSsliderHandleHover=ff606060
DSsliderHandleFocus=ff0492c9
DSsliderHandleInteraction=ff2aafd3
DSscrollBarTrack=ffb5b4b4
DSscrollBarHandle=ff9b9b9b
DSsectionHeadBackground=ffd8d8d8
DSstateDefaultHighlight=ffffe400
DSstateSeparatorColor=ffadadad
DSstateBackgroundColor=ffe0e0e0
DSstatePreviewOutline=ff363636
DSchangedStateText=ff99ccff DSchangedStateText=ff99ccff
DS3DAxisXColor=ffff0000
DS3DAxisYColor=ff00A000 DS3DAxisXColor=ffd00000
DS3DAxisZColor=ff0000ff DS3DAxisYColor=ff009900
DS3DAxisZColor=ff5050ff
DSactionBinding=ff2aafd3
DSactionAlias=fff93a3a
DSactionKeyframe=ffe0e01b
DSactionJIT=ff2db543
DStableHeaderBackground=ffff0000
DStableHeaderText=ff00ff00
DSdockContainerBackground=ff323232
DSdockContainerSplitter=ff323232
DSdockAreaBackground=ff262728
DSdockWidgetBackground=ff00ff00
DSdockWidgetSplitter=ff595959
DSdockWidgetTitleBar=ffeaeaea
DStitleBarText=ffdadada
DStitleBarIcon=f4f5052
DStitleBarButtonHover=40ffffff
DStitleBarButtonPress=60ffffff
DStabContainerBackground=ff0000ff
DStabSplitter=ff595959
DStabInactiveBackground=ff999999
DStabInactiveText=ff262626
DStabInactiveIcon=ffffffff
DStabInactiveButtonHover=ff1f1f1f
DStabInactiveButtonPress=ff1f1f1f
DStabActiveBackground=ffdadada
DStabActiveText=ff111111
DStabActiveIcon=ff000000
DStabActiveButtonHover=ffdadada
DStabActiveButtonPress=ffdadada
DStabFocusBackground=ff2aafd3
DStabFocusText=ff111111
DStabFocusIcon=ff000000
DStabFocusButtonHover=ff2aafd3
DStabFocusButtonPress=ff2aafd3
DSnavigatorBranch=ff7c7b7b
DSnavigatorBranchIndicator=ff7c7b7b
DSnavigatorItemBackground=ffd8d8d8
DSnavigatorItemBackgroundHover=ffc2c2c2
DSnavigatorItemBackgroundSelected=ffffffff
DSnavigatorText=ff262626
DSnavigatorTextHover=ff1f1f1f
DSnavigatorTextSelected=ff2aafd3
DSnavigatorIcon=ff1f1f1f
DSnavigatorIconHover=ff1f1f1f
DSnavigatorIconSelected=ff7c7b7b
DSnavigatorAliasIconChecked=ffff0000
DSnavigatorDropIndicatorBackground=ff2aafd3
DSnavigatorDropIndicatorOutline=ff2aafd3
DSheaderViewBackground=ffd8d8d8
DStableViewAlternateBackground=ff00ff00
DStoolTipBackground=ff111111
DStoolTipOutline=ffdadada
DStoolTipText=ffdadada
;DS controls theme END ;DS controls theme END
BackgroundColorAlternate=alternateBackground BackgroundColorAlternate=alternateBackground
BackgroundColorDark=shadowBackground BackgroundColorDark=shadowBackground
BackgroundColorHover=hoverBackground BackgroundColorHover=hoverBackground
BackgroundColorNormal=normalBackground BackgroundColorNormal=normalBackground
BackgroundColorDisabled=ff444444 BackgroundColorDisabled=ff7a7a7a
BackgroundColorSelected=selectedBackground BackgroundColorSelected=selectedBackground
BadgeLabelBackgroundColorChecked=ffe0e0e0 BadgeLabelBackgroundColorChecked=ffe0e0e0
BadgeLabelBackgroundColorUnchecked=ff808080 BadgeLabelBackgroundColorUnchecked=ff808080
@@ -246,7 +339,7 @@ QmlDesigner_BackgroundColor=qmlDesignerButtonColor
QmlDesigner_HighlightColor=ff0492c9 QmlDesigner_HighlightColor=ff0492c9
QmlDesigner_FormEditorSelectionColor=ffd3299a QmlDesigner_FormEditorSelectionColor=ffd3299a
QmlDesigner_FormEditorForegroundColor=ffffffff QmlDesigner_FormEditorForegroundColor=ffffffff
QmlDesigner_BackgroundColorDarkAlternate=qmlDesignerButtonColor QmlDesigner_BackgroundColorDarkAlternate=ffeaeaea
QmlDesigner_BackgroundColorDarker=fff5f5f5 QmlDesigner_BackgroundColorDarker=fff5f5f5
QmlDesigner_BorderColor=splitter QmlDesigner_BorderColor=splitter
QmlDesigner_ButtonColor=f0f0f0 QmlDesigner_ButtonColor=f0f0f0

158
share/qtcreator/themes/design.creatortheme
View File

@@ -4,7 +4,7 @@ PreferredStyles=Fusion
DefaultTextEditorColorScheme=creator-dark.xml DefaultTextEditorColorScheme=creator-dark.xml
[Palette] [Palette]
shadowBackground=ff191919 shadowBackground=ff1f1f1f
text=ffdadada text=ffdadada
textDisabled=60a4a6a8 textDisabled=60a4a6a8
selectedBackgroundText=aa1f75cc selectedBackgroundText=aa1f75cc
@@ -23,47 +23,137 @@ textColorLink=ff007af4
textColorLinkVisited=ffa57aff textColorLinkVisited=ffa57aff
backgroundColorDisabled=ff444444 backgroundColorDisabled=ff444444
[Colors] [Colors]
;DS controls theme START ;DS controls theme START
DScontrolBackground=ff242424 DSpanelBackground=ff323232
DScontrolOutline=ff404040
DStextColor=ffffffff DSinteraction=ff2aafd3
DSdisabledTextColor=ff909090
DSpanelBackground=ff2a2a2a
DShoverHighlight=ff313131
DScolumnBackground=ff363636
DSfocusEdit=ff444444
DSfocusDrag=ff565656
DScontrolBackgroundPressed=ff606060
DScontrolBackgroundChecked=ff565656
DSinteraction=ff0492c9
DSsliderActiveTrack=ff606060
DSsliderInactiveTrack=ff404040
DSsliderHandle=ff505050
DSsliderActiveTrackHover=ff7f7f7f
DSsliderInactiveTrackHover=ff505050
DSsliderHandleHover=ff606060
DSsliderActiveTrackFocus=ffaaaaaa
DSsliderInactiveTrackFocus=ff606060
DSsliderHandleFocus=ff0492c9
DSerrorColor=ffdf3a3a DSerrorColor=ffdf3a3a
DScontrolBackgroundDisabled=ff363636 DSdisabledColor=ff707070
DScontrolOutlineDisabled=ff404040
DStextColorDisabled=ff606060 DScontrolBackground=ff323232
DStextSelectionColor=ff0492c9 DScontrolBackgroundInteraction=ff595959
DStextSelectedTextColor=ffffffff DScontrolBackgroundDisabled=ff323232
DScontrolBackgroundGlobalHover=ff474747
DScontrolBackgroundHover=ff666666
DScontrolOutline=ff1f1f1f
DScontrolOutlineInteraction=ff2aafd3
DScontrolOutlineDisabled=ff707070
DStextColor=ffffffff
DStextColorDisabled=ff707070
DStextSelectionColor=ff2aafd3
DStextSelectedTextColor=ff000000
DSplaceholderTextColor=ffffffff
DSplaceholderTextColorInteraction=ffababab
DSiconColor=ffffffff
DSiconColorHover=ff262626
DSiconColorInteraction=ff707070
DSiconColorDisabled=ff707070
DSiconColorSelected=ff2aafd3
DSlinkIndicatorColor=ff808080
DSlinkIndicatorColorHover=ffffffff
DSlinkIndicatorColorInteraction=ff2aafd3
DSlinkIndicatorColorDisabled=ff707070
DSpopupBackground=ff474747
DSpopupOverlayColor=99191919
DSsliderActiveTrack=ff7c7b7b
DSsliderActiveTrackHover=ff000000
DSsliderActiveTrackFocus=ffaaaaaa
DSsliderInactiveTrack=ff595959
DSsliderInactiveTrackHover=ff505050
DSsliderInactiveTrackFocus=ff606060
DSsliderHandle=ff1f1f1f
DSsliderHandleHover=ff606060
DSsliderHandleFocus=ff0492c9
DSsliderHandleInteraction=ff2aafd3
DSscrollBarTrack=ff404040 DSscrollBarTrack=ff404040
DSscrollBarHandle=ff505050 DSscrollBarHandle=ff505050
DScontrolBackgroundInteraction=ff404040
DStranslationIndicatorBorder=ff7f7f7f DSsectionHeadBackground=ff1f1f1f
DSsectionHeadBackground=ff191919
DSstateDefaultHighlight=ffffe400
DSstateSeparatorColor=ff7c7b7b
DSstateBackgroundColor=ff383838
DSstatePreviewOutline=ffaaaaaa
DSchangedStateText=ff99ccff DSchangedStateText=ff99ccff
DS3DAxisXColor=ffd00000 DS3DAxisXColor=ffd00000
DS3DAxisYColor=ff009900 DS3DAxisYColor=ff009900
DS3DAxisZColor=ff5050ff DS3DAxisZColor=ff5050ff
DSactionBinding=ff2aafd3
DSactionAlias=fff93a3a
DSactionKeyframe=ffe0e01b
DSactionJIT=ff2db543
DStableHeaderBackground=ffff0000
DStableHeaderText=ff00ff00
DSdockContainerBackground=ff323232
DSdockContainerSplitter=ff323232
DSdockAreaBackground=ff262728
DSdockWidgetBackground=ff00ff00
DSdockWidgetSplitter=ff595959
DSdockWidgetTitleBar=ff1f1f1f
DStitleBarText=ffdadada
DStitleBarIcon=ffffffff
DStitleBarButtonHover=40ffffff
DStitleBarButtonPress=60ffffff
DStabContainerBackground=ff0000ff
DStabSplitter=ff595959
DStabInactiveBackground=ff1f1f1f
DStabInactiveText=ffdadada
DStabInactiveIcon=ffffffff
DStabInactiveButtonHover=ff1f1f1f
DStabInactiveButtonPress=ff1f1f1f
DStabActiveBackground=ffdadada
DStabActiveText=ff111111
DStabActiveIcon=ff000000
DStabActiveButtonHover=ffdadada
DStabActiveButtonPress=ffdadada
DStabFocusBackground=ff2aafd3
DStabFocusText=ff111111
DStabFocusIcon=ff000000
DStabFocusButtonHover=ff2aafd3
DStabFocusButtonPress=ff2aafd3
DSnavigatorBranch=ff7c7b7b
DSnavigatorBranchIndicator=ff7c7b7b
DSnavigatorItemBackground=ff262626
DSnavigatorItemBackgroundHover=ff666666
DSnavigatorItemBackgroundSelected=ff1f1f1f
DSnavigatorText=ffffffff
DSnavigatorTextHover=ff1f1f1f
DSnavigatorTextSelected=ff2aafd3
DSnavigatorIcon=ffffffff
DSnavigatorIconHover=ff1f1f1f
DSnavigatorIconSelected=ff7c7b7b
DSnavigatorAliasIconChecked=ffff0000
DSnavigatorDropIndicatorBackground=ff2aafd3
DSnavigatorDropIndicatorOutline=ff2aafd3
DSheaderViewBackground=ff1f1f1f
DStableViewAlternateBackground=ff00ff00
DStoolTipBackground=ff111111
DStoolTipOutline=ffdadada
DStoolTipText=ffdadada
;DS controls theme END ;DS controls theme END
BackgroundColorAlternate=alternateBackground BackgroundColorAlternate=alternateBackground
@@ -270,7 +360,7 @@ QmlDesigner_FormEditorForegroundColor=ffdadada
;background color for main form view, library, navigator, properties, connections ;background color for main form view, library, navigator, properties, connections
;QmlDesigner_BackgroundColorDarkAlternate=ff4c4e50 ;QmlDesigner_BackgroundColorDarkAlternate=ff4c4e50
QmlDesigner_BackgroundColorDarkAlternate=ff262626 QmlDesigner_BackgroundColorDarkAlternate=ff323232
;filter outlines, override W/H outlines, properties spinbox background, timeline separators. ;filter outlines, override W/H outlines, properties spinbox background, timeline separators.
;QmlDesigner_BackgroundColorDarker=ff262728 ;QmlDesigner_BackgroundColorDarker=ff262728

160
share/qtcreator/themes/flat-dark.creatortheme
View File

@@ -26,44 +26,136 @@ backgroundColorDisabled=ff444444
qmlDesignerButtonColor=ff4c4e50 qmlDesignerButtonColor=ff4c4e50
[Colors] [Colors]
;DS controls theme START ;DS controls theme START
DScontrolBackground=ff404040 DSpanelBackground=ff323232
DScontrolOutline=ff595959
DStextColor=ffffffff DSinteraction=ff2aafd3
DSdisabledTextColor=ff909090
DSpanelBackground=ff454444
DShoverHighlight=ff313131
DScolumnBackground=ff363636
DSfocusEdit=ff444444
DSfocusDrag=ff565656
DScontrolBackgroundPressed=ff7a7a7a
DScontrolBackgroundChecked=ff565656
DSinteraction=ff1d545c
DSsliderActiveTrack=ff7a7a7a
DSsliderInactiveTrack=ff4d4d4d
DSsliderHandle=ff505050
DSsliderActiveTrackHover=ff7f7f7f
DSsliderInactiveTrackHover=ff505050
DSsliderHandleHover=ff7a7a7a
DSsliderActiveTrackFocus=ffaaaaaa
DSsliderInactiveTrackFocus=ff7a7a7a
DSsliderHandleFocus=ff1d545c
DSerrorColor=ffdf3a3a DSerrorColor=ffdf3a3a
DScontrolBackgroundDisabled=ff363636 DSdisabledColor=ff707070
DScontrolOutlineDisabled=ff4d4d4d
DStextColorDisabled=ff7a7a7a DScontrolBackground=ff323232
DStextSelectionColor=ff1d545c DScontrolBackgroundInteraction=ff595959
DStextSelectedTextColor=ffffffff DScontrolBackgroundDisabled=ff323232
DSscrollBarTrack=ff4d4d4d DScontrolBackgroundGlobalHover=ff474747
DScontrolBackgroundHover=ff666666
DScontrolOutline=ff1f1f1f
DScontrolOutlineInteraction=ff2aafd3
DScontrolOutlineDisabled=ff707070
DStextColor=ffffffff
DStextColorDisabled=ff707070
DStextSelectionColor=ff2aafd3
DStextSelectedTextColor=ff000000
DSplaceholderTextColor=ffffffff
DSplaceholderTextColorInteraction=ffababab
DSiconColor=ffffffff
DSiconColorHover=ff262626
DSiconColorInteraction=ff707070
DSiconColorDisabled=ff707070
DSiconColorSelected=ff2aafd3
DSlinkIndicatorColor=ff808080
DSlinkIndicatorColorHover=ffffffff
DSlinkIndicatorColorInteraction=ff2aafd3
DSlinkIndicatorColorDisabled=ff707070
DSpopupBackground=ff474747
DSpopupOverlayColor=99191919
DSsliderActiveTrack=ff7c7b7b
DSsliderActiveTrackHover=ff000000
DSsliderActiveTrackFocus=ffaaaaaa
DSsliderInactiveTrack=ff595959
DSsliderInactiveTrackHover=ff505050
DSsliderInactiveTrackFocus=ff606060
DSsliderHandle=ff1f1f1f
DSsliderHandleHover=ff606060
DSsliderHandleFocus=ff0492c9
DSsliderHandleInteraction=ff2aafd3
DSscrollBarTrack=ff404040
DSscrollBarHandle=ff505050 DSscrollBarHandle=ff505050
DScontrolBackgroundInteraction=ff4d4d4d
DStranslationIndicatorBorder=ff7f7f7f DSsectionHeadBackground=ff1f1f1f
DSsectionHeadBackground=ff424242
DSstateDefaultHighlight=ffffe400
DSstateSeparatorColor=ff7c7b7b
DSstateBackgroundColor=ff383838
DSstatePreviewOutline=ffaaaaaa
DSchangedStateText=ff99ccff DSchangedStateText=ff99ccff
DS3DAxisXColor=ffe00000
DS3DAxisXColor=ffd00000
DS3DAxisYColor=ff009900 DS3DAxisYColor=ff009900
DS3DAxisZColor=ff6060ff DS3DAxisZColor=ff5050ff
DSactionBinding=ff2aafd3
DSactionAlias=fff93a3a
DSactionKeyframe=ffe0e01b
DSactionJIT=ff2db543
DStableHeaderBackground=ffff0000
DStableHeaderText=ff00ff00
DSdockContainerBackground=ff323232
DSdockContainerSplitter=ff323232
DSdockAreaBackground=ff262728
DSdockWidgetBackground=ff00ff00
DSdockWidgetSplitter=ff595959
DSdockWidgetTitleBar=ff1f1f1f
DStitleBarText=ffdadada
DStitleBarIcon=ffffffff
DStitleBarButtonHover=40ffffff
DStitleBarButtonPress=60ffffff
DStabContainerBackground=ff0000ff
DStabSplitter=ff595959
DStabInactiveBackground=ff1f1f1f
DStabInactiveText=ffdadada
DStabInactiveIcon=ffffffff
DStabInactiveButtonHover=ff1f1f1f
DStabInactiveButtonPress=ff1f1f1f
DStabActiveBackground=ffdadada
DStabActiveText=ff111111
DStabActiveIcon=ff000000
DStabActiveButtonHover=ffdadada
DStabActiveButtonPress=ffdadada
DStabFocusBackground=ff2aafd3
DStabFocusText=ff111111
DStabFocusIcon=ff000000
DStabFocusButtonHover=ff2aafd3
DStabFocusButtonPress=ff2aafd3
DSnavigatorBranch=ff7c7b7b
DSnavigatorBranchIndicator=ff7c7b7b
DSnavigatorItemBackground=ff262626
DSnavigatorItemBackgroundHover=ff666666
DSnavigatorItemBackgroundSelected=ff1f1f1f
DSnavigatorText=ffffffff
DSnavigatorTextHover=ff1f1f1f
DSnavigatorTextSelected=ff2aafd3
DSnavigatorIcon=ffffffff
DSnavigatorIconHover=ff1f1f1f
DSnavigatorIconSelected=ff7c7b7b
DSnavigatorAliasIconChecked=ffff0000
DSnavigatorDropIndicatorBackground=ff2aafd3
DSnavigatorDropIndicatorOutline=ff2aafd3
DSheaderViewBackground=ff1f1f1f
DStableViewAlternateBackground=ff00ff00
DStoolTipBackground=ff111111
DStoolTipOutline=ffdadada
DStoolTipText=ffdadada
;DS controls theme END ;DS controls theme END
BackgroundColorAlternate=alternateBackground BackgroundColorAlternate=alternateBackground
@@ -245,7 +337,7 @@ QmlDesigner_BackgroundColor=qmlDesignerButtonColor
QmlDesigner_HighlightColor=ff1d545c QmlDesigner_HighlightColor=ff1d545c
QmlDesigner_FormEditorSelectionColor=ff4ba2ff QmlDesigner_FormEditorSelectionColor=ff4ba2ff
QmlDesigner_FormEditorForegroundColor=ffffffff QmlDesigner_FormEditorForegroundColor=ffffffff
QmlDesigner_BackgroundColorDarkAlternate=qmlDesignerButtonColor QmlDesigner_BackgroundColorDarkAlternate=ff323232
QmlDesigner_BackgroundColorDarker=ff262728 QmlDesigner_BackgroundColorDarker=ff262728
QmlDesigner_BorderColor=splitter QmlDesigner_BorderColor=splitter
QmlDesigner_ButtonColor=ff595b5c QmlDesigner_ButtonColor=ff595b5c

164
share/qtcreator/themes/flat-light.creatortheme
View File

@@ -22,44 +22,136 @@ warning=ffecbc1c
qmlDesignerButtonColor=fff8f8f8 qmlDesignerButtonColor=fff8f8f8
[Colors] [Colors]
;DS controls theme START ;DS controls theme START
DScontrolBackground=ffffffff DSpanelBackground=ffeaeaea
DScontrolOutline=ff777777
DStextColor=ff242424 DSinteraction=ff2aafd3
DSdisabledTextColor=ff505050
DSpanelBackground=fff2f2f2
DShoverHighlight=ffe6e6e6
DScolumnBackground=ffaaaaaa
DSfocusEdit=ffeaeaea
DSfocusDrag=ffd1d1d1
DScontrolBackgroundPressed=ff505050
DScontrolBackgroundChecked=ff5e5e5e
DSinteraction=ff0492c9
DSsliderActiveTrack=ff363636
DSsliderInactiveTrack=ffe6e6e6
DSsliderHandle=ff777777
DSsliderActiveTrackHover=ff7f7f7f
DSsliderInactiveTrackHover=ff5e5e5e
DSsliderHandleHover=ff505050
DSsliderActiveTrackFocus=ff363636
DSsliderInactiveTrackFocus=ff505050
DSsliderHandleFocus=ff0492c9
DSerrorColor=ffdf3a3a DSerrorColor=ffdf3a3a
DScontrolBackgroundDisabled=ffaaaaaa DSdisabledColor=ff8e8e8e
DScontrolOutlineDisabled=ff777777
DStextColorDisabled=ff505050 DScontrolBackground=ffeaeaea
DStextSelectionColor=ff0492c9 DScontrolBackgroundInteraction=ffc9c9c9
DStextSelectedTextColor=ffffffff DScontrolBackgroundDisabled=ff8e8e8e
DSscrollBarTrack=ff777777 DScontrolBackgroundGlobalHover=ffe5e5e5
DSscrollBarHandle=ff505050 DScontrolBackgroundHover=ffd1d1d1
DScontrolBackgroundInteraction=ff777777
DStranslationIndicatorBorder=ffebebeb DScontrolOutline=ffcecccc
DSsectionHeadBackground=ffebebeb DScontrolOutlineInteraction=ff2aafd3
DScontrolOutlineDisabled=ff707070
DStextColor=ff262626
DStextColorDisabled=ff707070
DStextSelectionColor=ff2aafd3
DStextSelectedTextColor=ff000000
DSplaceholderTextColor=ff262626
DSplaceholderTextColorInteraction=ffababab
DSiconColor=ff262626
DSiconColorHover=ff191919
DSiconColorInteraction=ffffffff
DSiconColorDisabled=ff707070
DSiconColorSelected=ff2aafd3
DSlinkIndicatorColor=ff808080
DSlinkIndicatorColorHover=ff1f1f1f
DSlinkIndicatorColorInteraction=ff2aafd3
DSlinkIndicatorColorDisabled=ff707070
DSpopupBackground=ffd3d3d3
DSpopupOverlayColor=99191919
DSsliderActiveTrack=ff7c7b7b
DSsliderActiveTrackHover=ff000000
DSsliderActiveTrackFocus=ffaaaaaa
DSsliderInactiveTrack=ffaaaaaa
DSsliderInactiveTrackHover=ff505050
DSsliderInactiveTrackFocus=ff606060
DSsliderHandle=ff1f1f1f
DSsliderHandleHover=ff606060
DSsliderHandleFocus=ff0492c9
DSsliderHandleInteraction=ff2aafd3
DSscrollBarTrack=ffb5b4b4
DSscrollBarHandle=ff9b9b9b
DSsectionHeadBackground=ffd8d8d8
DSstateDefaultHighlight=ffffe400
DSstateSeparatorColor=ffadadad
DSstateBackgroundColor=ffe0e0e0
DSstatePreviewOutline=ff363636
DSchangedStateText=ff99ccff DSchangedStateText=ff99ccff
DS3DAxisXColor=ffff0000
DS3DAxisYColor=ff00A000 DS3DAxisXColor=ffd00000
DS3DAxisZColor=ff0000ff DS3DAxisYColor=ff009900
DS3DAxisZColor=ff5050ff
DSactionBinding=ff2aafd3
DSactionAlias=fff93a3a
DSactionKeyframe=ffe0e01b
DSactionJIT=ff2db543
DStableHeaderBackground=ffff0000
DStableHeaderText=ff00ff00
DSdockContainerBackground=ff323232
DSdockContainerSplitter=ff323232
DSdockAreaBackground=ff262728
DSdockWidgetBackground=ff00ff00
DSdockWidgetSplitter=ff595959
DSdockWidgetTitleBar=ffeaeaea
DStitleBarText=ffdadada
DStitleBarIcon=f4f5052
DStitleBarButtonHover=40ffffff
DStitleBarButtonPress=60ffffff
DStabContainerBackground=ff0000ff
DStabSplitter=ff595959
DStabInactiveBackground=ff999999
DStabInactiveText=ff262626
DStabInactiveIcon=ffffffff
DStabInactiveButtonHover=ff1f1f1f
DStabInactiveButtonPress=ff1f1f1f
DStabActiveBackground=ffdadada
DStabActiveText=ff111111
DStabActiveIcon=ff000000
DStabActiveButtonHover=ffdadada
DStabActiveButtonPress=ffdadada
DStabFocusBackground=ff2aafd3
DStabFocusText=ff111111
DStabFocusIcon=ff000000
DStabFocusButtonHover=ff2aafd3
DStabFocusButtonPress=ff2aafd3
DSnavigatorBranch=ff7c7b7b
DSnavigatorBranchIndicator=ff7c7b7b
DSnavigatorItemBackground=ffd8d8d8
DSnavigatorItemBackgroundHover=ffc2c2c2
DSnavigatorItemBackgroundSelected=ffffffff
DSnavigatorText=ff262626
DSnavigatorTextHover=ff1f1f1f
DSnavigatorTextSelected=ff2aafd3
DSnavigatorIcon=ff1f1f1f
DSnavigatorIconHover=ff1f1f1f
DSnavigatorIconSelected=ff7c7b7b
DSnavigatorAliasIconChecked=ffff0000
DSnavigatorDropIndicatorBackground=ff2aafd3
DSnavigatorDropIndicatorOutline=ff2aafd3
DSheaderViewBackground=ffd8d8d8
DStableViewAlternateBackground=ff00ff00
DStoolTipBackground=ff111111
DStoolTipOutline=ffdadada
DStoolTipText=ffdadada
;DS controls theme END ;DS controls theme END
BackgroundColorAlternate=alternateBackground BackgroundColorAlternate=alternateBackground
@@ -241,7 +333,7 @@ QmlDesigner_BackgroundColor=qmlDesignerButtonColor
QmlDesigner_HighlightColor=ff46a2da QmlDesigner_HighlightColor=ff46a2da
QmlDesigner_FormEditorSelectionColor=ff4ba2ff QmlDesigner_FormEditorSelectionColor=ff4ba2ff
QmlDesigner_FormEditorForegroundColor=ffffffff QmlDesigner_FormEditorForegroundColor=ffffffff
QmlDesigner_BackgroundColorDarkAlternate=qmlDesignerButtonColor QmlDesigner_BackgroundColorDarkAlternate=ffeaeaea
QmlDesigner_BackgroundColorDarker=fff5f5f5 QmlDesigner_BackgroundColorDarker=fff5f5f5
QmlDesigner_BorderColor=splitter QmlDesigner_BorderColor=splitter
QmlDesigner_ButtonColor=ffcccccc QmlDesigner_ButtonColor=ffcccccc

160
share/qtcreator/themes/flat.creatortheme
View File

@@ -20,44 +20,136 @@ splitter=ff313131
qmlDesignerButtonColor=ff4c4e50 qmlDesignerButtonColor=ff4c4e50
[Colors] [Colors]
;DS controls theme START ;DS controls theme START
DScontrolBackground=ff404040 DSpanelBackground=ff323232
DScontrolOutline=ff595959
DStextColor=ffffffff DSinteraction=ff2aafd3
DSdisabledTextColor=ff909090
DSpanelBackground=ff454444
DShoverHighlight=ff313131
DScolumnBackground=ff363636
DSfocusEdit=ff444444
DSfocusDrag=ff565656
DScontrolBackgroundPressed=ff7a7a7a
DScontrolBackgroundChecked=ff565656
DSinteraction=ff3f91c4
DSsliderActiveTrack=ff7a7a7a
DSsliderInactiveTrack=ff4d4d4d
DSsliderHandle=ff505050
DSsliderActiveTrackHover=ff7f7f7f
DSsliderInactiveTrackHover=ff505050
DSsliderHandleHover=ff7a7a7a
DSsliderActiveTrackFocus=ffaaaaaa
DSsliderInactiveTrackFocus=ff7a7a7a
DSsliderHandleFocus=ff3f91c4
DSerrorColor=ffdf3a3a DSerrorColor=ffdf3a3a
DScontrolBackgroundDisabled=ff363636 DSdisabledColor=ff707070
DScontrolOutlineDisabled=ff4d4d4d
DStextColorDisabled=ff7a7a7a DScontrolBackground=ff323232
DStextSelectionColor=ff3f91c4 DScontrolBackgroundInteraction=ff595959
DStextSelectedTextColor=ffffffff DScontrolBackgroundDisabled=ff323232
DSscrollBarTrack=ff4d4d4d DScontrolBackgroundGlobalHover=ff474747
DScontrolBackgroundHover=ff666666
DScontrolOutline=ff1f1f1f
DScontrolOutlineInteraction=ff2aafd3
DScontrolOutlineDisabled=ff707070
DStextColor=ffffffff
DStextColorDisabled=ff707070
DStextSelectionColor=ff2aafd3
DStextSelectedTextColor=ff000000
DSplaceholderTextColor=ffffffff
DSplaceholderTextColorInteraction=ffababab
DSiconColor=ffffffff
DSiconColorHover=ff262626
DSiconColorInteraction=ff707070
DSiconColorDisabled=ff707070
DSiconColorSelected=ff2aafd3
DSlinkIndicatorColor=ff808080
DSlinkIndicatorColorHover=ffffffff
DSlinkIndicatorColorInteraction=ff2aafd3
DSlinkIndicatorColorDisabled=ff707070
DSpopupBackground=ff474747
DSpopupOverlayColor=99191919
DSsliderActiveTrack=ff7c7b7b
DSsliderActiveTrackHover=ff000000
DSsliderActiveTrackFocus=ffaaaaaa
DSsliderInactiveTrack=ff595959
DSsliderInactiveTrackHover=ff505050
DSsliderInactiveTrackFocus=ff606060
DSsliderHandle=ff1f1f1f
DSsliderHandleHover=ff606060
DSsliderHandleFocus=ff0492c9
DSsliderHandleInteraction=ff2aafd3
DSscrollBarTrack=ff404040
DSscrollBarHandle=ff505050 DSscrollBarHandle=ff505050
DScontrolBackgroundInteraction=ff4d4d4d
DStranslationIndicatorBorder=ff7f7f7f DSsectionHeadBackground=ff1f1f1f
DSsectionHeadBackground=ff424242
DSstateDefaultHighlight=ffffe400
DSstateSeparatorColor=ff7c7b7b
DSstateBackgroundColor=ff383838
DSstatePreviewOutline=ffaaaaaa
DSchangedStateText=ff99ccff DSchangedStateText=ff99ccff
DS3DAxisXColor=ffe00000
DS3DAxisXColor=ffd00000
DS3DAxisYColor=ff009900 DS3DAxisYColor=ff009900
DS3DAxisZColor=ff6060ff DS3DAxisZColor=ff5050ff
DSactionBinding=ff2aafd3
DSactionAlias=fff93a3a
DSactionKeyframe=ffe0e01b
DSactionJIT=ff2db543
DStableHeaderBackground=ffff0000
DStableHeaderText=ff00ff00
DSdockContainerBackground=ff323232
DSdockContainerSplitter=ff323232
DSdockAreaBackground=ff262728
DSdockWidgetBackground=ff00ff00
DSdockWidgetSplitter=ff595959
DSdockWidgetTitleBar=ff1f1f1f
DStitleBarText=ffdadada
DStitleBarIcon=ffffffff
DStitleBarButtonHover=40ffffff
DStitleBarButtonPress=60ffffff
DStabContainerBackground=ff0000ff
DStabSplitter=ff595959
DStabInactiveBackground=ff1f1f1f
DStabInactiveText=ffdadada
DStabInactiveIcon=ffffffff
DStabInactiveButtonHover=ff1f1f1f
DStabInactiveButtonPress=ff1f1f1f
DStabActiveBackground=ffdadada
DStabActiveText=ff111111
DStabActiveIcon=ff000000
DStabActiveButtonHover=ffdadada
DStabActiveButtonPress=ffdadada
DStabFocusBackground=ff2aafd3
DStabFocusText=ff111111
DStabFocusIcon=ff000000
DStabFocusButtonHover=ff2aafd3
DStabFocusButtonPress=ff2aafd3
DSnavigatorBranch=ff7c7b7b
DSnavigatorBranchIndicator=ff7c7b7b
DSnavigatorItemBackground=ff262626
DSnavigatorItemBackgroundHover=ff666666
DSnavigatorItemBackgroundSelected=ff1f1f1f
DSnavigatorText=ffffffff
DSnavigatorTextHover=ff1f1f1f
DSnavigatorTextSelected=ff2aafd3
DSnavigatorIcon=ffffffff
DSnavigatorIconHover=ff1f1f1f
DSnavigatorIconSelected=ff7c7b7b
DSnavigatorAliasIconChecked=ffff0000
DSnavigatorDropIndicatorBackground=ff2aafd3
DSnavigatorDropIndicatorOutline=ff2aafd3
DSheaderViewBackground=ff1f1f1f
DStableViewAlternateBackground=ff00ff00
DStoolTipBackground=ff111111
DStoolTipOutline=ffdadada
DStoolTipText=ffdadada
;DS controls theme END ;DS controls theme END
BackgroundColorAlternate=alternateBackground BackgroundColorAlternate=alternateBackground
@@ -239,7 +331,7 @@ QmlDesigner_BackgroundColor=qmlDesignerButtonColor
QmlDesigner_HighlightColor=ff46a2da QmlDesigner_HighlightColor=ff46a2da
QmlDesigner_FormEditorSelectionColor=ff4ba2ff QmlDesigner_FormEditorSelectionColor=ff4ba2ff
QmlDesigner_FormEditorForegroundColor=ffffffff QmlDesigner_FormEditorForegroundColor=ffffffff
QmlDesigner_BackgroundColorDarkAlternate=qmlDesignerButtonColor QmlDesigner_BackgroundColorDarkAlternate=ff323232
QmlDesigner_BackgroundColorDarker=ff262728 QmlDesigner_BackgroundColorDarker=ff262728
QmlDesigner_BorderColor=splitter QmlDesigner_BorderColor=splitter
QmlDesigner_ButtonColor=ff595b5c QmlDesigner_ButtonColor=ff595b5c

15
src/libs/advanceddockingsystem/dockareatitlebar.cpp
View File

@@ -133,12 +133,14 @@ namespace ADS
void DockAreaTitleBarPrivate::createButtons() void DockAreaTitleBarPrivate::createButtons()
{ {
const QSize iconSize(14, 14); const QSize iconSize(11, 11);
const QSize buttonSize(17, 17);
QSizePolicy sizePolicy(QSizePolicy::Fixed, QSizePolicy::Expanding); QSizePolicy sizePolicy(QSizePolicy::Fixed, QSizePolicy::Expanding);
// Tabs menu button // Tabs menu button
m_tabsMenuButton = new TitleBarButton(testConfigFlag(DockManager::DockAreaHasTabsMenuButton)); m_tabsMenuButton = new TitleBarButton(testConfigFlag(DockManager::DockAreaHasTabsMenuButton));
m_tabsMenuButton->setObjectName("tabsMenuButton"); m_tabsMenuButton->setObjectName("tabsMenuButton");
m_tabsMenuButton->setAutoRaise(true); //m_tabsMenuButton->setAutoRaise(true);
m_tabsMenuButton->setPopupMode(QToolButton::InstantPopup); m_tabsMenuButton->setPopupMode(QToolButton::InstantPopup);
internal::setButtonIcon(m_tabsMenuButton, internal::setButtonIcon(m_tabsMenuButton,
QStyle::SP_TitleBarUnshadeButton, QStyle::SP_TitleBarUnshadeButton,
@@ -152,6 +154,7 @@ namespace ADS
internal::setToolTip(m_tabsMenuButton, QObject::tr("List All Tabs")); internal::setToolTip(m_tabsMenuButton, QObject::tr("List All Tabs"));
m_tabsMenuButton->setSizePolicy(sizePolicy); m_tabsMenuButton->setSizePolicy(sizePolicy);
m_tabsMenuButton->setIconSize(iconSize); m_tabsMenuButton->setIconSize(iconSize);
m_tabsMenuButton->setFixedSize(buttonSize);
m_layout->addWidget(m_tabsMenuButton, 0); m_layout->addWidget(m_tabsMenuButton, 0);
QObject::connect(m_tabsMenuButton->menu(), QObject::connect(m_tabsMenuButton->menu(),
&QMenu::triggered, &QMenu::triggered,
@@ -161,13 +164,14 @@ namespace ADS
// Undock button // Undock button
m_undockButton = new TitleBarButton(testConfigFlag(DockManager::DockAreaHasUndockButton)); m_undockButton = new TitleBarButton(testConfigFlag(DockManager::DockAreaHasUndockButton));
m_undockButton->setObjectName("detachGroupButton"); m_undockButton->setObjectName("detachGroupButton");
m_undockButton->setAutoRaise(true); //m_undockButton->setAutoRaise(true);
internal::setToolTip(m_undockButton, QObject::tr("Detach Group")); internal::setToolTip(m_undockButton, QObject::tr("Detach Group"));
internal::setButtonIcon(m_undockButton, internal::setButtonIcon(m_undockButton,
QStyle::SP_TitleBarNormalButton, QStyle::SP_TitleBarNormalButton,
ADS::DockAreaUndockIcon); ADS::DockAreaUndockIcon);
m_undockButton->setSizePolicy(sizePolicy); m_undockButton->setSizePolicy(sizePolicy);
m_undockButton->setIconSize(iconSize); m_undockButton->setIconSize(iconSize);
m_undockButton->setFixedSize(buttonSize);
m_layout->addWidget(m_undockButton, 0); m_layout->addWidget(m_undockButton, 0);
QObject::connect(m_undockButton, QObject::connect(m_undockButton,
&QToolButton::clicked, &QToolButton::clicked,
@@ -177,7 +181,7 @@ namespace ADS
// Close button // Close button
m_closeButton = new TitleBarButton(testConfigFlag(DockManager::DockAreaHasCloseButton)); m_closeButton = new TitleBarButton(testConfigFlag(DockManager::DockAreaHasCloseButton));
m_closeButton->setObjectName("dockAreaCloseButton"); m_closeButton->setObjectName("dockAreaCloseButton");
m_closeButton->setAutoRaise(true); //m_closeButton->setAutoRaise(true);
internal::setButtonIcon(m_closeButton, internal::setButtonIcon(m_closeButton,
QStyle::SP_TitleBarCloseButton, QStyle::SP_TitleBarCloseButton,
ADS::DockAreaCloseIcon); ADS::DockAreaCloseIcon);
@@ -188,11 +192,14 @@ namespace ADS
m_closeButton->setSizePolicy(sizePolicy); m_closeButton->setSizePolicy(sizePolicy);
m_closeButton->setIconSize(iconSize); m_closeButton->setIconSize(iconSize);
m_closeButton->setFixedSize(buttonSize);
m_layout->addWidget(m_closeButton, 0); m_layout->addWidget(m_closeButton, 0);
QObject::connect(m_closeButton, QObject::connect(m_closeButton,
&QToolButton::clicked, &QToolButton::clicked,
q, q,
&DockAreaTitleBar::onCloseButtonClicked); &DockAreaTitleBar::onCloseButtonClicked);
m_layout->addSpacing(1);
} }
void DockAreaTitleBarPrivate::createTabBar() void DockAreaTitleBarPrivate::createTabBar()

62
src/libs/advanceddockingsystem/dockwidgettab.cpp
View File

@@ -45,6 +45,8 @@
#include "floatingdragpreview.h" #include "floatingdragpreview.h"
#include "iconprovider.h" #include "iconprovider.h"
#include <utils/theme/theme.h>
#include <QApplication> #include <QApplication>
#include <QBoxLayout> #include <QBoxLayout>
#include <QLabel> #include <QLabel>
@@ -54,7 +56,10 @@
#include <QPushButton> #include <QPushButton>
#include <QSplitter> #include <QSplitter>
#include <QStyle> #include <QStyle>
#include <QStyleOption>
#include <QToolButton> #include <QToolButton>
#include <QPainter>
#include <QStylePainter>
#include <iostream> #include <iostream>
@@ -81,7 +86,7 @@ namespace ADS
eDragState m_dragState = DraggingInactive; eDragState m_dragState = DraggingInactive;
AbstractFloatingWidget *m_floatingWidget = nullptr; AbstractFloatingWidget *m_floatingWidget = nullptr;
QIcon m_icon; QIcon m_icon;
QAbstractButton *m_closeButton = nullptr; TabButton *m_closeButton = nullptr;
QPoint m_tabDragStartPosition; QPoint m_tabDragStartPosition;
/** /**
@@ -122,8 +127,9 @@ namespace ADS
/** /**
* Creates the close button as QPushButton or as QToolButton * Creates the close button as QPushButton or as QToolButton
*/ */
QAbstractButton *createCloseButton() const TabButton *createCloseButton() const
{ {
/*
if (testConfigFlag(DockManager::TabCloseButtonIsToolButton)) { if (testConfigFlag(DockManager::TabCloseButtonIsToolButton)) {
auto button = new QToolButton(); auto button = new QToolButton();
button->setAutoRaise(true); button->setAutoRaise(true);
@@ -131,6 +137,8 @@ namespace ADS
} else { } else {
return new QPushButton(); return new QPushButton();
} }
*/
return new TabButton();
} }
template<typename T> template<typename T>
@@ -179,7 +187,8 @@ namespace ADS
QStyle::SP_TitleBarCloseButton, QStyle::SP_TitleBarCloseButton,
TabCloseIcon); TabCloseIcon);
m_closeButton->setSizePolicy(QSizePolicy::Fixed, QSizePolicy::Fixed); m_closeButton->setSizePolicy(QSizePolicy::Fixed, QSizePolicy::Fixed);
m_closeButton->setIconSize(QSize(14, 14)); m_closeButton->setIconSize(QSize(11, 11));
m_closeButton->setFixedSize(QSize(17, 17));
q->onDockWidgetFeaturesChanged(); q->onDockWidgetFeaturesChanged();
internal::setToolTip(m_closeButton, QObject::tr("Close Tab")); internal::setToolTip(m_closeButton, QObject::tr("Close Tab"));
QObject::connect(m_closeButton, QObject::connect(m_closeButton,
@@ -196,9 +205,9 @@ namespace ADS
boxLayout->setSpacing(0); boxLayout->setSpacing(0);
q->setLayout(boxLayout); q->setLayout(boxLayout);
boxLayout->addWidget(m_titleLabel, 1, Qt::AlignVCenter); boxLayout->addWidget(m_titleLabel, 1, Qt::AlignVCenter);
boxLayout->addSpacing(spacing);
boxLayout->addWidget(m_closeButton, 0, Qt::AlignVCenter);
boxLayout->addSpacing(qRound(spacing * 4.0 / 3.0)); boxLayout->addSpacing(qRound(spacing * 4.0 / 3.0));
boxLayout->addWidget(m_closeButton, 0, Qt::AlignVCenter);
boxLayout->addSpacing(1);
boxLayout->setAlignment(Qt::AlignCenter | Qt::AlignVCenter); boxLayout->setAlignment(Qt::AlignCenter | Qt::AlignVCenter);
if (DockManager::testConfigFlag(DockManager::FocusHighlighting)) if (DockManager::testConfigFlag(DockManager::FocusHighlighting))
@@ -263,6 +272,39 @@ namespace ADS
return true; return true;
} }
TabButton::TabButton(QWidget *parent)
: TabButtonType(parent)
, m_active(false)
, m_focus(false)
{}
void TabButton::setActive(bool value) { m_active = value; }
void TabButton::setFocus(bool value) { m_focus = value; }
void TabButton::paintEvent(QPaintEvent *event)
{
Q_UNUSED(event)
QStylePainter p(this);
QStyleOptionToolButton opt;
initStyleOption(&opt);
opt.icon = QIcon(); // set to null icon otherwise it is drawn twice
p.drawComplexControl(QStyle::CC_ToolButton, opt);
QIcon::Mode mode = QIcon::Mode::Normal;
if (m_active)
mode = QIcon::Mode::Active;
if (m_focus)
mode = QIcon::Mode::Selected;
const QPoint iconPosition = rect().center() - QPoint(iconSize().width() * 0.5,
iconSize().height() * 0.5);
p.drawPixmap(iconPosition, icon().pixmap(iconSize(), mode));
}
DockWidgetTab::DockWidgetTab(DockWidget *dockWidget, QWidget *parent) DockWidgetTab::DockWidgetTab(DockWidget *dockWidget, QWidget *parent)
: QFrame(parent) : QFrame(parent)
, d(new DockWidgetTabPrivate(this)) , d(new DockWidgetTabPrivate(this))
@@ -420,6 +462,8 @@ namespace ADS
bool tabHasCloseButton = (activeTabHasCloseButton && active) | allTabsHaveCloseButton; bool tabHasCloseButton = (activeTabHasCloseButton && active) | allTabsHaveCloseButton;
d->m_closeButton->setVisible(dockWidgetClosable && tabHasCloseButton); d->m_closeButton->setVisible(dockWidgetClosable && tabHasCloseButton);
d->m_closeButton->setActive(active);
// Focus related stuff // Focus related stuff
if (DockManager::testConfigFlag(DockManager::FocusHighlighting) if (DockManager::testConfigFlag(DockManager::FocusHighlighting)
&& !d->m_dockWidget->dockManager()->isRestoringState()) { && !d->m_dockWidget->dockManager()->isRestoringState()) {
@@ -550,12 +594,8 @@ namespace ADS
void DockWidgetTab::updateStyle() void DockWidgetTab::updateStyle()
{ {
if (DockManager::testConfigFlag(DockManager::FocusHighlighting)) { if (DockManager::testConfigFlag(DockManager::FocusHighlighting))
if (property("focused").toBool()) d->m_closeButton->setFocus(property("focused").toBool());
d->m_closeButton->setChecked(true);
else
d->m_closeButton->setChecked(false);
}
internal::repolishStyle(this, internal::RepolishDirectChildren); internal::repolishStyle(this, internal::RepolishDirectChildren);
} }

23
src/libs/advanceddockingsystem/dockwidgettab.h
View File

@@ -38,6 +38,7 @@
#include "ads_globals.h" #include "ads_globals.h"
#include <QFrame> #include <QFrame>
#include <QToolButton>
namespace ADS { namespace ADS {
@@ -45,6 +46,28 @@ class DockWidget;
class DockAreaWidget; class DockAreaWidget;
class DockWidgetTabPrivate; class DockWidgetTabPrivate;
using TabButtonType = QToolButton;
class TabButton : public TabButtonType
{
Q_OBJECT
public:
using Super = TabButtonType;
TabButton(QWidget *parent = nullptr);
void setActive(bool value);
void setFocus(bool value);
protected:
void paintEvent(QPaintEvent *event) override;
private:
bool m_active;
bool m_focus;
};
/** /**
* A dock widget tab that shows a title and an icon. * A dock widget tab that shows a title and an icon.
* The dock widget tab is shown in the dock area title bar to switch between * The dock widget tab is shown in the dock area title bar to switch between

2
src/libs/advanceddockingsystem/elidinglabel.cpp
View File

@@ -39,7 +39,7 @@
namespace ADS { namespace ADS {
/** /**
* Private data of public ClickableLabel * Private data of public ElidingLabel
*/ */
struct ElidingLabelPrivate struct ElidingLabelPrivate
{ {

4
src/libs/advanceddockingsystem/linux/floatingwidgettitlebar.cpp
View File

@@ -81,7 +81,8 @@ void FloatingWidgetTitleBarPrivate::createLayout()
QStyle::SP_TitleBarCloseButton, QStyle::SP_TitleBarCloseButton,
ADS::FloatingWidgetCloseIcon); ADS::FloatingWidgetCloseIcon);
m_closeButton->setSizePolicy(QSizePolicy::Fixed, QSizePolicy::Fixed); m_closeButton->setSizePolicy(QSizePolicy::Fixed, QSizePolicy::Fixed);
m_closeButton->setIconSize(QSize(14, 14)); m_closeButton->setIconSize(QSize(11, 11));
m_closeButton->setFixedSize(QSize(17, 17));
m_closeButton->setVisible(true); m_closeButton->setVisible(true);
m_closeButton->setFocusPolicy(Qt::NoFocus); m_closeButton->setFocusPolicy(Qt::NoFocus);
QObject::connect(m_closeButton, QObject::connect(m_closeButton,
@@ -100,6 +101,7 @@ void FloatingWidgetTitleBarPrivate::createLayout()
layout->addWidget(m_titleLabel, 1); layout->addWidget(m_titleLabel, 1);
layout->addSpacing(spacing); layout->addSpacing(spacing);
layout->addWidget(m_closeButton); layout->addWidget(m_closeButton);
layout->addSpacing(1);
layout->setAlignment(Qt::AlignCenter); layout->setAlignment(Qt::AlignCenter);
m_titleLabel->setVisible(true); m_titleLabel->setVisible(true);

123
src/libs/utils/theme/theme.h
View File

@@ -303,42 +303,121 @@ public:
/* Palette for DS Controls */ /* Palette for DS Controls */
DScontrolBackground,
DScontrolOutline,
DStextColor,
DSdisabledTextColor,
DSpanelBackground, DSpanelBackground,
DShoverHighlight,
DScolumnBackground,
DSfocusEdit,
DSfocusDrag,
DScontrolBackgroundPressed,
DScontrolBackgroundChecked,
DSinteraction, DSinteraction,
DSsliderActiveTrack,
DSsliderInactiveTrack,
DSsliderHandle,
DSsliderActiveTrackHover,
DSsliderInactiveTrackHover,
DSsliderHandleHover,
DSsliderActiveTrackFocus,
DSsliderInactiveTrackFocus,
DSsliderHandleFocus,
DSerrorColor, DSerrorColor,
DSdisabledColor,
DScontrolBackground,
DScontrolBackgroundInteraction,
DScontrolBackgroundDisabled, DScontrolBackgroundDisabled,
DScontrolBackgroundGlobalHover,
DScontrolBackgroundHover,
DScontrolOutline,
DScontrolOutlineInteraction,
DScontrolOutlineDisabled, DScontrolOutlineDisabled,
DStextColor,
DStextColorDisabled, DStextColorDisabled,
DStextSelectionColor, DStextSelectionColor,
DStextSelectedTextColor, DStextSelectedTextColor,
DSplaceholderTextColor,
DSplaceholderTextColorInteraction,
DSiconColor,
DSiconColorHover,
DSiconColorInteraction,
DSiconColorDisabled,
DSiconColorSelected,
DSlinkIndicatorColor,
DSlinkIndicatorColorHover,
DSlinkIndicatorColorInteraction,
DSlinkIndicatorColorDisabled,
DSpopupBackground,
DSpopupOverlayColor,
DSsliderActiveTrack,
DSsliderActiveTrackHover,
DSsliderActiveTrackFocus,
DSsliderInactiveTrack,
DSsliderInactiveTrackHover,
DSsliderInactiveTrackFocus,
DSsliderHandle,
DSsliderHandleHover,
DSsliderHandleFocus,
DSsliderHandleInteraction,
DSscrollBarTrack, DSscrollBarTrack,
DSscrollBarHandle, DSscrollBarHandle,
DScontrolBackgroundInteraction,
DStranslationIndicatorBorder,
DSsectionHeadBackground, DSsectionHeadBackground,
DSstateDefaultHighlight,
DSstateSeparatorColor,
DSstateBackgroundColor,
DSstatePreviewOutline,
DSchangedStateText, DSchangedStateText,
DS3DAxisXColor, DS3DAxisXColor,
DS3DAxisYColor, DS3DAxisYColor,
DS3DAxisZColor DS3DAxisZColor,
DSactionBinding,
DSactionAlias,
DSactionKeyframe,
DSactionJIT,
DStableHeaderBackground,
DStableHeaderText,
DSdockContainerBackground,
DSdockContainerSplitter,
DSdockAreaBackground,
DSdockWidgetBackground,
DSdockWidgetSplitter,
DSdockWidgetTitleBar,
DStitleBarText,
DStitleBarIcon,
DStitleBarButtonHover,
DStitleBarButtonPress,
DStabContainerBackground,
DStabSplitter,
DStabInactiveBackground,
DStabInactiveText,
DStabInactiveIcon,
DStabInactiveButtonHover,
DStabInactiveButtonPress,
DStabActiveBackground,
DStabActiveText,
DStabActiveIcon,
DStabActiveButtonHover,
DStabActiveButtonPress,
DStabFocusBackground,
DStabFocusText,
DStabFocusIcon,
DStabFocusButtonHover,
DStabFocusButtonPress,
DSnavigatorBranch,
DSnavigatorBranchIndicator,
DSnavigatorItemBackground,
DSnavigatorItemBackgroundHover,
DSnavigatorItemBackgroundSelected,
DSnavigatorText,
DSnavigatorTextHover,
DSnavigatorTextSelected,
DSnavigatorIcon,
DSnavigatorIconHover,
DSnavigatorIconSelected,
DSnavigatorAliasIconChecked,
DSnavigatorDropIndicatorBackground,
DSnavigatorDropIndicatorOutline,
DSheaderViewBackground,
DStableViewAlternateBackground,
DStoolTipBackground,
DStoolTipOutline,
DStoolTipText
}; };
enum Gradient { enum Gradient {

15
src/plugins/qmldesigner/components/componentcore/theme.cpp
View File

@@ -76,7 +76,7 @@ QColor Theme::evaluateColorAtThemeInstance(const QString &themeColorName)
const QMetaEnum e = m.enumerator(m.indexOfEnumerator("Color")); const QMetaEnum e = m.enumerator(m.indexOfEnumerator("Color"));
for (int i = 0, total = e.keyCount(); i < total; ++i) { for (int i = 0, total = e.keyCount(); i < total; ++i) {
if (QString::fromLatin1(e.key(i)) == themeColorName) if (QString::fromLatin1(e.key(i)) == themeColorName)
return color(static_cast<Utils::Theme::Color>(i)).name(); return color(static_cast<Utils::Theme::Color>(i));
} }
qWarning() << Q_FUNC_INFO << "error while evaluating" << themeColorName; qWarning() << Q_FUNC_INFO << "error while evaluating" << themeColorName;
@@ -101,14 +101,21 @@ QString Theme::replaceCssColors(const QString &input)
while (it.hasNext()) { while (it.hasNext()) {
const QRegularExpressionMatch match = it.next(); const QRegularExpressionMatch match = it.next();
const QString themeColorName = match.captured(1); const QString themeColorName = match.captured(1);
const QRegularExpression replaceExp("creatorTheme\\." + themeColorName + "(\\s|;|\\n)");
if (themeColorName == "smallFontPixelSize") { if (themeColorName == "smallFontPixelSize") {
output.replace("creatorTheme." + themeColorName, QString::number(instance()->smallFontPixelSize()) + "px"); output.replace(replaceExp,
QString::number(instance()->smallFontPixelSize()) + "px" + "\\1");
} else if (themeColorName == "captionFontPixelSize") { } else if (themeColorName == "captionFontPixelSize") {
output.replace("creatorTheme." + themeColorName, QString::number(instance()->captionFontPixelSize()) + "px"); output.replace(replaceExp,
QString::number(instance()->captionFontPixelSize()) + "px" + "\\1");
} else { } else {
const QColor color = instance()->evaluateColorAtThemeInstance(themeColorName); const QColor color = instance()->evaluateColorAtThemeInstance(themeColorName);
output.replace("creatorTheme." + themeColorName, color.name()); // Create rgba(r, g, b, a)
const QString rgbaStr = QString("rgba(%1, %2, %3, %4)")
.arg(color.red()).arg(color.green()).arg(color.blue())
.arg(color.alpha());
output.replace(replaceExp, rgbaStr + "\\1");
} }
pos += match.capturedLength(); pos += match.capturedLength();
} }

8
src/plugins/qmldesigner/components/connectioneditor/connectionviewwidget.ui
View File

@@ -18,7 +18,7 @@
<number>0</number> <number>0</number>
</property> </property>
<property name="topMargin"> <property name="topMargin">
<number>0</number> <number>1</number>
</property> </property>
<property name="rightMargin"> <property name="rightMargin">
<number>0</number> <number>0</number>
@@ -43,13 +43,13 @@
<property name="minimumSize"> <property name="minimumSize">
<size> <size>
<width>0</width> <width>0</width>
<height>4</height> <height>2</height>
</size> </size>
</property> </property>
<property name="maximumSize"> <property name="maximumSize">
<size> <size>
<width>16777215</width> <width>16777215</width>
<height>4</height> <height>2</height>
</size> </size>
</property> </property>
</widget> </widget>
@@ -244,7 +244,7 @@
</widget> </widget>
</item> </item>
<item row="2" column="0"> <item row="2" column="0">
<widget class="QToolBar" name="toolBar" native="true"/> <widget class="QToolBar" name="toolBar"/>
</item> </item>
</layout> </layout>
<zorder>stackedWidget</zorder> <zorder>stackedWidget</zorder>

103
src/plugins/qmldesigner/components/connectioneditor/stylesheet.css
View File

@@ -1,71 +1,64 @@
QFrame QFrame {
{ background-color: creatorTheme.DSpanelBackground;
background-color: creatorTheme.QmlDesigner_BackgroundColorDarkAlternate; color: creatorTheme.DStextColor;
color: creatorTheme.PanelTextColorLight;
font-size: creatorTheme.captionFontPixelSize; font-size: creatorTheme.captionFontPixelSize;
border-radius: 0px; border-radius: 0px;
} }
QTableView { QTableView {
color: creatorTheme.PanelTextColorLight; color: creatorTheme.DStextColor;
selection-color: creatorTheme.PanelTextColorLight; selection-color: creatorTheme.DStextSelectedTextColor;
selection-background-color: creatorTheme.QmlDesigner_HighlightColor; selection-background-color: creatorTheme.DStextSelectionColor;
} }
QTabBar QToolButton { QTabBar QToolButton {
background-color: creatorTheme.QmlDesigner_BackgroundColorDarkAlternate; background-color: creatorTheme.DSpanelBackground;
border: 1px solid creatorTheme.QmlDesigner_BackgroundColorDarker; border: 1px solid creatorTheme.QmlDesigner_BackgroundColorDarker;
border-radius: 0px; border-radius: 0px;
} }
QTableView::item QTableView::item {
{
border: 0px; border: 0px;
padding-left: 4px; padding-left: 4px;
} }
QTableView::item:focus QTableView::item:focus {
{
border: none; border: none;
background-color: transparent; background-color: transparent;
} }
QTableView::item:selected QTableView::item:selected {
{
border: none border: none
} }
QHeaderView::section { QHeaderView::section {
background-color: #494949; background-color: creatorTheme.DSheaderViewBackground;
border: 0px; border: 0px;
color: creatorTheme.DStextColor; color: creatorTheme.DStextColor;
margin-right: 1px margin-right: 1px
} }
QTableView { QTableView {
alternate-background-color: #414141; alternate-background-color: creatorTheme.DStableViewAlternateBackground;
} }
QWidget#widgetSpacer { QWidget#widgetSpacer {
background-color: creatorTheme.QmlDesigner_TabLight; background-color: creatorTheme.DStabActiveBackground;
} }
QStackedWidget { QStackedWidget {
border: 0px; border: 0px;
background-color: creatorTheme.QmlDesigner_TabLight; background-color: creatorTheme.DStabActiveBackground;
} }
QTabBar::tab:selected { QTabBar::tab:selected {
border: none; border: none;
border-image: none; border-image: none;
image: none; image: none;
background-color: creatorTheme.DStabActiveBackground;
background-color: creatorTheme.QmlDesigner_TabLight; color: creatorTheme.DStabActiveText;
color: creatorTheme.QmlDesigner_TabDark;
} }
QTabBar::tab { QTabBar::tab {
width: 92px; width: 92px;
height: 22px; height: 22px;
@@ -75,48 +68,62 @@ QTabBar::tab {
margin-right: 0px; margin-right: 0px;
font: bold; font: bold;
font-size: creatorTheme.captionFontPixelSize; font-size: creatorTheme.captionFontPixelSize;
background-color: creatorTheme.QmlDesigner_TabDark; background-color: creatorTheme.DStabInactiveBackground;
color: creatorTheme.QmlDesigner_TabLight; color: creatorTheme.DStabInactiveText;
} }
QSpinBox /*
{ QSpinBox {
font-size: creatorTheme.captionFontPixelSize; font-size: creatorTheme.captionFontPixelSize;
color: white; color: creatorTheme.DStextColor;
padding-right: 2px; padding-right: 2px;
padding-top: 2px; padding-top: 2px;
padding-bottom: 2px; padding-bottom: 2px;
padding-left: 12px; padding-left: 12px;
border: 2px solid #0F0F0F; border: 1px solid creatorTheme.DScontrolOutline;
border-width: 1; background-color: creatorTheme.DScontrolBackground;
background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,
stop: 0 #2c2c2c, stop: 1 #333333);
min-height: 22px; min-height: 22px;
} }
QDoubleSpinBox QDoubleSpinBox {
{
font-size: creatorTheme.captionFontPixelSize; font-size: creatorTheme.captionFontPixelSize;
color: white; color: creatorTheme.DStextColor;
padding-right: 2px; padding-right: 2px;
padding-top: 2px; padding-top: 2px;
padding-bottom: 2px; padding-bottom: 2px;
padding-left: 12px; padding-left: 12px;
border: 2px solid #0F0F0F; border: 1px solid creatorTheme.DScontrolOutline;
border-width: 1; background-color: creatorTheme.DScontrolBackground;
background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,
stop: 0 #2c2c2c, stop: 1 #333333);
min-height: 22px; min-height: 22px;
} }
*/
QLineEdit QLineEdit {
{ color: creatorTheme.DStextColor;
color: white; selection-color: creatorTheme.DStextSelectedTextColor;
selection-background-color: creatorTheme.DStextSelectionColor;
font-size: creatorTheme.captionFontPixelSize; font-size: creatorTheme.captionFontPixelSize;
border: 2px solid #0F0F0F; border: 1px solid creatorTheme.DScontrolOutline;
border-width: 1;
min-height: 26px; min-height: 26px;
background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, background-color: creatorTheme.DScontrolBackground;
stop: 0 #2c2c2c, stop: 1 #333333); }
QComboBox {
color: creatorTheme.DStextColor;
selection-color: creatorTheme.DStextSelectedTextColor;
selection-background-color: creatorTheme.DStextSelectionColor;
font-size: creatorTheme.captionFontPixelSize;
border: 1px solid creatorTheme.DScontrolOutline;
min-height: 26px;
background-color: creatorTheme.DScontrolBackground;
}
QComboBox QAbstractItemView {
show-decoration-selected: 1; /* make the selection span the entire width of the view */
background-color: creatorTheme.DSpopupBackground; /* sets background of the menu */
border: 1px solid creatorTheme.DScontrolOutline;
margin: 0px; /* some spacing around the menu */
color: creatorTheme.DStextColor;
selection-color: creatorTheme.DStextSelectedTextColor;
selection-background-color: creatorTheme.DSinteraction;
} }

7
src/plugins/qmldesigner/components/itemlibrary/itemlibrarywidget.cpp
View File

@@ -144,13 +144,14 @@ ItemLibraryWidget::ItemLibraryWidget(AsynchronousImageCache &imageCache,
m_headerWidget->setResizeMode(QQuickWidget::SizeRootObjectToView); m_headerWidget->setResizeMode(QQuickWidget::SizeRootObjectToView);
Theme::setupTheme(m_headerWidget->engine()); Theme::setupTheme(m_headerWidget->engine());
m_headerWidget->engine()->addImportPath(propertyEditorResourcesPath() + "/imports"); m_headerWidget->engine()->addImportPath(propertyEditorResourcesPath() + "/imports");
m_headerWidget->setClearColor(Theme::getColor(Theme::Color::QmlDesigner_BackgroundColorDarkAlternate)); m_headerWidget->setClearColor(Theme::getColor(Theme::Color::DSpanelBackground));
m_headerWidget->rootContext()->setContextProperty("rootView", QVariant::fromValue(this)); m_headerWidget->rootContext()->setContextProperty("rootView", QVariant::fromValue(this));
// create add imports widget // create add imports widget
m_addImportWidget->setResizeMode(QQuickWidget::SizeRootObjectToView); m_addImportWidget->setResizeMode(QQuickWidget::SizeRootObjectToView);
m_addImportWidget->setClearColor(Theme::getColor(Theme::Color::QmlDesigner_BackgroundColorDarkAlternate));
Theme::setupTheme(m_addImportWidget->engine()); Theme::setupTheme(m_addImportWidget->engine());
m_addImportWidget->engine()->addImportPath(propertyEditorResourcesPath() + "/imports");
m_addImportWidget->setClearColor(Theme::getColor(Theme::Color::DSpanelBackground));
m_addImportWidget->rootContext()->setContextProperties({ m_addImportWidget->rootContext()->setContextProperties({
{"addImportModel", QVariant::fromValue(m_itemLibraryAddImportModel.data())}, {"addImportModel", QVariant::fromValue(m_itemLibraryAddImportModel.data())},
{"rootView", QVariant::fromValue(this)}, {"rootView", QVariant::fromValue(this)},
@@ -172,7 +173,7 @@ ItemLibraryWidget::ItemLibraryWidget(AsynchronousImageCache &imageCache,
m_itemViewQuickWidget->rootContext()->setContextProperty("tooltipBackend", m_itemViewQuickWidget->rootContext()->setContextProperty("tooltipBackend",
m_previewTooltipBackend.get()); m_previewTooltipBackend.get());
m_itemViewQuickWidget->setClearColor(Theme::getColor(Theme::Color::QmlDesigner_ButtonColor)); m_itemViewQuickWidget->setClearColor(Theme::getColor(Theme::Color::DSpanelBackground));
m_itemViewQuickWidget->engine()->addImageProvider(QStringLiteral("qmldesigner_itemlibrary"), m_itemViewQuickWidget->engine()->addImageProvider(QStringLiteral("qmldesigner_itemlibrary"),
new Internal::ItemLibraryImageProvider); new Internal::ItemLibraryImageProvider);
Theme::setupTheme(m_itemViewQuickWidget->engine()); Theme::setupTheme(m_itemViewQuickWidget->engine());

25
src/plugins/qmldesigner/components/navigator/iconcheckboxitemdelegate.cpp
View File

@@ -45,12 +45,9 @@
namespace QmlDesigner { namespace QmlDesigner {
IconCheckboxItemDelegate::IconCheckboxItemDelegate(QObject *parent, IconCheckboxItemDelegate::IconCheckboxItemDelegate(QObject *parent, const QIcon &icon)
const QIcon &checkedIcon,
const QIcon &uncheckedIcon)
: QStyledItemDelegate(parent), : QStyledItemDelegate(parent),
m_checkedIcon(checkedIcon), m_icon(icon)
m_uncheckedIcon(uncheckedIcon)
{} {}
QSize IconCheckboxItemDelegate::sizeHint(const QStyleOptionViewItem & /*option*/, QSize IconCheckboxItemDelegate::sizeHint(const QStyleOptionViewItem & /*option*/,
@@ -83,12 +80,18 @@ void IconCheckboxItemDelegate::paint(QPainter *painter,
const QStyleOptionViewItem &styleOption, const QStyleOptionViewItem &styleOption,
const QModelIndex &modelIndex) const const QModelIndex &modelIndex) const
{ {
if (styleOption.state & QStyle::State_MouseOver && !isThisOrAncestorLocked(modelIndex)) QIcon::Mode mode = QIcon::Mode::Normal;
painter->fillRect(styleOption.rect.adjusted(0, delegateMargin, 0, -delegateMargin),
Theme::getColor(Theme::Color::DSsliderHandle));
if (styleOption.state & QStyle::State_Selected) if (styleOption.state & QStyle::State_MouseOver && !isThisOrAncestorLocked(modelIndex)) {
painter->fillRect(styleOption.rect.adjusted(0, delegateMargin, 0, -delegateMargin),
Theme::getColor(Theme::Color::DSnavigatorItemBackgroundHover));
mode = QIcon::Mode::Active; // hover
}
if (styleOption.state & QStyle::State_Selected) {
NavigatorTreeView::drawSelectionBackground(painter, styleOption); NavigatorTreeView::drawSelectionBackground(painter, styleOption);
mode = QIcon::Mode::Selected;
}
bool isVisibilityIcon = modelIndex.column() != NavigatorTreeModel::ColumnType::Visibility; bool isVisibilityIcon = modelIndex.column() != NavigatorTreeModel::ColumnType::Visibility;
// We need to invert the check status if visibility icon // We need to invert the check status if visibility icon
@@ -106,8 +109,8 @@ void IconCheckboxItemDelegate::paint(QPainter *painter,
const QPoint iconPosition(styleOption.rect.left() + (styleOption.rect.width() - iconSize.width()) / 2, const QPoint iconPosition(styleOption.rect.left() + (styleOption.rect.width() - iconSize.width()) / 2,
styleOption.rect.top() + 2 + delegateMargin); styleOption.rect.top() + 2 + delegateMargin);
const QIcon &icon = isChecked(modelIndex) ? m_checkedIcon : m_uncheckedIcon; const QIcon::State state = isChecked(modelIndex) ? QIcon::State::On : QIcon::State::Off;
const QPixmap iconPixmap = icon.pixmap(window, iconSize); const QPixmap iconPixmap = m_icon.pixmap(window, iconSize, mode, state);
painter->save(); painter->save();

7
src/plugins/qmldesigner/components/navigator/iconcheckboxitemdelegate.h
View File

@@ -34,9 +34,7 @@ class NavigatorTreeModel;
class IconCheckboxItemDelegate : public QStyledItemDelegate class IconCheckboxItemDelegate : public QStyledItemDelegate
{ {
public: public:
explicit IconCheckboxItemDelegate(QObject *parent, explicit IconCheckboxItemDelegate(QObject *parent, const QIcon &icon);
const QIcon &checkedIcon,
const QIcon &uncheckedIcon);
QSize sizeHint(const QStyleOptionViewItem &option, QSize sizeHint(const QStyleOptionViewItem &option,
const QModelIndex &index) const override; const QModelIndex &index) const override;
@@ -52,7 +50,6 @@ protected:
const QModelIndex &index) override; const QModelIndex &index) override;
private: private:
const QIcon m_checkedIcon; const QIcon m_icon;
const QIcon m_uncheckedIcon;
}; };
} // namespace QmlDesigner } // namespace QmlDesigner

14
src/plugins/qmldesigner/components/navigator/nameitemdelegate.cpp
View File

@@ -217,12 +217,18 @@ void NameItemDelegate::paint(QPainter *painter,
{ {
painter->save(); painter->save();
if (styleOption.state & QStyle::State_MouseOver && !isThisOrAncestorLocked(modelIndex)) painter->setPen(Theme::getColor(Theme::Color::DSnavigatorText));
painter->fillRect(styleOption.rect.adjusted(0, delegateMargin, 0, -delegateMargin),
Theme::getColor(Theme::Color::DSsliderHandle));
if (styleOption.state & QStyle::State_Selected) if (styleOption.state & QStyle::State_MouseOver && !isThisOrAncestorLocked(modelIndex)) {
painter->fillRect(styleOption.rect.adjusted(0, delegateMargin, 0, -delegateMargin),
Theme::getColor(Theme::Color::DSnavigatorItemBackgroundHover));
painter->setPen(Theme::getColor(Theme::Color::DSnavigatorTextHover));
}
if (styleOption.state & QStyle::State_Selected) {
NavigatorTreeView::drawSelectionBackground(painter, styleOption); NavigatorTreeView::drawSelectionBackground(painter, styleOption);
painter->setPen(Theme::getColor(Theme::Color::DSnavigatorTextSelected));
}
iconOffset = drawIcon(painter, styleOption, modelIndex); iconOffset = drawIcon(painter, styleOption, modelIndex);

42
src/plugins/qmldesigner/components/navigator/navigatortreeview.cpp
View File

@@ -74,7 +74,7 @@ public:
mouseOverStateSavedFrameRectangle = option->rect; mouseOverStateSavedFrameRectangle = option->rect;
painter->fillRect(option->rect.adjusted(0, delegateMargin, 0, -delegateMargin), painter->fillRect(option->rect.adjusted(0, delegateMargin, 0, -delegateMargin),
Theme::getColor(Theme::Color::QmlDesigner_BorderColor)); Theme::getColor(Theme::Color::DSnavigatorItemBackground));
} else if (element == PE_IndicatorItemViewItemDrop) { } else if (element == PE_IndicatorItemViewItemDrop) {
// between elements and on elements we have a width // between elements and on elements we have a width
if (option->rect.width() > 0) { if (option->rect.width() > 0) {
@@ -101,7 +101,8 @@ public:
int bef_v = mid_v; int bef_v = mid_v;
int aft_h = mid_h; int aft_h = mid_h;
int aft_v = mid_v; int aft_v = mid_v;
QBrush brush(Theme::getColor(Theme::Color::DSsliderHandle), Qt::SolidPattern);
QBrush brush(Theme::getColor(Theme::Color::DSnavigatorBranch), Qt::SolidPattern);
if (option->state & State_Item) { if (option->state & State_Item) {
if (option->direction == Qt::RightToLeft) if (option->direction == Qt::RightToLeft)
painter->fillRect(option->rect.left(), mid_v, bef_h - option->rect.left(), 1, brush); painter->fillRect(option->rect.left(), mid_v, bef_h - option->rect.left(), 1, brush);
@@ -116,11 +117,11 @@ public:
int delta = decoration_size / 2; int delta = decoration_size / 2;
bef_h -= delta; bef_h -= delta;
bef_v -= delta; bef_v -= delta;
aft_h += delta; //aft_h += delta;
aft_v += delta; //aft_v += delta;
const QRectF rect(bef_h, bef_v, decoration_size + 1, decoration_size + 1); const QRectF rect(bef_h, bef_v, decoration_size + 1, decoration_size + 1);
painter->fillRect(rect, QBrush(Theme::getColor(Theme::Color::QmlDesigner_BackgroundColorDarkAlternate))); painter->fillRect(rect, QBrush(Theme::getColor(Theme::Color::DSpanelBackground)));
static const QPointF collapsePoints[3] = { static const QPointF collapsePoints[3] = {
QPointF(0.0, 0.0), QPointF(0.0, 0.0),
@@ -134,7 +135,7 @@ public:
QPointF(4.0, 4.0) QPointF(4.0, 4.0)
}; };
auto color = Theme::getColor(Theme::Color::IconsBaseColor); auto color = Theme::getColor(Theme::Color::DSnavigatorBranchIndicator);
painter->setPen(color); painter->setPen(color);
painter->setBrush(color); painter->setBrush(color);
@@ -167,23 +168,15 @@ public:
private: // functions private: // functions
QColor highlightBrushColor() const QColor highlightBrushColor() const
{ {
QColor highlightBrushColor = m_currentTextColor; QColor color = Theme::getColor(Theme::Color::DSnavigatorDropIndicatorBackground);
highlightBrushColor.setAlphaF(0.7); color.setAlphaF(0.7);
return highlightBrushColor; return color;
} }
QColor highlightLineColor() const QColor highlightLineColor() const
{ {
return highlightBrushColor().lighter(); QColor color = Theme::getColor(Theme::Color::DSnavigatorDropIndicatorOutline);
} color.setAlphaF(0.7);
QColor backgroundBrushColor() const return color;
{
QColor backgroundBrushColor = highlightBrushColor();
backgroundBrushColor.setAlphaF(0.2);
return backgroundBrushColor;
}
QColor backgroundLineColor() const
{
return backgroundBrushColor().lighter();
} }
void drawHighlightFrame(const QRect &frameRectangle, QPainter *painter) const void drawHighlightFrame(const QRect &frameRectangle, QPainter *painter) const
@@ -192,12 +185,7 @@ private: // functions
painter->setBrush(highlightBrushColor()); painter->setBrush(highlightBrushColor());
painter->drawRect(frameRectangle); painter->drawRect(frameRectangle);
} }
void drawBackgroundFrame(const QRect &frameRectangle, QPainter *painter) const
{
painter->setPen(QPen(backgroundLineColor(), 2));
painter->setBrush(backgroundBrushColor());
painter->drawRect(frameRectangle);
}
void drawIndicatorLine(const QPoint &leftPoint, const QPoint &rightPoint, QPainter *painter) const void drawIndicatorLine(const QPoint &leftPoint, const QPoint &rightPoint, QPainter *painter) const
{ {
painter->setPen(QPen(highlightLineColor(), 3)); painter->setPen(QPen(highlightLineColor(), 3));
@@ -231,7 +219,7 @@ void NavigatorTreeView::drawSelectionBackground(QPainter *painter, const QStyleO
{ {
painter->save(); painter->save();
painter->fillRect(option.rect.adjusted(0, delegateMargin, 0, -delegateMargin), painter->fillRect(option.rect.adjusted(0, delegateMargin, 0, -delegateMargin),
Theme::getColor(Theme::Color::QmlDesigner_HighlightColor)); Theme::getColor(Theme::Color::DSnavigatorItemBackgroundSelected));
painter->restore(); painter->restore();
} }

105
src/plugins/qmldesigner/components/navigator/navigatorview.cpp
View File

@@ -615,44 +615,85 @@ void NavigatorView::setupWidget()
#ifndef QMLDESIGNER_TEST #ifndef QMLDESIGNER_TEST
const QString fontName = "qtds_propertyIconFont.ttf"; const QString fontName = "qtds_propertyIconFont.ttf";
const QSize size = QSize(28, 28);
const QIcon visibilityOnIcon = const QString visibilityOnUnicode = Theme::getIconUnicode(Theme::Icon::visibilityOn);
Utils::StyleHelper::getIconFromIconFont(fontName, const QString visibilityOffUnicode = Theme::getIconUnicode(Theme::Icon::visibilityOff);
Theme::getIconUnicode(Theme::Icon::visibilityOn),
20, 20, QColor(Qt::white));
const QIcon visibilityOffIcon =
Utils::StyleHelper::getIconFromIconFont(fontName,
Theme::getIconUnicode(Theme::Icon::visibilityOff),
20, 20, QColor(Qt::white));
const QIcon aliasOnIcon = const QString aliasOnUnicode = Theme::getIconUnicode(Theme::Icon::idAliasOn);
Utils::StyleHelper::getIconFromIconFont(fontName, const QString aliasOffUnicode = Theme::getIconUnicode(Theme::Icon::idAliasOff);
Theme::getIconUnicode(Theme::Icon::idAliasOn),
20, 20, QColor(Qt::red));
const QIcon aliasOffIcon =
Utils::StyleHelper::getIconFromIconFont(fontName,
Theme::getIconUnicode(Theme::Icon::idAliasOff),
20, 20, QColor(Qt::white));
const QIcon lockOnIcon = const QString lockOnUnicode = Theme::getIconUnicode(Theme::Icon::lockOn);
Utils::StyleHelper::getIconFromIconFont(fontName, const QString lockOffUnicode = Theme::getIconUnicode(Theme::Icon::lockOff);
Theme::getIconUnicode(Theme::Icon::lockOn),
20, 20, QColor(Qt::white)); auto visibilityIconOffNormal = Utils::StyleHelper::IconFontHelper(
const QIcon lockOffIcon = visibilityOffUnicode, Theme::getColor(Theme::DSnavigatorIcon), size, QIcon::Normal, QIcon::Off);
Utils::StyleHelper::getIconFromIconFont(fontName, auto visibilityIconOffHover = Utils::StyleHelper::IconFontHelper(
Theme::getIconUnicode(Theme::Icon::lockOff), visibilityOffUnicode, Theme::getColor(Theme::DSnavigatorIconHover), size, QIcon::Active, QIcon::Off);
20, 20, QColor(Qt::white)); auto visibilityIconOffSelected = Utils::StyleHelper::IconFontHelper(
visibilityOffUnicode, Theme::getColor(Theme::DSnavigatorIconSelected), size, QIcon::Selected, QIcon::Off);
auto visibilityIconOnNormal = Utils::StyleHelper::IconFontHelper(
visibilityOnUnicode, Theme::getColor(Theme::DSnavigatorIcon), size, QIcon::Normal, QIcon::On);
auto visibilityIconOnHover = Utils::StyleHelper::IconFontHelper(
visibilityOnUnicode, Theme::getColor(Theme::DSnavigatorIconHover), size, QIcon::Active, QIcon::On);
auto visibilityIconOnSelected = Utils::StyleHelper::IconFontHelper(
visibilityOnUnicode, Theme::getColor(Theme::DSnavigatorIconSelected), size, QIcon::Selected, QIcon::On);
const QIcon visibilityIcon = Utils::StyleHelper::getIconFromIconFont(
fontName, {visibilityIconOffNormal,
visibilityIconOffHover,
visibilityIconOffSelected,
visibilityIconOnNormal,
visibilityIconOnHover,
visibilityIconOnSelected});
auto aliasIconOffNormal = Utils::StyleHelper::IconFontHelper(
aliasOffUnicode, Theme::getColor(Theme::DSnavigatorIcon), size, QIcon::Normal, QIcon::Off);
auto aliasIconOffHover = Utils::StyleHelper::IconFontHelper(
aliasOffUnicode, Theme::getColor(Theme::DSnavigatorIconHover), size, QIcon::Active, QIcon::Off);
auto aliasIconOffSelected = Utils::StyleHelper::IconFontHelper(
aliasOffUnicode, Theme::getColor(Theme::DSnavigatorIconSelected), size, QIcon::Selected, QIcon::Off);
auto aliasIconOnNormal = Utils::StyleHelper::IconFontHelper(
aliasOnUnicode, Theme::getColor(Theme::DSnavigatorAliasIconChecked), size, QIcon::Normal, QIcon::On);
auto aliasIconOnHover = Utils::StyleHelper::IconFontHelper(
aliasOnUnicode, Theme::getColor(Theme::DSnavigatorAliasIconChecked), size, QIcon::Active, QIcon::On);
auto aliasIconOnSelected = Utils::StyleHelper::IconFontHelper(
aliasOnUnicode, Theme::getColor(Theme::DSnavigatorAliasIconChecked), size, QIcon::Selected, QIcon::On);
const QIcon aliasIcon = Utils::StyleHelper::getIconFromIconFont(
fontName, {aliasIconOffNormal,
aliasIconOffHover,
aliasIconOffSelected,
aliasIconOnNormal,
aliasIconOnHover,
aliasIconOnSelected});
auto lockIconOffNormal = Utils::StyleHelper::IconFontHelper(
lockOffUnicode, Theme::getColor(Theme::DSnavigatorIcon), size, QIcon::Normal, QIcon::Off);
auto lockIconOffHover = Utils::StyleHelper::IconFontHelper(
lockOffUnicode, Theme::getColor(Theme::DSnavigatorIconHover), size, QIcon::Active, QIcon::Off);
auto lockIconOffSelected = Utils::StyleHelper::IconFontHelper(
lockOffUnicode, Theme::getColor(Theme::DSnavigatorIconSelected), size, QIcon::Selected, QIcon::Off);
auto lockIconOnNormal = Utils::StyleHelper::IconFontHelper(
lockOnUnicode, Theme::getColor(Theme::DSnavigatorIcon), size, QIcon::Normal, QIcon::On);
auto lockIconOnHover = Utils::StyleHelper::IconFontHelper(
lockOnUnicode, Theme::getColor(Theme::DSnavigatorIconHover), size, QIcon::Active, QIcon::On);
auto lockIconOnSelected = Utils::StyleHelper::IconFontHelper(
lockOnUnicode, Theme::getColor(Theme::DSnavigatorIconSelected), size, QIcon::Selected, QIcon::On);
const QIcon lockIcon = Utils::StyleHelper::getIconFromIconFont(
fontName, {lockIconOffNormal,
lockIconOffHover,
lockIconOffSelected,
lockIconOnNormal,
lockIconOnHover,
lockIconOnSelected});
auto idDelegate = new NameItemDelegate(this); auto idDelegate = new NameItemDelegate(this);
IconCheckboxItemDelegate *visibilityDelegate = auto visibilityDelegate = new IconCheckboxItemDelegate(this, visibilityIcon);
new IconCheckboxItemDelegate(this, visibilityOnIcon, visibilityOffIcon); auto aliasDelegate = new IconCheckboxItemDelegate(this, aliasIcon);
auto lockDelegate = new IconCheckboxItemDelegate(this, lockIcon);
IconCheckboxItemDelegate *aliasDelegate =
new IconCheckboxItemDelegate(this, aliasOnIcon, aliasOffIcon);
IconCheckboxItemDelegate *lockDelegate =
new IconCheckboxItemDelegate(this, lockOnIcon, lockOffIcon);
treeWidget()->setItemDelegateForColumn(NavigatorTreeModel::ColumnType::Name, idDelegate); treeWidget()->setItemDelegateForColumn(NavigatorTreeModel::ColumnType::Name, idDelegate);
treeWidget()->setItemDelegateForColumn(NavigatorTreeModel::ColumnType::Alias, aliasDelegate); treeWidget()->setItemDelegateForColumn(NavigatorTreeModel::ColumnType::Alias, aliasDelegate);

142
src/plugins/qmldesigner/components/resources/dockwidgets.css
View File

@@ -1,112 +1,119 @@
ADS--DockContainerWidget ADS--DockContainerWidget {
{ background: creatorTheme.DSdockContainerBackground;
background-color: creatorTheme.QmlDesigner_BackgroundColorDarkAlternate;
} }
ADS--DockContainerWidget QSplitter::handle ADS--DockContainerWidget QSplitter::handle {
{ background: creatorTheme.DSdockContainerSplitter;
background-color: creatorTheme.QmlDesigner_BackgroundColorDarkAlternate;
} }
ADS--DockAreaWidget ADS--DockAreaWidget {
{ background: creatorTheme.DSdockAreaBackground;
background-color: creatorTheme.BackgroundColorNormal;
} }
ADS--DockAreaWidget #tabsMenuButton::menu-indicator ADS--DockAreaWidget #tabsMenuButton::menu-indicator {
{
image: none; image: none;
} }
ADS--DockSplitter::handle:horizontal { ADS--DockSplitter::handle:horizontal {
width: 1px; width: 1px;
background-color: creatorTheme.SplitterColor; background: creatorTheme.DSdockWidgetSplitter;
} }
ADS--DockSplitter::handle:vertical { ADS--DockSplitter::handle:vertical {
height: 1px; height: 1px;
background-color: creatorTheme.SplitterColor; background: creatorTheme.DSdockWidgetSplitter;
} }
ADS--DockWidgetTab ADS--DockWidgetTab {
{ background-color: creatorTheme.DStabInactiveBackground;
background-color: creatorTheme.BackgroundColorDark; border-color: creatorTheme.DStabSplitter;
border-color: creatorTheme.SplitterColor;
border-style: solid; border-style: solid;
border-width: 0 1px 0 0; border-width: 0 1px 0 0;
} }
ADS--DockWidgetTab[activeTab="true"] ADS--DockWidgetTab QLabel {
{ color: creatorTheme.DStabInactiveText;
background-color: creatorTheme.QmlDesigner_TabLight;
} }
ADS--DockWidgetTab QLabel ADS--DockWidgetTab[activeTab="true"] {
{ background: creatorTheme.DStabActiveBackground;
color: creatorTheme.QmlDesigner_TabLight;
} }
ADS--DockWidgetTab[activeTab="true"] QLabel ADS--DockWidgetTab[activeTab="true"] QLabel {
{ color: creatorTheme.DStabActiveText;
color: creatorTheme.QmlDesigner_TabDark;
} }
ADS--DockWidget ADS--DockWidgetTab[activeTab="true"] > #tabCloseButton:hover {
{ background: creatorTheme.DStabActiveButtonHover;
background-color: palette(light);
border-color: red;
border-style: solid;
border-width: 0;
} }
ADS--DockAreaTitleBar ADS--DockWidgetTab[activeTab="true"] > #tabCloseButton:pressed {
{ background: creatorTheme.DStabActiveButtonPress;
background-color: creatorTheme.BackgroundColorDark;
} }
QWidget#tabsContainerWidget ADS--DockWidget {
{ background: creatorTheme.DSdockWidgetBackground;
background-color: creatorTheme.BackgroundColorDark; border: none;
} }
ADS--TitleBarButton QWidget#tabsContainerWidget {
{ background: creatorTheme.DStabContainerBackground;
padding: 0px 0px;
} }
ADS--TitleBarButton:hover ADS--TitleBarButton {
{ margin: 1px;
background-color: creatorTheme.QmlDesigner_BackgroundColorDarkAlternate; background: none;
border: none;
} }
QScrollArea#dockWidgetScrollArea ADS--TitleBarButton:hover {
{ background-color: creatorTheme.DStitleBarButtonHover;
background-color: creatorTheme.QmlDesigner_BackgroundColorDarkAlternate; }
ADS--TitleBarButton:press {
background-color: creatorTheme.DStitleBarButtonPress;
}
#floatingTitleLabel {
color: creatorTheme.DStitleBarText;
}
#floatingTitleCloseButton {
margin: 1px;
background: none;
border: none;
}
#floatingTitleCloseButton:hover {
background: creatorTheme.DStitleBarButtonHover;
}
#floatingTitleCloseButton:pressed {
background: creatorTheme.DStitleBarButtonPress;
}
QScrollArea#dockWidgetScrollArea {
background-color: creatorTheme.DSpanelBackground;
padding: 0px; padding: 0px;
border: none; border: none;
} }
#tabCloseButton #tabCloseButton {
{ margin: 1px;
margin-top: 2px;
background: none; background: none;
border: none; border: none;
padding: 0px -2px;
} }
#tabCloseButton:hover #tabCloseButton:hover {
{ background: creatorTheme.DStabInactiveButtonHover;
border: 1px solid rgba(0, 0, 0, 32);
background: rgba(0, 0, 0, 16);
} }
#tabCloseButton:pressed #tabCloseButton:pressed {
{ background: creatorTheme.DStabInactiveButtonPress;
background: rgba(0, 0, 0, 32);
} }
QScrollBar { QScrollBar {
background-color: creatorTheme.BackgroundColorDark; background: creatorTheme.DSscrollBarTrack;
} }
QScrollBar:vertical { QScrollBar:vertical {
@@ -118,7 +125,7 @@ QScrollBar:horizontal {
} }
QScrollBar::handle { QScrollBar::handle {
background-color: creatorTheme.QmlDesigner_ScrollBarHandleColor; background: creatorTheme.DSscrollBarHandle;
} }
QScrollBar::handle:vertical { QScrollBar::handle:vertical {
@@ -141,28 +148,27 @@ QScrollBar::sub-page {
/* Focus related styling */ /* Focus related styling */
ADS--DockWidgetTab[focused="true"] { ADS--DockWidgetTab[focused="true"] {
background: creatorTheme.DSinteraction; background: creatorTheme.DStabFocusBackground;
border-color: creatorTheme.DSinteraction;
} }
ADS--DockWidgetTab[focused="true"] > #tabCloseButton:hover { ADS--DockWidgetTab[focused="true"] > #tabCloseButton:hover {
background: rgba(255, 255, 255, 48); background: creatorTheme.DStabFocusButtonHover;
} }
ADS--DockWidgetTab[focused="true"] > #tabCloseButton:pressed { ADS--DockWidgetTab[focused="true"] > #tabCloseButton:pressed {
background: rgba(255, 255, 255, 92); background: creatorTheme.DStabFocusButtonPress;
} }
ADS--DockWidgetTab[focused="true"] QLabel { ADS--DockWidgetTab[focused="true"] QLabel {
color: palette(creatorTheme.DStextColor); color: creatorTheme.DStabFocusText;
} }
ADS--DockAreaTitleBar { ADS--DockAreaTitleBar {
background: creatorTheme.QmlDesigner_BackgroundColorDarkAlternate; background: creatorTheme.DSdockWidgetTitleBar;
border-bottom: 2px solid creatorTheme.QmlDesigner_TabLight; border-bottom: 2px solid creatorTheme.DStabActiveBackground;
padding-bottom: 0px; padding-bottom: 0px;
} }
ADS--DockAreaWidget[focused="true"] ADS--DockAreaTitleBar { ADS--DockAreaWidget[focused="true"] ADS--DockAreaTitleBar {
border-bottom-color: creatorTheme.DSinteraction; border-bottom-color: creatorTheme.DStabFocusBackground;
} }

Some files were not shown because too many files have changed in this diff Show More