+ [Border](@ref border-visual)
+ [Mesh](@ref mesh-visual)
+ [Primitive](@ref primitive-visual)
+ + [Text](@ref text-visual)
+ [Wireframe](@ref wireframe-visual)
Controls can provide properties that allow users to specify the visual type ( visualType ).
Visuals have a **transform** field in the property map to allow layouting within a control. If this field is not set, then the visual defaults to filling the control. The **transform** field has a property map with the following keys:
-| Property | String | Type | Required | Description |
-|-------------------------------------------------|----------|:-------:|:--------:|---------------------------|
-| Dali::Toolkit::Visual::Transform::Property::OFFSET | offset | VECTOR2 | No | The offset of the visual. |
-| Dali::Toolkit::Visual::Transform::Property::SIZE | size | VECTOR2 | No | The size of the visual. |
-| Dali::Toolkit::Visual::Transform::Property::OFFSET_SIZE_MODE | offsetSizeMode | VECTOR4 | No | Whether the size or offset components are Relative or Absolute [More info](@ref offset-size-mode)|
-| Dali::Toolkit::Visual::Transform::Property::ORIGIN | origin | INTEGER or STRING | No | The origin of the visual within the control's area. [More info](@ref align-type) |
-| Dali::Toolkit::Visual::Transform::Property::ANCHOR_POINT | anchorPoint | INTEGER or STRING | No | The anchor point of the visual. [More info](@ref align-type)|
+| Property | String | Type | Required | Description |
+|----------------------------------------------------------------|--------------|:-----------------:|:--------:|---------------------------------------------------------------------------------------------|
+| Dali::Toolkit::Visual::Transform::Property::OFFSET | offset | VECTOR2 | No | The offset of the visual. |
+| Dali::Toolkit::Visual::Transform::Property::SIZE | size | VECTOR2 | No | The size of the visual. |
+| Dali::Toolkit::Visual::Transform::Property::OFFSET_POLICY | offsetPolicy | VECTOR4 | No | Whether the offset components are Relative or Absolute [More info](@ref offset-size-policy) |
+| Dali::Toolkit::Visual::Transform::Property::SIZE_POLICY | sizePolicy | VECTOR4 | No | Whether the size components are Relative or Absolute [More info](@ref offset-size-policy) |
+| Dali::Toolkit::Visual::Transform::Property::ORIGIN | origin | INTEGER or STRING | No | The origin of the visual within the control's area. [More info](@ref align-type) |
+| Dali::Toolkit::Visual::Transform::Property::ANCHOR_POINT | anchorPoint | INTEGER or STRING | No | The anchor point of the visual. [More info](@ref align-type) |
-## Offset & size modes {#offset-size-mode}
-
-The offset and size modes can be either Relative or Absolute. The offset modes are in the x and y components of the offsetSizeMode property, and map to the offset's x and y components respectively. The size modes are in the z and w components of the offsetSizeMode property, and map to the size's x and y components, respectively.
+## Offset & Size Policy {#offset-size-policy}
-A mode value of 0 represents a Relative mode, in which case the size or offset value represents a ratio of the control's size. A mode value of 1 represents an Absolute mode, in which case the size or offset value represents world units (pixels).
+The offset and size policies can be either Relative or Absolute.
-For example, an offsetSizeMode of [0, 0, 1, 1], an offset of (0, 0.25) and a size of (20, 20) means the visual will be 20 pixels by 20 pixels in size, positioned 25% above the center of the control.
+| Enumeration | String | Description |
+|---------------------------------------------------------|----------|-------------------------------------------------------------------------------|
+| Dali::Toolkit::Visual::Transform::Policy::RELATIVE | RELATIVE | *Default*. The size or offset value represents a ratio of the control's size |
+| Dali::Toolkit::Visual::Transform::Policy::ABSOLUTE | ABSOLUTE | The size or offset value represents world units (pixels) |
+For example, an offsetPolicy of [ RELATIVE, RELATIVE ], a sizePolicy of [ ABSOLUTE, ABSOLUTE ], an offset of ( 0, 0.25 ) and a size of ( 20, 20 ) means the visual will be 20 pixels by 20 pixels in size, positioned 25% above the center of the control.
## Alignment {#align-type}
| Enumeration | String | Description |
Visuals also have a custom **shader** property. Whilst it's possible to change the shader, please note that some visuals rely on the vertex shader to perform certain functions. For example, the NPatch visual uses the vertex shader to perform the stretching. The **shader** property is a Property::Map with the following keys:
-| Property | String | Type | Required | Description |
-|-------------------------------------------------|----------|:-------:|:--------:|---------------------------|
-| Dali::Toolkit::Visual::Shader::Property::VERTEX_SHADER | vertexShader | STRING | No | The vertex shader code. |
-| Dali::Toolkit::Visual::Shader::Property::FRAGMENT_SHADER | fragmentShader | STRING | No | The fragment shader code. |
-| Dali::Toolkit::Visual::Shader::Property::SUBDIVIDE_GRID_X | subdivideGridX | INTEGER | No | How to subdivide the grid along the X-Axis. Defaults to 1 |
-| Dali::Toolkit::Visual::Shader::Property::SUBDIVIDE_GRID_Y | subdivideGridY | INTEGER | No | How to subdivide the grid along the Y-Axis. Defaults to 1 |
-| Dali::Toolkit::Visual::Shader::Property::HINTS | hints | INTEGER or ARRAY of STRING | No | Shader hints bitmask [More info](@ref shader-hints) |
+| Property | String | Type | Required | Description |
+|-----------------------------------------------------------|----------------|:--------------------------:|:--------:|--------------------------------------------------------------------------------------------|
+| Dali::Toolkit::Visual::Shader::Property::VERTEX_SHADER | vertexShader | STRING or ARRAY of STRING | No | The vertex shader code. Can use an array of strings to split shader over multiple lines. |
+| Dali::Toolkit::Visual::Shader::Property::FRAGMENT_SHADER | fragmentShader | STRING or ARRAY of STRING | No | The fragment shader code. Can use an array of strings to split shader over multiple lines. |
+| Dali::Toolkit::Visual::Shader::Property::SUBDIVIDE_GRID_X | subdivideGridX | INTEGER | No | How to subdivide the grid along the X-Axis. Defaults to 1. |
+| Dali::Toolkit::Visual::Shader::Property::SUBDIVIDE_GRID_Y | subdivideGridY | INTEGER | No | How to subdivide the grid along the Y-Axis. Defaults to 1. |
+| Dali::Toolkit::Visual::Shader::Property::HINTS | hints | INTEGER or ARRAY of STRING | No | Shader hints bitmask [More info](@ref shader-hints) |
## Shader hints {#shader-hints}
~~~
___________________________________________________________________________________________________
+## Text Visual {#text-visual}
+
+Renders text within a control.
+
+
+
+
+### Properties
+
+**VisualType:** Dali::Toolkit::Visual::TEXT, "TEXT"
+
+| Property | String | Type | Required | Description | Default |
+|-------------------------------------------------------------|---------------------|:-------------:|:--------:|-------------------------------------------------------------------------------|------------------------|
+| Dali::Toolkit::TextVisual::Property::TEXT | text | STRING | Yes | The text to display in UTF-8 format | |
+| Dali::Toolkit::TextVisual::Property::FONT_FAMILY | fontFamily | STRING | No | The requested font family to use | |
+| Dali::Toolkit::TextVisual::Property::FONT_STYLE | fontStyle | MAP | No | The requested font style to use | |
+| Dali::Toolkit::TextVisual::Property::POINT_SIZE | pointSize | FLOAT | Yes | The size of font in points | |
+| Dali::Toolkit::TextVisual::Property::MULTI_LINE | multiLine | BOOLEAN | No | The single-line or multi-line layout option | false |
+| Dali::Toolkit::TextVisual::Property::HORIZONTAL_ALIGNMENT | horizontalAlignment | STRING | No | The line horizontal alignment: "BEGIN", "CENTER", "END" | "BEGIN" |
+| Dali::Toolkit::TextVisual::Property::VERTICAL_ALIGNMENT | verticalAlignment | STRING | No | The line vertical alignment: "TOP", "CENTER", "BOTTOM" | "TOP" |
+| Dali::Toolkit::TextVisual::Property::TEXT_COLOR | textColor | VECTOR4 | No | The color of the text | Color::BLACK |
+| Dali::Toolkit::TextVisual::Property::ENABLE_MARKUP | enableMarkup | BOOL | No | If mark up should be enabled | |
+
+### Usage
+
+~~~{.cpp}
+ // C++
+ Dali::Stage stage = Dali::Stage::GetCurrent();
+ stage.SetBackgroundColor( Dali::Color::WHITE );
+
+ Dali::Toolkit::Control control = Dali::Toolkit::Control::New();
+ control.SetParentOrigin( ParentOrigin::CENTER );
+
+ Dali::Property::Map map;
+ map[ Dali::Toolkit::Visual::Property::TYPE ] = Dali::Toolkit::Visual::TEXT;
+ map[ Dali::Toolkit::TextVisual::Property::TEXT ] = "Hello world";
+ map[ Dali::Toolkit::TextVisual::Property::TEXT_COLOR ] = Dali::Color::BLACK;
+ map[ Dali::Toolkit::TextVisual::Property::FONT_FAMILY ] = "Sans";
+ map[ Dali::Toolkit::TextVisual::Property::POINT_SIZE ] = 30.f;
+ map[ Dali::Toolkit::TextVisual::Property::HORIZONTAL_ALIGNMENT ] = "CENTER";
+ map[ Dali::Toolkit::TextVisual::Property::VERTICAL_ALIGNMENT ] = "CENTER";
+
+ control.SetProperty( Dali::Toolkit::Control::Property::BACKGROUND, map );
+
+ stage.Add( control );
+~~~
+
## Wireframe Visual {#wireframe-visual}
Renders a wireframe around a quad geometry.
projects / platform / core / uifw / dali-toolkit.git / blobdiff