You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@royale.apache.org by ah...@apache.org on 2018/11/02 20:44:45 UTC

[royale-asjs] branch develop updated (8cca6e3 -> 077ede8)

This is an automated email from the ASF dual-hosted git repository.

aharui pushed a change to branch develop
in repository https://gitbox.apache.org/repos/asf/royale-asjs.git.


    from 8cca6e3  fix build
     new b4c249c  switch to using position=absolute by default in UIComponent since that's more like how Flash worked
     new 0a1174f  use a div so we can measure it
     new 98daa68  UITextField needs beads now that it isn't a Label
     new 077ede8  axis labels are working

The 4 revisions listed above as "new" are entirely new to this
repository and will be described in separate emails.  The revisions
listed as "add" were already present in the repository and have only
been added to this reference.


Summary of changes:
 .../MXRoyale/src/main/resources/defaults.css       |   8 +
 .../src/main/royale/mx/charts/AxisRenderer.as      |  36 +-
 .../src/main/royale/mx/charts/GridLines.as         |   8 +
 .../src/main/royale/mx/core/UIComponent.as         |  77 ++--
 .../src/main/royale/mx/core/UITextField.as         | 414 +++++++++++++++++----
 5 files changed, 440 insertions(+), 103 deletions(-)


[royale-asjs] 03/04: UITextField needs beads now that it isn't a Label

Posted by ah...@apache.org.
This is an automated email from the ASF dual-hosted git repository.

aharui pushed a commit to branch develop
in repository https://gitbox.apache.org/repos/asf/royale-asjs.git

commit 98daa68acaa1963f6634217c225600bd6c922a90
Author: Alex Harui <ah...@apache.org>
AuthorDate: Fri Nov 2 13:43:33 2018 -0700

    UITextField needs beads now that it isn't a Label
---
 frameworks/projects/MXRoyale/src/main/resources/defaults.css | 8 ++++++++
 1 file changed, 8 insertions(+)

diff --git a/frameworks/projects/MXRoyale/src/main/resources/defaults.css b/frameworks/projects/MXRoyale/src/main/resources/defaults.css
index fea518d..182dd55 100644
--- a/frameworks/projects/MXRoyale/src/main/resources/defaults.css
+++ b/frameworks/projects/MXRoyale/src/main/resources/defaults.css
@@ -19,6 +19,7 @@
 @namespace Basic "library://ns.apache.org/royale/basic";
 @namespace "library://ns.apache.org/royale/mx";
 @namespace charts "mx.charts.chartClasses.*";
+@namespace core "mx.core.*";
 
 .royale *, . royale *:before, . royale *:after {
 	-moz-box-sizing: border-box;
@@ -735,5 +736,12 @@ charts|DataTip
 	{
 		IContentView: ClassReference("org.apache.royale.html.supportClasses.DataGroup");
 	}
+	
+	core|UITextField
+	{
+		IBeadModel: ClassReference("org.apache.royale.html.beads.models.TextModel");
+		IBeadView: ClassReference("org.apache.royale.html.beads.TextFieldView");
+		iMeasurementBead: ClassReference("org.apache.royale.html.beads.TextFieldLabelMeasurementBead");
+	}
 
 }
\ No newline at end of file


[royale-asjs] 04/04: axis labels are working

Posted by ah...@apache.org.
This is an automated email from the ASF dual-hosted git repository.

aharui pushed a commit to branch develop
in repository https://gitbox.apache.org/repos/asf/royale-asjs.git

commit 077ede82212e1fd8295cbf42da517b68645477b4
Author: Alex Harui <ah...@apache.org>
AuthorDate: Fri Nov 2 13:43:55 2018 -0700

    axis labels are working
---
 .../src/main/royale/mx/charts/AxisRenderer.as      | 36 +++++++++++++++++++++-
 .../src/main/royale/mx/charts/GridLines.as         |  8 +++++
 2 files changed, 43 insertions(+), 1 deletion(-)

diff --git a/frameworks/projects/MXRoyale/src/main/royale/mx/charts/AxisRenderer.as b/frameworks/projects/MXRoyale/src/main/royale/mx/charts/AxisRenderer.as
index a28b0ab..eede394 100644
--- a/frameworks/projects/MXRoyale/src/main/royale/mx/charts/AxisRenderer.as
+++ b/frameworks/projects/MXRoyale/src/main/royale/mx/charts/AxisRenderer.as
@@ -1349,7 +1349,8 @@ public class AxisRenderer extends DualStyleObject implements IAxisRenderer
             var oldX:Number = x - unscaledHeight;
             super.setActualSize(h, w);
             move(oldX + w, y);
