X-Git-Url: http://review.tizen.org/git/?a=blobdiff_plain;f=docs%2Fcontent%2Fshared-javascript-and-cpp-documentation%2Fvisuals.md;h=3db0bf484c9e4bd4567610f757bd5a85b230fb43;hb=85fb989437f48082146d91e0f092f6b97d1a9df5;hp=eaaaed53a721707071626d8cd0ec3a9b5f0a5d47;hpb=11d6d49bd9837159b95a27199c48dd7a39b8ccee;p=platform%2Fcore%2Fuifw%2Fdali-toolkit.git diff --git a/docs/content/shared-javascript-and-cpp-documentation/visuals.md b/docs/content/shared-javascript-and-cpp-documentation/visuals.md index eaaaed5..3db0bf4 100644 --- a/docs/content/shared-javascript-and-cpp-documentation/visuals.md +++ b/docs/content/shared-javascript-and-cpp-documentation/visuals.md @@ -16,6 +16,7 @@ DALi provides the following visuals: + [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 ). @@ -304,6 +305,9 @@ Renders a raster image ( jpg, png etc.) into the visual's quad geometry. | Dali::Toolkit::ImageVisual::Property::SAMPLING_MODE | samplingMode | INTEGER or STRING | No | Filtering options, used when resizing images to sample original pixels. [More info](@ref resourceimagescaling-scaling) | | Dali::Toolkit::ImageVisual::Property::DESIRED_WIDTH | desiredWidth | INT | No | The desired image width. Will use actual image width if not specified. | | Dali::Toolkit::ImageVisual::Property::DESIRED_HEIGHT | desiredHeight | INT | No | The desired image height. Will use actual image height if not specified. | +| Dali::Toolkit::ImageVisual::Property::PIXEL_AREA | pixelArea | VECTOR4 | No | The image area to be displayed, default value is [0.0, 0.0, 1.0, 1.0] | +| Dali::Toolkit::ImageVisual::Property::WRAP_MODE_U | wrapModeU | INTEGER or STRING | No | Wrap mode for u coordinate, valid values are CLAMP_TO_EDGE(default), REPEAT, MIRRORED_REPEAT | +| Dali::Toolkit::ImageVisual::Property::WRAP_MODE_V | wrapModeV | INTEGER or STRING | No | Wrap mode for v coordinate, valid values are CLAMP_TO_EDGE(default), REPEAT, MIRRORED_REPEAT | #### Usage @@ -455,9 +459,12 @@ Renders an animated image into the visual's quad geometry. Currently, only the G **VisualType:** Dali::Toolkit::Visual::IMAGE, "IMAGE" -| Property | String | Type | Required | Description | -|-------------------------------------------|--------|:-------:|:--------:|----------------------------------| -| Dali::Toolkit::ImageVisual::Property::URL | url | STRING | Yes | The URL of the animated image. | +| Property | String | Type | Required | Description | +|---------------------------------------------------|------------|:-----------------:|:--------:|----------------------------------------------------------------------------------------------| +| Dali::Toolkit::ImageVisual::Property::URL | url | STRING | Yes | The URL of the animated image. | +| Dali::Toolkit::ImageVisual::Property::PIXEL_AREA | pixelArea | VECTOR4 | No | The image area to be displayed, default value is [0.0, 0.0, 1.0, 1.0] | +| Dali::Toolkit::ImageVisual::Property::WRAP_MODE_U | wrapModeU | INTEGER or STRING | No | Wrap mode for u coordinate, valid values are CLAMP_TO_EDGE(default), REPEAT, MIRRORED_REPEAT | +| Dali::Toolkit::ImageVisual::Property::WRAP_MODE_V | wrapModeV | INTEGER or STRING | No | Wrap mode for v coordinate, valid values are CLAMP_TO_EDGE(default), REPEAT, MIRRORED_REPEAT | #### Usage @@ -709,6 +716,53 @@ control.SetProperty( Control::Property::BACKGROUND, map ); ~~~ ___________________________________________________________________________________________________ +## Text Visual {#text-visual} + +Renders text within a control. + +![ ](../assets/img/visuals/HelloWorld.png) +![ ](visuals/HelloWorld.png) + +### 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.