X-Git-Url: http://review.tizen.org/git/?a=blobdiff_plain;f=docs%2Fcontent%2Fshared-javascript-and-cpp-documentation%2Ftext-label.md;h=8b9d4d676805be408ed70a166796e53e7c253307;hb=fe706c2b9e0a2ce31c91317dd6749faecef6d92e;hp=98734b2d71f139d3faaf6c046a345cda5cd5eb1f;hpb=479693b4fd773eb8888ae401d02b49188293e231;p=platform%2Fcore%2Fuifw%2Fdali-toolkit.git diff --git a/docs/content/shared-javascript-and-cpp-documentation/text-label.md b/docs/content/shared-javascript-and-cpp-documentation/text-label.md old mode 100644 new mode 100755 index 98734b2..8b9d4d6 --- a/docs/content/shared-javascript-and-cpp-documentation/text-label.md +++ b/docs/content/shared-javascript-and-cpp-documentation/text-label.md @@ -89,6 +89,41 @@ label.HorizontalAlignment = "BEGIN"; // "CENTER" or "END" | ![ ](../assets/img/text-controls/LatinEnd.png) ![ ](LatinEnd.png) | ![ ](../assets/img/text-controls/ArabicEnd.png) ![ ](ArabicEnd.png) | + +The text's alignment and order can be modified to match the direction of the system language. + +If the MATCH_SYSTEM_LANGUAGE_DIRECTION property is set to true then the direction of the text is ignored, instead the text is aligned and ordered as the system default language. + +~~~{.cpp} +// C++ + +label.SetProperty( Toolkit::DevelTextLabel::Property::MATCH_SYSTEM_LANGUAGE_DIRECTION, true ); +~~~ + +~~~{.js} +// JavaScript + +label.matchSystemLanguageDirection = true; +~~~ + +| | | +|--|--| +| Current system language direction left-to-right | | +| MATCH_SYSTEM_LANGUAGE_DIRECTION set to TRUE. | MATCH_SYSTEM_LANGUAGE_DIRECTION set to FALSE (default). | +| BEGIN alignment | BEGIN alignment | +| ![ ](../assets/img/text-controls/HelloWorld-System-BEGIN.png) ![ ](HelloWorld-System-BEGIN.png) | ![ ](../assets/img/text-controls/HelloWorld-Default-BEGIN.png) ![ ](HelloWorld-Default-BEGIN.png) | +| CENTER alignment | CENTER alignment | +| ![ ](../assets/img/text-controls/HelloWorld-System-CENTER.png) ![ ](HelloWorld-System-CENTER.png) | ![ ](../assets/img/text-controls/HelloWorld-Default-CENTER.png) ![ ](HelloWorld-Default-CENTER.png) | +| END alignment | END alignment | +| ![ ](../assets/img/text-controls/HelloWorld-System-END.png) ![ ](HelloWorld-System-END.png) | ![ ](../assets/img/text-controls/HelloWorld-Default-END.png) ![ ](HelloWorld-Default-END.png) | + + +| | | +|--|--| +| Current system language direction left-to-right | Current system language direction right-to-left | +| ![ ](../assets/img/text-controls/LTR_order.png) ![ ](LTR_order.png) | ![ ](../assets/img/text-controls/RTL_order.png) ![ ](RTL_order.png) | + + The examples above assume that the TextLabel size greater than the minimum required. The next section provides details about the other size related options. @@ -207,7 +242,7 @@ label.textColor = dali.COLOR_RED; #### Drop Shadow -To add a drop-shadow to the text, simply set the SHADOW property. Shadow parameters can be set through a json string, see the examples below. +To add a drop-shadow to the text, simply set the SHADOW property. Shadow parameters can be set through a json string or through a property map, see the examples below. ~~~{.cpp} // C++ @@ -222,8 +257,14 @@ label2.SetProperty( TextLabel::Property::SHADOW, "{\"offset\":\"1 1\",\"color\": label3.SetProperty( TextLabel::Property::TEXT, "Text with Bigger Shadow" ); label3.SetProperty( TextLabel::Property::SHADOW, "{\"offset\":\"2 2\",\"color\":\"black\"}" ); -label4.SetProperty( TextLabel::Property::TEXT, "Text with Color Shadow" ); -label4.SetProperty( TextLabel::Property::SHADOW, "{\"offset\":\"1 1\",\"color\":\"red\"}" ); +label4.SetProperty( TextLabel::Property::TEXT, "Text with Color Soft Shadow" ); + +Property::Map shadow; +shadow.Insert( "offset", Vector2(1.0f, 1.0f) ); +shadow.Insert( "color", Color::RED ); +shadow.Insert( "blurRadius", 2.0f ); // A value of 0 indicates no blur. The bigger the radius, the more blurry. +label4.SetProperty( TextLabel::Property::SHADOW, shadow ); + ~~~ ~~~{.js} @@ -240,8 +281,14 @@ label2.shadow = "{\"offset\":\"1 1\",\"color\":\"black\"}"; label3.text = "Text with Bigger Shadow"; label3.shadow = "{\"offset\":\"2 2\",\"color\":\"black\"}"; -label4.SetProperty( TextLabel::Property::TEXT, "Text with Color Shadow" ); -label3.shadow = "{\"offset\":\"1 1\",\"color\":\"red\"}"; +label4.SetProperty( TextLabel::Property::TEXT, "Text with Color Soft Shadow" ); +var shadow = { + "offset" : [ 1.0, 1.0 ], + "color" : dali.COLOR_RED; + "blurRadius" : 2.0 +}; +label4.shadow = shadow; + ~~~