-        }       
+        }
+        updateDisplayList(w, h);
     }
 
     /**
@@ -3346,6 +3347,7 @@ public class AxisRenderer extends DualStyleObject implements IAxisRenderer
                 }
             }
             
+            graphics.beginStroke();
             graphics.moveTo(_gutters.left - leftJoin,
                             baseline + w / 2);
 
@@ -3353,6 +3355,7 @@ public class AxisRenderer extends DualStyleObject implements IAxisRenderer
 			
             graphics.lineTo(unscaledWidth - _gutters.right + rightJoin,
                             baseline + w / 2);
+            graphics.endStroke();
         }
     }
     
@@ -3443,8 +3446,10 @@ public class AxisRenderer extends DualStyleObject implements IAxisRenderer
             for (var i:int = 0; i < n; i++)
             {
                 left = axisStart + axisLength * _ticks[i];
+                g.beginStroke();
                 g.moveTo(left, tickStart);
                 g.lineTo(left, tickEnd);
+                g.endStroke();
             }
 
         }   
@@ -3509,8 +3514,10 @@ public class AxisRenderer extends DualStyleObject implements IAxisRenderer
             for (i = 0; i < n; i++)
             {
                 left = axisStart + axisLength * minorTicks[i];
+                g.beginStroke();
                 g.moveTo(left, tickStart);
                 g.lineTo(left, tickEnd);
+                g.endStroke();
             }
         }
 
@@ -3606,6 +3613,17 @@ public class AxisRenderer extends DualStyleObject implements IAxisRenderer
             {
                 measuringField = IUITextField(/*createInFontContext(UITextField)*/ new UITextField);
                 _measuringField = UIComponent(measuringField);
+                COMPILE::JS
+                {
+                    document.body.appendChild(_measuringField.element);
+                    _measuringField.element.style.width="auto";
+                    _measuringField.element.style.height="auto";
+                    _measuringField.element.style.position="absolute";
+                }
+            }
+            COMPILE::JS
+            {
+                _measuringField.element.style.display="block";
             }
             
             COMPILE::SWF
@@ -3748,6 +3766,10 @@ public class AxisRenderer extends DualStyleObject implements IAxisRenderer
 
         _supressInvalidations--;
 
+        COMPILE::JS
+        {
+            _measuringField.element.style.display="none";                
+        }
         return newLabelData.accurate == true;
     }
     
@@ -3883,6 +3905,18 @@ public class AxisRenderer extends DualStyleObject implements IAxisRenderer
     {
         AxisBase(_axis).highlightElements(true);
     }
+    
+    override public function addedToParent():void
+    {
+        super.addedToParent();
+        COMPILE::JS
+        {
+            element.style.position = "absolute";
+        }
+        commitProperties();
+        measure();
+        updateDisplayList(getExplicitOrMeasuredWidth(), getExplicitOrMeasuredHeight());
+    }
 
 }
 
diff --git a/frameworks/projects/MXRoyale/src/main/royale/mx/charts/GridLines.as b/frameworks/projects/MXRoyale/src/main/royale/mx/charts/GridLines.as
index aac294f..7130058 100644
--- a/frameworks/projects/MXRoyale/src/main/royale/mx/charts/GridLines.as
+++ b/frameworks/projects/MXRoyale/src/main/royale/mx/charts/GridLines.as
@@ -522,9 +522,11 @@ public class GridLines extends ChartElement
 					if (addedLastLine && idx == (spacing.length-1))
 						continue;
 
+                    g.beginStroke();
 					stroke.apply(g,null,null);
 					g.moveTo(rc.left, rc.bottom);
 					g.lineTo(rc.right, rc.bottom);
+                    g.endStroke();
 
 				}
 			}
@@ -610,9 +612,11 @@ public class GridLines extends ChartElement
 					if (addedLastLine && i == spacing.length-1)
 						continue;
 						
+                    g.beginStroke();
 					stroke.apply(g,null,null);
 					g.moveTo(rc.left, rc.top);
 					g.lineTo(rc.left, rc.bottom);
+                    g.endStroke();
 				}
 			}
 		}
