Skip to content

Q
qgroundcontrol
Commit 3c877924 authored by Gus Grubba's avatar Gus Grubba
Browse files
Options

Fix inverted order of color definitions when exporting 

Fix overall Palette Window UI
parent 7591e825
Hide whitespace changes
Inline Side-by-side
Showing with 312 additions and 314 deletions
src/QmlControls/QmlTest.qml
View file @ 3c877924
...@@ -13,259 +13,259 @@ Rectangle { ...@@ -13,259 +13,259 @@ Rectangle {
anchors.margins: ScreenTools.defaultFontPixelWidth anchors.margins: ScreenTools.defaultFontPixelWidth
color: "white" color: "white"
property var palette: QGCPalette { colorGroupEnabled: true } property var palette: QGCPalette { colorGroupEnabled: true }
property var enabledPalette: QGCPalette { colorGroupEnabled: true } property var enabledPalette: QGCPalette { colorGroupEnabled: true }
property var disabledPalette: QGCPalette { colorGroupEnabled: false } property var disabledPalette: QGCPalette { colorGroupEnabled: false }
function exportPaletteColors(pal) {
var objToExport = {}
for(var clrName in pal) {
if(pal[clrName].r !== undefined) {
objToExport[clrName] = pal[clrName].toString();
}
}
return objToExport;
}
QGCFlickable { function fillPalette(pal, colorsObj) {
anchors.fill: parent for(var clrName in colorsObj) {
contentWidth: _rootCol.width pal[clrName] = colorsObj[clrName];
contentHeight: _rootCol.height }
clip: true }
Column { function exportTheme() {
id: _rootCol var themeObj = {"light": {}, "dark":{}}
var oldTheme = palette.globalTheme;
Rectangle { palette.globalTheme = QGCPalette.Light
id: _header palette.colorGroupEnabled = true
width: parent.width themeObj.light["enabled"] = exportPaletteColors(palette);
height: themeChoice.height * 2 palette.colorGroupEnabled = false
color: palette.window themeObj.light["disabled"] = exportPaletteColors(palette);
QGCLabel { palette.globalTheme = QGCPalette.Dark
id: windowColorLabel palette.colorGroupEnabled = true
text: qsTr("Window Color") themeObj.dark["enabled"] = exportPaletteColors(palette);
anchors.left: parent.left palette.colorGroupEnabled = false
anchors.leftMargin: 20 themeObj.dark["disabled"] = exportPaletteColors(palette);
}
function exportPaletteColors(pal) { palette.globalTheme = oldTheme;
var objToExport = {} palette.colorGroupEnabled = true;
for(var clrName in pal) {
if(pal[clrName].r !== undefined) {
objToExport[clrName] = pal[clrName].toString();
}
}
return objToExport;
}
function fillPalette(pal, colorsObj) {
for(var clrName in colorsObj) {
pal[clrName] = colorsObj[clrName];
}
}
function exportTheme() { var jsonString = JSON.stringify(themeObj, null, 4);
var themeObj = {"light": {}, "dark":{}}
var oldTheme = palette.globalTheme;
palette.globalTheme = QGCPalette.Light themeImportExportEdit.text = jsonString
palette.colorGroupEnabled = true }
themeObj.light["enabled"] = exportPaletteColors(palette);
palette.colorGroupEnabled = false
themeObj.light["disabled"] = exportPaletteColors(palette);
palette.globalTheme = QGCPalette.Dark
palette.colorGroupEnabled = true
themeObj.dark["enabled"] = exportPaletteColors(palette);
palette.colorGroupEnabled = false
themeObj.dark["disabled"] = exportPaletteColors(palette);
palette.globalTheme = oldTheme; function exportThemeCPP() {
palette.colorGroupEnabled = true; var palToExport = ""
for(var i = 0; i < palette.colors.length; i++) {
var cs = palette.colors[i]
var csc = cs + 'Colors'
palToExport += 'DECLARE_QGC_COLOR(' + cs + ', \"' + palette[csc][1] + '\", \"' + palette[csc][0] + '\", \"' + palette[csc][3] + '\", \"' + palette[csc][2] + '\")\n'
}
themeImportExportEdit.text = palToExport
}
var jsonString = JSON.stringify(themeObj, null, 4); function exportThemePlugin() {
var palToExport = ""
for(var i = 0; i < palette.colors.length; i++) {
var cs = palette.colors[i]
var csc = cs + 'Colors'
if(i > 0) {
palToExport += '\nelse '
}
palToExport +=
'if (colorName == QStringLiteral(\"' + cs + '\")) {\n' +
' colorInfo[QGCPalette::Dark][QGCPalette::ColorGroupEnabled] = QColor(\"' + palette[csc][2] + '\");\n' +
' colorInfo[QGCPalette::Dark][QGCPalette::ColorGroupDisabled] = QColor(\"' + palette[csc][3] + '\");\n' +
' colorInfo[QGCPalette::Light][QGCPalette::ColorGroupEnabled] = QColor(\"' + palette[csc][0] + '\");\n' +
' colorInfo[QGCPalette::Light][QGCPalette::ColorGroupDisabled] = QColor(\"' + palette[csc][1] + '\");\n' +
'}'
}
themeImportExportEdit.text = palToExport
}
themeImportExportEdit.text = jsonString function importTheme(jsonStr) {
} var jsonObj = JSON.parse(jsonStr)
var themeObj = {"light": {}, "dark":{}}
var oldTheme = palette.globalTheme;
palette.globalTheme = QGCPalette.Light
palette.colorGroupEnabled = true
fillPalette(palette, jsonObj.light.enabled)
palette.colorGroupEnabled = false
fillPalette(palette, jsonObj.light.disabled);
palette.globalTheme = QGCPalette.Dark
palette.colorGroupEnabled = true
fillPalette(palette, jsonObj.dark.enabled);
palette.colorGroupEnabled = false
fillPalette(palette, jsonObj.dark.disabled);
palette.globalTheme = oldTheme;
palette.colorGroupEnabled = true;
paletteImportExportPopup.close()
}
function exportThemeCPP() { //-------------------------------------------------------------------------
var palToExport = "" //-- Export/Import
for(var i = 0; i < palette.colors.length; i++) { Popup {
var cs = palette.colors[i] id: paletteImportExportPopup
var csc = cs + 'Colors' width: impCol.width + (ScreenTools.defaultFontPixelWidth * 4)
palToExport += 'DECLARE_QGC_COLOR(' + cs + ', \"' + palette[csc][0] + '\", \"' + palette[csc][1] + '\", \"' + palette[csc][2] + '\", \"' + palette[csc][3] + '\")\n' height: impCol.height + (ScreenTools.defaultFontPixelHeight * 2)
} modal: true
themeImportExportEdit.text = palToExport focus: true
parent: Overlay.overlay
closePolicy: Popup.CloseOnEscape | Popup.CloseOnPressOutside
x: Math.round((mainWindow.width - width) * 0.5)
y: Math.round((mainWindow.height - height) * 0.5)
onVisibleChanged: {
if(visible) {
exportTheme()
_jsonButton.checked = true
}
}
background: Rectangle {
anchors.fill: parent
color: palette.window
radius: ScreenTools.defaultFontPixelHeight * 0.5
border.width: 1
border.color: palette.text
}
Column {
id: impCol
spacing: ScreenTools.defaultFontPixelHeight
anchors.centerIn: parent
Row {
id: exportFormats
spacing: ScreenTools.defaultFontPixelWidth * 2
anchors.horizontalCenter: parent.horizontalCenter
QGCRadioButton {
id: _jsonButton
text: "Json"
onClicked: exportTheme()
} }
QGCRadioButton {
function exportThemePlugin() { text: "QGC"
var palToExport = "" onClicked: exportThemeCPP()
for(var i = 0; i < palette.colors.length; i++) {
var cs = palette.colors[i]
var csc = cs + 'Colors'
if(i > 0) {
palToExport += '\nelse '
}
palToExport +=
'if (colorName == QStringLiteral(\"' + cs + '\")) {\n' +
' colorInfo[QGCPalette::Dark][QGCPalette::ColorGroupEnabled] = QColor(\"' + palette[csc][0] + '\");\n' +
' colorInfo[QGCPalette::Dark][QGCPalette::ColorGroupDisabled] = QColor(\"' + palette[csc][1] + '\");\n' +
' colorInfo[QGCPalette::Light][QGCPalette::ColorGroupEnabled] = QColor(\"' + palette[csc][2] + '\");\n' +
' colorInfo[QGCPalette::Light][QGCPalette::ColorGroupDisabled] = QColor(\"' + palette[csc][3] + '\");\n' +
'}'
}
themeImportExportEdit.text = palToExport
} }
QGCRadioButton {
function importTheme(jsonStr) { text: "Custom Plugin"
var jsonObj = JSON.parse(jsonStr) onClicked: exportThemePlugin()
var themeObj = {"light": {}, "dark":{}}
var oldTheme = palette.globalTheme;
palette.globalTheme = QGCPalette.Light
palette.colorGroupEnabled = true
fillPalette(palette, jsonObj.light.enabled)
palette.colorGroupEnabled = false
fillPalette(palette, jsonObj.light.disabled);
palette.globalTheme = QGCPalette.Dark
palette.colorGroupEnabled = true
fillPalette(palette, jsonObj.dark.enabled);
palette.colorGroupEnabled = false
fillPalette(palette, jsonObj.dark.disabled);
palette.globalTheme = oldTheme;
palette.colorGroupEnabled = true;
paletteImportExportPopup.close()
} }
}
Popup { Rectangle {
id: paletteImportExportPopup width: flick.width + (ScreenTools.defaultFontPixelWidth * 2)
width: impCol.width + (ScreenTools.defaultFontPixelWidth * 4) height: flick.height + (ScreenTools.defaultFontPixelHeight * 2)
height: impCol.height + (ScreenTools.defaultFontPixelHeight * 2) color: "white"
modal: true anchors.margins: 10
focus: true Flickable {
parent: Overlay.overlay id: flick
closePolicy: Popup.CloseOnEscape | Popup.CloseOnPressOutside clip: true
x: Math.round((mainWindow.width - width) * 0.5) width: mainWindow.width * 0.666
y: Math.round((mainWindow.height - height) * 0.5) height: mainWindow.height * 0.666
onVisibleChanged: { contentWidth: themeImportExportEdit.paintedWidth
if(visible) { contentHeight: themeImportExportEdit.paintedHeight
_header.exportTheme() anchors.centerIn: parent
_jsonButton.checked = true flickableDirection: Flickable.VerticalFlick
}
function ensureVisible(r)
{
if (contentX >= r.x)
contentX = r.x;
else if (contentX+width <= r.x+r.width)
contentX = r.x+r.width-width;
if (contentY >= r.y)
contentY = r.y;
else if (contentY+height <= r.y+r.height)
contentY = r.y+r.height-height;
} }
background: Rectangle {
anchors.fill: parent TextEdit {
color: palette.window id: themeImportExportEdit
radius: ScreenTools.defaultFontPixelHeight * 0.5 width: flick.width
border.width: 1 focus: true
border.color: palette.text font.family: ScreenTools.fixedFontFamily
font.pointSize: ScreenTools.defaultFontPointSize
onCursorRectangleChanged: flick.ensureVisible(cursorRectangle)
} }
Column { }
id: impCol }
spacing: ScreenTools.defaultFontPixelHeight Row {
anchors.centerIn: parent spacing: ScreenTools.defaultFontPixelWidth * 2
Row { anchors.horizontalCenter: parent.horizontalCenter
id: exportFormats QGCButton {
spacing: ScreenTools.defaultFontPixelWidth * 2 id: importButton
anchors.horizontalCenter: parent.horizontalCenter text: "Import (Json Only)"
QGCRadioButton { enabled: themeImportExportEdit.text[0] === "{" && _jsonButton.checked
id: _jsonButton onClicked: {
text: "Json" importTheme(themeImportExportEdit.text);
onClicked: _header.exportTheme()
}
QGCRadioButton {
text: "QGC"
onClicked: _header.exportThemeCPP()
}
QGCRadioButton {
text: "Custom Plugin"
onClicked: _header.exportThemePlugin()
}
}
Rectangle {
width: flick.width + (ScreenTools.defaultFontPixelWidth * 2)
height: flick.height + (ScreenTools.defaultFontPixelHeight * 2)
color: "white"
anchors.margins: 10
Flickable {
id: flick
clip: true
width: mainWindow.width * 0.666
height: mainWindow.height * 0.666
contentWidth: themeImportExportEdit.paintedWidth
contentHeight: themeImportExportEdit.paintedHeight
anchors.centerIn: parent
flickableDirection: Flickable.VerticalFlick
function ensureVisible(r)
{
if (contentX >= r.x)
contentX = r.x;
else if (contentX+width <= r.x+r.width)
contentX = r.x+r.width-width;
if (contentY >= r.y)
contentY = r.y;
else if (contentY+height <= r.y+r.height)
contentY = r.y+r.height-height;
}
TextEdit {
id: themeImportExportEdit
width: flick.width
focus: true
font.family: ScreenTools.fixedFontFamily
font.pointSize: ScreenTools.defaultFontPointSize
onCursorRectangleChanged: flick.ensureVisible(cursorRectangle)
}
}
}
Row {
spacing: ScreenTools.defaultFontPixelWidth * 2
anchors.horizontalCenter: parent.horizontalCenter
QGCButton {
id: importButton
text: "Import (Json Only)"
enabled: themeImportExportEdit.text[0] === "{" && _jsonButton.checked
onClicked: {
_header.importTheme(themeImportExportEdit.text);
}
}
QGCButton {
text: "Close"
onClicked: {
paletteImportExportPopup.close()
}
}
}
} }
} }
QGCButton {
Button { text: "Close"
id: exportButton onClicked: {
text: "Import/Export" paletteImportExportPopup.close()
width: 200 }
height: 30
anchors.left: windowColorLabel.right
anchors.leftMargin: 20
onPressed: paletteImportExportPopup.open()
} }
}
}
}
Row { //-------------------------------------------------------------------------
id: themeChoice //-- Header
anchors.centerIn: parent Rectangle {
anchors.margins: 20 id: _header
spacing: 20 width: parent.width
height: themeChoice.height * 2
ButtonGroup { id: themeGroup; exclusive: true } color: palette.window
QGCRadioButton { anchors.top: parent.top
text: qsTr("Light") Row {
checked: palette.globalTheme === QGCPalette.Light id: themeChoice
ButtonGroup.group: themeGroup spacing: 20
onClicked: { palette.globalTheme = QGCPalette.Light } anchors.centerIn: parent
QGCLabel {
text: qsTr("Window Color")
anchors.verticalCenter: parent.verticalCenter
}
QGCButton {
text: qsTr("Import/Export")
anchors.verticalCenter: parent.verticalCenter
onClicked: paletteImportExportPopup.open()
}
Row {
spacing: 20
anchors.verticalCenter: parent.verticalCenter
QGCRadioButton {
text: qsTr("Light")
checked: _root.palette.globalTheme === QGCPalette.Light
onClicked: {
_root.palette.globalTheme = QGCPalette.Light
} }
QGCRadioButton { }
text: qsTr("Dark") QGCRadioButton {
checked: palette.globalTheme === QGCPalette.Dark text: qsTr("Dark")
ButtonGroup.group: themeGroup checked: _root.palette.globalTheme === QGCPalette.Dark
onClicked: { palette.globalTheme = QGCPalette.Dark } onClicked: {
_root.palette.globalTheme = QGCPalette.Dark
} }
} }
} }
}
}
//-------------------------------------------------------------------------
//-- Main Contents
QGCFlickable {
anchors.top: _header.bottom
anchors.bottom: parent.bottom
width: parent.width
contentWidth: _rootCol.width
contentHeight: _rootCol.height
clip: true
Column {
id: _rootCol
Row { Row {
spacing: 30 spacing: 30
// Edit theme GroupBox // Edit theme GroupBox
GroupBox { GroupBox {
title: "Preview and edit theme" title: "Preview and edit theme"
...@@ -377,24 +377,6 @@ Rectangle { ...@@ -377,24 +377,6 @@ Rectangle {
columns: 3 columns: 3
spacing: 10 spacing: 10
Component {
id: ctlRowHeader
Rectangle {
width: ctlPrevColumn._colWidth
height: ctlPrevColumn._height
color: "white"
Text {
anchors.fill: parent
horizontalAlignment: Text.AlignRight
verticalAlignment: Text.AlignVCenter
color: "black"
text: parent.parent.text
}
}
}
// Header row // Header row
Text { Text {
width: ctlPrevColumn._colWidth width: ctlPrevColumn._colWidth
...@@ -660,74 +642,6 @@ Rectangle { ...@@ -660,74 +642,6 @@ Rectangle {
width: 1; width: 1;
} }
Component {
id: arbBox
Rectangle {
width: arbGrid.width * 1.5
height: arbGrid.height * 1.5
color: backgroundColor
border.color: qgcPal.text
border.width: 1
anchors.horizontalCenter: parent.horizontalCenter
GridLayout {
id: arbGrid
columns: 4
rowSpacing: 10
anchors.centerIn: parent
QGCColoredImage {
color: qgcPal.colorGreen
width: ScreenTools.defaultFontPixelWidth * 2
height: width
sourceSize.height: width
mipmap: true
fillMode: Image.PreserveAspectFit
source: "/qmlimages/Gears.svg"
}
Label { text: "colorGreen"; color: qgcPal.colorGreen; }
QGCColoredImage {
color: qgcPal.colorOrange
width: ScreenTools.defaultFontPixelWidth * 2
height: width
sourceSize.height: width
mipmap: true
fillMode: Image.PreserveAspectFit
source: "/qmlimages/Gears.svg"
}
Label { text: "colorOrange"; color: qgcPal.colorOrange; }
QGCColoredImage {
color: qgcPal.colorRed
width: ScreenTools.defaultFontPixelWidth * 2
height: width
sourceSize.height: width
mipmap: true
fillMode: Image.PreserveAspectFit
source: "/qmlimages/Gears.svg"
}
Label { text: "colorRed"; color: qgcPal.colorRed; }
QGCColoredImage {
color: qgcPal.colorGrey
width: ScreenTools.defaultFontPixelWidth * 2
height: width
sourceSize.height: width
mipmap: true
fillMode: Image.PreserveAspectFit
source: "/qmlimages/Gears.svg"
}
Label { text: "colorGrey"; color: qgcPal.colorGrey; }
QGCColoredImage {
color: qgcPal.colorBlue
width: ScreenTools.defaultFontPixelWidth * 2
height: width
sourceSize.height: width
mipmap: true
fillMode: Image.PreserveAspectFit
source: "/qmlimages/Gears.svg"
}
Label { text: "colorBlue"; color: qgcPal.colorBlue; }
}
}
}
Row { Row {
spacing: 10 spacing: 10
anchors.horizontalCenter: parent.horizontalCenter anchors.horizontalCenter: parent.horizontalCenter
...@@ -748,4 +662,88 @@ Rectangle { ...@@ -748,4 +662,88 @@ Rectangle {
} }
} }
Component {
id: ctlRowHeader
Rectangle {
width: ctlPrevColumn._colWidth
height: ctlPrevColumn._height
color: "white"
Text {
color: "black"
text: parent.parent.text
anchors.fill: parent
horizontalAlignment: Text.AlignRight
verticalAlignment: Text.AlignVCenter
}
}
}
Component {
id: arbBox
Rectangle {
width: arbGrid.width * 1.5
height: arbGrid.height * 1.5
color: backgroundColor
border.color: qgcPal.text
border.width: 1
anchors.horizontalCenter: parent.horizontalCenter
GridLayout {
id: arbGrid
columns: 4
rowSpacing: 10
anchors.centerIn: parent
QGCColoredImage {
color: qgcPal.colorGreen
width: ScreenTools.defaultFontPixelWidth * 2
height: width
sourceSize.height: width
mipmap: true
fillMode: Image.PreserveAspectFit
source: "/qmlimages/Gears.svg"
}
Label { text: "colorGreen"; color: qgcPal.colorGreen; }
QGCColoredImage {
color: qgcPal.colorOrange
width: ScreenTools.defaultFontPixelWidth * 2
height: width
sourceSize.height: width
mipmap: true
fillMode: Image.PreserveAspectFit
source: "/qmlimages/Gears.svg"
}
Label { text: "colorOrange"; color: qgcPal.colorOrange; }
QGCColoredImage {
color: qgcPal.colorRed
width: ScreenTools.defaultFontPixelWidth * 2
height: width
sourceSize.height: width
mipmap: true
fillMode: Image.PreserveAspectFit
source: "/qmlimages/Gears.svg"
}
Label { text: "colorRed"; color: qgcPal.colorRed; }
QGCColoredImage {
color: qgcPal.colorGrey
width: ScreenTools.defaultFontPixelWidth * 2
height: width
sourceSize.height: width
mipmap: true
fillMode: Image.PreserveAspectFit
source: "/qmlimages/Gears.svg"
}
Label { text: "colorGrey"; color: qgcPal.colorGrey; }
QGCColoredImage {
color: qgcPal.colorBlue
width: ScreenTools.defaultFontPixelWidth * 2
height: width
sourceSize.height: width
mipmap: true
fillMode: Image.PreserveAspectFit
source: "/qmlimages/Gears.svg"
}
Label { text: "colorBlue"; color: qgcPal.colorBlue; }
}
}
}
} }
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment