Page History
...
| Code Block | ||||
|---|---|---|---|---|
| ||||
{
"name": String layout name,
"displayName": String more descriptive name that is shown in the designer,
"version": the version, the same as for the components (integer),
"definition": A reference to the json file of this layout,
"icon": A reference to the icon shown in designer,
"contains": ["Specifies an array of components/layouts which can be added to this layout container"],
"excludes": ["Used to specify that a layout can contain any component or layout except this list.
If present, the 'contains' property is ignored.
See the column.spec example below for more details."]
"topContainer": Used to determine whether this layout container can be added directly into the root of the form,
"tagType":The tag type for HTML output. The default value is 'div',
"model": {
"propertyName": type description, optional default value - the model properties are generated
on the tag as HTML attributes
"tagType": "string" // optional attribute if the tagType should be configurable in the developer
}
} |
...
It is worth to mention that the 'tagType' property is a bit more special. It is a top level property which specifies the default value for the tagType, but it can also be a model property. In this case, it shows in the properties view and the user is able to change its value.
The json config file is for the default properties (class="row") which are not changeable by the servoy developer (if the model area of the spec file doesn't specify them) but also for making composite layouts, so you can drop full structures at once.
...
| Code Block | ||||
|---|---|---|---|---|
| ||||
{
"layoutName":"row",
"class":"row",
"children" : [
{
"layoutName":"column",
"model": {
"class":"col-md-4"
}
},
{
"layoutName":"column",
"model": {
"class":"col-md-4"
}
},
{
"layoutName":"column",
"model": {
"class":"col-md-4"
}
}
]
} |
In the following example, it is specified that the 'column' layout can contain any component or layout except the one named "container" (from any package).
| Code Block | ||||
|---|---|---|---|---|
| ||||
{
{
"name": "column",
"displayName": "Column",
"version": 1,
"icon": "12grid/column.png",
"definition": "column.json",
"excludes": ["container"],
"model": {
}
}
} |
We can also disallow adding any component with "excludes": ["component"]. However, if we want to allow all components but a specific one, then we need to use the "contains" property instead of "excludes", in which we enumerate all possible components that this layout accepts.
Overview
Content Tools
Activity