@@ -631,18 +635,22 @@ public class GridLines extends ChartElement
 				cache[0].y > 0 && cache[0].y < unscaledHeight)
 			{
 				originStroke = getStyle("horizontalOriginStroke");
+                g.beginStroke();
 				originStroke.apply(g,null,null);
 				g.moveTo(0, cache[0].y - sWidth / 2);
 				g.lineTo(unscaledWidth/*$width*/, cache[0].y - sWidth / 2);
+                g.endStroke();
 			}
 
 			if (verticalShowOrigin &&
 				cache[0].x > 0 && cache[0].x < unscaledWidth)
 			{
 				originStroke = getStyle("verticalOriginStroke");
+                g.beginStroke();
 				originStroke.apply(g,null,null);
 				g.moveTo(cache[0].x - sWidth / 2, 0);
 				g.lineTo(cache[0].x - sWidth / 2, unscaledHeight/*$height*/);
+                g.endStroke();
 			}
 		}
 	}	


[royale-asjs] 01/04: switch to using position=absolute by default in UIComponent since that's more like how Flash worked

Posted by ah...@apache.org.
This is an automated email from the ASF dual-hosted git repository.

aharui pushed a commit to branch develop
in repository https://gitbox.apache.org/repos/asf/royale-asjs.git

commit b4c249c94736ebc7c8934c61f904696d5c6b0f16
Author: Alex Harui <ah...@apache.org>
AuthorDate: Fri Nov 2 13:42:23 2018 -0700

    switch to using position=absolute by default in UIComponent since that's more like how Flash worked
---
 .../src/main/royale/mx/core/UIComponent.as         | 77 +++++++++++++++-------
 1 file changed, 55 insertions(+), 22 deletions(-)

diff --git a/frameworks/projects/MXRoyale/src/main/royale/mx/core/UIComponent.as b/frameworks/projects/MXRoyale/src/main/royale/mx/core/UIComponent.as
index 660a71b..c6e044e 100644
--- a/frameworks/projects/MXRoyale/src/main/royale/mx/core/UIComponent.as
+++ b/frameworks/projects/MXRoyale/src/main/royale/mx/core/UIComponent.as
@@ -39,6 +39,7 @@ import flash.events.IEventDispatcher;
 */
 
 import mx.controls.beads.ToolTipBead;
+import mx.core.mx_internal;
 import mx.display.Graphics;
 import mx.events.EffectEvent;
 import mx.events.FlexEvent;
@@ -58,8 +59,6 @@ import mx.styles.IStyleClient;
 import mx.styles.IStyleManager2;
 import mx.styles.StyleManager;
 import mx.utils.StringUtil;
-
-import mx.core.mx_internal;
 use namespace mx_internal;
 
 import org.apache.royale.core.CallLaterBead;
@@ -629,21 +628,49 @@ public class UIComponent extends UIBase
 	 
 	 }
 
-	COMPILE::JS{
-	 private var _rotation:Number;
+    COMPILE::JS
+	private var _rotation:Number = 0;
 	 
-	 	public function get rotation():Number
-	 	{
-            //TODO figure out JS side. There's a transofrm bead, but that's pretty specific to SVG (I think)
-            trace("proper rotation not yet implemented");
-	    	return _rotation;
-	 	}
-     		public function set rotation(value:Number):void
-		{
-	   		_rotation = value;
-		}
+    COMPILE::JS
+	public function get rotation():Number
+	{
+	    return _rotation;
+	}
+    
+    COMPILE::JS
+    public function set rotation(value:Number):void
+	{
+	   	_rotation = value;
+        element.style.transform = computeTransformString();
+        element.style["transform-origin-x"] = "0px";
+        element.style["transform-origin-y"] = "0px";
 	}
 	
+    COMPILE::JS
+	private function computeTransformString():String
+    {
+        var s:String = "";
+        var value:Number = _rotation;
+        if (_rotation != 0)
+        {
+            if (value < 0)
+                value += 360;
+            s += "rotate(" + value.toString() + "deg)";
+        }
+        if (_scaleX != 1.0)
+        {
+            if (s.length)
+                s += " ";
+            s += "scaleX(" + _scaleX.toString() + ")";
+        }
+        if (_scaleY != 1.0)
+        {
+            if (s.length)
+                s += " ";
+            s += "scaleY(" + _scaleY.toString() + ")";
+        }
+        return s;
+    }
     //----------------------------------
     //  name
     //----------------------------------
@@ -1667,10 +1694,8 @@ COMPILE::JS
         COMPILE::JS
         {
             // Flex layouts don't use percentages the way the browser
-            // does, so we have to absolute position everything.  Before
-            // layout runs, we want to establish the parent as the
-            // offsetParent.  Other code may set position="absolute" later.
-            element.style.position = "relative";
+            // does, so we have to absolute position everything.
+            element.style.position = "absolute";
         }
         super.addedToParent();
         
@@ -2608,28 +2633,36 @@ COMPILE::JS
         dispatchEvent(new Event("explicitMaxHeightChanged"));
     }
 	
