You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@royale.apache.org by ca...@apache.org on 2018/09/17 10:53:42 UTC

[royale-asjs] branch develop updated: Fixes a bug in all Jewel Layouts where components loose all class names when doing a removeElement and then addElement

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

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


The following commit(s) were added to refs/heads/develop by this push:
     new 25f80bb  Fixes a bug in all Jewel Layouts where components loose all class names when doing a removeElement and then addElement
25f80bb is described below

commit 25f80bb814f1b4960406df570f017cfb7816af72
Author: Carlos Rovira <ca...@apache.org>
AuthorDate: Mon Sep 17 12:53:35 2018 +0200

    Fixes a bug in all Jewel Layouts where components loose all class names when doing a removeElement and then addElement
---
 .../royale/jewel/beads/layouts/BasicLayout.as      | 43 ++++++++------------
 .../royale/jewel/beads/layouts/GridCellLayout.as   | 34 ++++++++--------
 .../royale/jewel/beads/layouts/GridLayout.as       | 33 +++++++---------
 .../beads/layouts/HorizontalCenteredLayout.as      | 44 +++++++++------------
 .../jewel/beads/layouts/HorizontalFlowLayout.as    | 44 +++++++++------------
 .../royale/jewel/beads/layouts/HorizontalLayout.as | 44 +++++++++------------
 .../royale/jewel/beads/layouts/NullLayout.as       | 22 ++++-------
 .../jewel/beads/layouts/SimpleHorizontalLayout.as  | 42 ++++++++++----------
 .../jewel/beads/layouts/SimpleVerticalLayout.as    | 43 ++++++++++----------
 .../royale/jewel/beads/layouts/StyledLayoutBase.as | 31 ++++++++++++---
 .../royale/jewel/beads/layouts/TableLayout.as      | 41 ++++++++-----------
 .../royale/jewel/beads/layouts/TileLayout.as       |  3 +-
 .../jewel/beads/layouts/VerticalCenteredLayout.as  | 44 +++++++++------------
 .../jewel/beads/layouts/VerticalFlowLayout.as      | 43 +++++++++-----------
 .../royale/jewel/beads/layouts/VerticalLayout.as   | 46 +++++++++-------------
 .../apache/royale/jewel/beads/views/TableView.as   | 20 +++++++---
 16 files changed, 264 insertions(+), 313 deletions(-)

