Enable markup processor in text controls. 40/54740/11
authorVictor Cebollada <v.cebollada@samsung.com>
Thu, 17 Dec 2015 09:26:09 +0000 (09:26 +0000)
committerVictor Cebollada <v.cebollada@samsung.com>
Wed, 6 Jan 2016 14:13:43 +0000 (14:13 +0000)
Property added to enable and disable the markup processor.

Change-Id: I0c5e237ed235774a5cbcbbb393de7200385575d8
Signed-off-by: Victor Cebollada <v.cebollada@samsung.com>
automated-tests/src/dali-toolkit/utc-Dali-TextField.cpp
automated-tests/src/dali-toolkit/utc-Dali-TextLabel.cpp
dali-toolkit/internal/controls/text-controls/text-field-impl.cpp
dali-toolkit/internal/controls/text-controls/text-label-impl.cpp
dali-toolkit/public-api/controls/text-controls/text-field.h
dali-toolkit/public-api/controls/text-controls/text-label.h
docs/content/shared-javascript-and-cpp-documentation/markup-style.md [new file with mode: 0644]
docs/content/shared-javascript-and-cpp-documentation/text-field.md
docs/content/shared-javascript-and-cpp-documentation/text-label.md

index 0afc09847708ba0776acb19b305e3477db1cead5..9fe5e530958f36ecd8a7de0d47c269c690fe2db3 100644 (file)
@@ -75,6 +75,7 @@ const char* const PROPERTY_NAME_SELECTION_HIGHLIGHT_COLOR            = "selectio
 const char* const PROPERTY_NAME_DECORATION_BOUNDING_BOX              = "decorationBoundingBox";
 const char* const PROPERTY_NAME_INPUT_METHOD_SETTINGS                = "inputMethodSettings";
 const char* const PROPERTY_NAME_INPUT_COLOR                          = "inputColor";
+const char* const PROPERTY_NAME_ENABLE_MARKUP                        = "enableMarkup";
 
 const int DEFAULT_RENDERING_BACKEND = Dali::Toolkit::Text::DEFAULT_RENDERING_BACKEND;
 
@@ -264,6 +265,7 @@ int UtcDaliTextFieldGetPropertyP(void)
   DALI_TEST_CHECK( field.GetPropertyIndex( PROPERTY_NAME_DECORATION_BOUNDING_BOX ) == TextField::Property::DECORATION_BOUNDING_BOX );
   DALI_TEST_CHECK( field.GetPropertyIndex( PROPERTY_NAME_INPUT_METHOD_SETTINGS ) == TextField::Property::INPUT_METHOD_SETTINGS );
   DALI_TEST_CHECK( field.GetPropertyIndex( PROPERTY_NAME_INPUT_COLOR ) == TextField::Property::INPUT_COLOR );
+  DALI_TEST_CHECK( field.GetPropertyIndex( PROPERTY_NAME_ENABLE_MARKUP ) == TextField::Property::ENABLE_MARKUP );
   END_TEST;
 }
 
@@ -395,6 +397,11 @@ int UtcDaliTextFieldSetPropertyP(void)
   field.SetProperty( TextField::Property::INPUT_COLOR, Color::YELLOW );
   DALI_TEST_EQUALS( field.GetProperty<Vector4>( TextField::Property::INPUT_COLOR ), Color::YELLOW, TEST_LOCATION );
 
+  // Check the enable markup property.
+  DALI_TEST_CHECK( !field.GetProperty<bool>( TextField::Property::ENABLE_MARKUP ) );
+  field.SetProperty( TextField::Property::ENABLE_MARKUP, true );
+  DALI_TEST_CHECK( field.GetProperty<bool>( TextField::Property::ENABLE_MARKUP ) );
+
   END_TEST;
 }
 
index 370fde08d7c1a79d413ab5d07cf45a532594dbf7..5e77ebb77432d9a8097982e21b814c159c421e2e 100644 (file)
@@ -50,6 +50,7 @@ const char* const PROPERTY_NAME_SHADOW_COLOR = "shadowColor";
 const char* const PROPERTY_NAME_UNDERLINE_ENABLED = "underlineEnabled";
 const char* const PROPERTY_NAME_UNDERLINE_COLOR = "underlineColor";
 const char* const PROPERTY_NAME_UNDERLINE_HEIGHT = "underlineHeight";