+    COMPILE::JS
+    private var _scaleX:Number = 1.0;
+    
 	COMPILE::JS
 	public function get scaleX():Number
 	{
-		return 1.0;
+		return _scaleX;
 	}
 	
 	COMPILE::JS
 	public function set scaleX(value:Number):void
 	{
-		// always 1.0
+        _scaleX = value;
+        element.style.transform = computeTransformString();
 	}
 	
+    COMPILE::JS
+    private var _scaleY:Number = 1.0;
+    
 	COMPILE::JS
 	public function get scaleY():Number
 	{
-		return 1.0;
+		return _scaleY;
 	}
 	
 	COMPILE::JS
 	public function set scaleY(value:Number):void
 	{
-		// always 1.0
+        _scaleY = value;
+        element.style.transform = computeTransformString();
 	}
 
     //----------------------------------


[royale-asjs] 02/04: use a div so we can measure it

Posted by ah...@apache.org.
This is an automated email from the ASF dual-hosted git repository.

aharui pushed a commit to branch develop
in repository https://gitbox.apache.org/repos/asf/royale-asjs.git

commit 0a1174f48a6108f6f2a0caa8a896d404a134f0e9
Author: Alex Harui <ah...@apache.org>
AuthorDate: Fri Nov 2 13:42:49 2018 -0700

    use a div so we can measure it
---
 .../src/main/royale/mx/core/UITextField.as         | 414 +++++++++++++++++----
 1 file changed, 334 insertions(+), 80 deletions(-)

diff --git a/frameworks/projects/MXRoyale/src/main/royale/mx/core/UITextField.as b/frameworks/projects/MXRoyale/src/main/royale/mx/core/UITextField.as
index 8c11a01..9461bea 100644
--- a/frameworks/projects/MXRoyale/src/main/royale/mx/core/UITextField.as
+++ b/frameworks/projects/MXRoyale/src/main/royale/mx/core/UITextField.as
@@ -39,6 +39,13 @@ import flash.text.TextLineMetrics;
  import mx.utils.StringUtil;
  
  import org.apache.royale.events.Event;
+ 
+ COMPILE::JS
+ {
+     import window.Text;
+ }
+ import org.apache.royale.core.ITextModel;
+ import mx.events.FlexEvent;
 
 use namespace mx_internal;
 
@@ -74,6 +81,9 @@ include "../styles/metadata/TextStyles.as"
  *  will modify its own <code>transform.matrix</code> to restore the default
  *  coordinate system locally.</p>
  *
+ *  This is mostly a copy of Label but with a DIV element instead of SPAN so
+ *  we can measure text.
+ *  
  *  @see flash.text.TextField
  *  @see mx.core.UITextFormat
  *  
@@ -82,7 +92,7 @@ include "../styles/metadata/TextStyles.as"
  *  @playerversion AIR 1.1
  *  @productversion Royale 0.9.3
  */
-public class UITextField  extends Label implements IUITextField
+public class UITextField  extends UIComponent implements IUITextField
        
 {
 
@@ -449,40 +459,224 @@ public class UITextField  extends Label implements IUITextField
             dispatchEvent(new Event("textFieldWidthChange")); */
     }
     
