games/vcmi
1
0
Fork 0
mirror of https://github.com/vcmi/vcmi.git synced 2025-08-13 19:54:17 +02:00
Code Issues Releases Activity

Unified common primitive-based UI elements

Browse Source
This commit is contained in:
Ivan Savenko
2024-02-18 22:15:31 +02:00
parent 14e3c762c0
commit ef8ff00973
6 changed files with 116 additions and 105 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
client/gui/InterfaceObjectConfigurable.cpp
View File

@@ -114,8 +114,20 @@ void InterfaceObjectConfigurable::build(const JsonNode &config)
{
if (!config["library"].isNull())
{
const JsonNode library(JsonPath::fromJson(config["library"]));
loadCustomBuilders(library);
if (config["library"].isString())
{
const JsonNode library(JsonPath::fromJson(config["library"]));
loadCustomBuilders(library);
}
if (config["library"].isVector())
{
for (auto const & entry : config["library"].Vector())
{
const JsonNode library(JsonPath::fromJson(entry));
loadCustomBuilders(library);
}
}
}
loadCustomBuilders(config["customTypes"]);
@@ -718,11 +730,16 @@ std::shared_ptr<CIntObject> InterfaceObjectConfigurable::buildGraphicalPrimitive
for (auto const & entry : config["primitives"].Vector())
{
auto color = readColor(entry["color"]);
//auto typeString = entry["type"];
auto typeString = entry["type"].String();
auto pointA = readPosition(entry["a"]);
auto pointB = readPosition(entry["b"]);
widget->addLine(pointA, pointB, color);
if (typeString == "line")
widget->addLine(pointA, pointB, color);
if (typeString == "filledBox")
widget->addBox(pointA, pointB, color);
if (typeString == "rectangle")
widget->addRectangle(pointA, pointB, color);
}
return widget;

2
client/widgets/GraphicalPrimitiveCanvas.h
View File

@@ -13,6 +13,7 @@
class GraphicalPrimitiveCanvas : public CIntObject
{
public:
enum class PrimitiveType
{
LINE,
@@ -20,6 +21,7 @@ class GraphicalPrimitiveCanvas : public CIntObject
FILLED_BOX
};
private:
struct PrimitiveEntry
{
ColorRGBA color;

53
config/widgets/commonPrimitives.json Normal file
View File

@@ -0,0 +1,53 @@
{
"boxWithNoBackground" : {
"type": "graphicalPrimitive",
"primitives" : [
// Top line
{ "type" : "line", "a" : { "x" : 0, "y" : 0}, "b" : { "x" : -1, "y" : 0}, "color" : [ 255, 255, 255, 32 ] },
{ "type" : "line", "a" : { "x" : 0, "y" : 1}, "b" : { "x" : -1, "y" : 1}, "color" : [ 0, 0, 0, 48 ] }
// Left line
{ "type" : "line", "a" : { "x" : 0, "y" : 1}, "b" : { "x" : 0, "y" : -2}, "color" : [ 255, 255, 255, 32 ] },
{ "type" : "line", "a" : { "x" : 1, "y" : 2}, "b" : { "x" : 1, "y" : -2}, "color" : [ 0, 0, 0, 48 ] }
// Right line
{ "type" : "line", "a" : { "x" : -2, "y" : 2}, "b" : { "x" : -2, "y" : -3}, "color" : [ 255, 255, 255, 24 ] },
{ "type" : "line", "a" : { "x" : -1, "y" : 1}, "b" : { "x" : -1, "y" : -2}, "color" : [ 255, 255, 255, 48 ] },
// Bottom line
{ "type" : "line", "a" : { "x" : 1, "y" : -2}, "b" : { "x" : -1, "y" : -2}, "color" : [ 255, 255, 255, 24 ] },
{ "type" : "line", "a" : { "x" : 0, "y" : -1}, "b" : { "x" : -1, "y" : -1}, "color" : [ 255, 255, 255, 48 ] },
]
},
"horizontalLine" : {
"type": "graphicalPrimitive",
"primitives" : [
{ "type" : "line", "a" : { "x" : 0, "y" : 0}, "b" : { "x" : -1, "y" : 0}, "color" : [ 255, 255, 255, 64 ] },
{ "type" : "line", "a" : { "x" : 0, "y" : 1}, "b" : { "x" : -1, "y" : 1}, "color" : [ 0, 0, 0, 64 ] },
]
}
"boxWithBackground" : {
"type": "graphicalPrimitive",
"primitives" : [
{ "type" : "filledBox", "a" : { "x" : 1, "y" : 1}, "b" : { "x" : -2, "y" : -2}, "color" : [ 0, 0, 0, 75 ] },
// Top line
{ "type" : "line", "a" : { "x" : 0, "y" : 0}, "b" : { "x" : -1, "y" : 0}, "color" : [ 255, 255, 255, 32 ] },
{ "type" : "line", "a" : { "x" : 0, "y" : 1}, "b" : { "x" : -1, "y" : 1}, "color" : [ 0, 0, 0, 48 ] }
// Left line
{ "type" : "line", "a" : { "x" : 0, "y" : 1}, "b" : { "x" : 0, "y" : -2}, "color" : [ 255, 255, 255, 32 ] },
{ "type" : "line", "a" : { "x" : 1, "y" : 2}, "b" : { "x" : 1, "y" : -2}, "color" : [ 0, 0, 0, 48 ] }
// Right line
{ "type" : "line", "a" : { "x" : -2, "y" : 2}, "b" : { "x" : -2, "y" : -3}, "color" : [ 255, 255, 255, 24 ] },
{ "type" : "line", "a" : { "x" : -1, "y" : 1}, "b" : { "x" : -1, "y" : -2}, "color" : [ 255, 255, 255, 48 ] },
// Bottom line
{ "type" : "line", "a" : { "x" : 1, "y" : -2}, "b" : { "x" : -1, "y" : -2}, "color" : [ 255, 255, 255, 24 ] },
{ "type" : "line", "a" : { "x" : 0, "y" : -1}, "b" : { "x" : -1, "y" : -1}, "color" : [ 255, 255, 255, 48 ] },
]
},
}

10
config/widgets/extraOptionsTab.json
View File

@@ -37,27 +37,27 @@
},
{
"type": "transparentFilledRectangle",
"rect": {"x": 54, "y": 127, "w": 335, "h": 1},
"rect": {"x": 54, "y": 127, "w": 335, "h": 2},
"color": [24, 41, 90, 255]
},
{
"type": "transparentFilledRectangle",
"rect": {"x": 158, "y": 90, "w": 2, "h": 37},
"rect": {"x": 159, "y": 90, "w": 2, "h": 38},
"color": [24, 41, 90, 255]
},
{
"type": "transparentFilledRectangle",
"rect": {"x": 234, "y": 90, "w": 2, "h": 37},
"rect": {"x": 235, "y": 90, "w": 2, "h": 38},
"color": [24, 41, 90, 255]
},
{
"type": "transparentFilledRectangle",
"rect": {"x": 310, "y": 90, "w": 2, "h": 37},
"rect": {"x": 311, "y": 90, "w": 2, "h": 38},
"color": [24, 41, 90, 255]
},
{
"type": "transparentFilledRectangle",
"rect": {"x": 55, "y": 556, "w": 334, "h": 18},
"rect": {"x": 55, "y": 556, "w": 335, "h": 19},
"color": [24, 41, 90, 255]
},
{

56
config/widgets/mapOverview.json
View File

@@ -1,4 +1,6 @@
{
"library" : "config/widgets/commonPrimitives.json",
"items":
[
{
@@ -8,10 +10,8 @@
"rect": {"w": 428, "h": 379}
},
{
"type": "transparentFilledRectangle",
"rect": {"x": 5, "y": 5, "w": 418, "h": 20},
"color": [0, 0, 0, 75],
"colorLine": [128, 100, 75, 255]
"type": "boxWithBackground",
"rect": {"x": 5, "y": 5, "w": 418, "h": 20}
},
{
"type": "label",
@@ -22,10 +22,8 @@
"position": {"x": 214, "y": 15}
},
{
"type": "transparentFilledRectangle",
"rect": {"x": 5, "y": 30, "w": 418, "h": 20},
"color": [0, 0, 0, 75],
"colorLine": [128, 100, 75, 255]
"type": "boxWithBackground",
"rect": {"x": 5, "y": 30, "w": 418, "h": 20}
},
{
"type": "label",
@@ -37,10 +35,8 @@
"position": {"x": 214, "y": 40}
},
{
"type": "transparentFilledRectangle",
"rect": {"x": 5, "y": 55, "w": 418, "h": 20},
"color": [0, 0, 0, 75],
"colorLine": [128, 100, 75, 255]
"type": "boxWithBackground",
"rect": {"x": 5, "y": 55, "w": 418, "h": 20}
},
{
"type": "label",
@@ -51,10 +47,8 @@
"position": {"x": 214, "y": 65}
},
{
"type": "transparentFilledRectangle",
"rect": {"x": 29, "y": 79, "w": 171, "h": 171},
"color": [0, 0, 0, 255],
"colorLine": [128, 100, 75, 255]
"type": "boxWithBackground",
"rect": {"x": 29, "y": 79, "w": 171, "h": 171}
},
{
"type": "label",
@@ -70,10 +64,8 @@
"rect": {"x": 30, "y": 80, "w": 169, "h": 169}
},
{
"type": "transparentFilledRectangle",
"rect": {"x": 228, "y": 79, "w": 171, "h": 171},
"color": [0, 0, 0, 255],
"colorLine": [128, 100, 75, 255]
"type": "boxWithBackground",
"rect": {"x": 228, "y": 79, "w": 171, "h": 171}
},
{
"type": "label",
@@ -90,10 +82,8 @@
"rect": {"x": 229, "y": 80, "w": 169, "h": 169}
},
{
"type": "transparentFilledRectangle",
"rect": {"x": 5, "y": 254, "w": 418, "h": 20},
"color": [0, 0, 0, 75],
"colorLine": [128, 100, 75, 255]
"type": "boxWithBackground",
"rect": {"x": 5, "y": 254, "w": 418, "h": 20}
},
{
"type": "label",
@@ -104,10 +94,8 @@
"position": {"x": 214, "y": 264}
},
{
"type": "transparentFilledRectangle",
"rect": {"x": 5, "y": 279, "w": 418, "h": 20},
"color": [0, 0, 0, 75],
"colorLine": [128, 100, 75, 255]
"type": "boxWithBackground",
"rect": {"x": 5, "y": 279, "w": 418, "h": 20}
},
{
"type": "label",
@@ -119,10 +107,8 @@
"position": {"x": 214, "y": 289}
},
{
"type": "transparentFilledRectangle",
"rect": {"x": 5, "y": 304, "w": 418, "h": 20},
"color": [0, 0, 0, 75],
"colorLine": [128, 100, 75, 255]
"type": "boxWithBackground",
"rect": {"x": 5, "y": 304, "w": 418, "h": 20}
},
{
"type": "label",
@@ -133,10 +119,8 @@
"position": {"x": 214, "y": 314}
},
{
"type": "transparentFilledRectangle",
"rect": {"x": 5, "y": 329, "w": 418, "h": 45},
"color": [0, 0, 0, 75],
"colorLine": [128, 100, 75, 255]
"type": "boxWithBackground",
"rect": {"x": 5, "y": 329, "w": 418, "h": 45}
},
{
"type": "textBox",

75
config/widgets/turnOptionsTab.json
View File

@@ -1,5 +1,8 @@
{
"library" : "config/widgets/turnOptionsDropdownLibrary.json",
"library" : [
"config/widgets/turnOptionsDropdownLibrary.json",
"config/widgets/commonPrimitives.json",
],
"customTypes" : {
"verticalLayout66" : {
@@ -88,66 +91,18 @@
},
{
"type": "graphicalPrimitive",
"rect": {"x" : 64, "y" : 394, "w": 316, "h": 124},
"primitives" : [
// Top line
{ "type" : "line", "a" : { "x" : 0, "y" : 0}, "b" : { "x" : -1, "y" : 0}, "color" : [ 255, 255, 255, 32 ] },
{ "type" : "line", "a" : { "x" : 0, "y" : 1}, "b" : { "x" : -1, "y" : 1}, "color" : [ 0, 0, 0, 48 ] }
// Left line
{ "type" : "line", "a" : { "x" : 0, "y" : 1}, "b" : { "x" : 0, "y" : -2}, "color" : [ 255, 255, 255, 32 ] },
{ "type" : "line", "a" : { "x" : 1, "y" : 2}, "b" : { "x" : 1, "y" : -2}, "color" : [ 0, 0, 0, 48 ] }
// Right line
{ "type" : "line", "a" : { "x" : -2, "y" : 2}, "b" : { "x" : -2, "y" : -3}, "color" : [ 255, 255, 255, 24 ] },
{ "type" : "line", "a" : { "x" : -1, "y" : 1}, "b" : { "x" : -1, "y" : -2}, "color" : [ 255, 255, 255, 48 ] },
// Central separator
{ "type" : "line", "a" : { "x" : 1, "y" : 22}, "b" : { "x" : -2, "y" : 22}, "color" : [ 255, 255, 255, 64 ] },
{ "type" : "line", "a" : { "x" : 1, "y" : 23}, "b" : { "x" : -2, "y" : 23}, "color" : [ 0, 0, 0, 64 ] },
// 2nd Central separator
{ "type" : "line", "a" : { "x" : 1, "y" : 72}, "b" : { "x" : -2, "y" : 72}, "color" : [ 255, 255, 255, 64 ] },
{ "type" : "line", "a" : { "x" : 1, "y" : 73}, "b" : { "x" : -2, "y" : 73}, "color" : [ 0, 0, 0, 64 ] },
// Bottom line
{ "type" : "line", "a" : { "x" : 1, "y" : -2}, "b" : { "x" : -1, "y" : -2}, "color" : [ 255, 255, 255, 24 ] },
{ "type" : "line", "a" : { "x" : 0, "y" : -1}, "b" : { "x" : -1, "y" : -1}, "color" : [ 255, 255, 255, 48 ] },
]
"type": "boxWithNoBackground",
"rect": {"x" : 64, "y" : 394, "w": 316, "h": 124}
},
// {
// "type": "transparentFilledRectangle",
// "rect": {"x" : 64, "y" : 394, "w": 316, "h": 124},
// "color": [0, 0, 0, 0],
// "colorLine": [64, 80, 128, 128]
// },
// {
// "type": "transparentFilledRectangle",
// "rect": {"x" : 65, "y" : 416, "w": 314, "h": 1},
// "color": [0, 0, 0, 0],
// "colorLine": [80, 96, 160, 128]
// },
// {
// "type": "transparentFilledRectangle",
// "rect": {"x" : 65, "y" : 417, "w": 314, "h": 1},
// "color": [0, 0, 0, 0],
// "colorLine": [32, 40, 128, 128]
// },
// {
// "type": "transparentFilledRectangle",
// "rect": {"x" : 65, "y" : 466, "w": 314, "h": 1},
// "color": [0, 0, 0, 0],
// "colorLine": [80, 96, 160, 128]
// },
// {
// "type": "transparentFilledRectangle",
// "rect": {"x" : 65, "y" : 467, "w": 314, "h": 1},
// "color": [0, 0, 0, 0],
// "colorLine": [32, 40, 128, 128]
// },
{
"type": "horizontalLine",
"rect": {"x" : 65, "y" : 416, "w": 314, "h": 2}
},
{
"type": "horizontalLine",
"rect": {"x" : 65, "y" : 466, "w": 314, "h": 2}
},
{
"type" : "verticalLayout66",
"customType" : "labelTitle",