+const char* const PROPERTY_NAME_ENABLE_MARKUP = "enableMarkup";
 
 const int DEFAULT_RENDERING_BACKEND = Dali::Toolkit::Text::DEFAULT_RENDERING_BACKEND;
 
@@ -150,6 +151,7 @@ int UtcDaliToolkitTextLabelGetPropertyP(void)
   DALI_TEST_CHECK( label.GetPropertyIndex( PROPERTY_NAME_UNDERLINE_ENABLED ) == TextLabel::Property::UNDERLINE_ENABLED );
   DALI_TEST_CHECK( label.GetPropertyIndex( PROPERTY_NAME_UNDERLINE_COLOR ) == TextLabel::Property::UNDERLINE_COLOR );
   DALI_TEST_CHECK( label.GetPropertyIndex( PROPERTY_NAME_UNDERLINE_HEIGHT) == TextLabel::Property::UNDERLINE_HEIGHT );
+  DALI_TEST_CHECK( label.GetPropertyIndex( PROPERTY_NAME_ENABLE_MARKUP) == TextLabel::Property::ENABLE_MARKUP );
 
   END_TEST;
 }
@@ -211,6 +213,11 @@ int UtcDaliToolkitTextLabelSetPropertyP(void)
   DALI_TEST_CHECK( label2 );
   DALI_TEST_EQUALS( label2.GetProperty<std::string>( TextLabel::Property::TEXT ), std::string("New text"), TEST_LOCATION );
 
+  // Check the enable markup property.
+  DALI_TEST_CHECK( !label.GetProperty<bool>( TextLabel::Property::ENABLE_MARKUP ) );
+  label.SetProperty( TextLabel::Property::ENABLE_MARKUP, true );
+  DALI_TEST_CHECK( label.GetProperty<bool>( TextLabel::Property::ENABLE_MARKUP ) );
+
   END_TEST;
 }
 
index e31213ed6476f9f7241bc5fb9ae999cc60f500ec..8b7ea1dc3270251336375028c87b90ccb386e571 100644 (file)
@@ -119,6 +119,7 @@ DALI_PROPERTY_REGISTRATION( Toolkit, TextField, "selectionHighlightColor",
 DALI_PROPERTY_REGISTRATION( Toolkit, TextField, "decorationBoundingBox",                RECTANGLE, DECORATION_BOUNDING_BOX              )
 DALI_PROPERTY_REGISTRATION( Toolkit, TextField, "inputMethodSettings",                  MAP,       INPUT_METHOD_SETTINGS                )
 DALI_PROPERTY_REGISTRATION( Toolkit, TextField, "inputColor",                           VECTOR4,   INPUT_COLOR                          )
+DALI_PROPERTY_REGISTRATION( Toolkit, TextField, "enableMarkup",                         BOOLEAN,   ENABLE_MARKUP                        )
 
 DALI_SIGNAL_REGISTRATION( Toolkit, TextField, "textChanged",        SIGNAL_TEXT_CHANGED )
 DALI_SIGNAL_REGISTRATION( Toolkit, TextField, "maxLengthReached",   SIGNAL_MAX_LENGTH_REACHED )
@@ -566,6 +567,17 @@ void TextField::SetProperty( BaseObject* object, Property::Index index, const Pr
         }
         break;
       }
+      case Toolkit::TextField::Property::ENABLE_MARKUP:
+      {
+        if( impl.mController )
+        {
+          const bool enableMarkup = value.Get<bool>();
+          DALI_LOG_INFO( gLogFilter, Debug::General, "TextField %p ENABLE_MARKUP %d\n", impl.mController.Get(), enableMarkup );
+
+          impl.mController->SetMarkupProcessorEnabled( enableMarkup );
+        }
+        break;
+      }
     } // switch
   } // textfield
 }
@@ -857,6 +869,14 @@ Property::Value TextField::GetProperty( BaseObject* object, Property::Index inde
       {
         break;
       }
+      case Toolkit::TextField::Property::ENABLE_MARKUP:
+      {
+        if( impl.mController )
+        {
+          value = impl.mController->IsMarkupProcessorEnabled();
+        }
+        break;
+      }
     } //switch
   }
 