-    //----------------------------------
-    //  htmlText
-    //----------------------------------
-
-    /**
-     *  @private
-     */
-    /* override public function set htmlText(value:String):void
-    {
-        // TextField's htmlText property can't be set to null.
-       if (!value)
-            value = "";
-
-        // Performance optimization: if the htmlText hasn't changed,
-        // don't let the player think that we're dirty.
-        if (isHTML && super.htmlText == value)
-            return;
-
-        // Reapply the format because TextField would otherwise reset to
-        // black, Times New Roman, 12
-        if (cachedTextFormat && styleSheet == null)
-            defaultTextFormat = cachedTextFormat;
-            
-        super.htmlText = value;
-        
-        // Remember the htmlText that we've set,
-        // because the TextField doesn't remember it for us.
-        // We need it so that we can re-apply the HTML markup
-        // in validateNow() after the CSS styles change
-        explicitHTMLText = value;
-
-        if (invalidateDisplayListFlag)
-            validateNow();
-    }*/
+     //----------------------------------
+     //  htmlText
+     //----------------------------------
+     
+     /**
+      *  @private
+      *  Storage for the htmlText property.
+      *  In addition to being set in the htmlText setter,
+      *  it is automatically updated at two other times.
+      *  1. When the 'text' or 'htmlText' is pushed down into
+      *  the textField in commitProperties(), this causes
+      *  the textField to update its own 'htmlText'.
+      *  Therefore in commitProperties() we reset this storage var
+      *  to be in sync with the textField.
+      *  2. When the TextFormat of the textField changes
+      *  because a CSS style has changed (see validateNow()
+      *  in UITextField), the textField also updates its own 'htmlText'.
+      *  Therefore in textField_textFieldStyleChangeHandler()
+      */
+     
+     
+     [Bindable("htmlChange")]
+     [CollapseWhiteSpace]
+     [Inspectable(category="General", defaultValue="")]
+     
+     /**
+      *  Specifies the text displayed by the Label control, including HTML markup that
+      *  expresses the styles of that text.
+      *  When you specify HTML text in this property, you can use the subset of HTML
+      *  tags that is supported by the Flash TextField control.
+      *
+      *  <p>When you set this property, the HTML markup is applied
+      *  after the CSS styles for the Label instance are applied.
+      *  When you get this property, the HTML markup includes
+      *  the CSS styles.</p>
+      *
+      *  <p>For example, if you set this to be a string such as,
+      *  <code>"This is an example of &lt;b&gt;bold&lt;/b&gt; markup"</code>,
+      *  the text "This is an example of <b>bold</b> markup" appears
+      *  in the Label with whatever CSS styles normally apply.
+      *  Also, the word "bold" appears in boldface font because of the
+      *  <code>&lt;b&gt;</code> markup.</p>
+      *
+      *  <p>HTML markup uses characters such as &lt; and &gt;,
+      *  which have special meaning in XML (and therefore in MXML). So,
+      *  code such as the following does not compile:</p>
+      *
+      *  <pre>
+      *  &lt;mx:Label htmlText="This is an example of &lt;b&gt;bold&lt;/b&gt; markup"/&gt;
+      *  </pre>
+      *
+      *  <p>There are three ways around this problem.</p>
+      *
+      *  <ul>
+      *
+      *  <li>
+      *
+      *  <p>Set the <code>htmlText</code> property in an ActionScript method called as
+      *  an <code>initialize</code> handler:</p>
+      *
+      *  <pre>
+      *  &lt;mx:Label id="myLabel" initialize="myLabel_initialize()"/&gt;
+      *  </pre>
+      *
+      *  <p>where the <code>myLabel_initialize</code> method is in a script CDATA section:</p>
+      *
+      *  <pre>
+      *  &lt;fx:Script&gt;
+      *  &lt;![CDATA[
+      *  private function myLabel_initialize():void {
+      *      myLabel.htmlText = "This is an example of &lt;b&gt;bold&lt;/b&gt; markup";
+      *  }
+      *  ]]&gt;
+      *  &lt;/fx:Script&gt;
+      *
+      *  </pre>
+      *
+      *  <p>This is the simplest approach because the HTML markup
+      *  remains easily readable.
+      *  Notice that you must assign an <code>id</code> to the label
+      *  so you can refer to it in the <code>initialize</code>
+      *  handler.</p>
+      *
+      *  </li>
+      *
+      *  <li>
+      *
+      *  <p>Specify the <code>htmlText</code> property by using a child tag
+      *  with a CDATA section. A CDATA section in XML contains character data
+      *  where characters like &lt; and &gt; aren't given a special meaning.</p>
+      *
+      *  <pre>
+      *  &lt;mx:Label&gt;
+      *      &lt;mx:htmlText&gt;&lt;![CDATA[This is an example of &lt;b&gt;bold&lt;/b&gt; markup]]&gt;&lt;/mx:htmlText&gt;
+      *  &lt;mx:Label/&gt;
+      *  </pre>
+      *
+      *  <p>You must write the <code>htmlText</code> property as a child tag
+      *  rather than as an attribute on the <code>&lt;mx:Label&gt;</code> tag
+      *  because XML doesn't allow CDATA for the value of an attribute.
+      *  Notice that the markup is readable, but the CDATA section makes
+      *  this approach more complicated.</p>
+      *
+      *  </li>
+      *
+      *  <li>
+      *
+      *  <p>Use an <code>hmtlText</code> attribute where any occurences
+      *  of the HTML markup characters &lt; and &gt; in the attribute value
+      *  are written instead as the XML "entities" <code>&amp;lt;</code>
+      *  and <code>&amp;gt;</code>:</p>
+      *
+      *  <pre>
+      *  &lt;mx:Label htmlText="This is an example of &amp;lt;b&amp;gt;bold&amp;lt;/b&amp;gt; markup"/&amp;gt;
+      *  </pre>
+      *
+      *  Adobe does not recommend this approach because the HTML markup becomes
+      *  nearly impossible to read.
+      *
+      *  </li>
+      *
+      *  </ul>
+      *
+      *  <p>If the <code>condenseWhite</code> property is <code>true</code>
+      *  when you set the <code>htmlText</code> property, multiple
+      *  white-space characters are condensed, as in HTML-based browsers;
+      *  for example, three consecutive spaces are displayed
+      *  as a single space.
+      *  The default value for <code>condenseWhite</code> is
+      *  <code>false</code>, so you must set <code>condenseWhite</code>
+      *  to <code>true</code> to collapse the white space.</p>
+      *
+      *  <p>If you read back the <code>htmlText</code> property quickly
+      *  after setting it, you get the same string that you set.
+      *  However, after the LayoutManager runs, the value changes
+      *  to include additional markup that includes the CSS styles.</p>
+      *
+      *  <p>Setting the <code>htmlText</code> property affects the <code>text</code>
+      *  property in several ways.
+      *  If you read the <code>text</code> property quickly after setting
+      *  the <code>htmlText</code> property, you get <code>null</code>,
+      *  which indicates that the <code>text</code> corresponding to the new
+      *  <code>htmlText</code> has not yet been determined.
+      *  However, after the LayoutManager runs, the <code>text</code> property
+      *  value changes to the <code>htmlText</code> string with all the
+      *  HTML markup removed; that is,
+      *  the value is the characters that the Label actually displays.</p>
+      *
+      *  <p>Conversely, if you set the <code>text</code> property,
+      *  any previously set <code>htmlText</code> is irrelevant.
+      *  If you read the <code>htmlText</code> property quickly after setting
+      *  the <code>text</code> property, you get <code>null</code>,
+      *  which indicates that the <code>htmlText</code> that corresponds to the new
+      *  <code>text</code> has not yet been determined.
+      *  However, after the LayoutManager runs, the <code>htmlText</code> property
+      *  value changes to the new text plus the HTML markup for the CSS styles.</p>
+      *
+      *  <p>To make the LayoutManager run immediately, you can call the
+      *  <code>validateNow()</code> method on the Label.
+      *  For example, you could set some <code>htmlText</code>,
+      *  call the <code>validateNow()</code> method, and immediately
+      *  obtain the corresponding <code>text</code> that doesn't have
+      *  the HTML markup.</p>
+      *
+      *  <p>If you set both <code>text</code> and <code>htmlText</code> properties
+      *  in ActionScript, whichever is set last takes effect.
+      *  Do not set both in MXML, because MXML does not guarantee that
+      *  the properties of an instance get set in any particular order.</p>
+      *
+      *  <p>Setting either <code>text</code> or <code>htmlText</code> property
+      *  inside a loop is a fast operation, because the underlying TextField
+      *  that actually renders the text is not updated until
+      *  the LayoutManager runs.</p>
+      *
+      *  <p>If you try to set this property to <code>null</code>,
+      *  it is set, instead, to the empty string.
+      *  If the property temporarily has the value <code>null</code>,
+      *  it indicates that the <code>text</code> has been recently set
+      *  and the corresponding <code>htmlText</code>
+      *  has not yet been determined.</p>
+      *
+      *  @default ""
+      *
+      *  @see flash.text.TextField#htmlText
+      *
+      *  @langversion 3.0
+      *  @playerversion Flash 9
+      *  @playerversion AIR 1.1
+      *  @productversion Flex 3
+      */
+     public function get htmlText():String
+     {
+         COMPILE::SWF
+             {
+                 return ITextModel(model).html;
+             }
+             COMPILE::JS
+             {
+                 return element.innerHTML;
+             }
+     }
+     
+     /**
+      *  @private
+      */
+     public function set htmlText(value:String):void
+     {
+         COMPILE::SWF
+             {
+                 ITextModel(model).html = value;
+             }
+             COMPILE::JS
+             {
+                 this.element.innerHTML = value;
+                 this.dispatchEvent('textChange');
+             }
+             invalidateSize();
+     }
 
     //----------------------------------
     //  parent
