1 Introduction
There is a customizable settings.json file for the Atlas UI that can be found in the theme folder of your Mendix project.
This how-to will teach you how to do the following:
- Change Atlas UI to Old Mendix UI Framework
- Extend design properties applied in the Web Modeler
2 Extending Design Properties Applied in the Web Modeler
Properties in the Design section of the Web Modeler allow users to change the position and styling of widgets on a page. Atlas UI contains a design properties file that can be extended with your own custom design properties.
You can find the design properties in the theme folder > settings.json file of the Mendix project.
The example below shows the design properties of a "Button"
.
"name"
– the name of the design property"type"
– the type of the design property (for example,Dropdown
orToggle
)"description"
– a brief explanation of the design property"options"
– the array of options that shows the name and CSS class specified in the Sass files for Atlas UI
These design properties are used in the Design section of the Web Modeler.
When you apply a new class in settings.json file, make sure that this class exists in the scss file. For example, the detailed Sass information for buttons can be found in this file: /theme/styles/sass/lib/components/_buttons.scss
3 Changing Atlas UI to Old Mendix UI Framework
If your project’s version is 7.8.0 or lower, you can change Atlas UI framework to the old Mendix UI Framework.
The first line in the settings.json file enables the resources, page templates, and building blocks that are integrated with Atlas UI, the Web Modeler, and the Desktop Modeler:
"pageTemplates" : "WebModeler"
If this line is deleted, the old Mendix UI Framework resources will be loaded in the Mendix Web Modeler and the Desktop Modeler. If you do not want to use Atlas UI, it is possible to delete this line.
You can only switch to the old Mendix UI Framework following the instructions above if your project’s version is 7.8.0 or lower.