diff --git a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/BasicLayout.as b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/BasicLayout.as
index c3ea9c8..3d1c67f 100644
--- a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/BasicLayout.as
+++ b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/BasicLayout.as
@@ -18,16 +18,13 @@
 ////////////////////////////////////////////////////////////////////////////////
 package org.apache.royale.jewel.beads.layouts
 {
-	import org.apache.royale.core.LayoutBase;
-	import org.apache.royale.core.IBeadLayout;
-	import org.apache.royale.core.ILayoutChild;
-	import org.apache.royale.core.ILayoutView;
-	import org.apache.royale.core.IUIBase;
-	import org.apache.royale.core.IStrand;
-
 	COMPILE::JS {
     	import org.apache.royale.core.UIBase;
     }
+	import org.apache.royale.core.ILayoutChild;
+	import org.apache.royale.core.ILayoutView;
+	import org.apache.royale.core.IUIBase;
+	import org.apache.royale.events.Event;
 
     /**
      *  The BasicLayout class is a simple layout
@@ -40,7 +37,7 @@ package org.apache.royale.jewel.beads.layouts
      *  @playerversion AIR 2.6
      *  @productversion Royale 0.9.4
      */
-	public class BasicLayout extends LayoutBase implements IBeadLayout
+	public class BasicLayout extends StyledLayoutBase
 	{
         /**
          *  Constructor.
@@ -60,28 +57,22 @@ package org.apache.royale.jewel.beads.layouts
 		 */
 		public static const LAYOUT_TYPE_NAMES:String = "layout absolute";
 
-		COMPILE::JS
-		private var hostComponent:UIBase;
-
-		COMPILE::JS
-		protected var hostClassList:DOMTokenList;
-
 		/**
-		 *  @copy org.apache.royale.core.IBead#strand
-		 *  
-		 *  @langversion 3.0
-		 *  @playerversion Flash 10.2
-		 *  @playerversion AIR 2.6
-		 *  @productversion Royale 0.9.4
-		 */
-		override public function set strand(value:IStrand):void
+		 *  Add class selectors when the component is addedToParent
+		 *  Otherwise component will not get the class selectors when 
+		 *  perform "removeElement" and then "addElement"
+		 * 
+ 		 *  @langversion 3.0
+ 		 *  @playerversion Flash 10.2
+ 		 *  @playerversion AIR 2.6
+ 		 *  @productversion Royale 0.9.4
+ 		 */
+		override public function beadsAddedHandler(event:Event = null):void
 		{
-			super.strand = value;
-
+			super.beadsAddedHandler();
+			
 			COMPILE::JS
 			{
-				hostComponent = host as UIBase;
-				hostClassList = hostComponent.positioner.classList;
 				if (hostClassList.contains("layout"))
 					hostClassList.remove("layout");
 				hostClassList.add("layout");
diff --git a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/GridCellLayout.as b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/GridCellLayout.as
index c040879..c2b4f26 100644
--- a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/GridCellLayout.as
+++ b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/GridCellLayout.as
@@ -18,16 +18,14 @@
 ////////////////////////////////////////////////////////////////////////////////
 package org.apache.royale.jewel.beads.layouts
 {
-	import org.apache.royale.jewel.beads.layouts.StyledLayoutBase;
-	import org.apache.royale.core.IBeadLayout;
-	import org.apache.royale.core.ILayoutChild;
-	import org.apache.royale.core.ILayoutView;
-	import org.apache.royale.core.IUIBase;
-	import org.apache.royale.core.IStrand;
-
 	COMPILE::JS {
     	import org.apache.royale.core.UIBase;
     }
+	import org.apache.royale.core.ILayoutChild;
+	import org.apache.royale.core.ILayoutView;
+	import org.apache.royale.core.IUIBase;
+	import org.apache.royale.events.Event;
+	import org.apache.royale.jewel.beads.layouts.StyledLayoutBase;
 
     /**
      *  The GridCellLayout class is the layout used for childrens in a Grid
@@ -37,7 +35,7 @@ package org.apache.royale.jewel.beads.layouts
      *  @playerversion AIR 2.6
      *  @productversion Royale 0.9.4
      */
-	public class GridCellLayout extends StyledLayoutBase implements IBeadLayout
+	public class GridCellLayout extends StyledLayoutBase
 	{
 		public static const MAX_COLUMNS:Number = 12;
 		public static const PHONE:String = "phone";
@@ -64,16 +62,18 @@ package org.apache.royale.jewel.beads.layouts
 		public static const LAYOUT_TYPE_NAMES:String = "cell";
 
 		/**
-		 *  @copy org.apache.royale.core.IBead#strand
-		 *  
-		 *  @langversion 3.0
-		 *  @playerversion Flash 10.2
-		 *  @playerversion AIR 2.6
-		 *  @productversion Royale 0.9.4
-		 */
-		override public function set strand(value:IStrand):void
+		 *  Add class selectors when the component is addedToParent
+		 *  Otherwise component will not get the class selectors when 
+		 *  perform "removeElement" and then "addElement"
+		 * 
+ 		 *  @langversion 3.0
+ 		 *  @playerversion Flash 10.2
+ 		 *  @playerversion AIR 2.6
+ 		 *  @productversion Royale 0.9.4
+ 		 */
+		override public function beadsAddedHandler(event:Event = null):void
 		{
-			super.strand = value;
+			super.beadsAddedHandler();
 
 			COMPILE::JS
 			{
diff --git a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/GridLayout.as b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/GridLayout.as
index c2a1828..451f435 100644
--- a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/GridLayout.as
+++ b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/GridLayout.as
@@ -18,15 +18,12 @@
 ////////////////////////////////////////////////////////////////////////////////
 package org.apache.royale.jewel.beads.layouts
 {
-	import org.apache.royale.jewel.beads.layouts.StyledLayoutBase;
-	import org.apache.royale.core.IBeadLayout;
-	import org.apache.royale.core.IStrand;
-	import org.apache.royale.core.IParentIUIBase;
-
 	COMPILE::JS {
+		import org.apache.royale.core.UIBase;
 		import org.apache.royale.core.WrappedHTMLElement;
-    	import org.apache.royale.core.UIBase;
     }
+	import org.apache.royale.events.Event;
+	import org.apache.royale.jewel.beads.layouts.StyledLayoutBase;
 
     /**
      *  The GridLayout class sets its childrens in a grid with cells filling all
@@ -37,7 +34,7 @@ package org.apache.royale.jewel.beads.layouts
      *  @playerversion AIR 2.6
      *  @productversion Royale 0.9.4
      */
-	public class GridLayout extends StyledLayoutBase implements IBeadLayout
+	public class GridLayout extends StyledLayoutBase
 	{
         /**
          *  Constructor.
@@ -58,18 +55,18 @@ package org.apache.royale.jewel.beads.layouts
 		public static const LAYOUT_TYPE_NAMES:String = "layout grid";
 
 		/**
-		 *  @copy org.apache.royale.core.IBead#strand
-		 *  
-		 *  @langversion 3.0
-		 *  @playerversion Flash 10.2
-		 *  @playerversion AIR 2.6
-		 *  @productversion Royale 0.9.4
-		 *  @royaleignorecoercion org.apache.royale.core.IParentIUIBase
-		 *  @royaleignorecoercion org.apache.royale.core.WrappedHTMLElement
-		 */
-		override public function set strand(value:IStrand):void
+		 *  Add class selectors when the component is addedToParent
+		 *  Otherwise component will not get the class selectors when 
+		 *  perform "removeElement" and then "addElement"
+		 * 
+ 		 *  @langversion 3.0
+ 		 *  @playerversion Flash 10.2
+ 		 *  @playerversion AIR 2.6
+ 		 *  @productversion Royale 0.9.4
+ 		 */
+		override public function beadsAddedHandler(event:Event = null):void
 		{
-			super.strand = value;
+			super.beadsAddedHandler();
 
 			COMPILE::JS
 			{
diff --git a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/HorizontalCenteredLayout.as b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/HorizontalCenteredLayout.as
index 11497d6..3d15f81 100644
--- a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/HorizontalCenteredLayout.as
+++ b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/HorizontalCenteredLayout.as
@@ -18,26 +18,18 @@
 ////////////////////////////////////////////////////////////////////////////////
 package org.apache.royale.jewel.beads.layouts
 {
-	import org.apache.royale.core.LayoutBase;
-	import org.apache.royale.core.IBeadLayout;
-    import org.apache.royale.core.IBorderPaddingMarginValuesImpl;
+	COMPILE::JS {
+        import org.apache.royale.core.UIBase;
+        import org.apache.royale.core.WrappedHTMLElement;
+    }
+	import org.apache.royale.core.IBorderPaddingMarginValuesImpl;
 	import org.apache.royale.core.ILayoutChild;
-	import org.apache.royale.core.ILayoutHost;
 	import org.apache.royale.core.ILayoutView;
-	import org.apache.royale.core.IParentIUIBase;
 	import org.apache.royale.core.IUIBase;
-    import org.apache.royale.core.layout.EdgeData;
 	import org.apache.royale.core.ValuesManager;
-	import org.apache.royale.core.IBorderPaddingMarginValuesImpl;
-	import org.apache.royale.core.IStrand;
-	import org.apache.royale.utils.css.addDynamicSelector;
-	import org.apache.royale.utils.StringUtil;
+	import org.apache.royale.core.layout.EdgeData;
 	import org.apache.royale.core.layout.ILayoutStyleProperties;
-
-	COMPILE::JS {
-        import org.apache.royale.core.WrappedHTMLElement;
-		import org.apache.royale.core.UIBase;
-    }
+	import org.apache.royale.events.Event;
 
     /**
 	 *  The HorizontalCenteredLayout class is a simple layout
@@ -70,18 +62,18 @@ package org.apache.royale.jewel.beads.layouts
 		public static const LAYOUT_TYPE_NAMES:String = "layout horizontal centered";
 
 		/**
-		 *  @copy org.apache.royale.core.IBead#strand
-		 *  
-		 *  @langversion 3.0
-		 *  @playerversion Flash 10.2
-		 *  @playerversion AIR 2.6
-		 *  @productversion Royale 0.9.4
-		 *  @royaleignorecoercion org.apache.royale.core.IParentIUIBase
-		 *  @royaleignorecoercion org.apache.royale.core.WrappedHTMLElement
-		 */
-		override public function set strand(value:IStrand):void
+		 *  Add class selectors when the component is addedToParent
+		 *  Otherwise component will not get the class selectors when 
+		 *  perform "removeElement" and then "addElement"
+		 * 
+ 		 *  @langversion 3.0
+ 		 *  @playerversion Flash 10.2
+ 		 *  @playerversion AIR 2.6
+ 		 *  @productversion Royale 0.9.4
+ 		 */
+		override public function beadsAddedHandler(event:Event = null):void
 		{
-			super.strand = value;
+			super.beadsAddedHandler();
 
 			COMPILE::JS
 			{
diff --git a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/HorizontalFlowLayout.as b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/HorizontalFlowLayout.as
index f43c9cb..dda3999 100644
--- a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/HorizontalFlowLayout.as
+++ b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/HorizontalFlowLayout.as
@@ -18,26 +18,18 @@
 ////////////////////////////////////////////////////////////////////////////////
 package org.apache.royale.jewel.beads.layouts
 {
-	import org.apache.royale.core.LayoutBase;
-	import org.apache.royale.core.IBeadLayout;
-    import org.apache.royale.core.IBorderPaddingMarginValuesImpl;
+	COMPILE::JS {
+        import org.apache.royale.core.UIBase;
+        import org.apache.royale.core.WrappedHTMLElement;
+    }
+	import org.apache.royale.core.IBorderPaddingMarginValuesImpl;
 	import org.apache.royale.core.ILayoutChild;
-	import org.apache.royale.core.ILayoutHost;
 	import org.apache.royale.core.ILayoutView;
-	import org.apache.royale.core.IParentIUIBase;
 	import org.apache.royale.core.IUIBase;
-    import org.apache.royale.core.layout.EdgeData;
 	import org.apache.royale.core.ValuesManager;
-	import org.apache.royale.core.IBorderPaddingMarginValuesImpl;
-	import org.apache.royale.core.IStrand;
-	import org.apache.royale.utils.css.addDynamicSelector;
-	import org.apache.royale.utils.StringUtil;
+	import org.apache.royale.core.layout.EdgeData;
 	import org.apache.royale.core.layout.ILayoutStyleProperties;
-
-	COMPILE::JS {
-        import org.apache.royale.core.WrappedHTMLElement;
-		import org.apache.royale.core.UIBase;
-    }
+	import org.apache.royale.events.Event;
 
     /**
 	 *  The HorizontalFlowLayout class is a simple layout
@@ -70,18 +62,18 @@ package org.apache.royale.jewel.beads.layouts
 		public static const LAYOUT_TYPE_NAMES:String = "layout horizontal flow";
 
 		/**
-		 *  @copy org.apache.royale.core.IBead#strand
-		 *  
-		 *  @langversion 3.0
-		 *  @playerversion Flash 10.2
-		 *  @playerversion AIR 2.6
-		 *  @productversion Royale 0.9.4
-		 *  @royaleignorecoercion org.apache.royale.core.IParentIUIBase
-		 *  @royaleignorecoercion org.apache.royale.core.WrappedHTMLElement
-		 */
-		override public function set strand(value:IStrand):void
+		 *  Add class selectors when the component is addedToParent
+		 *  Otherwise component will not get the class selectors when 
+		 *  perform "removeElement" and then "addElement"
+		 * 
+ 		 *  @langversion 3.0
+ 		 *  @playerversion Flash 10.2
+ 		 *  @playerversion AIR 2.6
+ 		 *  @productversion Royale 0.9.4
+ 		 */
+		override public function beadsAddedHandler(event:Event = null):void
 		{
-			super.strand = value;
+			super.beadsAddedHandler();
 
 			COMPILE::JS
 			{
diff --git a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/HorizontalLayout.as b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/HorizontalLayout.as
index d8cc47b..726ddc3 100644
--- a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/HorizontalLayout.as
+++ b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/HorizontalLayout.as
@@ -18,26 +18,18 @@
 ////////////////////////////////////////////////////////////////////////////////
 package org.apache.royale.jewel.beads.layouts
 {
-	import org.apache.royale.core.LayoutBase;
-	import org.apache.royale.core.IBeadLayout;
-    import org.apache.royale.core.IBorderPaddingMarginValuesImpl;
+	COMPILE::JS {
+        import org.apache.royale.core.UIBase;
+        import org.apache.royale.core.WrappedHTMLElement;
+    }
+	import org.apache.royale.core.IBorderPaddingMarginValuesImpl;
 	import org.apache.royale.core.ILayoutChild;
-	import org.apache.royale.core.ILayoutHost;
 	import org.apache.royale.core.ILayoutView;
-	import org.apache.royale.core.IParentIUIBase;
 	import org.apache.royale.core.IUIBase;
-    import org.apache.royale.core.layout.EdgeData;
 	import org.apache.royale.core.ValuesManager;
-	import org.apache.royale.core.IBorderPaddingMarginValuesImpl;
-	import org.apache.royale.core.IStrand;
-	import org.apache.royale.utils.css.addDynamicSelector;
-	import org.apache.royale.utils.StringUtil;
+	import org.apache.royale.core.layout.EdgeData;
 	import org.apache.royale.core.layout.ILayoutStyleProperties;
-
-	COMPILE::JS {
-        import org.apache.royale.core.WrappedHTMLElement;
-		import org.apache.royale.core.UIBase;
-    }
+	import org.apache.royale.events.Event;
 
     /**
 	 *  The HorizontalLayout class is a simple layout
@@ -70,18 +62,18 @@ package org.apache.royale.jewel.beads.layouts
 		public static const LAYOUT_TYPE_NAMES:String = "layout horizontal";
 
 		/**
-		 *  @copy org.apache.royale.core.IBead#strand
-		 *  
-		 *  @langversion 3.0
-		 *  @playerversion Flash 10.2
-		 *  @playerversion AIR 2.6
-		 *  @productversion Royale 0.9.4
-		 *  @royaleignorecoercion org.apache.royale.core.IParentIUIBase
-		 *  @royaleignorecoercion org.apache.royale.core.WrappedHTMLElement
-		 */
-		override public function set strand(value:IStrand):void
+		 *  Add class selectors when the component is addedToParent
+		 *  Otherwise component will not get the class selectors when 
+		 *  perform "removeElement" and then "addElement"
+		 * 
+ 		 *  @langversion 3.0
+ 		 *  @playerversion Flash 10.2
+ 		 *  @playerversion AIR 2.6
+ 		 *  @productversion Royale 0.9.4
+ 		 */
+		override public function beadsAddedHandler(event:Event = null):void
 		{
-			super.strand = value;
+			super.beadsAddedHandler();
 
 			COMPILE::JS
 			{
diff --git a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/NullLayout.as b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/NullLayout.as
index 8618f27..ca8b678 100644
--- a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/NullLayout.as
+++ b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/NullLayout.as
@@ -18,16 +18,10 @@
 ////////////////////////////////////////////////////////////////////////////////
 package org.apache.royale.jewel.beads.layouts
 {
-	import org.apache.royale.core.LayoutBase;
-	import org.apache.royale.core.IBeadLayout;
-	import org.apache.royale.core.ILayoutChild;
-	import org.apache.royale.core.ILayoutView;
-	import org.apache.royale.core.IUIBase;
-	import org.apache.royale.core.IStrand;
-
 	COMPILE::JS {
-    	import org.apache.royale.core.UIBase;
-    }
+	    import org.apache.royale.core.UIBase;
+	}
+	import org.apache.royale.core.LayoutBase;
 
     /**
      *  The NullLayout class is a layout class used to override other layout classes
@@ -39,7 +33,7 @@ package org.apache.royale.jewel.beads.layouts
      *  @playerversion AIR 2.6
      *  @productversion Royale 0.9.4
      */
-	public class NullLayout extends LayoutBase implements IBeadLayout
+	public class NullLayout extends LayoutBase
 	{
         /**
          *  Constructor.
@@ -49,9 +43,9 @@ package org.apache.royale.jewel.beads.layouts
          *  @playerversion AIR 2.6
          *  @productversion Royale 0.9.4
          */
-		public function NullLayout()
-		{
-			super();
-		}        
+        public function NullLayout()
+        {
+            super();
+        }        
 	}
 }
diff --git a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/SimpleHorizontalLayout.as b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/SimpleHorizontalLayout.as
index e69fe2f..3ec3ce5 100644
--- a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/SimpleHorizontalLayout.as
+++ b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/SimpleHorizontalLayout.as
@@ -18,20 +18,18 @@
 ////////////////////////////////////////////////////////////////////////////////
 package org.apache.royale.jewel.beads.layouts
 {
-	import org.apache.royale.jewel.beads.layouts.StyledLayoutBase;
-	import org.apache.royale.core.IBeadLayout;
-    import org.apache.royale.core.IBorderPaddingMarginValuesImpl;
-	import org.apache.royale.core.ILayoutChild;
-	import org.apache.royale.core.ILayoutView;
-	import org.apache.royale.core.IUIBase;
-    import org.apache.royale.core.layout.EdgeData;
-	import org.apache.royale.core.ValuesManager;
-	import org.apache.royale.core.IStrand;
-
 	COMPILE::JS 
 	{
 		import org.apache.royale.core.UIBase;
 	}
+	import org.apache.royale.core.IBorderPaddingMarginValuesImpl;
+	import org.apache.royale.core.ILayoutChild;
+	import org.apache.royale.core.ILayoutView;
+	import org.apache.royale.core.IUIBase;
+	import org.apache.royale.core.ValuesManager;
+	import org.apache.royale.core.layout.EdgeData;
+	import org.apache.royale.events.Event;
+	import org.apache.royale.jewel.beads.layouts.StyledLayoutBase;
 
     /**
      *  The HorizontalLayout class is a simple layout
@@ -44,7 +42,7 @@ package org.apache.royale.jewel.beads.layouts
      *  @playerversion AIR 2.6
      *  @productversion Royale 0.9.4
      */
-	public class SimpleHorizontalLayout extends StyledLayoutBase implements IBeadLayout
+	public class SimpleHorizontalLayout extends StyledLayoutBase
 	{
         /**
          *  Constructor.
@@ -65,18 +63,18 @@ package org.apache.royale.jewel.beads.layouts
 		public static const LAYOUT_TYPE_NAMES:String = "layout horizontal";
 
 		/**
-		 *  @copy org.apache.royale.core.IBead#strand
-		 *  
-		 *  @langversion 3.0
-		 *  @playerversion Flash 10.2
-		 *  @playerversion AIR 2.6
-		 *  @productversion Royale 0.9.4
-		 *  @royaleignorecoercion org.apache.royale.core.IParentIUIBase
-		 *  @royaleignorecoercion org.apache.royale.core.WrappedHTMLElement
-		 */
-		override public function set strand(value:IStrand):void
+		 *  Add class selectors when the component is addedToParent
+		 *  Otherwise component will not get the class selectors when 
+		 *  perform "removeElement" and then "addElement"
+		 * 
+ 		 *  @langversion 3.0
+ 		 *  @playerversion Flash 10.2
+ 		 *  @playerversion AIR 2.6
+ 		 *  @productversion Royale 0.9.4
+ 		 */
+		override public function beadsAddedHandler(event:Event = null):void
 		{
-			super.strand = value;
+			super.beadsAddedHandler();
 
 			COMPILE::JS
 			{
diff --git a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/SimpleVerticalLayout.as b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/SimpleVerticalLayout.as
index a4c0084..938cc6b 100644
--- a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/SimpleVerticalLayout.as
+++ b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/SimpleVerticalLayout.as
@@ -18,20 +18,18 @@
 ////////////////////////////////////////////////////////////////////////////////
 package org.apache.royale.jewel.beads.layouts
 {
-	import org.apache.royale.jewel.beads.layouts.StyledLayoutBase;
-	import org.apache.royale.core.IBeadLayout;
-    import org.apache.royale.core.IBorderPaddingMarginValuesImpl;
-	import org.apache.royale.core.ILayoutChild;
-	import org.apache.royale.core.ILayoutView;
-	import org.apache.royale.core.IUIBase;
-    import org.apache.royale.core.layout.EdgeData;
-	import org.apache.royale.core.ValuesManager;
-	import org.apache.royale.core.IStrand;
-
 	COMPILE::JS
 	{
 		import org.apache.royale.core.UIBase;
 	}
+	import org.apache.royale.core.IBorderPaddingMarginValuesImpl;
+	import org.apache.royale.core.ILayoutChild;
+	import org.apache.royale.core.ILayoutView;
+	import org.apache.royale.core.IUIBase;
+	import org.apache.royale.core.ValuesManager;
+	import org.apache.royale.core.layout.EdgeData;
+	import org.apache.royale.events.Event;
+	import org.apache.royale.jewel.beads.layouts.StyledLayoutBase;
 
 	/**
 	 *  The VerticalLayout class is a simple layout
@@ -44,7 +42,7 @@ package org.apache.royale.jewel.beads.layouts
 	 *  @playerversion AIR 2.6
 	 *  @productversion Royale 0.9.4
 	 */
-	public class SimpleVerticalLayout extends StyledLayoutBase implements IBeadLayout
+	public class SimpleVerticalLayout extends StyledLayoutBase
 	{
 		/**
 		 *  Constructor.
@@ -64,19 +62,20 @@ package org.apache.royale.jewel.beads.layouts
 		 */
 		public static const LAYOUT_TYPE_NAMES:String = "layout vertical";
 
+
 		/**
-		 *  @copy org.apache.royale.core.IBead#strand
-		 *  
-		 *  @langversion 3.0
-		 *  @playerversion Flash 10.2
-		 *  @playerversion AIR 2.6
-		 *  @productversion Royale 0.9.4
-		 *  @royaleignorecoercion org.apache.royale.core.IParentIUIBase
-		 *  @royaleignorecoercion org.apache.royale.core.WrappedHTMLElement
-		 */
-		override public function set strand(value:IStrand):void
+		 *  Add class selectors when the component is addedToParent
+		 *  Otherwise component will not get the class selectors when 
+		 *  perform "removeElement" and then "addElement"
+		 * 
+ 		 *  @langversion 3.0
+ 		 *  @playerversion Flash 10.2
+ 		 *  @playerversion AIR 2.6
+ 		 *  @productversion Royale 0.9.4
+ 		 */
+		override public function beadsAddedHandler(event:Event = null):void
 		{
-			super.strand = value;
+			super.beadsAddedHandler();
 
 			COMPILE::JS
 			{
diff --git a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/StyledLayoutBase.as b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/StyledLayoutBase.as
index 44a622e..430142f 100644
--- a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/StyledLayoutBase.as
+++ b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/StyledLayoutBase.as
@@ -18,14 +18,14 @@
 ////////////////////////////////////////////////////////////////////////////////
 package org.apache.royale.jewel.beads.layouts
 {
-	import org.apache.royale.core.LayoutBase;
-	import org.apache.royale.core.IBeadLayout;
 	import org.apache.royale.core.IStrand;
-	import org.apache.royale.core.UIBase;
 	import org.apache.royale.core.IUIBase;
+	import org.apache.royale.core.LayoutBase;
+	import org.apache.royale.core.UIBase;
 	import org.apache.royale.core.ValuesManager;
-
-
+	import org.apache.royale.events.Event;
+	import org.apache.royale.events.IEventDispatcher;
+	
     /**
      *  The StyledLayoutBase class is an extension of LayoutBase
 	 *  to define various common layout features for the rest of
@@ -36,7 +36,7 @@ package org.apache.royale.jewel.beads.layouts
      *  @playerversion AIR 2.6
      *  @productversion Royale 0.9.4
      */
-	public class StyledLayoutBase extends LayoutBase implements IBeadLayout
+	public class StyledLayoutBase extends LayoutBase
 	{
         /**
          *  Constructor.
@@ -79,7 +79,26 @@ package org.apache.royale.jewel.beads.layouts
 			{
 				hostComponent = host as UIBase;
 				hostClassList = hostComponent.positioner.classList;
+			}
 
+			IEventDispatcher(value).addEventListener("beadsAdded", beadsAddedHandler);
+			beadsAddedHandler();
+		}
+
+		/**
+		 *  Add class selectors when the component is addedToParent
+		 *  Otherwise component will not get the class selectors when 
+		 *  perform "removeElement" and then "addElement"
+		 * 
+ 		 *  @langversion 3.0
+ 		 *  @playerversion Flash 10.2
+ 		 *  @playerversion AIR 2.6
+ 		 *  @productversion Royale 0.9.4
+ 		 */
+		public function beadsAddedHandler(event:Event = null):void
+		{
+			COMPILE::JS
+			{
 				initStyleToLayout(hostComponent, "itemsExpand");
 				setHostClassList("itemsExpand", _itemsExpand ? "itemsExpand":"");
 
diff --git a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/TableLayout.as b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/TableLayout.as
index bf9a58f..c1c1f41 100644
--- a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/TableLayout.as
+++ b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/TableLayout.as
@@ -18,16 +18,13 @@
 ////////////////////////////////////////////////////////////////////////////////
 package org.apache.royale.jewel.beads.layouts
 {
-	import org.apache.royale.core.LayoutBase;
-	import org.apache.royale.core.IBeadLayout;
-	import org.apache.royale.core.ILayoutChild;
-	import org.apache.royale.core.ILayoutView;
-	import org.apache.royale.core.IUIBase;
-	import org.apache.royale.core.IStrand;
-
 	COMPILE::JS {
     	import org.apache.royale.core.UIBase;
     }
+	import org.apache.royale.core.ILayoutChild;
+	import org.apache.royale.core.ILayoutView;
+	import org.apache.royale.core.IUIBase;
+	import org.apache.royale.events.Event;
 
     /**
      *  The TableLayout class is a simple layout
@@ -39,7 +36,7 @@ package org.apache.royale.jewel.beads.layouts
      *  @playerversion AIR 2.6
      *  @productversion Royale 0.9.4
      */
-	public class TableLayout extends LayoutBase implements IBeadLayout
+	public class TableLayout extends StyledLayoutBase
 	{
         /**
          *  Constructor.
@@ -59,28 +56,22 @@ package org.apache.royale.jewel.beads.layouts
 		 */
 		public static const LAYOUT_TYPE_NAMES:String = "layout table";
 
-		COMPILE::JS
-		private var hostComponent:UIBase;
-
-		COMPILE::JS
-		protected var hostClassList:DOMTokenList;
-
 		/**
-		 *  @copy org.apache.royale.core.IBead#strand
-		 *  
-		 *  @langversion 3.0
-		 *  @playerversion Flash 10.2
-		 *  @playerversion AIR 2.6
-		 *  @productversion Royale 0.9.4
-		 */
-		override public function set strand(value:IStrand):void
+		 *  Add class selectors when the component is addedToParent
+		 *  Otherwise component will not get the class selectors when 
+		 *  perform "removeElement" and then "addElement"
+		 * 
+ 		 *  @langversion 3.0
+ 		 *  @playerversion Flash 10.2
+ 		 *  @playerversion AIR 2.6
+ 		 *  @productversion Royale 0.9.4
+ 		 */
+		override public function beadsAddedHandler(event:Event = null):void
 		{
-			super.strand = value;
+			super.beadsAddedHandler();
 
 			COMPILE::JS
 			{
-				hostComponent = host as UIBase;
-				hostClassList = hostComponent.positioner.classList;
 				if (hostClassList.contains("layout"))
 					hostClassList.remove("layout");
 				hostClassList.add("layout");
diff --git a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/TileLayout.as b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/TileLayout.as
index 9c2585e..478ad8e 100644
--- a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/TileLayout.as
+++ b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/TileLayout.as
@@ -19,7 +19,6 @@
 package org.apache.royale.jewel.beads.layouts
 {
 	import org.apache.royale.core.LayoutBase;
-	import org.apache.royale.core.IBeadLayout;
     import org.apache.royale.core.IBorderPaddingMarginValuesImpl;
 	import org.apache.royale.core.IParentIUIBase;
 	import org.apache.royale.core.IUIBase;
@@ -44,7 +43,7 @@ package org.apache.royale.jewel.beads.layouts
 	 *  @playerversion AIR 2.6
 	 *  @productversion Royale 0.0
 	 */
-	public class TileLayout extends LayoutBase implements IBeadLayout, ILayoutStyleProperties
+	public class TileLayout extends LayoutBase implements ILayoutStyleProperties
 	{
 		/**
 		 *  constructor.
diff --git a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/VerticalCenteredLayout.as b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/VerticalCenteredLayout.as
index 0316c2f..00487d6 100644
--- a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/VerticalCenteredLayout.as
+++ b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/VerticalCenteredLayout.as
@@ -18,26 +18,18 @@
 ////////////////////////////////////////////////////////////////////////////////
 package org.apache.royale.jewel.beads.layouts
 {
-	import org.apache.royale.core.LayoutBase;
-	import org.apache.royale.core.IBeadLayout;
-    import org.apache.royale.core.IBorderPaddingMarginValuesImpl;
+	COMPILE::JS {
+        import org.apache.royale.core.UIBase;
+        import org.apache.royale.core.WrappedHTMLElement;
+    }
+	import org.apache.royale.core.IBorderPaddingMarginValuesImpl;
 	import org.apache.royale.core.ILayoutChild;
-	import org.apache.royale.core.ILayoutHost;
 	import org.apache.royale.core.ILayoutView;
-	import org.apache.royale.core.IParentIUIBase;
 	import org.apache.royale.core.IUIBase;
-    import org.apache.royale.core.layout.EdgeData;
 	import org.apache.royale.core.ValuesManager;
-	import org.apache.royale.core.IBorderPaddingMarginValuesImpl;
-	import org.apache.royale.core.IStrand;
-	import org.apache.royale.utils.css.addDynamicSelector;
-	import org.apache.royale.utils.StringUtil;
+	import org.apache.royale.core.layout.EdgeData;
 	import org.apache.royale.core.layout.ILayoutStyleProperties;
-
-	COMPILE::JS {
-        import org.apache.royale.core.WrappedHTMLElement;
-		import org.apache.royale.core.UIBase;
-    }
+	import org.apache.royale.events.Event;
 
     /**
 	 *  The VerticalCenteredLayout class is a simple layout
@@ -70,18 +62,18 @@ package org.apache.royale.jewel.beads.layouts
 		public static const LAYOUT_TYPE_NAMES:String = "layout vertical centered";
 
 		/**
-		 *  @copy org.apache.royale.core.IBead#strand
-		 *  
-		 *  @langversion 3.0
-		 *  @playerversion Flash 10.2
-		 *  @playerversion AIR 2.6
-		 *  @productversion Royale 0.9.4
-		 *  @royaleignorecoercion org.apache.royale.core.IParentIUIBase
-		 *  @royaleignorecoercion org.apache.royale.core.WrappedHTMLElement
-		 */
-		override public function set strand(value:IStrand):void
+		 *  Add class selectors when the component is addedToParent
+		 *  Otherwise component will not get the class selectors when 
+		 *  perform "removeElement" and then "addElement"
+		 * 
+ 		 *  @langversion 3.0
+ 		 *  @playerversion Flash 10.2
+ 		 *  @playerversion AIR 2.6
+ 		 *  @productversion Royale 0.9.4
+ 		 */
+		override public function beadsAddedHandler(event:Event = null):void
 		{
-			super.strand = value;
+			super.beadsAddedHandler();
 
 			COMPILE::JS
 			{
diff --git a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/VerticalFlowLayout.as b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/VerticalFlowLayout.as
index de5bafa..c8a4cf4 100644
--- a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/VerticalFlowLayout.as
+++ b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/VerticalFlowLayout.as
@@ -18,26 +18,19 @@
 ////////////////////////////////////////////////////////////////////////////////
 package org.apache.royale.jewel.beads.layouts
 {
-	import org.apache.royale.core.LayoutBase;
-	import org.apache.royale.core.IBeadLayout;
-    import org.apache.royale.core.IBorderPaddingMarginValuesImpl;
+	COMPILE::JS {
+        import org.apache.royale.core.UIBase;
+        import org.apache.royale.core.WrappedHTMLElement;
+    }
+	import org.apache.royale.core.IBorderPaddingMarginValuesImpl;
 	import org.apache.royale.core.ILayoutChild;
-	import org.apache.royale.core.ILayoutHost;
 	import org.apache.royale.core.ILayoutView;
-	import org.apache.royale.core.IParentIUIBase;
 	import org.apache.royale.core.IUIBase;
-    import org.apache.royale.core.layout.EdgeData;
 	import org.apache.royale.core.ValuesManager;
-	import org.apache.royale.core.IBorderPaddingMarginValuesImpl;
-	import org.apache.royale.core.IStrand;
-	import org.apache.royale.utils.css.addDynamicSelector;
-	import org.apache.royale.utils.StringUtil;
+	import org.apache.royale.core.layout.EdgeData;
 	import org.apache.royale.core.layout.ILayoutStyleProperties;
+	import org.apache.royale.events.Event;
 
-	COMPILE::JS {
-        import org.apache.royale.core.WrappedHTMLElement;
-		import org.apache.royale.core.UIBase;
-    }
 
     /**
 	 *  The VerticalFlowLayout class is a simple layout
@@ -70,18 +63,18 @@ package org.apache.royale.jewel.beads.layouts
 		public static const LAYOUT_TYPE_NAMES:String = "layout vertical flow";
 
 		/**
-		 *  @copy org.apache.royale.core.IBead#strand
-		 *  
-		 *  @langversion 3.0
-		 *  @playerversion Flash 10.2
-		 *  @playerversion AIR 2.6
-		 *  @productversion Royale 0.9.4
-		 *  @royaleignorecoercion org.apache.royale.core.IParentIUIBase
-		 *  @royaleignorecoercion org.apache.royale.core.WrappedHTMLElement
-		 */
-		override public function set strand(value:IStrand):void
+		 *  Add class selectors when the component is addedToParent
+		 *  Otherwise component will not get the class selectors when 
+		 *  perform "removeElement" and then "addElement"
+		 * 
+ 		 *  @langversion 3.0
+ 		 *  @playerversion Flash 10.2
+ 		 *  @playerversion AIR 2.6
+ 		 *  @productversion Royale 0.9.4
+ 		 */
+		override public function beadsAddedHandler(event:Event = null):void
 		{
-			super.strand = value;
+			super.beadsAddedHandler();
 
 			COMPILE::JS
 			{
diff --git a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/VerticalLayout.as b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/VerticalLayout.as
index a632ca4..918a508 100644
--- a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/VerticalLayout.as
+++ b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/layouts/VerticalLayout.as
@@ -18,27 +18,19 @@
 ////////////////////////////////////////////////////////////////////////////////
 package org.apache.royale.jewel.beads.layouts
 {
-	import org.apache.royale.core.LayoutBase;
-	import org.apache.royale.core.IBeadLayout;
-    import org.apache.royale.core.IBorderPaddingMarginValuesImpl;
+	COMPILE::JS
+	{
+		import org.apache.royale.core.UIBase;
+		import org.apache.royale.core.WrappedHTMLElement;
+	}
+	import org.apache.royale.core.IBorderPaddingMarginValuesImpl;
 	import org.apache.royale.core.ILayoutChild;
-	import org.apache.royale.core.ILayoutHost;
 	import org.apache.royale.core.ILayoutView;
-	import org.apache.royale.core.IParentIUIBase;
 	import org.apache.royale.core.IUIBase;
-    import org.apache.royale.core.layout.EdgeData;
 	import org.apache.royale.core.ValuesManager;
-	import org.apache.royale.events.Event;
-	import org.apache.royale.core.IStrand;
-	import org.apache.royale.utils.StringUtil;
+	import org.apache.royale.core.layout.EdgeData;
 	import org.apache.royale.core.layout.ILayoutStyleProperties;
-
-
-	COMPILE::JS
-	{
-		import org.apache.royale.core.WrappedHTMLElement;
-		import org.apache.royale.core.UIBase;
-	}
+	import org.apache.royale.events.Event;
 
 	/**
 	 *  The VerticalLayout class is a simple layout
@@ -71,18 +63,18 @@ package org.apache.royale.jewel.beads.layouts
 		public static const LAYOUT_TYPE_NAMES:String = "layout vertical";
 
 		/**
-		 *  @copy org.apache.royale.core.IBead#strand
-		 *  
-		 *  @langversion 3.0
-		 *  @playerversion Flash 10.2
-		 *  @playerversion AIR 2.6
-		 *  @productversion Royale 0.9.4
-		 *  @royaleignorecoercion org.apache.royale.core.IParentIUIBase
-		 *  @royaleignorecoercion org.apache.royale.core.WrappedHTMLElement
-		 */
-		override public function set strand(value:IStrand):void
+		 *  Add class selectors when the component is addedToParent
+		 *  Otherwise component will not get the class selectors when 
+		 *  perform "removeElement" and then "addElement"
+		 * 
+ 		 *  @langversion 3.0
+ 		 *  @playerversion Flash 10.2
+ 		 *  @playerversion AIR 2.6
+ 		 *  @productversion Royale 0.9.4
+ 		 */
+		override public function beadsAddedHandler(event:Event = null):void
 		{
-			super.strand = value;
+			super.beadsAddedHandler();
 
 			COMPILE::JS
 			{
diff --git a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/views/TableView.as b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/views/TableView.as
index 6e7789f..b7030fd 100644
--- a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/views/TableView.as
+++ b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/views/TableView.as
@@ -18,15 +18,14 @@
 ////////////////////////////////////////////////////////////////////////////////
 package org.apache.royale.jewel.beads.views
 {
-	import org.apache.royale.html.beads.DataContainerView;
-	import org.apache.royale.core.UIBase;
+	import org.apache.royale.core.ISelectableItemRenderer;
 	import org.apache.royale.core.IStrand;
 	import org.apache.royale.events.Event;
-	import org.apache.royale.core.ISelectableItemRenderer;
+	import org.apache.royale.events.IEventDispatcher;
+	import org.apache.royale.jewel.beads.models.TableModel;
 	import org.apache.royale.jewel.beads.views.ListView;
-	import org.apache.royale.jewel.supportClasses.table.THead;
 	import org.apache.royale.jewel.supportClasses.table.TFoot;
-	import  org.apache.royale.jewel.beads.models.TableModel;
+	import org.apache.royale.jewel.supportClasses.table.THead;
 	
 	/**
 	 *  The TableView class creates the visual elements of the org.apache.royale.jewel.Table component.
@@ -77,11 +76,22 @@ package org.apache.royale.jewel.beads.views
 			model = _strand.getBeadByType(TableModel) as TableModel;
 			model.addEventListener("selectedIndexChanged", selectionChangeHandler);
 			model.addEventListener("rollOverIndexChanged", rollOverIndexChangeHandler);
+			IEventDispatcher(_strand).addEventListener("itemsCreated", itemsCreatedHandler);
 
 			super.handleInitComplete(event);
 		}
 
 		/**
+		 * @private
+		 * Ensure the list selects the selectedItem if someone is set by the user at creation time
+		 */
+		private function itemsCreatedHandler(event:Event):void
+		{
+			if(listModel.selectedIndex != -1)
+				selectionChangeHandler(null);
+		}
+
+		/**
 		 * @royalesuppresspublicvarwarning
 		 */
 		public var thead:THead;