External Json

The Chameleon UI .json file can reference other json files.¶

In the previous introduction Buttons, we mentioned using external json files to introduce button code. This allows for code reuse.

ExternalJson¶

TIP
Nested references are supported, but circular references need to be avoided

For example, the following JSON file is equivalent to copying and replacing the contents of the "ZeldaWorldMapEditor_Buttons.json" file with the line "ExternalJson": "ZeldaWorldMapEditor_Buttons.json"

{
    "autoWidth": true,
    "SBox": {
        "WidthOverride": 480,
        "Content": {
            "ExternalJson": "ZeldaWorldMapEditor_Buttons.json"
        }
    }
}

Since it is text replacement, only ensure that the resulting JSON file is valid.

Multiple Inclusions¶

Additionally, you can also include an ExternalJson multiple times to use the same ExternalJson in different locations, for example:

"SBorder": {
    "BorderImage": {
        "Style": "FEditorStyle",
        "Brush": "ToolPanel.DarkGroupBorder"
    },
    "Content":{
        "SVerticalBox":
        {
            "Slots": [
                {
                    "ExternalJson": "ZeldaWorldMapEditor_Buttons.json"
                },
                {
                    "ExternalJson": "ZeldaWorldMapEditor_Buttons.json"
                },
                {
                    "ExternalJson": "ZeldaWorldMapEditor_Buttons.json"
                }
            ]
        }
    }
}

This way, we can avoid repeating the same code in multiple places.

Differentiate Button Click Events¶

When I need to distinguish which specific button an SButton click event comes from, we can obtain it through the variable placeholder: %widgetPath. For more details, see SButton OnClick.

Note
Now %widgetPath only supports SButton widget

Summary¶

Pros:¶

• Reduce the complexity and size of a single json file
• Reuse part of the UI code

Cons:¶

• The UI json files become less intuitive and more obscure
• The Widget path logged in the console window is not the same as the Json crumb path shown in PyCharm. As PyCharm doesn't know that another json content has been "imported" here.

Recommendation¶

• Put the repetitive ui code (such as 16x16 map buttons) or the ui code which generated by other script into an "external" json file.