-/**
- *
+<!--
+/**-->
+
[TOC]
# DALi JSON Specification {#script-json-specification}
## Overview {#overview}
-This document describes the Dali JSON specification.
+This document describes the DALi JSON specification.
The format is not yet formally versioned within the JSON.
# General format {#format}
Concrete Actors and Controls can be created from types registered in the
-Dali Type Registry.
+DALi Type Registry.
Template, style and scene sections all configure Actors and Controls via
-the Dali property system.
+the DALi property system.
The JSON format deviates from the formal JSON specification and allows C style comments.
"stage": // Stage section
[ //
{ // Actors|Controls to create on JSON file load
- "type": "basic-text", // A Dali Control or a template name
+ "type": "basic-text", // A DALi Control or a template name
"styles":["base-theme","light-theme"] // Style list to apply to this instance
} //
] //
## Includes {#includes}
-The "includes" section is an array of filenames to be merged in order to
+The "includes" section is an array of file names to be merged in order to
create a final in memory JSON tree.
The merge process will walk key, value attributes from the root JSON
}, //
... //
{ //
- "type":"ImageActor" // An Dali type or a template name
+ "type":"ImageView" // An DALi type or a template name
"image": //
{ //
- "filename":"{IMAGES}b.jpg" // Image filename substring replacement
+ "url":"{IMAGES}b.jpg" // Image filename substring replacement
}, //
"size": "{SIZE}" //
} // Property replacement
The template section supports the creation of actor instances. The
template name can be used in code to create an actor tree.
-~~~
+~~~{.cpp}
+// C++
+
+Builder builder = Builder::New();
+std::string jsonData = loadFile("my-app.json");
+builder.LoadFromString( jsonData );
+
actorTree = builder.Create("basic-text");
~~~
Templates consist of a name, multiple property-value configurations and
an optional actor sub hierarchy.
-~~~
+~~~{.json}
{ //
"templates": // Template library section
{ //
"basic-text": // The template name
{ //
- "type":"ImageActor", // Concrete Dali Type/Class to create
+ "type":"ImageView", // Concrete DALi Type/Class to create
"styles":["base-style"], // Style list to apply
"name":"image", // }
"image": // } property name : value
{ // }
- "filename":"{IMAGES}/b.jpg" //
+ "url":"{IMAGES}/b.jpg" //
}, //
- "parent-origin": "CENTER" //
+ "parentOrigin": "CENTER" //
... //
"actors": // A tree of sub actors
[ //
"type":"TextView" //
"name":"text", //
"text":"Hello World", //
- "parent-origin": "CENTER", //
+ "parentOrigin": "CENTER", //
} //
] //
} //
~~~
A template has a special 'type' property which must contain a concrete
-Dali Actor or Control type name.
+DALi Actor or Control type name.
A template has a special 'styles' property which contains a list of
styles to apply when creating using the template.
The styles section supports a named set of properties that can be
applied to an actor or actor tree.
-~~~
+~~~{.cpp}
+// C++
+
Builder.ApplyStyle("light-theme", myActor);
~~~
The styles can also be applied as an animation.
-~~~
+~~~{.cpp}
Builder.AnimateTo("light-theme", myActor, TimePeriod(0, 10));
~~~
+
+
~~~
{ //
"styles": // Style set section
~~~
When applied to an actor tree the actors are referenced by name. Names
-are not unique in Dali.
+are not unique in DALi.
-When a style is applied in code Dali will perform a depth first search
+When a style is applied in code DALi will perform a depth first search
stopping with the first matching name.
Typically an application developer will apply the style to the template
{ //
"duration": 10, // Duration in seconds
"loop": false, // Whether to loop.
- "end-action": "Bake", // Whether to set final value(bake) or
+ "endAction": "Bake", // Whether to set final value(bake) or
// reset
- "disconnect-aciton": "Discard", // Whether 'Bake' or 'Discard' when disconnected
+ "disconnectAction": "Discard", // Whether 'Bake' or 'Discard' when disconnected
"properties":
[
// Properties changed in this animation
"actor":"image", // Actor found by name from the stage
"property":"rotation", // Property to change
"value":[0, 0.1, 0, 0], // Value to set
- "alpha-function": "EASE\_IN\_OUT", // Interpolation function
+ "alphaFunction": "EASE\_IN\_OUT", // Interpolation function
//
- "time-period": // Time period for change
+ "timePeriod": // Time period for change
{"delay": 0,
"duration": 3
}
Paths are defined in a top level path section and referenced by the
animation property.
-~~~~
+~~~
{ //
"paths": // Path library
{ //
[190.0,-150.0,0.0]
],
// curvature automatically creates
- "curvature":0.35, // control-points
+ "curvature":0.35, // controlPoints
//
- "control-points": [...] // Otherwise control-points can be
+ "controlPoints": [...] // Otherwise controlPoints can be
// directly specified.
} //
}, //
"animations": //
{ //
- "path-animation":
+ "pathAnimation":
{
"duration": 3.0,
"properties":
"path":"path0", // animation.
"forward":[1,0,0], // Forward vector specifies orientation
// whilst travelling along the path
- "alpha-function": "EASE\_IN\_OUT", // (optional)
- "time-period":
+ "alphaFunction": "EASE\_IN\_OUT", // (optional)
+ "timePeriod":
{
"delay": 0,
"duration": 3
// animation.
}, //
} //
-~~~~
-
-## Shaders {#shaders}
-
-The shader section of the JSON file defines a library of shader effect
-instances that are created on demand.
-
-The shaders are referred to by name from the template, style, stage or
-animation sections.
-
-Multiple actors can set the same shader as the name refers to a single
-instance.
-
-Similarly one named shader instance can be set to several actors and can
-be animated by one animation.
-
-~~~~
- { //
- "shader-effects": // Shader Effect section
- { //
- "myshader1": // Shader instance name
- { //
- "program": //
- { // Prefixs are placed before DALi uniforms.
- "vertexPrefix": "", // (Useful for \#defines.)
- "vertex":"", // Glsl vertex program
- "fragmentPrefix": "",
- "fragment": "", // Glsl fragment program.
- "geometry-type": "GEOMETRY_TYPE_IMAGE", // Geometry type(see DALi documentation)
- },
- "geometry-hints": "HINT_NONE": // Geometry hints (see DALi documentation)
- "grid-density": 0, // Grid density(see DALi documentation)
- "image":
- {
- "filename": "" // Effect image available as a second texture unit.
- }
- },
- ...
- },
- "stage":
- [{
- "type": "ImageActor",
- "effect": "myshader1",
- ...
- }]
- }
-~~~~
+~~~
At least one of the vertex or fragment fields is mandatory. All
other fields are optional will use internal defaults.
When the animation is created from code (or from a signal) the property
name search begins on the actor, if it isn't found the search continues
-on the attached shader object.
+on the attached renderer, and then on the attached shader object.
The actor property names and shader uniform names must not clash for the
-uniform to animate correctly. The convention in DALi is to prepend
-uniforms with 'u'.
+uniform to animate correctly.
-~~~~
- { \\
- "animations": \\ Animation library
- { \\
- "rotate": \\ An Animation named rotate
- { \\
- "duration": 10, \\
- "properties": \\ Properties changed in this animation
- [ \\
- {
- "actor":"image", \\ Actor found by name from the stage
- "property":"uTranslate", \\ Uniform name specified as if it is a
- \\ property of the object.
- "value":[10, 20],
- ...
- },
- ...
- ]
- },
- "shader-effects":
- {
- "myshader1":
- {
- \\ Shader program with uniform
- "program": {...} \\ "uTranslate"
- }
- },
- "actors":
- [
- {
- "name": "image",
- "effect": "myshader1" \\ Actor using shader effect instance
- \\ "myshader1"
- }
- ]
+The actor needs to register the uniform properties as custom animatable
+properties.
+
+~~~
+{
+ "animations":
+ {
+ "rotate": \\ An Animation named rotate
+ {
+ "properties": \\ Properties changed in this animation
+ [
+ {
+ "actor": "image", \\ Actor found by name from the stage
+ "property": "uTranslate", \\ Uniform name specified as if it is a property of the object
+ "value": [10, 20], \\ Target value of uniform
+ ...
+ }
+ ]
},
-~~~~
+ ...
+ },
+ "stage":
+ [
+ {
+ "type": "ImageView",
+ "name": "image", \\ Name of the actor
+ ...
+ "image":
+ {
+ ...
+ "shader": \\ ImageView has a shader property where we can set a custom shader
+ {
+ "vertexShader": "..." \\ Vertex shader with uniform "uTranslate"
+ }
+ },
+ "animatableProperties": \\ Custom properties that the actor needs to register
+ {
+ "uTranslate": [0, 0] \\ The name should match the uniform we want to animate
+ },
+ ...
+ },
+ ...
+ ]
+}
+~~~
## Stage {#stage}
The stage section supports the immediate creation of actors at the time
the JSON is loaded.
-The stage is a tree of actors that can be added to Dali's stage object.
+The stage is a tree of actors that can be added to DALi's stage object.
~~~
+// C++
builder = Dali.Builder();
json_text = load("layout.json");
builder.Load(json\_text);
"stage": \\ Stage Section Number
[ \\ An array of actors
{
- "type": "ImageActor",
+ "type": "ImageView",
...
"actors": \\ Each actor can have children
\\ creating a tree
{
"type": "TextView",
\\ The Type to create; this can be a
- ... \\ concrete Dali type (actor/control)
+ ... \\ concrete DALi type (actor/control)
\\ or a template name.
"styles": ["base-style"]
\\ A list of styles to apply to the
# Actor and Control Properties {#actorprop}
-Each control has a set of supported properties documented in the "Dali
+Each control has a set of supported properties documented in the "DALi
UI Control Specification".
Please refer to the above document for further information about specific
controls.
-@class ScriptJsonSpecification
*/