@@ -518,51 +712,61 @@ public class UITextField  extends Label implements IUITextField
         return _parent ? _parent : super.parent;
     }
  */
-    //----------------------------------
-    //  text
-    //----------------------------------
-
-    /**
-     *  @private
-     */
-    /* override public function set text(value:String):void
-    {
-        // TextField's text property can't be set to null.
-       if (!value)
-            value = "";
-        
-        // Performance optimization: if the text hasn't changed,
-        // don't let the player think that we're dirty.
-        if (!isHTML && super.text == value)
-            return;
-
-        super.text = value;
-
-        explicitHTMLText = null;
-
-        if (invalidateDisplayListFlag)
-            validateNow();
-    }
-	public function get text():String
-    {
-        // TextField's text property can't be set to null.
-       if (!value)
-            value = "";
-        
-        // Performance optimization: if the text hasn't changed,
-        // don't let the player think that we're dirty.
-        if (!isHTML && super.text == value)
-            return;
-
-        super.text = value;
-
-        explicitHTMLText = null;
-
-        if (invalidateDisplayListFlag)
-            validateNow();
-			return "";
-    }
-    */
+     
+     //----------------------------------
+     //  text
+     //----------------------------------
+     
+     
+     COMPILE::JS
+     protected var textNode:window.Text;
+     
+     COMPILE::JS
+     private var _text:String = "";
+     
+     [Bindable("textChange")]
+     /**
+      *  The text to display in the label.
+      *
+      *  @langversion 3.0
+      *  @playerversion Flash 10.2
+      *  @playerversion AIR 2.6
+      *  @productversion Royale 0.0
+      */
+     public function get text():String
+     {
+         COMPILE::SWF
+             {
+                 return ITextModel(model).text;
+             }
+             COMPILE::JS
+             {
+                 return _text;
+             }
+     }
+     
+     /**
+      *  @private
+      */
+     public function set text(value:String):void
+     {
+         COMPILE::SWF
+             {
+                 ITextModel(model).text = value;
+             }
+             COMPILE::JS
+             {
+                 if (textNode)
+                 {
+                     _text = value;
+                     textNode.nodeValue = value;
+                     this.dispatchEvent('textChange');
+                 }
+             }
+             
+             invalidateSize();
+         
+     }
 
 	//----------------------------------
 	//  textColor
