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.Controls 2.15
import QtQuickDesignerTheme 1.0
import HelperWidgets 2.0
import StudioTheme 1.0 as StudioTheme
Column {
id: root
@@ -33,7 +35,7 @@ Column {
Text {
id: header
text: qsTr("Select a Module to Add")
color: "#ffffff"
color: StudioTheme.Values.themeTextColor
font.pixelSize: 16
width: parent.width
height: 50
@@ -54,17 +56,16 @@ Column {
model: addImportModel
delegate: Rectangle {
id: itemBackground
width: listView.width
height: isSeparator ? 4 : 25
color: isSeparator ? Theme.color(Theme.BackgroundColorNormal)
: mouseArea.containsMouse
? Qt.lighter(Theme.qmlDesignerButtonColor(), 1.3)
: Theme.qmlDesignerButtonColor()
color: StudioTheme.Values.themeListItemBackground
visible: importVisible
Text {
id: itemText
text: importUrl
color: Theme.color(Theme.PanelTextColorLight)
color: StudioTheme.Values.themeListItemText
anchors.verticalCenter: parent.verticalCenter
anchors.left: parent.left
anchors.right: parent.right
@@ -79,6 +80,53 @@ Column {
onClicked: rootView.handleAddImport(index)
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 QtQuickDesignerTheme 1.0
import HelperWidgets 2.0
import StudioTheme 1.0 as StudioTheme
Item {
id: delegateRoot
@@ -37,7 +38,7 @@ Item {
anchors.topMargin: 1
anchors.fill: parent
color: Theme.qmlDesignerButtonColor()
color: StudioTheme.Values.themePanelBackground
Image {
id: itemIcon // to be set by model
@@ -68,7 +69,7 @@ Item {
verticalAlignment: Qt.AlignVCenter
horizontalAlignment: Qt.AlignHCenter
text: itemName // to be set by model
color: Theme.color(Theme.PanelTextColorLight)
color: StudioTheme.Values.themeTextColor
renderType: Text.NativeRendering
}

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

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

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

@@ -26,6 +26,7 @@
import QtQuick 2.15
import QtQuick.Controls 2.15
import QtQuickDesignerTheme 1.0
import HelperWidgets 2.0 as HelperWidgets
import StudioControls 1.0 as StudioControls
import StudioTheme 1.0 as StudioTheme
@@ -47,7 +48,7 @@ Item {
Column {
anchors.left: parent.left
anchors.right: parent.right
spacing: 10
spacing: 9
TabBar {
id: tabBar
@@ -58,7 +59,7 @@ Item {
spacing: 40
background: Rectangle {
color: Theme.color(Theme.QmlDesigner_BackgroundColorDarkAlternate)
color: StudioTheme.Values.themePanelBackground
}
Repeater {
@@ -74,8 +75,9 @@ Item {
Text { // TabButton text
text: modelData.title
font.pixelSize: 13
font.bold: true
color: tabBar.currentIndex === index ? "#0094ce" : "#dadada"
font.bold: false
color: tabBar.currentIndex === index ? StudioTheme.Values.themeInteraction
: StudioTheme.Values.themeTextColor
anchors.left: parent.left
anchors.top: parent.top
anchors.bottom: parent.bottom
@@ -93,11 +95,8 @@ Item {
anchors.topMargin: 1
width: 24
height: 24
color: mouseArea.containsMouse ? "#353535" : "#262626"
ToolTip.delay: 500
ToolTip.text: modelData.addToolTip
ToolTip.visible: mouseArea.containsMouse
color: mouseArea.containsMouse ? StudioTheme.Values.themeControlBackgroundHover
: StudioTheme.Values.themeControlBackground
Label { // + sign
text: StudioTheme.Constants.plus
@@ -106,15 +105,17 @@ Item {
verticalAlignment: Text.AlignVCenter
horizontalAlignment: Text.AlignHCenter
anchors.centerIn: parent
color: tabBar.currentIndex === index ? "#0094ce" : "#a8a8a8"
color: tabBar.currentIndex === index ? StudioTheme.Values.themeIconColorSelected
: StudioTheme.Values.themeIconColor
}
MouseArea {
HelperWidgets.ToolTipArea {
id: mouseArea
anchors.fill: parent
hoverEnabled: true
onClicked: index == 0 ? rootView.handleAddModule()
: rootView.handleAddAsset()
tooltip: modelData.addToolTip
}
}
}
@@ -124,7 +125,8 @@ Item {
anchors.bottom: parent.bottom
width: parent.width
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
id: searchFilterText
placeholderText: qsTr("Search")
placeholderTextColor: "#a8a8a8"
color: "#dadada"
selectedTextColor: "#0094ce"
placeholderTextColor: StudioTheme.Values.themePlaceholderTextColor
color: StudioTheme.Values.themeTextColor
selectionColor: StudioTheme.Values.themeTextSelectionColor
selectedTextColor: StudioTheme.Values.themeTextSelectedTextColor
background: Rectangle {
color: "#111111"
border.color: "#666666"
id: textFieldBackground
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.right: parent.right
anchors.leftMargin: 5
anchors.rightMargin: 5
selectByMouse: true
hoverEnabled: true
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
width: 15
width: 16
height: 15
anchors.right: parent.right
anchors.rightMargin: 5
anchors.verticalCenter: parent.verticalCenter
visible: searchFilterText.text !== ""
color: xMouseArea.containsMouse ? "#353535" : "transparent"
color: xMouseArea.containsMouse ? StudioTheme.Values.themePanelBackground
: "transparent"
Label {
text: StudioTheme.Constants.closeCross
@@ -167,7 +190,7 @@ Item {
verticalAlignment: Text.AlignVCenter
horizontalAlignment: Text.AlignHCenter
anchors.centerIn: parent
color: "#dadada"
color: StudioTheme.Values.themeIconColor
}
MouseArea {
@@ -177,6 +200,49 @@ Item {
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 {
anchors.fill: parent
anchors.leftMargin: StudioTheme.Values.inputHorizontalPadding
anchors.topMargin: StudioTheme.Values.typeLabelVerticalShift
text: backendValues.className.value
}
ToolTipArea {
@@ -338,6 +339,7 @@ Rectangle {
SecondColumnLayout {
SpinBox {
width: StudioTheme.Values.squareComponentWidth * 4
sliderIndicatorVisible: true
backendValue: backendValues.opacity
decimals: 2

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

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

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

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

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

@@ -39,7 +39,8 @@ Row {
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: {
buttonAlignLeft.checked = true

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

@@ -39,7 +39,8 @@ Row {
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: {
buttonAlignTop.checked = true

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

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

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

@@ -34,7 +34,8 @@ StudioControls.Button {
property variant backendValue
property bool isHighlighted: false
iconColor: isHighlighted ? StudioTheme.Values.themeInteraction : StudioTheme.Values.themeTextColor
iconColor: isHighlighted ? StudioTheme.Values.themeIconColorInteraction
: StudioTheme.Values.themeIconColor
actionIndicatorVisible: 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
PropertyChanges {
target: buttonBackground
color: StudioTheme.Values.themeHoverHighlight
color: StudioTheme.Values.themeControlBackgroundHover
}
},
State {

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

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

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

@@ -24,6 +24,7 @@
****************************************************************************/
import QtQuick 2.1
import StudioTheme 1.0 as StudioTheme
Item {
id: colorButton
@@ -229,10 +230,10 @@ Item {
}
Rectangle {
anchors.fill: parent
anchors.margins: -1
anchors.margins: -StudioTheme.Values.border
color: "#00000000"
border.color: "black"
border.width: 1
border.color: StudioTheme.Values.themeControlOutline
border.width: StudioTheme.Values.border
}
}
@@ -249,20 +250,24 @@ Item {
onClicked: colorButton.updateColor()
}
Row {
Column {
anchors.left: hueSlider.right
anchors.margins: colorButton.sliderMargins
spacing: 10
spacing: StudioTheme.Values.sectionRowSpacing
Row {
spacing: 20
Column {
spacing: 10
spacing: StudioTheme.Values.sectionRowSpacing
Row {
z: 3
spacing: 1
Label {
text: "R"
width: 16
color: "#eee"
color: StudioTheme.Values.themeTextColor
elide: Text.ElideRight
anchors.verticalCenter: parent.verticalCenter
}
@@ -291,7 +296,7 @@ Item {
Label {
text: "G"
width: 16
color: "#eee"
color: StudioTheme.Values.themeTextColor
elide: Text.ElideRight
anchors.verticalCenter: parent.verticalCenter
}
@@ -320,7 +325,7 @@ Item {
Label {
text: "B"
width: 16
color: "#eee"
color: StudioTheme.Values.themeTextColor
elide: Text.ElideRight
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 {
spacing: 10
spacing: StudioTheme.Values.sectionRowSpacing
Row {
z: 3
spacing: 1
Label {
text: "H"
width: 16
color: "#eee"
color: StudioTheme.Values.themeTextColor
elide: Text.ElideRight
anchors.verticalCenter: parent.verticalCenter
}
@@ -397,7 +380,7 @@ Item {
Label {
text: "S"
width: 16
color: "#eee"
color: StudioTheme.Values.themeTextColor
elide: Text.ElideRight
anchors.verticalCenter: parent.verticalCenter
}
@@ -419,7 +402,7 @@ Item {
Label {
text: "L"
width: 16
color: "#eee"
color: StudioTheme.Values.themeTextColor
elide: Text.ElideRight
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 StudioTheme 1.0 as StudioTheme
Item {
id: root
property bool checked: false
property alias buttonColor: checkBox.color
width: 30
height: 24
width: StudioTheme.Values.height
height: StudioTheme.Values.height
signal rightMouseButtonClicked
Rectangle {
id: backgroundBox
width: 24
height: 24
width: StudioTheme.Values.height
height: StudioTheme.Values.height
anchors.right: parent.right
color: "white"
border.color: "white"
border.width: 1
border.width: StudioTheme.Values.border
Rectangle {
id: checkBox
width: 22
height: 22
width: StudioTheme.Values.height - 2 * StudioTheme.Values.border
height: StudioTheme.Values.height - 2 * StudioTheme.Values.border
anchors.centerIn: parent
border.color: "black"
border.width: 1
border.width: StudioTheme.Values.border
}
}
@@ -62,7 +63,7 @@ Item {
source: "image://icons/down-arrow"
anchors.verticalCenter: parent.verticalCenter
anchors.right: backgroundBox.left
anchors.rightMargin: 2
anchors.rightMargin: 4
opacity: colorToolTip.containsMouse ? 1 : 0.8
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 QtQuickDesignerTheme 1.0
import QtQuick.Dialogs 1.3
import StudioTheme 1.0 as StudioTheme
import StudioControls 1.0 as StudioControls
Column {
@@ -214,6 +215,10 @@ Column {
SecondColumnLayout {
Item {
width: 6
}
ColorCheckButton {
id: checkButton
buttonColor: colorEditor.color
@@ -260,7 +265,6 @@ Column {
}
ButtonRow {
id: buttonRow
exclusive: true
@@ -303,30 +307,20 @@ Column {
GradientDialogPopup {
id: gradientDialogPopupLinear
dialogHeight: 80
content: GridLayout {
rowSpacing: 4
anchors.fill: parent
height: 40
columns: 4
rows: 2
anchors.leftMargin: 12
anchors.rightMargin: 6
anchors.topMargin: 28
anchors.bottomMargin: 6
dialogHeight: 110
content: Column {
spacing: StudioTheme.Values.sectionRowSpacing
RowLayout {
Label {
text: "X1"
width: 18
tooltip: qsTr("Defines the start point for color interpolation.")
}
GradientPropertySpinBox {
propertyName: "x1"
}
GradientPropertySpinBox { propertyName: "x1" }
Item { width: StudioTheme.Values.controlLabelGap }
Label {
text: "X2"
@@ -334,19 +328,19 @@ Column {
tooltip: qsTr("Defines the end point for color interpolation.")
}
GradientPropertySpinBox {
propertyName: "x2"
GradientPropertySpinBox { propertyName: "x2" }
}
RowLayout {
Label {
text: "y1"
text: "Y1"
width: 18
tooltip: qsTr("Defines the start point for color interpolation.")
}
GradientPropertySpinBox {
propertyName: "y1"
}
GradientPropertySpinBox { propertyName: "y1" }
Item { width: StudioTheme.Values.controlLabelGap }
Label {
text: "Y2"
@@ -354,8 +348,7 @@ Column {
tooltip: qsTr("Defines the end point for color interpolation.")
}
GradientPropertySpinBox {
propertyName: "y2"
GradientPropertySpinBox { propertyName: "y2" }
}
}
}
@@ -384,78 +377,67 @@ Column {
GradientDialogPopup {
id: gradientDialogPopupRadial
dialogHeight: 140
content: GridLayout {
rowSpacing: 4
anchors.fill: parent
height: 40
columns: 4
rows: 3
anchors.leftMargin: 12
anchors.rightMargin: 6
anchors.topMargin: 28
anchors.bottomMargin: 6
content: Column {
spacing: StudioTheme.Values.sectionRowSpacing
RowLayout {
Label {
text: "CenterX"
width: 64
width: 74
tooltip: qsTr("Defines the center point.")
}
GradientPropertySpinBox {
propertyName: "centerX"
}
GradientPropertySpinBox { propertyName: "centerX" }
Item { width: StudioTheme.Values.controlLabelGap }
Label {
text: "CenterY"
width: 64
width: 74
tooltip: qsTr("Defines the center point.")
}
GradientPropertySpinBox {
propertyName: "centerY"
GradientPropertySpinBox { propertyName: "centerY" }
}
RowLayout {
Label {
text: "FocalX"
width: 64
width: 74
tooltip: qsTr("Defines the focal point.")
}
GradientPropertySpinBox {
propertyName: "focalX"
}
GradientPropertySpinBox { propertyName: "focalX" }
Item { width: StudioTheme.Values.controlLabelGap }
Label {
text: "FocalY"
width: 64
width: 74
tooltip: qsTr("Defines the focal point.")
}
GradientPropertySpinBox {
propertyName: "focalY"
GradientPropertySpinBox { propertyName: "focalY" }
}
RowLayout {
Label {
text: "Center Radius"
width: 64
width: 74
tooltip: qsTr("Defines the center point.")
}
GradientPropertySpinBox {
propertyName: "centerRadius"
}
GradientPropertySpinBox { propertyName: "centerRadius" }
Item { width: StudioTheme.Values.controlLabelGap }
Label {
text: "Focal Radius"
width: 64
width: 74
tooltip: qsTr("Defines the focal radius. Set to 0 for simple radial gradients.")
}
GradientPropertySpinBox {
propertyName: "focalRadius"
GradientPropertySpinBox { propertyName: "focalRadius" }
}
}
}
@@ -484,30 +466,20 @@ Column {
GradientDialogPopup {
id: gradientDialogPopupConical
dialogHeight: 80
content: GridLayout {
rowSpacing: 4
anchors.fill: parent
height: 40
columns: 4
rows: 2
anchors.leftMargin: 12
anchors.rightMargin: 6
anchors.topMargin: 28
anchors.bottomMargin: 6
dialogHeight: 110
content: Column {
spacing: StudioTheme.Values.sectionRowSpacing
RowLayout {
Label {
text: "CenterX"
width: 64
tooltip: qsTr("Defines the center point.")
}
GradientPropertySpinBox {
propertyName: "centerX"
}
GradientPropertySpinBox { propertyName: "centerX" }
Item { width: StudioTheme.Values.controlLabelGap }
Label {
text: "CenterY"
@@ -515,18 +487,17 @@ Column {
tooltip: qsTr("Defines the center point.")
}
GradientPropertySpinBox {
propertyName: "centerY"
GradientPropertySpinBox { propertyName: "centerY" }
}
RowLayout {
Label {
text: "Angle"
width: 64
tooltip: qsTr("Defines the start angle for the conical gradient. The value is in degrees (0-360).")
}
GradientPropertySpinBox {
propertyName: "angle"
GradientPropertySpinBox { propertyName: "angle" }
}
}
}
@@ -546,13 +517,13 @@ Column {
Rectangle {
id: gradientPickerButton
width: 20
height: 20
width: StudioTheme.Values.height
height: StudioTheme.Values.height
visible: colorEditor.supportGradient
color: Theme.qmlDesignerButtonColor()
border.color: Theme.qmlDesignerBorderColor()
border.width: 1
color: StudioTheme.Values.themeControlBackground
border.color: StudioTheme.Values.themeControlOutline
border.width: StudioTheme.Values.border
ToolTipArea {
anchors.fill: parent

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

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

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

@@ -32,7 +32,8 @@ StudioControls.ComboBox {
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"
enum ValueType { String, Integer, Enum }

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

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

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

@@ -66,9 +66,9 @@ StudioControls.TextField {
Popup {
id: textFieldPopup
x: textField.x
y: textField.height - StudioTheme.Values.border
width: textField.width
x: StudioTheme.Values.border
y: textField.height
width: textField.width - (StudioTheme.Values.border * 2)
// 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
// and is then cut off.
@@ -106,11 +106,14 @@ StudioControls.TextField {
padding: 0
text: itemDelegateText.text
highlighted: listView.currentIndex === index
contentItem: Text {
id: itemDelegateText
leftPadding: 8
text: modelData
color: StudioTheme.Values.themeTextColor
color: highlighted ? StudioTheme.Values.themeTextSelectedTextColor
: StudioTheme.Values.themeTextColor
font: textField.font
elide: Text.ElideRight
verticalAlignment: Text.AlignVCenter
@@ -144,9 +147,8 @@ StudioControls.TextField {
}
background: Rectangle {
color: StudioTheme.Values.themeControlBackground
border.color: StudioTheme.Values.themeInteraction
border.width: StudioTheme.Values.border
color: StudioTheme.Values.themePopupBackground
border.width: 0
}
enter: Transition {
@@ -155,7 +157,7 @@ StudioControls.TextField {
}
}
verticalAlignment: Text.AlignTop
verticalAlignment: Text.AlignVCenter
onPressed: listView.model = null

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

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

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

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

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

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

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

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

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

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

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

@@ -24,6 +24,7 @@
****************************************************************************/
import QtQuick 2.1
import StudioTheme 1.0 as StudioTheme
Item {
id: colorSlider
@@ -63,7 +64,7 @@ Item {
Rectangle {
anchors.fill: track
anchors.margins: -1
color: "darkGray"
color: StudioTheme.Values.themeControlOutline
}
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)
color: ((label.disabledState || label.disabledStateSoft)
? StudioTheme.Values.themeDisabledTextColor
? StudioTheme.Values.themeTextColorDisabled
: StudioTheme.Values.themeTextColor)
elide: Text.ElideRight

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

@@ -35,12 +35,12 @@ Item {
property variant backendValue
property color borderColorSelected: colorLogic.textColor
property color borderColor: Theme.qmlDesignerBorderColor()
property color borderColor: StudioTheme.Values.themeControlOutline
property bool showTranslateCheckBox: true
readonly property color selectedColor: Theme.qmlDesignerBackgroundColorDarkAlternate()
readonly property color unselectedColor: Theme.qmlDesignerBackgroundColorDarker()
readonly property color selectedColor: StudioTheme.Values.themeControlBackgroundInteraction
readonly property color unselectedColor: StudioTheme.Values.themeControlBackground
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.Layouts 1.0
import QtQuickDesignerTheme 1.0
import StudioTheme 1.0 as StudioTheme
Rectangle {
id: panel
@@ -43,8 +44,8 @@ Rectangle {
*/
border.width: roundLeft || roundRight ? 1 : 0
color: Theme.qmlDesignerButtonColor()
border.color: Theme.qmlDesignerBorderColor()
color: StudioTheme.Values.themeControlBackground
border.color: StudioTheme.Values.themeControlOutline
Rectangle {
anchors.fill: parent
@@ -71,7 +72,7 @@ Rectangle {
}
Rectangle {
color: Theme.qmlDesignerBorderColor()
color: StudioTheme.Values.themeControlOutline
anchors.top: parent.top
anchors.left: parent.left
anchors.right: parent.right
@@ -81,7 +82,7 @@ Rectangle {
}
Rectangle {
color: Theme.qmlDesignerBorderColor()
color: StudioTheme.Values.themeControlOutline
anchors.bottom: parent.bottom
anchors.left: parent.left
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/
**
** This file is part of Qt Creator.
@@ -62,7 +62,7 @@ Item {
Rectangle {
id: header
height: 20
height: StudioTheme.Values.sectionHeadHeight
anchors.left: parent.left
anchors.right: parent.right
color: Qt.lighter(StudioTheme.Values.themeSectionHeadBackground, 1.0 + (0.2 * level))
@@ -82,8 +82,8 @@ Item {
anchors.verticalCenter: parent.verticalCenter
color: StudioTheme.Values.themeTextColor
x: 22 + (level * levelShift)
font.bold: true
font.pixelSize: StudioTheme.Values.myFontSize
font.capitalization: Font.AllUppercase
}
MouseArea {
@@ -112,15 +112,20 @@ Item {
anchors.rightMargin: 5 + leftPadding
anchors.leftMargin: 5 - leftPadding
visible: false
color: "#666666"
color: StudioTheme.Values.themeControlOutline
}
default property alias __content: row.children
readonly property alias contentItem: row
implicitHeight: Math.round(row.height + header.height
+ section.topPadding + section.bottomPadding)
implicitHeight: Math.round(row.height + header.height + topRow.height + bottomRow.height)
Row {
id: topRow
height: StudioTheme.Values.sectionHeadSpacerHeight
anchors.top: header.bottom
}
Row {
id: row
@@ -128,8 +133,13 @@ Item {
anchors.leftMargin: section.leftPadding
anchors.right: parent.right
anchors.rightMargin: section.rightPadding
anchors.top: header.bottom
anchors.topMargin: section.topPadding
anchors.top: topRow.bottom
}
Row {
id: bottomRow
height: StudioTheme.Values.sectionHeadSpacerHeight
anchors.top: row.bottom
}
states: [

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

@@ -127,20 +127,18 @@ Section {
text: qsTr("Alignment")
}
AligmentHorizontalButtons {
Row {
AligmentHorizontalButtons {}
}
Label {
Item {
visible: showVerticalAlignment
text: ("")
width: 20
height: 2
}
AligmentVerticalButtons {
visible: showVerticalAlignment
AligmentVerticalButtons { visible: showVerticalAlignment }
}
Label {
visible: showFormatProperty
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 StudioControls 1.0 as StudioControls
import StudioTheme 1.0 as StudioTheme
@@ -35,7 +35,8 @@ RowLayout {
id: urlChooser
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"
FileResourcesModel {
@@ -57,50 +58,85 @@ RowLayout {
property int hoverIndex: -1
ToolTip {
visible: comboBox.hovered
id: toolTip
visible: comboBox.hovered && toolTip.text !== ""
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 {
id: delegateItem
width: parent.width
height: 20
highlighted: comboBox.hoverIndex === index
height: StudioTheme.Values.height - 2 * StudioTheme.Values.border
padding: 0
highlighted: comboBox.highlightedIndex === index
indicator: Label { // selected item check mark
padding: 5
y: (parent.height - height) / 2
indicator: Item {
id: itemDelegateIconArea
width: delegateItem.height
height: delegateItem.height
Label {
id: itemDelegateIcon
text: StudioTheme.Constants.tickIcon
font.pixelSize: 10
color: delegateItem.highlighted ? StudioTheme.Values.themeTextSelectedTextColor
: StudioTheme.Values.themeTextColor
font.family: StudioTheme.Constants.iconFont.family
color: Theme.color(comboBox.hoverIndex === index ? Theme.PanelTextColorLight
: Theme.QmlDesigner_HighlightColor)
visible: comboBox.currentIndex === index
font.pixelSize: StudioTheme.Values.spinControlIconSizeMulti
visible: comboBox.currentIndex === index ? true : false
anchors.fill: parent
renderType: Text.NativeRendering
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter
}
}
contentItem: Label {
leftPadding: 10
contentItem: Text {
leftPadding: itemDelegateIconArea.width
text: modelData
anchors.top: parent.top
color: Theme.color(Theme.PanelTextColorLight)
font.pixelSize: 13
color: delegateItem.highlighted ? StudioTheme.Values.themeTextSelectedTextColor
: StudioTheme.Values.themeTextColor
font: comboBox.font
elide: Text.ElideRight
verticalAlignment: Text.AlignVCenter
}
background: Rectangle {
anchors.fill: parent
color: parent.highlighted ? Theme.color(Theme.QmlDesigner_HighlightColor) : "transparent"
id: itemDelegateBackground
x: 0
y: 0
width: delegateItem.width
height: delegateItem.height
color: delegateItem.highlighted ? StudioTheme.Values.themeInteraction : "transparent"
}
ToolTip {
id: itemToolTip
visible: delegateItem.hovered && comboBox.highlightedIndex === 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
background: Rectangle {
color: StudioTheme.Values.themeSectionHeadBackground
color: StudioTheme.Values.themeScrollBarTrack
}
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/
**
** This file is part of Qt Creator.
@@ -30,12 +30,15 @@ import StudioTheme 1.0 as StudioTheme
T.AbstractButton {
id: myButton
property bool globalHover: false
property alias buttonIcon: buttonIcon.text
property alias iconColor: buttonIcon.color
property alias iconFont: buttonIcon.font.family
property alias iconSize: buttonIcon.font.pixelSize
property alias iconItalic: buttonIcon.font.italic
property alias iconBold: buttonIcon.font.bold
property alias iconRotation: buttonIcon.rotation
property alias backgroundVisible: buttonBackground.visible
property alias backgroundRadius: buttonBackground.radius
@@ -49,14 +52,14 @@ T.AbstractButton {
activeFocusOnTab: false
onHoveredChanged: {
if (parent !== undefined && parent.hover !== undefined)
parent.hover = hovered
if (parent !== undefined && parent.hoverCallback !== undefined)
parent.hoverCallback()
}
background: Rectangle {
id: buttonBackground
color: myButton.checked ? StudioTheme.Values.themeControlBackgroundChecked : StudioTheme.Values.themeControlBackground
border.color: myButton.checked ? StudioTheme.Values.themeInteraction : StudioTheme.Values.themeControlOutline
color: StudioTheme.Values.themeControlBackground
border.color: StudioTheme.Values.themeControlOutline
border.width: StudioTheme.Values.border
}
@@ -75,14 +78,49 @@ T.AbstractButton {
horizontalAlignment: Text.AlignHCenter
anchors.fill: parent
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: [
State {
name: "default"
when: myButton.enabled && !myButton.hovered && !myButton.pressed
&& !myButton.checked
when: myButton.enabled && !myButton.globalHover && !myButton.hovered
&& !myButton.pressed && !myButton.checked
PropertyChanges {
target: buttonBackground
color: StudioTheme.Values.themeControlBackground
@@ -93,38 +131,42 @@ T.AbstractButton {
}
},
State {
name: "hovered"
when: myButton.hovered && !myButton.pressed
name: "globalHover"
when: myButton.globalHover && !myButton.hovered && !myButton.pressed
PropertyChanges {
target: buttonBackground
color: StudioTheme.Values.themeHoverHighlight
color: StudioTheme.Values.themeControlBackgroundGlobalHover
}
},
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
PropertyChanges {
target: buttonBackground
color: StudioTheme.Values.themeControlBackgroundPressed
color: StudioTheme.Values.themeControlBackgroundInteraction
border.color: StudioTheme.Values.themeInteraction
}
PropertyChanges {
target: myButton
z: 10
z: 100
}
},
State {
name: "disabled"
name: "disable"
when: !myButton.enabled
PropertyChanges {
target: buttonBackground
color: StudioTheme.Values.themeControlBackgroundDisabled
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/
**
** This file is part of Qt Creator.
@@ -32,18 +32,16 @@ Rectangle {
property Item myControl
property bool showBackground: StudioTheme.Constants.showActionIndicatorBackground
property alias icon: actionIndicatorIcon
property bool hover: false
property bool pressed: false
property bool forceVisible: false
color: actionIndicator.showBackground ? StudioTheme.Values.themeControlBackground : "transparent"
border.color: actionIndicator.showBackground ? StudioTheme.Values.themeControlOutline : "transparent"
color: "transparent"
implicitWidth: StudioTheme.Values.height
implicitHeight: StudioTheme.Values.height
implicitWidth: StudioTheme.Values.actionIndicatorWidth
implicitHeight: StudioTheme.Values.actionIndicatorHeight
signal clicked
z: 10
@@ -65,7 +63,7 @@ Rectangle {
states: [
State {
name: "hovered"
name: "hover"
when: actionIndicator.hover && !actionIndicator.pressed
&& (!myControl || (!myControl.edit && !myControl.drag))
&& actionIndicator.enabled
@@ -76,7 +74,7 @@ Rectangle {
}
},
State {
name: "disabled"
name: "disable"
when: !actionIndicator.enabled
PropertyChanges {
target: actionIndicatorIcon
@@ -93,59 +91,4 @@ Rectangle {
onContainsMouseChanged: actionIndicator.hover = containsMouse
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/
**
** This file is part of Qt Creator.
@@ -32,6 +32,7 @@ ButtonRow {
property alias buttonIcon: myAbstractButton.buttonIcon
property alias iconColor: myAbstractButton.iconColor
property alias iconRotation: myAbstractButton.iconRotation
property alias checkable: myAbstractButton.checkable
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/
**
** 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/
**
** This file is part of Qt Creator.
@@ -31,22 +31,41 @@ import StudioTheme 1.0 as StudioTheme
Row {
id: myButtonRow
property bool hover: false
property bool hover: actionIndicator.hover || myButtonRow.childHover
property bool childHover: false
property alias actionIndicator: actionIndicator
property alias actionIndicatorVisible: actionIndicator.visible
property real __actionIndicatorWidth: StudioTheme.Values.squareComponentWidth
property real __actionIndicatorHeight: StudioTheme.Values.height
property real __actionIndicatorWidth: StudioTheme.Values.actionIndicatorWidth
property real __actionIndicatorHeight: StudioTheme.Values.actionIndicatorHeight
ActionIndicator {
id: actionIndicator
myControl: myButtonRow
x: 0
y: 0
width: actionIndicator.visible ? __actionIndicatorWidth : 0
height: actionIndicator.visible ? __actionIndicatorHeight : 0
// + StudioTheme.Values.border on width because of negative spacing on the row
width: actionIndicator.visible ? myButtonRow.__actionIndicatorWidth + StudioTheme.Values.border : 0
height: actionIndicator.visible ? myButtonRow.__actionIndicatorHeight : 0
}
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/
**
** This file is part of Qt Creator.
@@ -32,23 +32,22 @@ T.CheckBox {
property alias actionIndicator: actionIndicator
// This property is used to indicate the global hover state
property bool hover: myCheckBox.hovered
property bool edit: false
property alias actionIndicatorVisible: actionIndicator.visible
property real __actionIndicatorWidth: StudioTheme.Values.squareComponentWidth
property real __actionIndicatorHeight: StudioTheme.Values.height
property real __actionIndicatorWidth: StudioTheme.Values.actionIndicatorWidth
property real __actionIndicatorHeight: StudioTheme.Values.actionIndicatorHeight
property alias labelVisible: checkBoxLabel.visible
property alias labelColor: checkBoxLabel.color
font.pixelSize: StudioTheme.Values.myFontSize
implicitWidth: Math.max(
implicitBackgroundWidth + leftInset + rightInset,
implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset,
implicitContentWidth + leftPadding + rightPadding)
implicitHeight: Math.max(
implicitBackgroundHeight + topInset + bottomInset,
implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset,
implicitContentHeight + topPadding + bottomPadding,
implicitIndicatorHeight + topPadding + bottomPadding)
@@ -58,15 +57,14 @@ T.CheckBox {
ActionIndicator {
id: actionIndicator
myControl: myCheckBox // TODO global hover issue. Can be solved with extra property in ActionIndicator
width: actionIndicator.visible ? __actionIndicatorWidth : 0
height: actionIndicator.visible ? __actionIndicatorHeight : 0
myControl: myCheckBox
width: actionIndicator.visible ? myCheckBox.__actionIndicatorWidth : 0
height: actionIndicator.visible ? myCheckBox.__actionIndicatorHeight : 0
}
indicator: Rectangle {
id: checkBoxBackground
x: actionIndicator.x + actionIndicator.width
- (actionIndicator.visible ? StudioTheme.Values.border : 0)
x: actionIndicator.width
y: 0
z: 5
implicitWidth: StudioTheme.Values.height
@@ -112,33 +110,75 @@ T.CheckBox {
states: [
State {
name: "default"
when: myCheckBox.enabled && !myCheckBox.hovered
&& !myCheckBox.pressed
when: myCheckBox.enabled && !myCheckBox.hover
&& !myCheckBox.pressed && !actionIndicator.hover
PropertyChanges {
target: checkBoxBackground
color: StudioTheme.Values.themeControlBackground
border.color: StudioTheme.Values.themeControlOutline
}
PropertyChanges {
target: checkedIcon
color: StudioTheme.Values.themeIconColor
}
PropertyChanges {
target: partiallyCheckedIcon
color: StudioTheme.Values.themeIconColor
}
},
State {
name: "hovered"
when: myCheckBox.hovered && !myCheckBox.pressed
&& !actionIndicator.hover
name: "globalHover"
when: actionIndicator.hover && myCheckBox.hover && !myCheckBox.pressed
PropertyChanges {
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 {
name: "pressed"
when: myCheckBox.hovered && myCheckBox.pressed
name: "hover"
when: myCheckBox.hover && !actionIndicator.hover && !myCheckBox.pressed
PropertyChanges {
target: checkBoxBackground
color: StudioTheme.Values.themeFocusEdit
border.color: StudioTheme.Values.themeInteraction
color: StudioTheme.Values.themeControlBackgroundHover
border.color: StudioTheme.Values.themeControlOutline
}
PropertyChanges {
target: checkedIcon
color: StudioTheme.Values.themeIconColor // TODO naming
}
PropertyChanges {
target: partiallyCheckedIcon
color: StudioTheme.Values.themeIconColor
}
},
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
PropertyChanges {
target: checkBoxBackground
@@ -147,11 +187,11 @@ T.CheckBox {
}
PropertyChanges {
target: checkedIcon
color: StudioTheme.Values.themeTextColorDisabled
color: StudioTheme.Values.themeIconColorDisabled
}
PropertyChanges {
target: partiallyCheckedIcon
color: StudioTheme.Values.themeTextColorDisabled
color: StudioTheme.Values.themeIconColorDisabled
}
PropertyChanges {
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/
**
** This file is part of Qt Creator.
@@ -33,27 +33,33 @@ Rectangle {
property T.Control myControl
property T.Popup myPopup
property bool hover: false
property bool hover: checkIndicatorMouseArea.containsMouse
property bool pressed: checkIndicatorMouseArea.containsPress
property bool checked: false
color: StudioTheme.Values.themeControlBackground
border.color: StudioTheme.Values.themeControlOutline
state: "default"
border.width: 0
Connections {
target: myPopup
onClosed: checkIndicator.checked = false
onOpened: checkIndicator.checked = true
function onClosed() { checkIndicator.checked = false }
function onOpened() { checkIndicator.checked = true }
}
MouseArea {
id: checkIndicatorMouseArea
anchors.fill: parent
hoverEnabled: true
onContainsMouseChanged: checkIndicator.hover = checkIndicatorMouseArea.containsMouse
onPressed: {
myControl.forceActiveFocus() // TODO
myPopup.opened ? myPopup.close() : myPopup.open()
if (myPopup.opened) {
myPopup.close()
} else {
myPopup.open()
myPopup.forceActiveFocus()
}
if (myControl.activeFocus)
myControl.focus = false
}
}
@@ -71,63 +77,87 @@ Rectangle {
states: [
State {
name: "default"
when: myControl.enabled && !(checkIndicator.hover
|| myControl.hover)
&& !checkIndicator.checked && !myControl.edit
&& !myControl.drag
when: myControl.enabled && checkIndicator.enabled && !myControl.edit
&& !checkIndicator.hover && !myControl.hover && !myControl.drag
&& !checkIndicator.checked
PropertyChanges {
target: checkIndicator
color: StudioTheme.Values.themeControlBackground
border.color: StudioTheme.Values.themeControlOutline
}
},
State {
name: "hovered"
when: (checkIndicator.hover || myControl.hover)
&& !checkIndicator.checked && !myControl.edit
&& !myControl.drag
name: "globalHover"
when: myControl.enabled && checkIndicator.enabled && !myControl.drag
&& !checkIndicator.hover && myControl.hover && !myControl.edit
&& !checkIndicator.checked
PropertyChanges {
target: checkIndicator
color: StudioTheme.Values.themeHoverHighlight
border.color: StudioTheme.Values.themeControlOutline
color: StudioTheme.Values.themeControlBackgroundGlobalHover
}
},
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
PropertyChanges {
target: checkIndicatorIcon
color: StudioTheme.Values.themeIconColorInteraction
}
PropertyChanges {
target: checkIndicator
color: StudioTheme.Values.themeInteraction
border.color: StudioTheme.Values.themeInteraction
}
},
State {
name: "edit"
when: myControl.edit && !checkIndicator.checked
&& !(checkIndicator.hover && myControl.hover)
PropertyChanges {
target: checkIndicatorIcon
color: StudioTheme.Values.themeTextColor
}
PropertyChanges {
target: checkIndicator
color: StudioTheme.Values.themeFocusEdit
border.color: StudioTheme.Values.themeInteraction
color: StudioTheme.Values.themeControlBackground
}
},
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 {
name: "drag"
when: myControl.drag && !checkIndicator.checked
when: (myControl.drag !== undefined && myControl.drag) && !checkIndicator.checked
&& !(checkIndicator.hover && myControl.hover)
PropertyChanges {
target: checkIndicator
color: StudioTheme.Values.themeFocusDrag
border.color: StudioTheme.Values.themeInteraction
color: StudioTheme.Values.themeControlBackgroundInteraction
}
},
State {
name: "disabled"
name: "disable"
when: !myControl.enabled
PropertyChanges {
target: checkIndicator
color: StudioTheme.Values.themeControlBackgroundDisabled
border.color: StudioTheme.Values.themeControlOutlineDisabled
}
PropertyChanges {
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/
**
** This file is part of Qt Creator.
@@ -35,14 +33,16 @@ T.ComboBox {
property alias actionIndicator: actionIndicator
property alias labelColor: comboBoxInput.color
property bool hover: false // This property is used to indicate the global hover state
property bool edit: myComboBox.activeFocus
// This property is used to indicate the global hover state
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 alias actionIndicatorVisible: actionIndicator.visible
property real __actionIndicatorWidth: StudioTheme.Values.squareComponentWidth
property real __actionIndicatorHeight: StudioTheme.Values.height
property real __actionIndicatorWidth: StudioTheme.Values.actionIndicatorWidth
property real __actionIndicatorHeight: StudioTheme.Values.actionIndicatorHeight
property alias textInput: comboBoxInput
@@ -50,12 +50,11 @@ T.ComboBox {
enum ActivatedReason { EditingFinished, Other }
width: StudioTheme.Values.squareComponentWidth * 5
height: StudioTheme.Values.height
width: StudioTheme.Values.defaultControlWidth
height: StudioTheme.Values.defaultControlHeight
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
wheelEnabled: false
@@ -94,19 +93,18 @@ T.ComboBox {
id: popupIndicator
myControl: myComboBox
myPopup: myComboBox.popup
x: comboBoxInput.x + comboBoxInput.width - StudioTheme.Values.border
y: 0
width: StudioTheme.Values.squareComponentWidth
height: StudioTheme.Values.height
x: comboBoxInput.x + comboBoxInput.width
y: StudioTheme.Values.border
width: StudioTheme.Values.checkIndicatorWidth - StudioTheme.Values.border
height: StudioTheme.Values.checkIndicatorHeight - (StudioTheme.Values.border * 2)
}
background: Rectangle {
id: comboBoxBackground
color: StudioTheme.Values.themeControlOutline
color: StudioTheme.Values.themeControlBackground
border.color: StudioTheme.Values.themeControlOutline
border.width: StudioTheme.Values.border
x: actionIndicator.width
- (myComboBox.actionIndicatorVisible ? StudioTheme.Values.border : 0)
width: myComboBox.width - actionIndicator.width
height: myComboBox.height
}
@@ -138,7 +136,8 @@ T.ComboBox {
contentItem: Text {
leftPadding: itemDelegateIconArea.width
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
elide: Text.ElideRight
verticalAlignment: Text.AlignVCenter
@@ -152,7 +151,8 @@ T.ComboBox {
T.Label {
id: itemDelegateIcon
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.pixelSize: StudioTheme.Values.spinControlIconSizeMulti
visible: myComboBox.currentIndex === index ? true : false
@@ -177,9 +177,9 @@ T.ComboBox {
popup: T.Popup {
id: comboBoxPopup
x: comboBoxInput.x
y: myComboBox.height - StudioTheme.Values.border
width: comboBoxInput.width + popupIndicator.width - StudioTheme.Values.border
x: actionIndicator.width + StudioTheme.Values.border
y: myComboBox.height
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,
// but it has the problem that it sometimes extend over the border of the actual window
// and is then cut off.
@@ -205,9 +205,8 @@ T.ComboBox {
}
background: Rectangle {
color: StudioTheme.Values.themeControlBackground
border.color: StudioTheme.Values.themeInteraction
border.width: StudioTheme.Values.border
color: StudioTheme.Values.themePopupBackground
border.width: 0
}
enter: Transition {
@@ -219,7 +218,8 @@ T.ComboBox {
states: [
State {
name: "default"
when: !myComboBox.hover && !myComboBox.edit
when: myComboBox.enabled && !myComboBox.hover && !myComboBox.edit && !myComboBox.open
&& !myComboBox.activeFocus
PropertyChanges {
target: myComboBox
wheelEnabled: false
@@ -230,13 +230,16 @@ T.ComboBox {
}
PropertyChanges {
target: comboBoxBackground
color: StudioTheme.Values.themeControlOutline
color: StudioTheme.Values.themeControlBackground
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 {
name: "focus"
when: myComboBox.edit && !myComboBox.editable
when: myComboBox.enabled && myComboBox.activeFocus && !myComboBox.editable
&& !myComboBox.open
PropertyChanges {
target: myComboBox
wheelEnabled: true
@@ -248,7 +251,7 @@ T.ComboBox {
},
State {
name: "edit"
when: myComboBox.edit && myComboBox.editable && !comboBoxPopup.opened
when: myComboBox.enabled && myComboBox.edit && myComboBox.editable && !myComboBox.open
PropertyChanges {
target: myComboBox
wheelEnabled: true
@@ -260,8 +263,8 @@ T.ComboBox {
}
PropertyChanges {
target: comboBoxBackground
color: StudioTheme.Values.themeInteraction
border.color: StudioTheme.Values.themeInteraction
color: StudioTheme.Values.themeControlBackgroundInteraction
border.color: StudioTheme.Values.themeControlOutline
}
StateChangeScript {
script: comboBoxPopup.close()
@@ -269,7 +272,7 @@ T.ComboBox {
},
State {
name: "popup"
when: myComboBox.edit && comboBoxPopup.opened
when: myComboBox.enabled && myComboBox.open
PropertyChanges {
target: myComboBox
wheelEnabled: true
@@ -279,6 +282,20 @@ T.ComboBox {
selectByMouse: false
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/
**
** This file is part of Qt Creator.
@@ -33,7 +33,7 @@ TextInput {
property T.Control myControl
property bool edit: textInput.activeFocus
property bool drag: false
property bool hover: mouseArea.containsMouse
z: 2
font: myControl.font
@@ -54,15 +54,14 @@ TextInput {
clip: true
Rectangle {
id: textInputArea
x: 0
y: 0
id: textInputBackground
x: StudioTheme.Values.border
y: StudioTheme.Values.border
z: -1
width: textInput.width
height: StudioTheme.Values.height
height: StudioTheme.Values.height - (StudioTheme.Values.border * 2)
color: StudioTheme.Values.themeControlBackground
border.color: StudioTheme.Values.themeControlOutline
border.width: StudioTheme.Values.border
border.width: 0
}
TapHandler {
@@ -73,6 +72,7 @@ TextInput {
if (textInput.readOnly) {
if (myControl.popup.opened) {
myControl.popup.close()
myControl.focus = false
} else {
myControl.forceActiveFocus()
myControl.popup.open()
@@ -91,20 +91,17 @@ TextInput {
propagateComposedEvents: true
acceptedButtons: Qt.LeftButton
cursorShape: Qt.PointingHandCursor
// Sets the global hover
onContainsMouseChanged: myControl.hover = containsMouse
onPressed: mouse.accepted = false
}
states: [
State {
name: "default"
when: myControl.enabled && !textInput.edit
&& !mouseArea.containsMouse && !myControl.drag
when: myControl.enabled && !textInput.edit && !textInput.hover && !myControl.hover
&& !myControl.open
PropertyChanges {
target: textInputArea
target: textInputBackground
color: StudioTheme.Values.themeControlBackground
border.color: StudioTheme.Values.themeControlOutline
}
PropertyChanges {
target: tapHandler
@@ -116,27 +113,38 @@ TextInput {
}
},
State {
name: "hovered"
when: myControl.hover && !textInput.edit && !myControl.drag
name: "globalHover"
when: myControl.hover && !textInput.hover && !textInput.edit && !myControl.open
PropertyChanges {
target: textInputArea
color: StudioTheme.Values.themeHoverHighlight
border.color: StudioTheme.Values.themeControlOutline
target: textInputBackground
color: StudioTheme.Values.themeControlBackgroundGlobalHover
}
},
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 {
name: "focus"
when: textInput.edit && !myControl.editable
PropertyChanges {
target: textInputArea
color: StudioTheme.Values.themeFocusEdit
border.color: StudioTheme.Values.themeInteraction
target: textInputBackground
color: StudioTheme.Values.themeControlBackgroundInteraction
}
},
State {
name: "edit"
when: textInput.edit && myControl.editable
extend: "focus"
PropertyChanges {
target: textInputBackground
color: StudioTheme.Values.themeControlBackgroundInteraction
}
PropertyChanges {
target: tapHandler
enabled: false
@@ -147,12 +155,19 @@ TextInput {
}
},
State {
name: "disabled"
name: "popup"
when: myControl.open
PropertyChanges {
target: textInputBackground
color: StudioTheme.Values.themeControlBackgroundHover
}
},
State {
name: "disable"
when: !myControl.enabled
PropertyChanges {
target: textInputArea
target: textInputBackground
color: StudioTheme.Values.themeControlBackgroundDisabled
border.color: StudioTheme.Values.themeControlOutlineDisabled
}
PropertyChanges {
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/
**
** 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/
**
** 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/
**
** 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/
**
** This file is part of Qt Creator.
@@ -24,6 +22,7 @@
** be met: https://www.gnu.org/licenses/gpl-3.0.html.
**
****************************************************************************/
import QtQuick 2.12
import QtQuick.Window 2.12
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/
**
** This file is part of Qt Creator.
@@ -35,8 +35,7 @@ T.MenuItem {
implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset,
implicitContentWidth + leftPadding + rightPadding)
implicitHeight: Math.max(
implicitBackgroundHeight + topInset + bottomInset,
implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset,
implicitContentHeight + topPadding + bottomPadding,
implicitIndicatorHeight + topPadding + bottomPadding)
@@ -50,7 +49,8 @@ T.MenuItem {
id: textLabel
text: control.text
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
}
@@ -78,6 +78,8 @@ T.MenuItem {
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"
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/
**
** 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/
**
** This file is part of Qt Creator.
@@ -32,14 +32,16 @@ T.Popup {
property T.Control myControl
property bool drag: slider.pressed
dim: false
closePolicy: T.Popup.CloseOnPressOutside | T.Popup.CloseOnPressOutsideParent
| T.Popup.CloseOnEscape | T.Popup.CloseOnReleaseOutside
| T.Popup.CloseOnReleaseOutsideParent
background: Rectangle {
color: StudioTheme.Values.themeControlBackground
border.color: StudioTheme.Values.themeInteraction
color: StudioTheme.Values.themePopupBackground
border.width: 0
}
contentItem: T.Slider {
@@ -63,7 +65,8 @@ T.Popup {
width: StudioTheme.Values.sliderHandleWidth
height: StudioTheme.Values.sliderHandleHeight
radius: 0
color: slider.pressed ? StudioTheme.Values.themeInteraction : StudioTheme.Values.themeControlOutline
color: slider.pressed ? StudioTheme.Values.themeSliderHandleInteraction
: StudioTheme.Values.themeSliderHandle
}
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/
**
** This file is part of Qt Creator.
@@ -50,8 +50,10 @@ T.SpinBox {
}
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 sliderDrag: sliderPopup.drag
property bool dirty: false // user modification flag
@@ -59,18 +61,16 @@ T.SpinBox {
property real realDragRange: mySpinBox.realTo - mySpinBox.realFrom
property alias actionIndicatorVisible: actionIndicator.visible
property real __actionIndicatorWidth: StudioTheme.Values.squareComponentWidth
property real __actionIndicatorHeight: StudioTheme.Values.height
property real __actionIndicatorWidth: StudioTheme.Values.actionIndicatorWidth
property real __actionIndicatorHeight: StudioTheme.Values.actionIndicatorHeight
property bool spinBoxIndicatorVisible: true
property real __spinBoxIndicatorWidth: StudioTheme.Values.smallRectWidth - 2
* StudioTheme.Values.border
property real __spinBoxIndicatorHeight: StudioTheme.Values.height / 2
- StudioTheme.Values.border
property real __spinBoxIndicatorWidth: StudioTheme.Values.spinBoxIndicatorWidth
property real __spinBoxIndicatorHeight: StudioTheme.Values.spinBoxIndicatorHeight
property alias sliderIndicatorVisible: sliderIndicator.visible
property real __sliderIndicatorWidth: StudioTheme.Values.squareComponentWidth
property real __sliderIndicatorHeight: StudioTheme.Values.height
property real __sliderIndicatorWidth: StudioTheme.Values.sliderIndicatorWidth
property real __sliderIndicatorHeight: StudioTheme.Values.sliderIndicatorHeight
property alias compressedValueTimer: myTimer
@@ -83,13 +83,13 @@ T.SpinBox {
// Use custom wheel handling due to bugs
property bool __wheelEnabled: false
wheelEnabled: false
hoverEnabled: true
width: StudioTheme.Values.squareComponentWidth * 5
height: StudioTheme.Values.height
width: StudioTheme.Values.defaultControlWidth
height: StudioTheme.Values.defaultControlHeight
leftPadding: spinBoxIndicatorDown.x + spinBoxIndicatorDown.width
- (spinBoxIndicatorVisible ? 0 : StudioTheme.Values.border)
rightPadding: sliderIndicator.width - (sliderIndicatorVisible ? StudioTheme.Values.border : 0)
rightPadding: sliderIndicator.width + StudioTheme.Values.border
font.pixelSize: StudioTheme.Values.myFontSize
editable: true
@@ -113,8 +113,8 @@ T.SpinBox {
myControl: mySpinBox
x: 0
y: 0
width: actionIndicator.visible ? __actionIndicatorWidth : 0
height: actionIndicator.visible ? __actionIndicatorHeight : 0
width: actionIndicator.visible ? mySpinBox.__actionIndicatorWidth : 0
height: actionIndicator.visible ? mySpinBox.__actionIndicatorHeight : 0
}
up.indicator: RealSpinBoxIndicator {
@@ -124,12 +124,13 @@ T.SpinBox {
visible: mySpinBox.spinBoxIndicatorVisible
onRealReleased: mySpinBox.realIncrease()
onRealPressAndHold: mySpinBox.realIncrease()
x: actionIndicator.width + (mySpinBox.actionIndicatorVisible ? 0 : StudioTheme.Values.border)
x: actionIndicator.width + StudioTheme.Values.border
y: StudioTheme.Values.border
width: mySpinBox.spinBoxIndicatorVisible ? mySpinBox.__spinBoxIndicatorWidth : 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 {
@@ -138,12 +139,13 @@ T.SpinBox {
visible: mySpinBox.spinBoxIndicatorVisible
onRealReleased: 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
width: mySpinBox.spinBoxIndicatorVisible ? mySpinBox.__spinBoxIndicatorWidth : 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 {
@@ -173,7 +175,7 @@ T.SpinBox {
color: StudioTheme.Values.themeControlOutline
border.color: StudioTheme.Values.themeControlOutline
border.width: StudioTheme.Values.border
x: actionIndicator.width - (mySpinBox.actionIndicatorVisible ? StudioTheme.Values.border : 0)
x: actionIndicator.width
width: mySpinBox.width - actionIndicator.width
height: mySpinBox.height
}
@@ -182,18 +184,19 @@ T.SpinBox {
id: sliderIndicator
myControl: mySpinBox
myPopup: sliderPopup
x: spinBoxInput.x + spinBoxInput.width - StudioTheme.Values.border
width: sliderIndicator.visible ? mySpinBox.__sliderIndicatorWidth : 0
height: sliderIndicator.visible ? mySpinBox.__sliderIndicatorHeight : 0
x: spinBoxInput.x + spinBoxInput.width
y: StudioTheme.Values.border
width: sliderIndicator.visible ? mySpinBox.__sliderIndicatorWidth - StudioTheme.Values.border : 0
height: sliderIndicator.visible ? mySpinBox.__sliderIndicatorHeight - (StudioTheme.Values.border * 2) : 0
visible: false // reasonable default
}
RealSliderPopup {
id: sliderPopup
myControl: mySpinBox
x: spinBoxInput.x
y: StudioTheme.Values.height - StudioTheme.Values.border
width: spinBoxInput.width + sliderIndicator.width - StudioTheme.Values.border
x: actionIndicator.width + StudioTheme.Values.border
y: StudioTheme.Values.height
width: mySpinBox.width - actionIndicator.width - (StudioTheme.Values.border * 2)
height: StudioTheme.Values.sliderHeight
enter: Transition {
@@ -203,6 +206,7 @@ T.SpinBox {
}
textFromValue: function (value, locale) {
locale.numberOptions = Locale.OmitGroupSeparator
return Number(mySpinBox.realValue).toLocaleString(locale, 'f', mySpinBox.decimals)
}
@@ -214,8 +218,8 @@ T.SpinBox {
states: [
State {
name: "default"
when: mySpinBox.enabled && !mySpinBox.hover
&& !mySpinBox.edit && !mySpinBox.drag
when: mySpinBox.enabled && !mySpinBox.hover && !mySpinBox.hovered
&& !mySpinBox.edit && !mySpinBox.drag && !mySpinBox.sliderDrag
PropertyChanges {
target: mySpinBox
__wheelEnabled: false
@@ -226,7 +230,7 @@ T.SpinBox {
}
PropertyChanges {
target: spinBoxBackground
color: StudioTheme.Values.themeControlOutline
color: StudioTheme.Values.themeControlBackground
border.color: StudioTheme.Values.themeControlOutline
}
},
@@ -243,21 +247,21 @@ T.SpinBox {
}
PropertyChanges {
target: spinBoxBackground
color: StudioTheme.Values.themeInteraction
border.color: StudioTheme.Values.themeInteraction
color: StudioTheme.Values.themeControlBackgroundInteraction
border.color: StudioTheme.Values.themeControlOutline
}
},
State {
name: "drag"
when: mySpinBox.drag
when: mySpinBox.drag || mySpinBox.sliderDrag
PropertyChanges {
target: spinBoxBackground
color: StudioTheme.Values.themeInteraction
border.color: StudioTheme.Values.themeInteraction
color: StudioTheme.Values.themeControlBackgroundInteraction
border.color: StudioTheme.Values.themeControlOutlineInteraction
}
},
State {
name: "disabled"
name: "disable"
when: !mySpinBox.enabled
PropertyChanges {
target: spinBoxBackground
@@ -296,12 +300,8 @@ T.SpinBox {
}
onDisplayTextChanged: spinBoxInput.text = mySpinBox.displayText
onActiveFocusChanged: {
if (mySpinBox.activeFocus)
// QTBUG-75862 && mySpinBox.focusReason === Qt.TabFocusReason)
if (mySpinBox.activeFocus) // QTBUG-75862 && mySpinBox.focusReason === Qt.TabFocusReason)
spinBoxInput.selectAll()
if (sliderPopup.opened && !mySpinBox.activeFocus)
sliderPopup.close()
}
Keys.onPressed: {
@@ -336,7 +336,6 @@ T.SpinBox {
}
function setValueFromInput() {
if (!mySpinBox.dirty)
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/
**
** This file is part of Qt Creator.
@@ -32,8 +32,8 @@ Rectangle {
property T.Control myControl
property bool hover: false
property bool pressed: false
property bool hover: spinBoxIndicatorMouseArea.containsMouse
property bool pressed: spinBoxIndicatorMouseArea.containsPress
property bool released: false
property bool realEnabled: true
@@ -77,15 +77,12 @@ Rectangle {
property bool pressedAndHeld: false
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
pressAndHoldInterval: 500
onContainsMouseChanged: spinBoxIndicator.hover = containsMouse
onContainsPressChanged: spinBoxIndicator.pressed = containsPress
onPressed: {
myControl.forceActiveFocus()
if (myControl.activeFocus)
spinBoxIndicator.forceActiveFocus()
spinBoxIndicator.realPressed()
mouse.accepted = true
}
@@ -130,15 +127,42 @@ Rectangle {
states: [
State {
name: "default"
when: myControl.enabled && spinBoxIndicator.enabled
name: "globalHover"
when: myControl.enabled && spinBoxIndicator.enabled && !myControl.drag
&& !spinBoxIndicator.hover && myControl.hover && !myControl.edit
PropertyChanges {
target: spinBoxIndicatorIcon
color: StudioTheme.Values.themeTextColor
}
},
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
PropertyChanges {
target: spinBoxIndicatorIcon
@@ -151,55 +175,102 @@ Rectangle {
states: [
State {
name: "default"
when: myControl.enabled && !(spinBoxIndicator.hover
|| myControl.hover)
&& !spinBoxIndicator.pressed && !myControl.edit
&& !myControl.drag
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: "hovered"
when: (spinBoxIndicator.hover || myControl.hover)
&& !spinBoxIndicator.pressed && !myControl.edit
&& !myControl.drag
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.themeHoverHighlight
color: StudioTheme.Values.themeControlBackgroundGlobalHover
}
},
State {
name: "pressed"
when: spinBoxIndicator.pressed
name: "hover"
when: myControl.enabled && !myControl.drag
&& spinBoxIndicator.hover && myControl.hover && !spinBoxIndicator.pressed
PropertyChanges {
target: spinBoxIndicatorIcon
visible: true
}
PropertyChanges {
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 {
name: "edit"
when: myControl.edit
PropertyChanges {
target: spinBoxIndicatorIcon
visible: true
}
PropertyChanges {
target: spinBoxIndicator
color: StudioTheme.Values.themeFocusEdit
color: StudioTheme.Values.themeControlBackground
}
},
State {
name: "drag"
when: myControl.drag
PropertyChanges {
target: spinBoxIndicatorIcon
visible: false
}
PropertyChanges {
target: spinBoxIndicator
color: StudioTheme.Values.themeFocusDrag
color: StudioTheme.Values.themeControlBackgroundInteraction
}
},
State {
name: "disabled"
name: "disable"
when: !myControl.enabled
PropertyChanges {
target: spinBoxIndicatorIcon
visible: false
}
PropertyChanges {
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/
**
** This file is part of Qt Creator.
@@ -34,6 +34,7 @@ TextInput {
property bool edit: textInput.activeFocus
property bool drag: false
property bool hover: mouseArea.containsMouse
z: 2
font: myControl.font
@@ -59,15 +60,14 @@ TextInput {
onActiveFocusChanged: textInput.focus = activeFocus
Rectangle {
id: textInputArea
color: StudioTheme.Values.themeControlBackground
border.color: StudioTheme.Values.themeControlOutline
border.width: StudioTheme.Values.border
id: textInputBackground
x: 0
y: 0
y: StudioTheme.Values.border
z: -1
width: textInput.width
height: StudioTheme.Values.height
height: StudioTheme.Values.height - (StudioTheme.Values.border * 2)
color: StudioTheme.Values.themeControlBackground
border.width: 0
}
Item {
@@ -118,8 +118,6 @@ TextInput {
propagateComposedEvents: true
acceptedButtons: Qt.LeftButton
cursorShape: Qt.PointingHandCursor
// Sets the global hover
onContainsMouseChanged: myControl.hover = containsMouse
onPositionChanged: {
if (!mouseArea.dragging
@@ -238,12 +236,11 @@ TextInput {
states: [
State {
name: "default"
when: myControl.enabled && !textInput.edit
&& !mouseArea.containsMouse && !myControl.drag
when: myControl.enabled && !textInput.edit && !textInput.hover && !myControl.hover
&& !myControl.drag && !myControl.sliderDrag
PropertyChanges {
target: textInputArea
target: textInputBackground
color: StudioTheme.Values.themeControlBackground
border.color: StudioTheme.Values.themeControlOutline
}
PropertyChanges {
target: mouseArea
@@ -251,21 +248,28 @@ TextInput {
}
},
State {
name: "hovered"
when: myControl.hover && !textInput.edit && !myControl.drag
name: "globalHover"
when: myControl.hover && !textInput.hover
&& !textInput.edit && !myControl.drag
PropertyChanges {
target: textInputArea
color: StudioTheme.Values.themeHoverHighlight
border.color: StudioTheme.Values.themeControlOutline
target: textInputBackground
color: StudioTheme.Values.themeControlBackgroundGlobalHover
}
},
State {
name: "hover"
when: textInput.hover && myControl.hover && !textInput.edit && !myControl.drag
PropertyChanges {
target: textInputBackground
color: StudioTheme.Values.themeControlBackgroundHover
}
},
State {
name: "edit"
when: textInput.edit && !myControl.drag
PropertyChanges {
target: textInputArea
color: StudioTheme.Values.themeFocusEdit
border.color: StudioTheme.Values.themeInteraction
target: textInputBackground
color: StudioTheme.Values.themeControlBackgroundInteraction
}
PropertyChanges {
target: mouseArea
@@ -276,18 +280,32 @@ TextInput {
name: "drag"
when: myControl.drag
PropertyChanges {
target: textInputArea
color: StudioTheme.Values.themeFocusDrag
border.color: StudioTheme.Values.themeInteraction
target: textInputBackground
color: StudioTheme.Values.themeControlBackgroundInteraction
}
PropertyChanges {
target: textInput
color: StudioTheme.Values.themeInteraction
}
},
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
PropertyChanges {
target: textInputArea
target: textInputBackground
color: StudioTheme.Values.themeControlBackgroundDisabled
border.color: StudioTheme.Values.themeControlOutlineDisabled
}
PropertyChanges {
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/
**
** 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/
**
** 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/
**
** This file is part of Qt Creator.
@@ -28,5 +28,5 @@ import QtQuick.Layouts 1.12
RowLayout {
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/
**
** This file is part of Qt Creator.
@@ -34,7 +34,7 @@ Item {
property int topPadding: 4
property int rightPadding: 0
property int animationDuration: 0
property int animationDuration: 120
property bool expanded: true
@@ -42,28 +42,27 @@ Item {
Rectangle {
id: header
height: StudioTheme.Values.height
height: StudioTheme.Values.sectionHeadHeight
anchors.left: parent.left
anchors.right: parent.right
color: StudioTheme.Values.themeControlBackground
color: StudioTheme.Values.themeSectionHeadBackground
SectionLabel {
id: label
anchors.verticalCenter: parent.verticalCenter
color: StudioTheme.Values.themeTextColor
x: 22
//font.bold: true
font.pixelSize: StudioTheme.Values.myFontSize
// TODO font size?
font.capitalization: Font.AllUppercase
}
SectionLabel {
id: arrow
width: StudioTheme.Values.spinControlIconSizeMulti
height: StudioTheme.Values.spinControlIconSizeMulti
text: StudioTheme.Constants.upDownSquare2
text: StudioTheme.Constants.startNode
color: StudioTheme.Values.themeTextColor
renderType: Text.NativeRendering
anchors.left: parent.left
@@ -74,7 +73,7 @@ Item {
Behavior on rotation {
NumberAnimation {
easing.type: Easing.OutCubic
duration: animationDuration
duration: section.animationDuration
}
}
}
@@ -82,7 +81,6 @@ Item {
MouseArea {
anchors.fill: parent
onClicked: {
section.animationDuration = 120
section.expanded = !section.expanded
if (!section.expanded) // TODO
section.forceActiveFocus()
@@ -94,7 +92,13 @@ Item {
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 {
id: row
@@ -102,18 +106,31 @@ Item {
anchors.leftMargin: leftPadding
anchors.right: parent.right
anchors.rightMargin: rightPadding
anchors.top: header.bottom
anchors.topMargin: topPadding
anchors.top: topRow.bottom
}
Row {
id: bottomRow
height: StudioTheme.Values.sectionHeadSpacerHeight
anchors.top: row.bottom
}
Behavior on implicitHeight {
NumberAnimation {
easing.type: Easing.OutCubic
duration: animationDuration
duration: section.animationDuration
}
}
states: [
State {
name: "Expanded"
when: section.expanded
PropertyChanges {
target: arrow
rotation: 90
}
},
State {
name: "Collapsed"
when: !section.expanded
@@ -123,7 +140,7 @@ Item {
}
PropertyChanges {
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/
**
** This file is part of Qt Creator.
@@ -35,7 +35,7 @@ T.Label {
// workaround because PictureSpecifics.qml still use this
//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
font.pixelSize: StudioTheme.Values.myFontSize // TODO
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/
**
** This file is part of Qt Creator.
@@ -25,10 +25,11 @@
import QtQuick 2.12
import QtQuick.Layouts 1.12
import StudioTheme 1.0 as StudioTheme
GridLayout {
columns: 2
columnSpacing: 12
rowSpacing: 4
width: parent.width - 16
columnSpacing: StudioTheme.Values.sectionColumnSpacing
rowSpacing: StudioTheme.Values.sectionRowSpacing
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/
**
** This file is part of Qt Creator.
@@ -50,8 +50,8 @@ T.Slider {
property bool edit: slider.activeFocus
property alias actionIndicatorVisible: actionIndicator.visible
property real __actionIndicatorWidth: StudioTheme.Values.squareComponentWidth
property real __actionIndicatorHeight: StudioTheme.Values.height
property real __actionIndicatorWidth: StudioTheme.Values.actionIndicatorWidth
property real __actionIndicatorHeight: StudioTheme.Values.actionIndicatorHeight
implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset,
implicitHandleWidth + leftPadding + rightPadding)
@@ -231,7 +231,7 @@ T.Slider {
}
},
State {
name: "hovered"
name: "hover"
when: slider.enabled && slider.hover && !slider.edit
PropertyChanges {
target: slider
@@ -258,7 +258,7 @@ T.Slider {
}
},
State {
name: "disabled"
name: "disable"
when: !slider.enabled
PropertyChanges {
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/
**
** This file is part of Qt Creator.
@@ -32,12 +32,16 @@ T.Popup {
property T.Control myControl
property bool drag: slider.pressed
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 {
color: StudioTheme.Values.themeControlBackground
border.color: StudioTheme.Values.themeInteraction
color: StudioTheme.Values.themePopupBackground
border.width: 0
}
contentItem: T.Slider {
@@ -61,7 +65,8 @@ T.Popup {
width: StudioTheme.Values.sliderHandleWidth
height: StudioTheme.Values.sliderHandleHeight
radius: 0
color: slider.pressed ? StudioTheme.Values.themeInteraction : StudioTheme.Values.themeControlOutline
color: slider.pressed ? StudioTheme.Values.themeSliderHandleInteraction
: StudioTheme.Values.themeSliderHandle
}
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/
**
** This file is part of Qt Creator.
@@ -40,35 +40,35 @@ T.SpinBox {
property real maxStepSize: 10
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 sliderDrag: sliderPopup.drag
property alias actionIndicatorVisible: actionIndicator.visible
property real __actionIndicatorWidth: StudioTheme.Values.squareComponentWidth
property real __actionIndicatorHeight: StudioTheme.Values.height
property real __actionIndicatorWidth: StudioTheme.Values.actionIndicatorWidth
property real __actionIndicatorHeight: StudioTheme.Values.actionIndicatorHeight
property bool spinBoxIndicatorVisible: true
property real __spinBoxIndicatorWidth: StudioTheme.Values.smallRectWidth - (2
* StudioTheme.Values.border)
property real __spinBoxIndicatorHeight: (StudioTheme.Values.height / 2)
- StudioTheme.Values.border
property real __spinBoxIndicatorWidth: StudioTheme.Values.spinBoxIndicatorWidth
property real __spinBoxIndicatorHeight: StudioTheme.Values.spinBoxIndicatorHeight
property alias sliderIndicatorVisible: sliderIndicator.visible
property real __sliderIndicatorWidth: StudioTheme.Values.squareComponentWidth
property real __sliderIndicatorHeight: StudioTheme.Values.height
property real __sliderIndicatorWidth: StudioTheme.Values.sliderIndicatorWidth
property real __sliderIndicatorHeight: StudioTheme.Values.sliderIndicatorHeight
signal compressedValueModified
// Use custom wheel handling due to bugs
property bool __wheelEnabled: false
wheelEnabled: false
hoverEnabled: true // TODO
width: StudioTheme.Values.squareComponentWidth * 5
height: StudioTheme.Values.height
width: StudioTheme.Values.defaultControlWidth
height: StudioTheme.Values.defaultControlHeight
leftPadding: spinBoxIndicatorDown.x + spinBoxIndicatorDown.width
- (spinBoxIndicatorVisible ? 0 : StudioTheme.Values.border)
rightPadding: sliderIndicator.width - (sliderIndicatorVisible ? StudioTheme.Values.border : 0)
rightPadding: sliderIndicator.width + StudioTheme.Values.border
font.pixelSize: StudioTheme.Values.myFontSize
editable: true
@@ -93,44 +93,41 @@ T.SpinBox {
ActionIndicator {
id: actionIndicator
myControl: mySpinBox
x: 0
y: 0
width: actionIndicator.visible ? __actionIndicatorWidth : 0
height: actionIndicator.visible ? __actionIndicatorHeight : 0
width: actionIndicator.visible ? mySpinBox.__actionIndicatorWidth : 0
height: actionIndicator.visible ? mySpinBox.__actionIndicatorHeight : 0
}
up.indicator: SpinBoxIndicator {
id: spinBoxIndicatorUp
myControl: mySpinBox
visible: spinBoxIndicatorVisible
iconFlip: -1
visible: mySpinBox.spinBoxIndicatorVisible
//hover: mySpinBox.up.hovered // TODO QTBUG-74688
pressed: mySpinBox.up.pressed
iconFlip: -1
x: actionIndicator.width + (actionIndicatorVisible ? 0 : StudioTheme.Values.border)
x: actionIndicator.width + StudioTheme.Values.border
y: StudioTheme.Values.border
width: spinBoxIndicatorVisible ? __spinBoxIndicatorWidth : 0
height: spinBoxIndicatorVisible ? __spinBoxIndicatorHeight : 0
width: spinBoxIndicatorVisible ? mySpinBox.__spinBoxIndicatorWidth : 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 {
id: spinBoxIndicatorDown
myControl: mySpinBox
visible: spinBoxIndicatorVisible
visible: mySpinBox.spinBoxIndicatorVisible
//hover: mySpinBox.down.hovered // TODO QTBUG-74688
pressed: mySpinBox.down.pressed
x: actionIndicator.width + (actionIndicatorVisible ? 0 : StudioTheme.Values.border)
x: actionIndicator.width + StudioTheme.Values.border
y: spinBoxIndicatorUp.y + spinBoxIndicatorUp.height
width: spinBoxIndicatorVisible ? __spinBoxIndicatorWidth : 0
height: spinBoxIndicatorVisible ? __spinBoxIndicatorHeight : 0
width: spinBoxIndicatorVisible ? mySpinBox.__spinBoxIndicatorWidth : 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 {
@@ -143,7 +140,7 @@ T.SpinBox {
color: StudioTheme.Values.themeControlOutline
border.color: StudioTheme.Values.themeControlOutline
border.width: StudioTheme.Values.border
x: actionIndicator.width - (actionIndicatorVisible ? StudioTheme.Values.border : 0)
x: actionIndicator.width
width: mySpinBox.width - actionIndicator.width
height: mySpinBox.height
}
@@ -152,20 +149,19 @@ T.SpinBox {
id: sliderIndicator
myControl: mySpinBox
myPopup: sliderPopup
x: spinBoxInput.x + spinBoxInput.width - StudioTheme.Values.border
width: sliderIndicator.visible ? __sliderIndicatorWidth : 0
height: sliderIndicator.visible ? __sliderIndicatorHeight : 0
x: spinBoxInput.x + spinBoxInput.width
y: StudioTheme.Values.border
width: sliderIndicator.visible ? mySpinBox.__sliderIndicatorWidth - StudioTheme.Values.border : 0
height: sliderIndicator.visible ? mySpinBox.__sliderIndicatorHeight - (StudioTheme.Values.border * 2) : 0
visible: false // reasonable default
}
SliderPopup {
id: sliderPopup
myControl: mySpinBox
x: spinBoxInput.x
y: StudioTheme.Values.height - StudioTheme.Values.border
width: spinBoxInput.width + sliderIndicator.width - StudioTheme.Values.border
x: actionIndicator.width + StudioTheme.Values.border
y: StudioTheme.Values.height
width: mySpinBox.width - actionIndicator.width - (StudioTheme.Values.border * 2)
height: StudioTheme.Values.sliderHeight
enter: Transition {
@@ -175,6 +171,7 @@ T.SpinBox {
}
textFromValue: function (value, locale) {
locale.numberOptions = Locale.OmitGroupSeparator
return Number(value / mySpinBox.factor).toLocaleString(locale, 'f',
mySpinBox.decimals)
}
@@ -186,8 +183,8 @@ T.SpinBox {
states: [
State {
name: "default"
when: mySpinBox.enabled && !mySpinBox.hover
&& !mySpinBox.edit && !mySpinBox.drag
when: mySpinBox.enabled && !mySpinBox.hover && !mySpinBox.hovered
&& !mySpinBox.edit && !mySpinBox.drag && !mySpinBox.sliderDrag
PropertyChanges {
target: mySpinBox
__wheelEnabled: false
@@ -198,7 +195,7 @@ T.SpinBox {
}
PropertyChanges {
target: spinBoxBackground
color: StudioTheme.Values.themeControlOutline
color: StudioTheme.Values.themeControlBackground
border.color: StudioTheme.Values.themeControlOutline
}
},
@@ -215,21 +212,21 @@ T.SpinBox {
}
PropertyChanges {
target: spinBoxBackground
color: StudioTheme.Values.themeInteraction
border.color: StudioTheme.Values.themeInteraction
color: StudioTheme.Values.themeControlBackgroundInteraction
border.color: StudioTheme.Values.themeControlOutline
}
},
State {
name: "drag"
when: mySpinBox.drag
when: mySpinBox.drag || mySpinBox.sliderDrag
PropertyChanges {
target: spinBoxBackground
color: StudioTheme.Values.themeInteraction
border.color: StudioTheme.Values.themeInteraction
color: StudioTheme.Values.themeControlBackgroundInteraction
border.color: StudioTheme.Values.themeControlOutlineInteraction
}
},
State {
name: "disabled"
name: "disable"
when: !mySpinBox.enabled
PropertyChanges {
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/
**
** This file is part of Qt Creator.
@@ -32,8 +32,8 @@ Rectangle {
property T.Control myControl
property bool hover: false
property bool pressed: false
property bool hover: spinBoxIndicatorMouseArea.containsMouse
property bool pressed: spinBoxIndicatorMouseArea.containsPress
property alias iconFlip: spinBoxIndicatorIconScale.yScale
@@ -46,9 +46,10 @@ Rectangle {
id: spinBoxIndicatorMouseArea
anchors.fill: parent
hoverEnabled: true
onContainsMouseChanged: spinBoxIndicator.hover = containsMouse
onPressed: {
myControl.forceActiveFocus()
if (myControl.activeFocus)
spinBoxIndicator.forceActiveFocus()
mouse.accepted = false
}
}
@@ -69,61 +70,46 @@ Rectangle {
origin.y: spinBoxIndicatorIcon.height / 2
yScale: 1
}
}
states: [
State {
name: "default"
when: myControl.enabled && !(spinBoxIndicator.hover
|| myControl.hover)
&& !spinBoxIndicator.pressed && !myControl.edit
&& !myControl.drag && spinBoxIndicator.enabled
name: "globalHover"
when: myControl.enabled && spinBoxIndicator.enabled && !myControl.drag
&& !spinBoxIndicator.hover && myControl.hover && !myControl.edit
PropertyChanges {
target: spinBoxIndicator
color: StudioTheme.Values.themeControlBackground
target: spinBoxIndicatorIcon
color: StudioTheme.Values.themeTextColor
}
},
State {
name: "hovered"
when: (spinBoxIndicator.hover || myControl.hover)
&& !spinBoxIndicator.pressed && !myControl.edit
&& !myControl.drag && spinBoxIndicator.enabled
name: "hover"
when: myControl.enabled && spinBoxIndicator.enabled && !myControl.drag
&& spinBoxIndicator.hover && myControl.hover && !spinBoxIndicator.pressed
PropertyChanges {
target: spinBoxIndicator
color: StudioTheme.Values.themeHoverHighlight
target: spinBoxIndicatorIcon
color: StudioTheme.Values.themeIconColorHover
}
},
State {
name: "pressed"
when: spinBoxIndicator.pressed && spinBoxIndicator.enabled
name: "press"
when: myControl.enabled && spinBoxIndicator.enabled && !myControl.drag
&& spinBoxIndicator.pressed
PropertyChanges {
target: spinBoxIndicator
color: StudioTheme.Values.themeInteraction
target: spinBoxIndicatorIcon
color: "#323232" // TODO
}
},
State {
name: "edit"
when: myControl.edit && spinBoxIndicator.enabled
when: myControl.edit
PropertyChanges {
target: spinBoxIndicator
color: StudioTheme.Values.themeFocusEdit
target: spinBoxIndicatorIcon
color: StudioTheme.Values.themeTextColor
}
},
State {
name: "drag"
when: myControl.drag && spinBoxIndicator.enabled
PropertyChanges {
target: spinBoxIndicator
color: StudioTheme.Values.themeFocusDrag
}
},
State {
name: "disabled"
name: "disable"
when: !myControl.enabled || !spinBoxIndicator.enabled
PropertyChanges {
target: spinBoxIndicator
color: StudioTheme.Values.themeControlBackgroundDisabled
}
PropertyChanges {
target: spinBoxIndicatorIcon
color: StudioTheme.Values.themeTextColorDisabled
@@ -131,3 +117,107 @@ Rectangle {
}
]
}
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/
**
** This file is part of Qt Creator.
@@ -34,6 +34,7 @@ TextInput {
property bool edit: textInput.activeFocus
property bool drag: false
property bool hover: mouseArea.containsMouse
z: 2
font: myControl.font
@@ -59,17 +60,14 @@ TextInput {
onActiveFocusChanged: textInput.focus = activeFocus
Rectangle {
id: textInputArea
color: StudioTheme.Values.themeControlBackground
border.color: StudioTheme.Values.themeControlOutline
border.width: StudioTheme.Values.border
id: textInputBackground
x: 0
y: 0
y: StudioTheme.Values.border
z: -1
width: textInput.width
height: StudioTheme.Values.height
height: StudioTheme.Values.height - (StudioTheme.Values.border * 2)
color: StudioTheme.Values.themeControlBackground
border.width: 0
}
DragHandler {
@@ -117,8 +115,6 @@ TextInput {
propagateComposedEvents: true
acceptedButtons: Qt.LeftButton
cursorShape: Qt.PointingHandCursor
// Sets the global hover
onContainsMouseChanged: myControl.hover = containsMouse
onPressed: mouse.accepted = false
onWheel: {
if (!myControl.__wheelEnabled)
@@ -139,12 +135,11 @@ TextInput {
states: [
State {
name: "default"
when: myControl.enabled && !textInput.edit
&& !mouseArea.containsMouse && !myControl.drag
when: myControl.enabled && !textInput.edit && !textInput.hover && !myControl.hover
&& !myControl.drag && !myControl.sliderDrag
PropertyChanges {
target: textInputArea
target: textInputBackground
color: StudioTheme.Values.themeControlBackground
border.color: StudioTheme.Values.themeControlOutline
}
PropertyChanges {
target: dragHandler
@@ -160,21 +155,28 @@ TextInput {
}
},
State {
name: "hovered"
when: myControl.hover && !textInput.edit && !myControl.drag
name: "globalHover"
when: myControl.hover && !textInput.hover && !textInput.edit && !myControl.drag
PropertyChanges {
target: textInputArea
color: StudioTheme.Values.themeHoverHighlight
border.color: StudioTheme.Values.themeControlOutline
target: textInputBackground
color: StudioTheme.Values.themeControlBackgroundGlobalHover
}
},
State {
name: "hover"
when: textInput.hover && myControl.hover
&& !textInput.edit && !myControl.drag
PropertyChanges {
target: textInputBackground
color: StudioTheme.Values.themeControlBackgroundHover
}
},
State {
name: "edit"
when: textInput.edit
when: textInput.edit && !myControl.drag
PropertyChanges {
target: textInputArea
color: StudioTheme.Values.themeFocusEdit
border.color: StudioTheme.Values.themeInteraction
target: textInputBackground
color: StudioTheme.Values.themeControlBackgroundInteraction
}
PropertyChanges {
target: dragHandler
@@ -193,18 +195,32 @@ TextInput {
name: "drag"
when: myControl.drag
PropertyChanges {
target: textInputArea
color: StudioTheme.Values.themeFocusDrag
border.color: StudioTheme.Values.themeInteraction
target: textInputBackground
color: StudioTheme.Values.themeControlBackgroundInteraction
}
PropertyChanges {
target: textInput
color: StudioTheme.Values.themeInteraction
}
},
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
PropertyChanges {
target: textInputArea
target: textInputBackground
color: StudioTheme.Values.themeControlBackgroundDisabled
border.color: StudioTheme.Values.themeControlOutlineDisabled
}
PropertyChanges {
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/
**
** This file is part of Qt Creator.
@@ -36,7 +36,7 @@ T.TabBar {
implicitContentHeight + topPadding + bottomPadding)
spacing: 0
bottomPadding: 4
bottomPadding: 2
contentItem: ListView {
model: myButton.contentModel
@@ -50,6 +50,6 @@ T.TabBar {
}
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/
**
** This file is part of Qt Creator.
@@ -39,14 +39,15 @@ T.TabButton {
background: Rectangle {
id: buttonBackground
color: myButton.checked ? StudioTheme.Values.themeTabLight : StudioTheme.Values.themeTabDark
border.color: StudioTheme.Values.themeControlOutline
color: myButton.checked ? StudioTheme.Values.themeTabActiveBackground
: StudioTheme.Values.themeTabInactiveBackground
border.width: 0
}
contentItem: T.Label {
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.family: StudioTheme.Constants.font.family
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/
**
** This file is part of Qt Creator.
@@ -43,7 +43,7 @@ TextField {
width: myTextField.popupWidth
height: scrollView.height
background: Rectangle {
color: StudioTheme.Values.themeFocusEdit
color: StudioTheme.Values.themePopupBackground
border.color: StudioTheme.Values.themeInteraction
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/
**
** This file is part of Qt Creator.
@@ -33,16 +33,18 @@ T.TextField {
property alias actionIndicator: actionIndicator
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 hover: false // This property is used to indicate the global hover state
property alias actionIndicatorVisible: actionIndicator.visible
property real __actionIndicatorWidth: StudioTheme.Values.squareComponentWidth
property real __actionIndicatorHeight: StudioTheme.Values.height
property real __actionIndicatorWidth: StudioTheme.Values.actionIndicatorWidth
property real __actionIndicatorHeight: StudioTheme.Values.actionIndicatorHeight
property alias translationIndicatorVisible: translationIndicator.visible
property real __translationIndicatorWidth: StudioTheme.Values.squareComponentWidth
property real __translationIndicatorHeight: StudioTheme.Values.height
property real __translationIndicatorWidth: StudioTheme.Values.translationIndicatorWidth
property real __translationIndicatorHeight: StudioTheme.Values.translationIndicatorHeight
horizontalAlignment: Qt.AlignLeft
verticalAlignment: Qt.AlignVCenter
@@ -58,14 +60,12 @@ T.TextField {
persistentSelection: focus // QTBUG-73807
clip: true
width: StudioTheme.Values.height * 5
height: StudioTheme.Values.height
implicitHeight: StudioTheme.Values.height
width: StudioTheme.Values.defaultControlWidth
height: StudioTheme.Values.defaultControlHeight
implicitHeight: StudioTheme.Values.defaultControlHeight
leftPadding: StudioTheme.Values.inputHorizontalPadding + actionIndicator.width
- (actionIndicatorVisible ? StudioTheme.Values.border : 0)
rightPadding: StudioTheme.Values.inputHorizontalPadding + translationIndicator.width
- (translationIndicatorVisible ? StudioTheme.Values.border : 0)
MouseArea {
id: mouseArea
@@ -75,7 +75,6 @@ T.TextField {
propagateComposedEvents: true
acceptedButtons: Qt.LeftButton | Qt.RightButton
cursorShape: Qt.PointingHandCursor
onContainsMouseChanged: myTextField.hover = containsMouse // Sets the global hover
onPressed: {
if (mouse.button === Qt.RightButton)
contextMenu.popup(myTextField)
@@ -104,8 +103,8 @@ T.TextField {
myControl: myTextField
x: 0
y: 0
width: actionIndicator.visible ? __actionIndicatorWidth : 0
height: actionIndicator.visible ? __actionIndicatorHeight : 0
width: actionIndicator.visible ? myTextField.__actionIndicatorWidth : 0
height: actionIndicator.visible ? myTextField.__actionIndicatorHeight : 0
}
background: Rectangle {
@@ -113,7 +112,7 @@ T.TextField {
color: StudioTheme.Values.themeControlBackground
border.color: StudioTheme.Values.themeControlOutline
border.width: StudioTheme.Values.border
x: actionIndicator.width - (actionIndicatorVisible ? StudioTheme.Values.border : 0)
x: actionIndicator.width
width: myTextField.width - actionIndicator.width
height: myTextField.height
}
@@ -136,27 +135,53 @@ T.TextField {
color: StudioTheme.Values.themeControlBackground
border.color: StudioTheme.Values.themeControlOutline
}
PropertyChanges {
target: myTextField
color: StudioTheme.Values.themeTextColor
}
PropertyChanges {
target: mouseArea
cursorShape: Qt.PointingHandCursor
}
},
State {
name: "hovered"
when: myTextField.hover && !myTextField.edit
name: "globalHover"
when: (actionIndicator.hover || translationIndicator.hover) && !myTextField.edit
PropertyChanges {
target: textFieldBackground
color: StudioTheme.Values.themeHoverHighlight
color: StudioTheme.Values.themeControlBackgroundGlobalHover
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 {
name: "edit"
when: myTextField.edit
PropertyChanges {
target: textFieldBackground
color: StudioTheme.Values.themeFocusEdit
border.color: StudioTheme.Values.themeInteraction
color: StudioTheme.Values.themeControlBackgroundInteraction
border.color: StudioTheme.Values.themeControlOutlineInteraction
}
PropertyChanges {
target: myTextField
color: StudioTheme.Values.themeTextColor
}
PropertyChanges {
target: mouseArea
@@ -164,13 +189,17 @@ T.TextField {
}
},
State {
name: "disabled"
name: "disable"
when: !myTextField.enabled
PropertyChanges {
target: textFieldBackground
color: StudioTheme.Values.themeControlBackgroundDisabled
border.color: StudioTheme.Values.themeControlOutlineDisabled
}
PropertyChanges {
target: myTextField
color: StudioTheme.Values.themeTextColorDisabled
}
}
]

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

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

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

158
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/
**
** This file is part of Qt Creator.
@@ -30,11 +30,11 @@ import QtQuickDesignerTheme 1.0
QtObject {
id: values
property real baseHeight: 20
property real baseHeight: 29
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 myFontSize: Math.round(values.baseFont * values.scaleFactor)
@@ -54,9 +54,9 @@ QtObject {
property real spinControlIconSize: 8
property real spinControlIconSizeMulti: values.spinControlIconSize * values.scaleFactor
property real sliderTrackHeight: values.height / 4
property real sliderHandleHeight: values.sliderTrackHeight * 2
property real sliderHandleWidth: values.sliderTrackHeight
property real sliderTrackHeight: values.height / 3
property real sliderHandleHeight: values.sliderTrackHeight * 1.8
property real sliderHandleWidth: values.sliderTrackHeight * 0.5
property real sliderFontSize: Math.round(8 * values.scaleFactor)
property real sliderPadding: Math.round(6 * 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 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 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
// 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 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 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)
// Text colors
property string themeTextColor: Theme.color(Theme.DStextColor)
property string themeTextColorDisabled: Theme.color(Theme.DStextColorDisabled)
property string themeTextSelectionColor: Theme.color(Theme.DStextSelectionColor)
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 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 themeTabDark: Theme.color(Theme.QmlDesigner_TabDark)
property string themeTabLight: Theme.color(Theme.QmlDesigner_TabLight)
property string themeTabActiveBackground: Theme.color(Theme.DStabActiveBackground)
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
property string themeChangedStateText: Theme.color(Theme.DSchangedStateText)
@@ -131,4 +205,16 @@ QtObject {
property string theme3DAxisXColor: Theme.color(Theme.DS3DAxisXColor)
property string theme3DAxisYColor: Theme.color(Theme.DS3DAxisYColor)
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 {
anchors.margins: (isDefaultState || (isBaseState && !modelHasDefaultState)) ? -myRoot.highlightBorderWidth : 0
anchors.fill: column
color: Theme.color(Theme.DSsliderActiveTrackFocus)
color: StudioTheme.Values.themeStateSeparator
border.color: StudioTheme.Values.themeStateDefaultHighlight
border.width: (isDefaultState || (isBaseState && !modelHasDefaultState)) ? myRoot.highlightBorderWidth : 0
}
@@ -188,14 +188,14 @@ Rectangle {
width: myRoot.width - 2 * myRoot.stateMargin
height: myRoot.topAreaHeight
color: Theme.color(Theme.DShoverHighlight)
color: StudioTheme.Values.themeStateBackground
StudioControls.TextField {
id: stateNameField
property string oldValue
width: StudioTheme.Values.height * 7
width: StudioTheme.Values.height * 5.5
anchors.top: parent.top
anchors.topMargin: myRoot.textFieldMargin
@@ -247,7 +247,7 @@ Rectangle {
anchors.rightMargin: myRoot.previewMargin
anchors.verticalCenter: stateNameField.verticalCenter
color: Theme.color(Theme.DStextColor)
color: StudioTheme.Values.themeTextColor
font.italic: true
font.pixelSize: StudioTheme.Values.myFontSize
font.family: StudioTheme.Constants.font
@@ -261,27 +261,29 @@ Rectangle {
Rectangle {
id: stateImageArea
width: myRoot.width - 2 * myRoot.stateMargin
height: myRoot.bottomAreaHeight
color: Theme.color(Theme.DShoverHighlight)
color: StudioTheme.Values.themeStateBackground
visible: expanded
Image {
anchors.fill: stateImageBackground
source: "images/checkers.png"
fillMode: Image.Tile
}
Rectangle {
border.width: StudioTheme.Values.border
border.color: Theme.color(Theme.DSsliderActiveTrackFocus)
color: Theme.color(Theme.DSsliderInactiveTrack)
id: stateImageBackground
anchors.centerIn: parent
width: Math.round(stateImage.paintedWidth) + 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 {
id: stateImage
anchors.margins: myRoot.previewMargin
anchors.centerIn: parent
anchors.fill: parent

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

@@ -33,7 +33,7 @@ import StudioTheme 1.0 as StudioTheme
FocusScope {
id: root
property int delegateTopAreaHeight: 30
property int delegateTopAreaHeight: StudioTheme.Values.height + 8
property int delegateBottomAreaHeight: 200
property int delegateColumnSpacing: 2
property int delegateStateMargin: 16
@@ -72,7 +72,7 @@ FocusScope {
Rectangle {
id: background
anchors.fill: parent
color: Theme.color(Theme.QmlDesigner_BackgroundColorDarkAlternate)
color: StudioTheme.Values.themePanelBackground
}
MouseArea {
@@ -137,7 +137,7 @@ FocusScope {
}
Rectangle {
color: Theme.color(Theme.DSsliderActiveTrackFocus)
color: StudioTheme.Values.themeStateSeparator
x: root.padding
y: root.padding
width: Math.min((root.delegateWidth * flickable.count) + (2 * (flickable.count - 1)),
@@ -168,7 +168,7 @@ FocusScope {
height: root.delegateHeight
isBaseState: 0 === internalNodeId
isCurrentState: root.currentStateInternalId === internalNodeId
baseColor: isCurrentState ? Theme.color(Theme.DSinteraction) : background.color
baseColor: isCurrentState ? StudioTheme.Values.themeInteraction : background.color
delegateStateName: stateName
delegateStateImageSource: stateImageSource
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
[Colors]
;DS controls theme START
DScontrolBackground=ff404040
DScontrolOutline=ff595959
DStextColor=ffffffff
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
DSpanelBackground=ff323232
DSinteraction=ff2aafd3
DSerrorColor=ffdf3a3a
DScontrolBackgroundDisabled=ff363636
DScontrolOutlineDisabled=ff4d4d4d
DStextColorDisabled=ff7a7a7a
DStextSelectionColor=ff3f91c4
DStextSelectedTextColor=ffffffff
DSscrollBarTrack=ff4d4d4d
DSdisabledColor=ff707070
DScontrolBackground=ff323232
DScontrolBackgroundInteraction=ff595959
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
DSscrollBarHandle=ff505050
DScontrolBackgroundInteraction=ff4d4d4d
DStranslationIndicatorBorder=ff7f7f7f
DSsectionHeadBackground=ff424242
DSsectionHeadBackground=ff1f1f1f
DSstateDefaultHighlight=ffffe400
DSstateSeparatorColor=ff7c7b7b
DSstateBackgroundColor=ff383838
DSstatePreviewOutline=ffaaaaaa
DSchangedStateText=ff99ccff
DS3DAxisXColor=ffe00000
DS3DAxisXColor=ffd00000
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
BackgroundColorAlternate=alternateBackground
@@ -263,7 +355,7 @@ QmlDesigner_BackgroundColor=qmlDesignerButtonColor
QmlDesigner_HighlightColor=ff46a2da
QmlDesigner_FormEditorSelectionColor=ff4ba2ff
QmlDesigner_FormEditorForegroundColor=ffffffff
QmlDesigner_BackgroundColorDarkAlternate=qmlDesignerButtonColor
QmlDesigner_BackgroundColorDarkAlternate=ff323232
QmlDesigner_BackgroundColorDarker=ff151515
QmlDesigner_BorderColor=splitterColor
QmlDesigner_ButtonColor=ff505050

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

@@ -13,44 +13,136 @@ splitterColor=ff151515
qmlDesignerButtonColor=ff4c4e50
[Colors]
;DS controls theme START
DScontrolBackground=ff404040
DScontrolOutline=ff595959
DStextColor=ffffffff
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
DSpanelBackground=ffeaeaea
DSinteraction=ff2aafd3
DSerrorColor=ffdf3a3a
DScontrolBackgroundDisabled=ff363636
DScontrolOutlineDisabled=ff4d4d4d
DStextColorDisabled=ff7a7a7a
DStextSelectionColor=ff3f91c4
DStextSelectedTextColor=ffffffff
DSscrollBarTrack=ff4d4d4d
DSscrollBarHandle=ff505050
DScontrolBackgroundInteraction=ff4d4d4d
DStranslationIndicatorBorder=ff7f7f7f
DSsectionHeadBackground=ff424242
DSdisabledColor=ff8e8e8e
DScontrolBackground=ffeaeaea
DScontrolBackgroundInteraction=ffc9c9c9
DScontrolBackgroundDisabled=ff8e8e8e
DScontrolBackgroundGlobalHover=ffe5e5e5
DScontrolBackgroundHover=ffd1d1d1
DScontrolOutline=ffcecccc
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
DS3DAxisXColor=ffe00000
DS3DAxisXColor=ffd00000
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
BackgroundColorAlternate=ff3d3d3d
@@ -232,7 +324,7 @@ QmlDesigner_BackgroundColor=qmlDesignerButtonColor
QmlDesigner_HighlightColor=ff46a2da
QmlDesigner_FormEditorSelectionColor=ff4ba2ff
QmlDesigner_FormEditorForegroundColor=brightText
QmlDesigner_BackgroundColorDarkAlternate=qmlDesignerButtonColor
QmlDesigner_BackgroundColorDarkAlternate=ffeaeaea
QmlDesigner_BackgroundColorDarker=ff4e4e4e
QmlDesigner_BorderColor=splitterColor
QmlDesigner_ButtonColor=ff7a7a7a

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

@@ -24,53 +24,146 @@ splitter=ffbdbebf
qmlDesignerButtonColor=fff8f8f8
textColorLink=ff007af4
textColorLinkVisited=ffa57aff
backgroundColorDisabled=ff444444
backgroundColorDisabled=ff8e8e8e
[Colors]
;DS controls theme START
DScontrolBackground=ffffffff
DScontrolOutline=ff777777
DStextColor=ff242424
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
DSpanelBackground=ffeaeaea
DSinteraction=ff2aafd3
DSerrorColor=ffdf3a3a
DScontrolBackgroundDisabled=ffaaaaaa
DScontrolOutlineDisabled=ff777777
DStextColorDisabled=ff505050
DStextSelectionColor=ff0492c9
DStextSelectedTextColor=ffffffff
DSscrollBarTrack=ff777777
DSscrollBarHandle=ff505050
DScontrolBackgroundInteraction=ff777777
DStranslationIndicatorBorder=ffebebeb
DSsectionHeadBackground=ffebebeb
DSdisabledColor=ff8e8e8e
DScontrolBackground=ffeaeaea
DScontrolBackgroundInteraction=ffc9c9c9
DScontrolBackgroundDisabled=ff8e8e8e
DScontrolBackgroundGlobalHover=ffe5e5e5
DScontrolBackgroundHover=ffd1d1d1
DScontrolOutline=ffcecccc
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
DS3DAxisXColor=ffff0000
DS3DAxisYColor=ff00A000
DS3DAxisZColor=ff0000ff
DS3DAxisXColor=ffd00000
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
BackgroundColorAlternate=alternateBackground
BackgroundColorDark=shadowBackground
BackgroundColorHover=hoverBackground
BackgroundColorNormal=normalBackground
BackgroundColorDisabled=ff444444
BackgroundColorDisabled=ff7a7a7a
BackgroundColorSelected=selectedBackground
BadgeLabelBackgroundColorChecked=ffe0e0e0
BadgeLabelBackgroundColorUnchecked=ff808080
@@ -246,7 +339,7 @@ QmlDesigner_BackgroundColor=qmlDesignerButtonColor
QmlDesigner_HighlightColor=ff0492c9
QmlDesigner_FormEditorSelectionColor=ffd3299a
QmlDesigner_FormEditorForegroundColor=ffffffff
QmlDesigner_BackgroundColorDarkAlternate=qmlDesignerButtonColor
QmlDesigner_BackgroundColorDarkAlternate=ffeaeaea
QmlDesigner_BackgroundColorDarker=fff5f5f5
QmlDesigner_BorderColor=splitter
QmlDesigner_ButtonColor=f0f0f0

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

@@ -4,7 +4,7 @@ PreferredStyles=Fusion
DefaultTextEditorColorScheme=creator-dark.xml
[Palette]
shadowBackground=ff191919
shadowBackground=ff1f1f1f
text=ffdadada
textDisabled=60a4a6a8
selectedBackgroundText=aa1f75cc
@@ -23,47 +23,137 @@ textColorLink=ff007af4
textColorLinkVisited=ffa57aff
backgroundColorDisabled=ff444444
[Colors]
;DS controls theme START
DScontrolBackground=ff242424
DScontrolOutline=ff404040
DStextColor=ffffffff
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
DSpanelBackground=ff323232
DSinteraction=ff2aafd3
DSerrorColor=ffdf3a3a
DScontrolBackgroundDisabled=ff363636
DScontrolOutlineDisabled=ff404040
DStextColorDisabled=ff606060
DStextSelectionColor=ff0492c9
DStextSelectedTextColor=ffffffff
DSdisabledColor=ff707070
DScontrolBackground=ff323232
DScontrolBackgroundInteraction=ff595959
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
DSscrollBarHandle=ff505050
DScontrolBackgroundInteraction=ff404040
DStranslationIndicatorBorder=ff7f7f7f
DSsectionHeadBackground=ff191919
DSsectionHeadBackground=ff1f1f1f
DSstateDefaultHighlight=ffffe400
DSstateSeparatorColor=ff7c7b7b
DSstateBackgroundColor=ff383838
DSstatePreviewOutline=ffaaaaaa
DSchangedStateText=ff99ccff
DS3DAxisXColor=ffd00000
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=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
BackgroundColorAlternate=alternateBackground
@@ -270,7 +360,7 @@ QmlDesigner_FormEditorForegroundColor=ffdadada
;background color for main form view, library, navigator, properties, connections
;QmlDesigner_BackgroundColorDarkAlternate=ff4c4e50
QmlDesigner_BackgroundColorDarkAlternate=ff262626
QmlDesigner_BackgroundColorDarkAlternate=ff323232
;filter outlines, override W/H outlines, properties spinbox background, timeline separators.
;QmlDesigner_BackgroundColorDarker=ff262728

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

@@ -26,44 +26,136 @@ backgroundColorDisabled=ff444444
qmlDesignerButtonColor=ff4c4e50
[Colors]
;DS controls theme START
DScontrolBackground=ff404040
DScontrolOutline=ff595959
DStextColor=ffffffff
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
DSpanelBackground=ff323232
DSinteraction=ff2aafd3
DSerrorColor=ffdf3a3a
DScontrolBackgroundDisabled=ff363636
DScontrolOutlineDisabled=ff4d4d4d
DStextColorDisabled=ff7a7a7a
DStextSelectionColor=ff1d545c
DStextSelectedTextColor=ffffffff
DSscrollBarTrack=ff4d4d4d
DSdisabledColor=ff707070
DScontrolBackground=ff323232
DScontrolBackgroundInteraction=ff595959
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
DSscrollBarHandle=ff505050
DScontrolBackgroundInteraction=ff4d4d4d
DStranslationIndicatorBorder=ff7f7f7f
DSsectionHeadBackground=ff424242
DSsectionHeadBackground=ff1f1f1f
DSstateDefaultHighlight=ffffe400
DSstateSeparatorColor=ff7c7b7b
DSstateBackgroundColor=ff383838
DSstatePreviewOutline=ffaaaaaa
DSchangedStateText=ff99ccff
DS3DAxisXColor=ffe00000
DS3DAxisXColor=ffd00000
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
BackgroundColorAlternate=alternateBackground
@@ -245,7 +337,7 @@ QmlDesigner_BackgroundColor=qmlDesignerButtonColor
QmlDesigner_HighlightColor=ff1d545c
QmlDesigner_FormEditorSelectionColor=ff4ba2ff
QmlDesigner_FormEditorForegroundColor=ffffffff
QmlDesigner_BackgroundColorDarkAlternate=qmlDesignerButtonColor
QmlDesigner_BackgroundColorDarkAlternate=ff323232
QmlDesigner_BackgroundColorDarker=ff262728
QmlDesigner_BorderColor=splitter
QmlDesigner_ButtonColor=ff595b5c

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

@@ -22,44 +22,136 @@ warning=ffecbc1c
qmlDesignerButtonColor=fff8f8f8
[Colors]
;DS controls theme START
DScontrolBackground=ffffffff
DScontrolOutline=ff777777
DStextColor=ff242424
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
DSpanelBackground=ffeaeaea
DSinteraction=ff2aafd3
DSerrorColor=ffdf3a3a
DScontrolBackgroundDisabled=ffaaaaaa
DScontrolOutlineDisabled=ff777777
DStextColorDisabled=ff505050
DStextSelectionColor=ff0492c9
DStextSelectedTextColor=ffffffff
DSscrollBarTrack=ff777777
DSscrollBarHandle=ff505050
DScontrolBackgroundInteraction=ff777777
DStranslationIndicatorBorder=ffebebeb
DSsectionHeadBackground=ffebebeb
DSdisabledColor=ff8e8e8e
DScontrolBackground=ffeaeaea
DScontrolBackgroundInteraction=ffc9c9c9
DScontrolBackgroundDisabled=ff8e8e8e
DScontrolBackgroundGlobalHover=ffe5e5e5
DScontrolBackgroundHover=ffd1d1d1
DScontrolOutline=ffcecccc
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
DS3DAxisXColor=ffff0000
DS3DAxisYColor=ff00A000
DS3DAxisZColor=ff0000ff
DS3DAxisXColor=ffd00000
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
BackgroundColorAlternate=alternateBackground
@@ -241,7 +333,7 @@ QmlDesigner_BackgroundColor=qmlDesignerButtonColor
QmlDesigner_HighlightColor=ff46a2da
QmlDesigner_FormEditorSelectionColor=ff4ba2ff
QmlDesigner_FormEditorForegroundColor=ffffffff
QmlDesigner_BackgroundColorDarkAlternate=qmlDesignerButtonColor
QmlDesigner_BackgroundColorDarkAlternate=ffeaeaea
QmlDesigner_BackgroundColorDarker=fff5f5f5
QmlDesigner_BorderColor=splitter
QmlDesigner_ButtonColor=ffcccccc

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

@@ -20,44 +20,136 @@ splitter=ff313131
qmlDesignerButtonColor=ff4c4e50
[Colors]
;DS controls theme START
DScontrolBackground=ff404040
DScontrolOutline=ff595959
DStextColor=ffffffff
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
DSpanelBackground=ff323232
DSinteraction=ff2aafd3
DSerrorColor=ffdf3a3a
DScontrolBackgroundDisabled=ff363636
DScontrolOutlineDisabled=ff4d4d4d
DStextColorDisabled=ff7a7a7a
DStextSelectionColor=ff3f91c4
DStextSelectedTextColor=ffffffff
DSscrollBarTrack=ff4d4d4d
DSdisabledColor=ff707070
DScontrolBackground=ff323232
DScontrolBackgroundInteraction=ff595959
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
DSscrollBarHandle=ff505050
DScontrolBackgroundInteraction=ff4d4d4d
DStranslationIndicatorBorder=ff7f7f7f
DSsectionHeadBackground=ff424242
DSsectionHeadBackground=ff1f1f1f
DSstateDefaultHighlight=ffffe400
DSstateSeparatorColor=ff7c7b7b
DSstateBackgroundColor=ff383838
DSstatePreviewOutline=ffaaaaaa
DSchangedStateText=ff99ccff
DS3DAxisXColor=ffe00000
DS3DAxisXColor=ffd00000
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
BackgroundColorAlternate=alternateBackground
@@ -239,7 +331,7 @@ QmlDesigner_BackgroundColor=qmlDesignerButtonColor
QmlDesigner_HighlightColor=ff46a2da
QmlDesigner_FormEditorSelectionColor=ff4ba2ff
QmlDesigner_FormEditorForegroundColor=ffffffff
QmlDesigner_BackgroundColorDarkAlternate=qmlDesignerButtonColor
QmlDesigner_BackgroundColorDarkAlternate=ff323232
QmlDesigner_BackgroundColorDarker=ff262728
QmlDesigner_BorderColor=splitter
QmlDesigner_ButtonColor=ff595b5c

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

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

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

@@ -45,6 +45,8 @@
#include "floatingdragpreview.h"
#include "iconprovider.h"
#include <utils/theme/theme.h>
#include <QApplication>
#include <QBoxLayout>
#include <QLabel>
@@ -54,7 +56,10 @@
#include <QPushButton>
#include <QSplitter>
#include <QStyle>
#include <QStyleOption>
#include <QToolButton>
#include <QPainter>
#include <QStylePainter>
#include <iostream>
@@ -81,7 +86,7 @@ namespace ADS
eDragState m_dragState = DraggingInactive;
AbstractFloatingWidget *m_floatingWidget = nullptr;
QIcon m_icon;
QAbstractButton *m_closeButton = nullptr;
TabButton *m_closeButton = nullptr;
QPoint m_tabDragStartPosition;
/**
@@ -122,8 +127,9 @@ namespace ADS
/**
* Creates the close button as QPushButton or as QToolButton
*/
QAbstractButton *createCloseButton() const
TabButton *createCloseButton() const
{
/*
if (testConfigFlag(DockManager::TabCloseButtonIsToolButton)) {
auto button = new QToolButton();
button->setAutoRaise(true);
@@ -131,6 +137,8 @@ namespace ADS
} else {
return new QPushButton();
}
*/
return new TabButton();
}
template<typename T>
@@ -179,7 +187,8 @@ namespace ADS
QStyle::SP_TitleBarCloseButton,
TabCloseIcon);
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();
internal::setToolTip(m_closeButton, QObject::tr("Close Tab"));
QObject::connect(m_closeButton,
@@ -196,9 +205,9 @@ namespace ADS
boxLayout->setSpacing(0);
q->setLayout(boxLayout);
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->addWidget(m_closeButton, 0, Qt::AlignVCenter);
boxLayout->addSpacing(1);
boxLayout->setAlignment(Qt::AlignCenter | Qt::AlignVCenter);
if (DockManager::testConfigFlag(DockManager::FocusHighlighting))
@@ -263,6 +272,39 @@ namespace ADS
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)
: QFrame(parent)
, d(new DockWidgetTabPrivate(this))
@@ -420,6 +462,8 @@ namespace ADS
bool tabHasCloseButton = (activeTabHasCloseButton && active) | allTabsHaveCloseButton;
d->m_closeButton->setVisible(dockWidgetClosable && tabHasCloseButton);
d->m_closeButton->setActive(active);
// Focus related stuff
if (DockManager::testConfigFlag(DockManager::FocusHighlighting)
&& !d->m_dockWidget->dockManager()->isRestoringState()) {
@@ -550,12 +594,8 @@ namespace ADS
void DockWidgetTab::updateStyle()
{
if (DockManager::testConfigFlag(DockManager::FocusHighlighting)) {
if (property("focused").toBool())
d->m_closeButton->setChecked(true);
else
d->m_closeButton->setChecked(false);
}
if (DockManager::testConfigFlag(DockManager::FocusHighlighting))
d->m_closeButton->setFocus(property("focused").toBool());
internal::repolishStyle(this, internal::RepolishDirectChildren);
}

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

@@ -38,6 +38,7 @@
#include "ads_globals.h"
#include <QFrame>
#include <QToolButton>
namespace ADS {
@@ -45,6 +46,28 @@ class DockWidget;
class DockAreaWidget;
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.
* 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 {
/**
* Private data of public ClickableLabel
* Private data of public ElidingLabel
*/
struct ElidingLabelPrivate
{

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

@@ -81,7 +81,8 @@ void FloatingWidgetTitleBarPrivate::createLayout()
QStyle::SP_TitleBarCloseButton,
ADS::FloatingWidgetCloseIcon);
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->setFocusPolicy(Qt::NoFocus);
QObject::connect(m_closeButton,
@@ -100,6 +101,7 @@ void FloatingWidgetTitleBarPrivate::createLayout()
layout->addWidget(m_titleLabel, 1);
layout->addSpacing(spacing);
layout->addWidget(m_closeButton);
layout->addSpacing(1);
layout->setAlignment(Qt::AlignCenter);
m_titleLabel->setVisible(true);

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

@@ -303,42 +303,121 @@ public:
/* Palette for DS Controls */
DScontrolBackground,
DScontrolOutline,
DStextColor,
DSdisabledTextColor,
DSpanelBackground,
DShoverHighlight,
DScolumnBackground,
DSfocusEdit,
DSfocusDrag,
DScontrolBackgroundPressed,
DScontrolBackgroundChecked,
DSinteraction,
DSsliderActiveTrack,
DSsliderInactiveTrack,
DSsliderHandle,
DSsliderActiveTrackHover,
DSsliderInactiveTrackHover,
DSsliderHandleHover,
DSsliderActiveTrackFocus,
DSsliderInactiveTrackFocus,
DSsliderHandleFocus,
DSerrorColor,
DSdisabledColor,
DScontrolBackground,
DScontrolBackgroundInteraction,
DScontrolBackgroundDisabled,
DScontrolBackgroundGlobalHover,
DScontrolBackgroundHover,
DScontrolOutline,
DScontrolOutlineInteraction,
DScontrolOutlineDisabled,
DStextColor,
DStextColorDisabled,
DStextSelectionColor,
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,
DSscrollBarHandle,
DScontrolBackgroundInteraction,
DStranslationIndicatorBorder,
DSsectionHeadBackground,
DSstateDefaultHighlight,
DSstateSeparatorColor,
DSstateBackgroundColor,
DSstatePreviewOutline,
DSchangedStateText,
DS3DAxisXColor,
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 {

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"));
for (int i = 0, total = e.keyCount(); i < total; ++i) {
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;
@@ -101,14 +101,21 @@ QString Theme::replaceCssColors(const QString &input)
while (it.hasNext()) {
const QRegularExpressionMatch match = it.next();
const QString themeColorName = match.captured(1);
const QRegularExpression replaceExp("creatorTheme\\." + themeColorName + "(\\s|;|\\n)");
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") {
output.replace("creatorTheme." + themeColorName, QString::number(instance()->captionFontPixelSize()) + "px");
output.replace(replaceExp,
QString::number(instance()->captionFontPixelSize()) + "px" + "\\1");
} else {
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();
}

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

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

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

@@ -1,71 +1,64 @@
QFrame
{
background-color: creatorTheme.QmlDesigner_BackgroundColorDarkAlternate;
color: creatorTheme.PanelTextColorLight;
QFrame {
background-color: creatorTheme.DSpanelBackground;
color: creatorTheme.DStextColor;
font-size: creatorTheme.captionFontPixelSize;
border-radius: 0px;
}
QTableView {
color: creatorTheme.PanelTextColorLight;
selection-color: creatorTheme.PanelTextColorLight;
selection-background-color: creatorTheme.QmlDesigner_HighlightColor;
color: creatorTheme.DStextColor;
selection-color: creatorTheme.DStextSelectedTextColor;
selection-background-color: creatorTheme.DStextSelectionColor;
}
QTabBar QToolButton {
background-color: creatorTheme.QmlDesigner_BackgroundColorDarkAlternate;
background-color: creatorTheme.DSpanelBackground;
border: 1px solid creatorTheme.QmlDesigner_BackgroundColorDarker;
border-radius: 0px;
}
QTableView::item
{
QTableView::item {
border: 0px;
padding-left: 4px;
}
QTableView::item:focus
{
QTableView::item:focus {
border: none;
background-color: transparent;
}
QTableView::item:selected
{
QTableView::item:selected {
border: none
}
QHeaderView::section {
background-color: #494949;
background-color: creatorTheme.DSheaderViewBackground;
border: 0px;
color: creatorTheme.DStextColor;
margin-right: 1px
}
QTableView {
alternate-background-color: #414141;
alternate-background-color: creatorTheme.DStableViewAlternateBackground;
}
QWidget#widgetSpacer {
background-color: creatorTheme.QmlDesigner_TabLight;
background-color: creatorTheme.DStabActiveBackground;
}
QStackedWidget {
border: 0px;
background-color: creatorTheme.QmlDesigner_TabLight;
background-color: creatorTheme.DStabActiveBackground;
}
QTabBar::tab:selected {
border: none;
border-image: none;
image: none;
background-color: creatorTheme.QmlDesigner_TabLight;
color: creatorTheme.QmlDesigner_TabDark;
background-color: creatorTheme.DStabActiveBackground;
color: creatorTheme.DStabActiveText;
}
QTabBar::tab {
width: 92px;
height: 22px;
@@ -75,48 +68,62 @@ QTabBar::tab {
margin-right: 0px;
font: bold;
font-size: creatorTheme.captionFontPixelSize;
background-color: creatorTheme.QmlDesigner_TabDark;
color: creatorTheme.QmlDesigner_TabLight;
background-color: creatorTheme.DStabInactiveBackground;
color: creatorTheme.DStabInactiveText;
}
QSpinBox
{
/*
QSpinBox {
font-size: creatorTheme.captionFontPixelSize;
color: white;
color: creatorTheme.DStextColor;
padding-right: 2px;
padding-top: 2px;
padding-bottom: 2px;
padding-left: 12px;
border: 2px solid #0F0F0F;
border-width: 1;
background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,
stop: 0 #2c2c2c, stop: 1 #333333);
border: 1px solid creatorTheme.DScontrolOutline;
background-color: creatorTheme.DScontrolBackground;
min-height: 22px;
}
QDoubleSpinBox
{
QDoubleSpinBox {
font-size: creatorTheme.captionFontPixelSize;
color: white;
color: creatorTheme.DStextColor;
padding-right: 2px;
padding-top: 2px;
padding-bottom: 2px;
padding-left: 12px;
border: 2px solid #0F0F0F;
border-width: 1;
background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,
stop: 0 #2c2c2c, stop: 1 #333333);
border: 1px solid creatorTheme.DScontrolOutline;
background-color: creatorTheme.DScontrolBackground;
min-height: 22px;
}
*/
QLineEdit
{
color: white;
QLineEdit {
color: creatorTheme.DStextColor;
selection-color: creatorTheme.DStextSelectedTextColor;
selection-background-color: creatorTheme.DStextSelectionColor;
font-size: creatorTheme.captionFontPixelSize;
border: 2px solid #0F0F0F;
border-width: 1;
border: 1px solid creatorTheme.DScontrolOutline;
min-height: 26px;
background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,
stop: 0 #2c2c2c, stop: 1 #333333);
background-color: creatorTheme.DScontrolBackground;
}
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);
Theme::setupTheme(m_headerWidget->engine());
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));
// create add imports widget
m_addImportWidget->setResizeMode(QQuickWidget::SizeRootObjectToView);
m_addImportWidget->setClearColor(Theme::getColor(Theme::Color::QmlDesigner_BackgroundColorDarkAlternate));
Theme::setupTheme(m_addImportWidget->engine());
m_addImportWidget->engine()->addImportPath(propertyEditorResourcesPath() + "/imports");
m_addImportWidget->setClearColor(Theme::getColor(Theme::Color::DSpanelBackground));
m_addImportWidget->rootContext()->setContextProperties({
{"addImportModel", QVariant::fromValue(m_itemLibraryAddImportModel.data())},
{"rootView", QVariant::fromValue(this)},
@@ -172,7 +173,7 @@ ItemLibraryWidget::ItemLibraryWidget(AsynchronousImageCache &imageCache,
m_itemViewQuickWidget->rootContext()->setContextProperty("tooltipBackend",
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"),
new Internal::ItemLibraryImageProvider);
Theme::setupTheme(m_itemViewQuickWidget->engine());

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

@@ -45,12 +45,9 @@
namespace QmlDesigner {
IconCheckboxItemDelegate::IconCheckboxItemDelegate(QObject *parent,
const QIcon &checkedIcon,
const QIcon &uncheckedIcon)
IconCheckboxItemDelegate::IconCheckboxItemDelegate(QObject *parent, const QIcon &icon)
: QStyledItemDelegate(parent),
m_checkedIcon(checkedIcon),
m_uncheckedIcon(uncheckedIcon)
m_icon(icon)
{}
QSize IconCheckboxItemDelegate::sizeHint(const QStyleOptionViewItem & /*option*/,
@@ -83,12 +80,18 @@ void IconCheckboxItemDelegate::paint(QPainter *painter,
const QStyleOptionViewItem &styleOption,
const QModelIndex &modelIndex) const
{
if (styleOption.state & QStyle::State_MouseOver && !isThisOrAncestorLocked(modelIndex))
painter->fillRect(styleOption.rect.adjusted(0, delegateMargin, 0, -delegateMargin),
Theme::getColor(Theme::Color::DSsliderHandle));
QIcon::Mode mode = QIcon::Mode::Normal;
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);
mode = QIcon::Mode::Selected;
}
bool isVisibilityIcon = modelIndex.column() != NavigatorTreeModel::ColumnType::Visibility;
// 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,
styleOption.rect.top() + 2 + delegateMargin);
const QIcon &icon = isChecked(modelIndex) ? m_checkedIcon : m_uncheckedIcon;
const QPixmap iconPixmap = icon.pixmap(window, iconSize);
const QIcon::State state = isChecked(modelIndex) ? QIcon::State::On : QIcon::State::Off;
const QPixmap iconPixmap = m_icon.pixmap(window, iconSize, mode, state);
painter->save();

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

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

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

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

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

@@ -74,7 +74,7 @@ public:
mouseOverStateSavedFrameRectangle = option->rect;
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) {
// between elements and on elements we have a width
if (option->rect.width() > 0) {
@@ -101,7 +101,8 @@ public:
int bef_v = mid_v;
int aft_h = mid_h;
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->direction == Qt::RightToLeft)
painter->fillRect(option->rect.left(), mid_v, bef_h - option->rect.left(), 1, brush);
@@ -116,11 +117,11 @@ public:
int delta = decoration_size / 2;
bef_h -= delta;
bef_v -= delta;
aft_h += delta;
aft_v += delta;
//aft_h += delta;
//aft_v += delta;
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] = {
QPointF(0.0, 0.0),
@@ -134,7 +135,7 @@ public:
QPointF(4.0, 4.0)
};
auto color = Theme::getColor(Theme::Color::IconsBaseColor);
auto color = Theme::getColor(Theme::Color::DSnavigatorBranchIndicator);
painter->setPen(color);
painter->setBrush(color);
@@ -167,23 +168,15 @@ public:
private: // functions
QColor highlightBrushColor() const
{
QColor highlightBrushColor = m_currentTextColor;
highlightBrushColor.setAlphaF(0.7);
return highlightBrushColor;
QColor color = Theme::getColor(Theme::Color::DSnavigatorDropIndicatorBackground);
color.setAlphaF(0.7);
return color;
}
QColor highlightLineColor() const
{
return highlightBrushColor().lighter();
}
QColor backgroundBrushColor() const
{
QColor backgroundBrushColor = highlightBrushColor();
backgroundBrushColor.setAlphaF(0.2);
return backgroundBrushColor;
}
QColor backgroundLineColor() const
{
return backgroundBrushColor().lighter();
QColor color = Theme::getColor(Theme::Color::DSnavigatorDropIndicatorOutline);
color.setAlphaF(0.7);
return color;
}
void drawHighlightFrame(const QRect &frameRectangle, QPainter *painter) const
@@ -192,12 +185,7 @@ private: // functions
painter->setBrush(highlightBrushColor());
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
{
painter->setPen(QPen(highlightLineColor(), 3));
@@ -231,7 +219,7 @@ void NavigatorTreeView::drawSelectionBackground(QPainter *painter, const QStyleO
{
painter->save();
painter->fillRect(option.rect.adjusted(0, delegateMargin, 0, -delegateMargin),
Theme::getColor(Theme::Color::QmlDesigner_HighlightColor));
Theme::getColor(Theme::Color::DSnavigatorItemBackgroundSelected));
painter->restore();
}

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

@@ -615,44 +615,85 @@ void NavigatorView::setupWidget()
#ifndef QMLDESIGNER_TEST
const QString fontName = "qtds_propertyIconFont.ttf";
const QSize size = QSize(28, 28);
const QIcon visibilityOnIcon =
Utils::StyleHelper::getIconFromIconFont(fontName,
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 QString visibilityOnUnicode = Theme::getIconUnicode(Theme::Icon::visibilityOn);
const QString visibilityOffUnicode = Theme::getIconUnicode(Theme::Icon::visibilityOff);
const QIcon aliasOnIcon =
Utils::StyleHelper::getIconFromIconFont(fontName,
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 QString aliasOnUnicode = Theme::getIconUnicode(Theme::Icon::idAliasOn);
const QString aliasOffUnicode = Theme::getIconUnicode(Theme::Icon::idAliasOff);
const QIcon lockOnIcon =
Utils::StyleHelper::getIconFromIconFont(fontName,
Theme::getIconUnicode(Theme::Icon::lockOn),
20, 20, QColor(Qt::white));
const QIcon lockOffIcon =
Utils::StyleHelper::getIconFromIconFont(fontName,
Theme::getIconUnicode(Theme::Icon::lockOff),
20, 20, QColor(Qt::white));
const QString lockOnUnicode = Theme::getIconUnicode(Theme::Icon::lockOn);
const QString lockOffUnicode = Theme::getIconUnicode(Theme::Icon::lockOff);
auto visibilityIconOffNormal = Utils::StyleHelper::IconFontHelper(
visibilityOffUnicode, Theme::getColor(Theme::DSnavigatorIcon), size, QIcon::Normal, QIcon::Off);
auto visibilityIconOffHover = Utils::StyleHelper::IconFontHelper(
visibilityOffUnicode, Theme::getColor(Theme::DSnavigatorIconHover), size, QIcon::Active, QIcon::Off);
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);
IconCheckboxItemDelegate *visibilityDelegate =
new IconCheckboxItemDelegate(this, visibilityOnIcon, visibilityOffIcon);
IconCheckboxItemDelegate *aliasDelegate =
new IconCheckboxItemDelegate(this, aliasOnIcon, aliasOffIcon);
IconCheckboxItemDelegate *lockDelegate =
new IconCheckboxItemDelegate(this, lockOnIcon, lockOffIcon);
auto visibilityDelegate = new IconCheckboxItemDelegate(this, visibilityIcon);
auto aliasDelegate = new IconCheckboxItemDelegate(this, aliasIcon);
auto lockDelegate = new IconCheckboxItemDelegate(this, lockIcon);
treeWidget()->setItemDelegateForColumn(NavigatorTreeModel::ColumnType::Name, idDelegate);
treeWidget()->setItemDelegateForColumn(NavigatorTreeModel::ColumnType::Alias, aliasDelegate);

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

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