index 11364d00730eade5f5f99da9a6685d37fff0eaab..0094c9ba5fb9d06d2d4e9dcc23fcecd46137cb95 100644 (file)
@@ -93,6 +93,7 @@ DALI_PROPERTY_REGISTRATION( Toolkit, TextLabel, "shadowColor",          VECTOR4,
 DALI_PROPERTY_REGISTRATION( Toolkit, TextLabel, "underlineEnabled",     BOOLEAN, UNDERLINE_ENABLED    )
 DALI_PROPERTY_REGISTRATION( Toolkit, TextLabel, "underlineColor",       VECTOR4, UNDERLINE_COLOR      )
 DALI_PROPERTY_REGISTRATION( Toolkit, TextLabel, "underlineHeight",      FLOAT,   UNDERLINE_HEIGHT     )
+DALI_PROPERTY_REGISTRATION( Toolkit, TextLabel, "enableMarkup",         BOOLEAN, ENABLE_MARKUP        )
 
 DALI_TYPE_REGISTRATION_END()
 
@@ -290,6 +291,15 @@ void TextLabel::SetProperty( BaseObject* object, Property::Index index, const Pr
         }
         break;
       }
+      case Toolkit::TextLabel::Property::ENABLE_MARKUP:
+      {
+        if( impl.mController )
+        {
+          const bool enableMarkup = value.Get<bool>();
+          impl.mController->SetMarkupProcessorEnabled( enableMarkup );
+        }
+        break;
+      }
     }
   }
 }
@@ -425,6 +435,14 @@ Property::Value TextLabel::GetProperty( BaseObject* object, Property::Index inde
         }
         break;
       }
+      case Toolkit::TextLabel::Property::ENABLE_MARKUP:
+      {
+        if( impl.mController )
+        {
+          value = impl.mController->IsMarkupProcessorEnabled();
+        }
+        break;
+      }
     }
   }
 
index 9b6453d012f4975705e34de880ecbc76a14593d3..e222f9958e79d83aec3f08b921de8335eb352016 100644 (file)
@@ -76,7 +76,7 @@ public:
       MAX_LENGTH,                               ///< name "maxLength"                            The maximum number of characters that can be inserted,                    type INTEGER
       EXCEED_POLICY,                            ///< name "exceedPolicy"                         Specifies how the text is truncated when it does not fit,                 type INTEGER
       HORIZONTAL_ALIGNMENT,                     ///< name "horizontalAlignment",                 The line horizontal alignment,                                            type STRING,  values "BEGIN", "CENTER", "END"
-      VERTICAL_ALIGNMENT,                       ///< name "verticalAlignment",                   The line vertical alignment,                                              type STRING,  values   "TOP",   "CENTER",   "BOTTOM"
+      VERTICAL_ALIGNMENT,                       ///< name "verticalAlignment",                   The line vertical alignment,                                              type STRING,  values "TOP",   "CENTER", "BOTTOM"
       TEXT_COLOR,                               ///< name "textColor",                           The text color,                                                           type VECTOR4
       PLACEHOLDER_TEXT_COLOR,                   ///< name "placeholderTextColor",                The placeholder-text color,                                               type VECTOR4
       SHADOW_OFFSET,                            ///< name "shadowOffset",                        The drop shadow offset 0 indicates no shadow,                             type VECTOR2
@@ -101,6 +101,7 @@ public:
       DECORATION_BOUNDING_BOX,                  ///< name "decorationBoundingBox",               The decorations (handles etc) will positioned within this area on-screen, type RECTANGLE
       INPUT_METHOD_SETTINGS,                    ///< name "inputMethodSettings",                 The settings to relating to the System's Input Method, Key and Value      type MAP
       INPUT_COLOR,                              ///< name "inputColor",                          The color of the new input text,                                          type VECTOR4
+      ENABLE_MARKUP                             ///< name "enableMarkup",                        Whether the mark-up processing is enabled.                                type BOOLEAN
     };
   };
 