@@ -792,6 +996,56 @@ public class UITextField  extends Label implements IUITextField
         return NameUtil.getUnqualifiedClassName(this);
     }
  */
+     //----------------------------------
+     //  data
+     //----------------------------------
+     
+     /**
+      *  @private
+      *  Storage for the data property.
+      */
+     private var _data:Object;
+     
+     [Bindable("dataChange")]
+     [Inspectable(environment="none")]
+     
+     /**
+      *  Lets you pass a value to the component
+      *  when you use it in an item renderer or item editor.
+      *  You typically use data binding to bind a field of the <code>data</code>
+      *  property to a property of this component.
+      *
+      *  <p>When you use the control as a drop-in item renderer or drop-in
+      *  item editor, Flex automatically writes the current value of the item
+      *  to the <code>text</code> property of this control.</p>
+      *
+      *  <p>You do not set this property in MXML.</p>
+      *
+      *  @default null
+      *  @see mx.core.IDataRenderer
+      *
+      *  @langversion 3.0
+      *  @playerversion Flash 9
+      *  @playerversion AIR 1.1
+      *  @productversion Flex 3
+      */
+     public function get data():Object
+     {
+         return _data;
+     }
+     
+     /**
+      *  @private
+      */
+     public function set data(value:Object):void
+     {
+         var newText:*;
+         
+         _data = value;
+         
+         dispatchEvent(new FlexEvent(FlexEvent.DATA_CHANGE));
+     }
+
     //----------------------------------
     //  document
     //----------------------------------