index 190d25c6c9055dd74889356e3e2bcb1ae5a47f03..6abc9fd2912e3e2b3400f05ab7671c5a1b66cc86 100644 (file)
@@ -68,13 +68,14 @@ public:
       POINT_SIZE,                               ///< name "pointSize",            The size of font in points,                       type FLOAT
       MULTI_LINE,                               ///< name "multiLine",            The single-line or multi-line layout option,      type BOOLEAN
       HORIZONTAL_ALIGNMENT,                     ///< name "horizontalAlignment",  The line horizontal alignment,                    type STRING,  values "BEGIN", "CENTER", "END"
-      VERTICAL_ALIGNMENT,                       ///< name "verticalAlignment",    The line vertical alignment,                      type STRING,  values   "TOP",   "CENTER",   "BOTTOM"
+      VERTICAL_ALIGNMENT,                       ///< name "verticalAlignment",    The line vertical alignment,                      type STRING,  values "TOP",   "CENTER", "BOTTOM"
       TEXT_COLOR,                               ///< name "textColor",            The text color,                                   type VECTOR4
       SHADOW_OFFSET,                            ///< name "shadowOffset",         The drop shadow offset 0 indicates no shadow,     type VECTOR2
       SHADOW_COLOR,                             ///< name "shadowColor",          The color of a drop shadow,                       type VECTOR4
       UNDERLINE_ENABLED,                        ///< name "underlineEnabled",     The underline enabled flag,                       type BOOLEAN
       UNDERLINE_COLOR,                          ///< name "underlineColor",       The color of the underline,                       type VECTOR4
-      UNDERLINE_HEIGHT                          ///< name "underlineHeight",      Overrides the underline height from font metrics, type FLOAT
+      UNDERLINE_HEIGHT,                         ///< name "underlineHeight",      Overrides the underline height from font metrics, type FLOAT
+      ENABLE_MARKUP                             ///< name "enableMarkup",         Whether the mark-up processing is enabled.        type BOOLEAN
     };
   };
 
diff --git a/docs/content/shared-javascript-and-cpp-documentation/markup-style.md b/docs/content/shared-javascript-and-cpp-documentation/markup-style.md
new file mode 100644 (file)
index 0000000..7c73868
--- /dev/null
@@ -0,0 +1,90 @@
+<!--
+/**-->
+
+# Mark-up Style {#markup-style}
+
+Mark-up tags can be used within the text to set styles.
+
+By default the text controls don't process the mark-up string. To enable the mark-up string processing the property *ENABLE_MARKUP* must be set to *true*.
+
+~~~{.cpp}
+// C++
+
+TextField field = TextField::New();
+field.SetProperty( TextField::Property::ENABLE_MARKUP, true );
+
+Stage::GetCurrent().Add( field );
+~~~
+
+~~~{.js}
+// JavaScript
+
+var field = new dali.TextField();
+field.enableMarkup = true;
+
+dali.stage.add( field );
+~~~
+
+Note the mark-up processor doesn't check the correctness of the mark-up string. This may cause the text to be badly rendered.
+
+The table below describes the priorities when styles are applied while rendering text.
+|  |  |  |  |
+|--|--|--|--|
+| Priority 1 | Style set by markup string. | Will override the style set through the control properties. | i.e The \<color\> tag will override the *TEXT_COLOR* property. |
+| Priority 2 | Style set through the control properties. | Will override the default platform style. |  |
+| Priority 3 | Default platform style. |  |  |
+
+Current supported tags are:
+
+## \<color\>
+
+Sets the color of the characters inside the tag. The *color* tag has a *value* attribute used to set the color. Possible values are: 'red', 'green', 'blue', 'yellow', 'magenta',
+ 'cyan', 'white', 'black' and 'transparent'. Web color and 32 bits hexadecimal 0xAARRGGBB formats are also supported.
+
+Examples below are equivalent, render the text in red. Second example codes the color in 0xAARRGGBB, third and fourth in web color with 3 and 6 characters.
+
+~~~{.cpp}
+// C++
+field.SetProperty( TextLabel::Property::TEXT, "<color value='red'>Red Text</color>" ); // Color coded with a text constant.
+~~~
+
+~~~{.js}
+// JavaScript
+
+field.text = "<color value='red'>Red Text</color>"; // Color coded with a text constant.
+~~~
+
+~~~{.cpp}
+// C++
+field.SetProperty( TextLabel::Property::TEXT, "<color value='0xFFFF0000'>Red Text</color>" ); // Color packed inside an ARGB hexadecimal value.
+~~~
+
+~~~{.js}
+// JavaScript
+
+field.text = "<color value='0xFFFF0000'>Red Text</color>"; // Color packed inside an ARGB hexadecimal value.
+~~~
+
+~~~{.cpp}
+// C++
+field.SetProperty( TextLabel::Property::TEXT, "<color value='#F00'>Red Text</color>" ); // Color packed with the web color format (3 characters).
+~~~
+
+~~~{.js}
+// JavaScript
+
+field.text = "<color value='#F00'>Red Text</color>"; // Color packed with the web color format (3 characters).
+~~~
+
+~~~{.cpp}
+// C++
+field.SetProperty( TextLabel::Property::TEXT, "<color value='#FF0000'>Red Text</color>" ); // Color packed with the web color format (6 characters).
+~~~
+
+~~~{.js}
+// JavaScript
+
+field.text = "<color value='#FF0000'>Red Text</color>"; // Color packed with the web color format (6 characters).
+~~~
+
+*/
index e42d14a34f55f8e19657ed90a4f0952211f99840..dbe468f028183d6fc28a2da872699ff1c589986e 100644 (file)
@@ -53,6 +53,20 @@ console.log( field.text );
 
 By default TextField will automatically select a suitable font from the platform. However, a different font could be selected. See the [Font Selection](@ref font-selection) section for more details.
 
+### Mark-up Style
+
+Mark-up tags can be used to change the style of the text. See the [Mark-up Style](@ref markup-style) section for more details.
+
+### Input Style
+
+The input style can be changed through the control properties. Current supported input style properties are:
+
+#### INPUT_COLOR
+
+Sets the input color. All subsequent characters added will be rendered with the input color.
+
+Note the input color may change if the cursor is updated by tapping in a new position.
+
 ### Text Alignment
 
 TextField displays a single-line of text, which will scroll if there is not enough room for the text displayed.
@@ -129,6 +143,7 @@ field.placeholderTextColor = dali.COLOR_BLACK;
  horizontalAlignment               | HORIZONTAL_ALIGNMENT                 |  STRING      | O            | X
  verticalAlignment                 | VERTICAL_ALIGNMENT                   |  STRING      | O            | X
  textColor                         | TEXT_COLOR                           |  VECTOR4     | O            | X
+ placeholderTextColor              | PLACEHOLDER_TEXT_COLOR               |  VECTOR4     | O            | X
  shadowOffset                      | SHADOW_OFFSET                        |  VECTOR2     | O            | X
  shadowColor                       | SHADOW_COLOR                         |  VECTOR4     | O            | X
  primaryCursorColor                | PRIMARY_CURSOR_COLOR                 |  VECTOR4     | O            | X
@@ -136,6 +151,7 @@ field.placeholderTextColor = dali.COLOR_BLACK;
  enableCursorBlink                 | ENABLE_CURSOR_BLINK                  |  BOOLEAN     | O            | X
  cursorBlinkInterval               | CURSOR_BLINK_INTERVAL                |  FLOAT       | O            | X
  cursorBlinkDuration               | CURSOR_BLINK_DURATION                |  FLOAT       | O            | X
+ cursorWidth                       | CURSOR_WIDTH                         |  INTEGER     | O            | X
  grabHandleImage                   | GRAB_HANDLE_IMAGE                    |  STRING      | O            | X
  grabHandlePressedImage            | GRAB_HANDLE_PRESSED_IMAGE            |  STRING      | O            | X
  scrollThreshold                   | SCROLL_THRESHOLD                     |  FLOAT       | O            | X
@@ -144,9 +160,13 @@ field.placeholderTextColor = dali.COLOR_BLACK;
  selectionHandleImageRight         | SELECTION_HANDLE_IMAGE_RIGHT         |  STRING      | O            | X
  selectionHandlePressedImageLeft   | SELECTION_HANDLE_PRESSED_IMAGE_LEFT  |  STRING      | O            | X
  selectionHandlePressedImageRight  | SELECTION_HANDLE_PRESSED_IMAGE_RIGHT |  STRING      | O            | X
+ selectionHandleMarkerImageLeft    | SELECTION_HANDLE_MARKER_IMAGE_LEFT   |  MAP         | O            | X
+ selectionHandleMarkerImageRight   | SELECTION_HANDLE_MARKER_IMAGE_RIGHT  |  MAP         | O            | X
  selectionHighlightColor           | SELECTION_HIGHLIGHT_COLOR            |  VECTOR4     | O            | X
  decorationBoundingBox             | DECORATION_BOUNDING_BOX              |  RECTANGLE   | O            | X
  inputMethodSettings               | INPUT_METHOD_SETTINGS                |  MAP         | O            | X
+ inputColor                        | INPUT_COLOR                          |  VECTOR4     | O            | X
+ enableMarkup                      | ENABLE_MARKUP                        |  BOOLEAN     | O            | X
 
 @class TextField
 
index 5986eeea29d951b08d8bce12a96321e2493149e7..13d2ab08b865b514a7030d50032a51c81d92b186 100644 (file)
@@ -43,6 +43,10 @@ The position of the label on-screen is dependent on the parentOrigin and anchorP
 
 By default TextLabel will automatically select a suitable font from the platform. However, a different font could be selected. See the [Font Selection](@ref font-selection) section for more details.
 
+### Mark-up Style
+
+Mark-up tags can be used to change the style of the text. See the [Mark-up Style](@ref markup-style) section for more details.
+
 ### Text Alignment
 
 Wrapping can be enabled using the MULTI_LINE property:
@@ -312,22 +316,23 @@ label1.underlineHeight = 1;
 
 ### Text Label Properties
 
- Name (JavaScript)   |  Name (C++)         |  Type        | Writable     | Animatable
----------------------|---------------------|--------------|--------------|-----------
- renderingBackend    | RENDERING_BACKEND   |  INTEGER     | O            | X
- text                | TEXT                |  STRING      | O            | X
- fontFamily          | FONT_FAMILY         |  STRING      | O            | X
- fontStyle           | FONT_STYLE          |  STRING      | O            | X
- pointSize           | POINT_SIZE          |  FLOAT       | O            | X
- multiLine           | MULTI_LINE          |  BOOLEAN     | O            | X
- horizontalAlignment | HORIZONTAL_ALIGNMENT|  STRING      | O            | X
- verticalAlignment   | VERTICAL_ALIGNMENT  |  STRING      | O            | X
- textColor           | TEXT_COLOR          |  VECTOR4     | O            | X
- shadowOffset        | SHADOW_OFFSET       |  VECTOR2     | O            | X
- shadowColor         | SHADOW_COLOR        |  VECTOR4     | O            | X
- underlineEnabled    | UNDERLINE_ENABLED   |  BOOLEAN     | O            | X
- underlineColor      | UNDERLINE_COLOR     |  VECTOR4     | O            | X
- underlineHeight     | UNDERLINE_HEIGHT    |  FLOAT       | O            | X
+ Name (JavaScript)   |  Name (C++)          |  Type        | Writable     | Animatable
+---------------------|----------------------|--------------|--------------|-----------
+ renderingBackend    | RENDERING_BACKEND    |  INTEGER     | O            | X
+ text                | TEXT                 |  STRING      | O            | X
+ fontFamily          | FONT_FAMILY          |  STRING      | O            | X
+ fontStyle           | FONT_STYLE           |  STRING      | O            | X
+ pointSize           | POINT_SIZE           |  FLOAT       | O            | X
+ multiLine           | MULTI_LINE           |  BOOLEAN     | O            | X
+ horizontalAlignment | HORIZONTAL_ALIGNMENT |  STRING      | O            | X
+ verticalAlignment   | VERTICAL_ALIGNMENT   |  STRING      | O            | X
+ textColor           | TEXT_COLOR           |  VECTOR4     | O            | X
+ shadowOffset        | SHADOW_OFFSET        |  VECTOR2     | O            | X
+ shadowColor         | SHADOW_COLOR         |  VECTOR4     | O            | X
+ underlineEnabled    | UNDERLINE_ENABLED    |  BOOLEAN     | O            | X
+ underlineColor      | UNDERLINE_COLOR      |  VECTOR4     | O            | X
+ underlineHeight     | UNDERLINE_HEIGHT     |  FLOAT       | O            | X
+ enableMarkup        | ENABLE_MARKUP        |  BOOLEAN     | O            | X