Merge branch 'develop' into dynamic_layout
diff --git a/frameworks/projects/MXRoyale/src/main/royale/mx/core/LayoutElementUIComponentUtils.as b/frameworks/projects/MXRoyale/src/main/royale/mx/core/LayoutElementUIComponentUtils.as
index 7147d24..70ba5e2 100644
--- a/frameworks/projects/MXRoyale/src/main/royale/mx/core/LayoutElementUIComponentUtils.as
+++ b/frameworks/projects/MXRoyale/src/main/royale/mx/core/LayoutElementUIComponentUtils.as
@@ -20,6 +20,7 @@
 {
 //import flash.geom.Matrix;
 //import flash.geom.Matrix3D;
+	import org.apache.royale.core.ILayoutChild;
 import org.apache.royale.geom.Point;
 
 //import mx.utils.MatrixUtil;
@@ -588,5 +589,52 @@
             obj.setActualSize(fitSize.x, fitSize.y);
         */
     }
+    
+	/**
+	 *  Set size of target based on size of child.
+	 *
+	 *  This sets the proper explicitXX and percentXX values either way
+	 *  (parent from child, or child from parent).  The values are
+	 *  different depending on which direction, but they are proper to 
+	 *  handle all cases.
+	 *
+	 *  @langversion 3.0
+	 *  @playerversion Flash 10.2
+	 *  @playerversion AIR 2.6
+	 *  @productversion Royale 0.9.8
+	 */
+	public static function setSizeFromChild(target:ILayoutChild, child:ILayoutChild):void
+	{
+		setWidthFromChild(target, child);
+		setHeightFromChild(target, child);
+	}
+
+	public static function setWidthFromChild(target:ILayoutChild, child:ILayoutChild):void
+	{
+		if (!isNaN(child.percentWidth))
+		{
+			target.explicitWidth = NaN;
+			target.percentWidth = 100;
+		}
+		else
+		{
+			target.explicitWidth = child.explicitWidth;
+			target.percentWidth = NaN;
+		}
+	}
+
+	public static function setHeightFromChild(target:ILayoutChild, child:ILayoutChild):void
+	{
+		if (!isNaN(child.percentHeight))
+		{
+			target.explicitHeight = NaN;
+			target.percentHeight = 100;
+		}
+		else
+		{
+			target.explicitHeight = child.explicitHeight;
+			target.percentHeight = NaN;
+		}
+	}
 }
 }
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 e218708..0ac33c3 100644
--- a/frameworks/projects/MXRoyale/src/main/royale/mx/core/UIComponent.as
+++ b/frameworks/projects/MXRoyale/src/main/royale/mx/core/UIComponent.as
@@ -1709,7 +1709,7 @@
     public function set doubleClickEnabled(value:Boolean):void
     {
         // TODO
-        trace("doubleClickEnabled not implemented");
+        if (doTraceNI) trace("doubleClickEnabled not implemented");
     }
 
     //----------------------------------
diff --git a/frameworks/projects/SparkRoyale/src/main/resources/defaults.css b/frameworks/projects/SparkRoyale/src/main/resources/defaults.css
index 1b4de88..88c7d29 100644
--- a/frameworks/projects/SparkRoyale/src/main/resources/defaults.css
+++ b/frameworks/projects/SparkRoyale/src/main/resources/defaults.css
@@ -70,7 +70,7 @@
 {
 	IDataProviderItemRendererMapper: ClassReference("mx.controls.listClasses.DataItemRendererFactoryForIListData");
 	IBeadModel: ClassReference("mx.controls.beads.models.SingleSelectionIListModel");
-	IBeadView:  ClassReference("spark.components.beads.DataContainerView");			
+	IBeadView:  ClassReference("spark.components.beads.SparkDataContainerView");	
 	IBeadLayout: ClassReference("spark.layouts.supportClasses.SparkLayoutBead");
 	IItemRendererClassFactory: ClassReference("org.apache.royale.core.ItemRendererClassFactory");
 	IItemRenderer: ClassReference("spark.components.beads.SelfItemRenderer");
@@ -83,7 +83,7 @@
 {
 	IDataProviderItemRendererMapper: ClassReference("mx.controls.listClasses.VirtualDataItemRendererFactoryForIListData");
 	IBeadModel: ClassReference("mx.controls.beads.models.SingleSelectionIListModel");
-	IBeadView:  ClassReference("mx.containers.beads.VirtualListView");			
+	IBeadView:  ClassReference("spark.components.beads.VirtualListView");			
 	IBeadController: ClassReference("org.apache.royale.html.beads.controllers.ListSingleSelectionMouseController");
 	IBeadLayout: ClassReference("org.apache.royale.html.beads.layouts.VirtualListVerticalLayout");
 	IItemRendererClassFactory: ClassReference("org.apache.royale.core.SelectableItemRendererClassFactory");
@@ -98,33 +98,17 @@
 {
 	IDataProviderItemRendererMapper: ClassReference("mx.controls.listClasses.DataItemRendererFactoryForIListData");
 	IBeadModel: ClassReference("mx.controls.beads.models.SingleSelectionIListModel");
-	IBeadView:  ClassReference("org.apache.royale.html.beads.DataContainerView");			
+	IBeadView:  ClassReference("spark.components.beads.SparkDataContainerView");	
 	IBeadController: ClassReference("org.apache.royale.html.beads.controllers.ListSingleSelectionMouseController");
 	IBeadLayout: ClassReference("spark.layouts.HorizontalLayout");
 	IItemRendererClassFactory: ClassReference("org.apache.royale.core.SelectableItemRendererClassFactory");
 	IItemRenderer: ClassReference("spark.components.supportClasses.SparkTextButtonItemRenderer");
-	IItemRendererInitializer: ClassReference("mx.controls.beads.ListItemRendererInitializer");
+	IItemRendererInitializer: ClassReference("spark.components.beads.TabBarItemRendererInitializer");
 	ISelectableItemRenderer: ClassReference("org.apache.royale.html.beads.SolidBackgroundSelectableItemRendererBead");
 	IViewport: ClassReference("org.apache.royale.html.supportClasses.ScrollingViewport");
 	IViewportModel: ClassReference("org.apache.royale.html.beads.models.ViewportModel");
 }
 
-/* not used
-NonVirtualVDataGroup
-{
-	IDataProviderItemRendererMapper: ClassReference("mx.controls.listClasses.DataItemRendererFactoryForIListData");
-	IBeadModel: ClassReference("mx.controls.beads.models.SingleSelectionIListModel");
-	IBeadView:  ClassReference("org.apache.royale.html.beads.DataContainerView");			
-	IBeadController: ClassReference("org.apache.royale.html.beads.controllers.ListSingleSelectionMouseController");
-	IBeadLayout: ClassReference("org.apache.royale.html.beads.layouts.VerticalLayout");
-	IItemRendererClassFactory: ClassReference("org.apache.royale.core.SelectableItemRendererClassFactory");
-	IItemRenderer: ClassReference("mx.controls.listClasses.ListItemRenderer");
-	IItemRendererInitializer: ClassReference("mx.controls.beads.ListItemRendererInitializer");
-	ISelectableItemRenderer: ClassReference("org.apache.royale.html.beads.SolidBackgroundSelectableItemRendererBead");
-	IViewport: ClassReference("org.apache.royale.html.supportClasses.ScrollingViewport");
-	IViewportModel: ClassReference("org.apache.royale.html.beads.models.ViewportModel");
-} */
-
 DropDownList
 {
 	IBeadModel: ClassReference("mx.controls.beads.models.SingleSelectionIListModel");
@@ -165,7 +149,7 @@
 Panel
 {
 	IBeadModel: ClassReference("mx.containers.beads.models.PanelModel");
-	IViewport: ClassReference("spark.components.beads.SparkSkinViewport");
+	IViewport: ClassReference("spark.components.beads.SparkSkinScrollingViewport");
 	skinClass: ClassReference("spark.skins.spark.PanelSkin");
 		
 	background-color: #FFFFFF;
diff --git a/frameworks/projects/SparkRoyale/src/main/resources/spark-royale-manifest.xml b/frameworks/projects/SparkRoyale/src/main/resources/spark-royale-manifest.xml
index 3383304..cd08390 100644
--- a/frameworks/projects/SparkRoyale/src/main/resources/spark-royale-manifest.xml
+++ b/frameworks/projects/SparkRoyale/src/main/resources/spark-royale-manifest.xml
@@ -145,9 +145,7 @@
     <component id="Sort" class="spark.collections.Sort"/>
     <component id="SortField" class="spark.collections.SortField"/>
     <component id="CollectionChangeUpdateForArrayListData" class="spark.components.beads.CollectionChangeUpdateForArrayListData" />
-    <component id="TabBarSelectionUpdateFromSelectableDataProvider" class="spark.components.beads.TabBarSelectionUpdateFromSelectableDataProvider"/>
     <component id="SelfItemRenderer" class="spark.components.beads.SelfItemRenderer"/>
-    <component id="SelfItemRendererInitializer" class="spark.components.beads.SelfItemRendererInitializer"/>
     <component id="SimpleMotionPath" class="spark.effects.animation.SimpleMotionPath"/>
     <component id="DateTimeFormatter" class="spark.formatters.DateTimeFormatter"/>
     <component id="NumberFormatter" class="spark.formatters.NumberFormatter"/>
diff --git a/frameworks/projects/SparkRoyale/src/main/royale/SparkRoyaleClasses.as b/frameworks/projects/SparkRoyale/src/main/royale/SparkRoyaleClasses.as
index d5cd1ec..fd28595 100644
--- a/frameworks/projects/SparkRoyale/src/main/royale/SparkRoyaleClasses.as
+++ b/frameworks/projects/SparkRoyale/src/main/royale/SparkRoyaleClasses.as
@@ -84,18 +84,20 @@
 	import spark.components.SkinnablePopUpContainer; SkinnablePopUpContainer;

     

     import spark.components.beads.PanelView; PanelView;

-    import spark.components.beads.DataContainerView; DataContainerView;

     import spark.components.beads.GroupView; GroupView;

     import spark.components.beads.SkinnableContainerView; SkinnableContainerView;

     import spark.components.beads.SkinnableDataContainerView; SkinnableDataContainerView;

+    import spark.components.beads.SparkSkinViewport; SparkSkinViewport;

     import spark.components.beads.SparkSkinScrollingViewport; SparkSkinScrollingViewport;

 	import spark.components.beads.SparkSkinWithClipAndEnableScrollingViewport; SparkSkinWithClipAndEnableScrollingViewport;

+    import spark.components.beads.VirtualListView; VirtualListView;

     import spark.components.beads.CollectionChangeUpdateForArrayListData; CollectionChangeUpdateForArrayListData;

-	import spark.components.beads.TabBarSelectionUpdateFromSelectableDataProvider; TabBarSelectionUpdateFromSelectableDataProvider;

     import spark.components.beads.DropDownListView; DropDownListView;

     import spark.components.beads.TitleWindowView; TitleWindowView;

     import spark.components.beads.controllers.DropDownListController; DropDownListController;

     import spark.components.beads.controllers.TabBarController; TabBarController;

+    import spark.components.beads.SelfItemRendererInitializer; SelfItemRendererInitializer;

+    import spark.components.beads.TabBarItemRendererInitializer; TabBarItemRendererInitializer;

     import spark.controls.advancedDataGridClasses.MXAdvancedDataGridItemRenderer; MXAdvancedDataGridItemRenderer;

     import spark.events.DropDownEvent; DropDownEvent;

 

diff --git a/frameworks/projects/SparkRoyale/src/main/royale/spark/components/Application.as b/frameworks/projects/SparkRoyale/src/main/royale/spark/components/Application.as
index 90dd0b9..93bd89e 100644
--- a/frameworks/projects/SparkRoyale/src/main/royale/spark/components/Application.as
+++ b/frameworks/projects/SparkRoyale/src/main/royale/spark/components/Application.as
@@ -63,6 +63,7 @@
 

 import mx.core.mx_internal;

 import mx.core.FlexGlobals;

+import mx.core.IUIComponent;

 import mx.events.utils.MouseEventConverter;

 import mx.managers.ISystemManager;

 

@@ -85,6 +86,7 @@
 import org.apache.royale.core.ValuesManager;

 import org.apache.royale.events.IEventDispatcher;

 import org.apache.royale.reflection.beads.ClassAliasBead;

+import spark.core.ISparkLayoutHost;

 

 use namespace mx_internal; 

 

@@ -2336,14 +2338,29 @@
 		return _softKeyboardRect;

 	}*/

      

-    override public function setActualSize(w:Number, h:Number):void

-    {

-		super.setActualSize(w, h);

-		if (!skin) {

-			((view as ILayoutHost).contentView as Group).width = w;

-			((view as ILayoutHost).contentView as Group).height = h;

+		override public function setActualSize(w:Number, h:Number):void

+		{

+			super.setActualSize(w, h);

+

+			var lh:ISparkLayoutHost = getLayoutHost() as ISparkLayoutHost;

+			var g:IUIComponent = (lh ? lh.displayView as IUIComponent : null);

+			if (g && g != this)

+			{

+				// TODO: If Applicaiton has no explicit or percent sizes, then

+				//       this function is used to set the default size of the app.

+				//       Unfortunatley, setActualSize() [non-explicit width/height]

+				//       is overridden during LayoutBase.layout() when it gets

+				//       measured sizes.  So legacy code has this function

+				//       setting explicit sizes on contentView (and now displayView).

+				//       This is not ideal, since displayView then has explicit sizes

+				//       that always stick (hence, why this function doesn't do it

+				//       in SkinnableContainerBase).

+				//

+//				g.setActualSize(w, h);

+				g.width = w;

+				g.height = h;

+			}

 		}

-    }

 

      //--------------------------------------------------------------------------

      //

diff --git a/frameworks/projects/SparkRoyale/src/main/royale/spark/components/List.as b/frameworks/projects/SparkRoyale/src/main/royale/spark/components/List.as
index e20ea63..05ea745 100644
--- a/frameworks/projects/SparkRoyale/src/main/royale/spark/components/List.as
+++ b/frameworks/projects/SparkRoyale/src/main/royale/spark/components/List.as
@@ -61,9 +61,11 @@
 import org.apache.royale.html.beads.SingleSelectionDropIndicatorBead;

 import mx.managers.IFocusManagerComponent;

 import spark.components.supportClasses.ListBase;

+import spark.layouts.VerticalLayout;

 import mx.core.mx_internal;

 import mx.core.UIComponent;

 use namespace mx_internal;

+

 [Event(name="dragComplete", type="mx.events.DragEvent")]

 //--------------------------------------

 //  Styles

@@ -424,7 +426,9 @@
     public function List()

     {

         super();

-

+        layout = new VerticalLayout();

+        VerticalLayout(layout).gap = 0;

+        

         typeNames += " List";

         

        /*  useVirtualLayout = true;

diff --git a/frameworks/projects/SparkRoyale/src/main/royale/spark/components/SkinnableContainer.as b/frameworks/projects/SparkRoyale/src/main/royale/spark/components/SkinnableContainer.as
index 247316b..b2b9145 100644
--- a/frameworks/projects/SparkRoyale/src/main/royale/spark/components/SkinnableContainer.as
+++ b/frameworks/projects/SparkRoyale/src/main/royale/spark/components/SkinnableContainer.as
@@ -36,7 +36,7 @@
 import spark.components.supportClasses.SkinnableContainerBase;

 import spark.components.supportClasses.SkinnableComponent;

 import spark.components.supportClasses.GroupBase;

-import spark.components.beads.SkinnableContainerView;

+import spark.core.ISparkContainer;

 import spark.layouts.supportClasses.LayoutBase;

 import spark.layouts.BasicLayout;

 

@@ -51,7 +51,6 @@
 import org.apache.royale.core.IContainer;

 import org.apache.royale.core.IContainerBaseStrandChildrenHost;

 import org.apache.royale.core.ILayoutHost;

-import org.apache.royale.core.ILayoutParent;

 import org.apache.royale.core.IParent;

 import org.apache.royale.core.ValuesManager;

 import org.apache.royale.events.ValueEvent;

@@ -367,8 +366,8 @@
  *  @playerversion AIR 1.5

  *  @productversion Royale 0.9.4

  */

-public class SkinnableContainer extends SkinnableContainerBase implements IContainer, IContainerBaseStrandChildrenHost, ILayoutParent

-{// SkinnableContainerBase 

+public class SkinnableContainer extends SkinnableContainerBase implements IContainer, IContainerBaseStrandChildrenHost, ISparkContainer

+{

  //    implements IDeferredContentOwner, IVisualElementContainer

    // include "../core/Version.as";

     

@@ -408,20 +407,6 @@
         typeNames = "SkinnableContainer";

     }

     

-    /**

-     * Returns the ILayoutHost which is its view. From ILayoutParent.

-     *

-     *  @langversion 3.0

-     *  @playerversion Flash 10.2

-     *  @playerversion AIR 2.6

-     *  @productversion Royale 0.8

-     */

-    public function getLayoutHost():ILayoutHost

-    {

-        return view as ILayoutHost;

-    }

-    

-

     //----------------------------------

     //  textDecoration

     //----------------------------------

@@ -659,14 +644,11 @@
             ? contentGroup.layout 

             : contentGroupProperties.layout;

         */

-        //if (!_layout)

-        //    _layout = new BasicLayout();

         return _layout;

     }

     

     /**

      * @private

-     * @royaleignorecoercion spark.components.beads.SkinnableContainerView

      * @royaleignorecoercion spark.components.supportClasses.GroupBase

      */

     public function set layout(value:LayoutBase):void

@@ -684,9 +666,9 @@
         _layout = value;

         if (getBeadByType(IBeadView))

         {

-            ((view as SkinnableContainerView).contentView as GroupBase).layout = value;

+            (getLayoutHost().contentView as GroupBase).layout = value;

             if (parent)

-                ((view as SkinnableContainerView).contentView as GroupBase).dispatchEvent(new Event("layoutNeeded"));       

+                (getLayoutHost().contentView as GroupBase).dispatchEvent(new Event("layoutNeeded"));       

         }

     }

     

@@ -913,7 +895,7 @@
     {

         if (skin)

         {

-            var skinDispatcher:IEventDispatcher = (view as SkinnableContainerView).contentView as IEventDispatcher;

+            var skinDispatcher:IEventDispatcher = getLayoutHost().contentView as IEventDispatcher;

             skinDispatcher.dispatchEvent(new ValueEvent("childrenAdded"));

         }

         dispatchEvent(new ValueEvent("childrenAdded"));

@@ -990,9 +972,7 @@
         

         dispatchEvent(new Event("beadsAdded"));

         dispatchEvent(new Event("initComplete"));

-        if ((isHeightSizedToContent() || !isNaN(explicitHeight)) &&

-            (isWidthSizedToContent() || !isNaN(explicitWidth)))

-            dispatchEvent(new Event("layoutNeeded"));

+        dispatchEvent(new Event("layoutNeeded"));

     }

     

     override protected function createChildren():void

@@ -1277,7 +1257,7 @@
      override public function addElement(c:IChild, dispatchEvent:Boolean = true):void

      {

          var contentView:IParent = getLayoutHost().contentView as IParent;

-         if (c == contentView)

+         if (c == contentView || c == skin)

          {

              super.addElement(c); // ContainerView uses addElement to add inner contentView

              if (c == skin)

@@ -1429,7 +1409,6 @@
      {

          return super.getElementAt(index);

      }

-

 }

 

 }

diff --git a/frameworks/projects/SparkRoyale/src/main/royale/spark/components/SkinnableDataContainer.as b/frameworks/projects/SparkRoyale/src/main/royale/spark/components/SkinnableDataContainer.as
index 95267fe..466cea5 100644
--- a/frameworks/projects/SparkRoyale/src/main/royale/spark/components/SkinnableDataContainer.as
+++ b/frameworks/projects/SparkRoyale/src/main/royale/spark/components/SkinnableDataContainer.as
@@ -31,9 +31,7 @@
 
 import spark.components.supportClasses.SkinnableContainerBase;
 import spark.components.supportClasses.GroupBase;
-import spark.components.beads.SkinnableDataContainerView;
-import spark.components.beads.SparkDataContainerView;
-import spark.core.IViewport;
+import spark.core.ISparkContainer;
 //import spark.events.RendererExistenceEvent;
 import spark.layouts.supportClasses.LayoutBase;
 
@@ -51,7 +49,6 @@
 import org.apache.royale.core.IBeadView;
 import org.apache.royale.core.IChild;
 import org.apache.royale.core.ILayoutHost;
-import org.apache.royale.core.ILayoutParent;
 import org.apache.royale.core.IParent;
 import org.apache.royale.core.ItemRendererClassFactory;
 import org.apache.royale.core.ValuesManager;
@@ -230,7 +227,7 @@
  *  @playerversion AIR 1.5
  *  @productversion Royale 0.9.8
  */
-public class SkinnableDataContainer extends SkinnableContainerBase implements IItemRendererProvider, IStrandWithPresentationModel, ILayoutParent
+public class SkinnableDataContainer extends SkinnableContainerBase implements IItemRendererProvider, IStrandWithPresentationModel, ISparkContainer
 { //implements IItemRendererOwner
     //include "../core/Version.as";
     
@@ -292,20 +289,6 @@
 
 
     /**
-     * Returns the ILayoutHost which is its view. From ILayoutParent.
-     *
-     *  @langversion 3.0
-     *  @playerversion Flash 10.2
-     *  @playerversion AIR 2.6
-     *  @productversion Royale 0.8
-     */
-    public function getLayoutHost():ILayoutHost
-    {
-        return view as ILayoutHost;
-    }
-
-    
-    /**
      *  The presentation model for the list.
      *
      *  @langversion 3.0
@@ -440,7 +423,6 @@
      *  @productversion Royale 0.9.8
      * 
      *  @royaleignorecoercion spark.components.DataGroup
-     *  @royaleignorecoercion spark.components.beads.SparkDataContainerView
      */
     [Bindable("dataProviderChanged")]
     [Inspectable(category="Data")]
@@ -451,13 +433,12 @@
             ? dataGroup.dataProvider 
             : dataGroupProperties.dataProvider; */
 
-        return ((view as SparkDataContainerView).contentView as DataGroup).dataProvider;
+        return (getLayoutHost().contentView as DataGroup).dataProvider;
     }
     
     /**
      *  @private
      *  @royaleignorecoercion spark.components.DataGroup
-     *  @royaleignorecoercion spark.components.beads.SparkDataContainerView
      */
     public function set dataProvider(value:IList):void
     {
@@ -471,27 +452,9 @@
             dataGroupProperties.dataProvider = value;
         dispatchEvent(new Event("dataProviderChanged")); */
 
-        if (isWidthSizedToContent() || isHeightSizedToContent())
-            ((view as SparkDataContainerView).contentView as DataGroup).addEventListener("itemsCreated", itemsCreatedHandler);
-        ((view as SparkDataContainerView).contentView as DataGroup).dataProvider = value;
+        (getLayoutHost().contentView as DataGroup).dataProvider = value;
     }
 
-    private function itemsCreatedHandler(event:Event):void
-    {
-        if (parent)
-        {
-            COMPILE::JS
-            {
-                // clear last width/height so elements size to content
-                element.style.width = "";
-                element.style.height = "";
-                ((view as SparkDataContainerView).contentView as DataGroup).element.style.width = "";
-                ((view as SparkDataContainerView).contentView as DataGroup).element.style.height = "";
-            }
-            (parent as IEventDispatcher).dispatchEvent(new Event("layoutNeeded"));
-        }
-    }
-    
     //----------------------------------
     //  itemRenderer
     //----------------------------------
@@ -513,7 +476,7 @@
             ? dataGroup.itemRenderer 
             : dataGroupProperties.itemRenderer; */
 
-        return ((view as SparkDataContainerView).contentView as DataGroup).itemRenderer;
+        return (getLayoutHost().contentView as DataGroup).itemRenderer;
     }
     
     /**
@@ -531,10 +494,10 @@
         else
             dataGroupProperties.itemRenderer = value; */
 
-        ((view as SparkDataContainerView).contentView as DataGroup).itemRenderer = value;
+        (getLayoutHost().contentView as DataGroup).itemRenderer = value;
         // the ItemRendererFactory was already put on the DataGroup's strand and
         // determined which factory to use so we have to set it up later here.
-        var factory:ItemRendererClassFactory = ((view as SparkDataContainerView).contentView as DataGroup).getBeadByType(ItemRendererClassFactory) as ItemRendererClassFactory;
+        var factory:ItemRendererClassFactory = (getLayoutHost().contentView as DataGroup).getBeadByType(ItemRendererClassFactory) as ItemRendererClassFactory;
         factory.createFunction = factory.createFromClass;
         factory.itemRendererFactory = value;
     }
@@ -601,15 +564,12 @@
             ? dataGroup.layout 
             : dataGroupProperties.layout;
          */
-        //if (!_layout)
-        //    _layout = new BasicLayout();
         return _layout;
     }
 
     /**
      *  @private
      *  @royaleignorecoercion spark.components.GroupBase
-     *  @royaleignorecoercion spark.components.beads.SparkDataContainerView
      */
     public function set layout(value:LayoutBase):void
     {
@@ -626,9 +586,9 @@
         _layout = value;
         if (getBeadByType(IBeadView))
         {
-            ((view as SkinnableDataContainerView).contentView as GroupBase).layout = value;
+            (getLayoutHost().contentView as GroupBase).layout = value;
             if (parent)
-                ((view as SkinnableDataContainerView).contentView as GroupBase).dispatchEvent(new Event("layoutNeeded"));       
+                (getLayoutHost().contentView as GroupBase).dispatchEvent(new Event("layoutNeeded"));       
         }
     }
     
@@ -948,13 +908,9 @@
     /**
      *  @private
      *  @royaleignorecoercion spark.components.DataGroup
-     *  @royaleignorecoercion spark.components.beads.SparkDataContainerView
      */
     override public function addedToParent():void
     {
-//        if (!getBeadByType(IBeadLayout))
-//            addBead(new VerticalLayout());
-
         if (!initialized) {
             // each MXML file can also have styles in fx:Style block
             ValuesManager.valuesImpl.init(this);
@@ -967,15 +923,10 @@
 
         dispatchEvent(new Event("beadsAdded"));
         dispatchEvent(new Event("initComplete"));
-        if ((isHeightSizedToContent() || !isNaN(explicitHeight)) &&
-            (isWidthSizedToContent() || !isNaN(explicitWidth)))
-            dispatchEvent(new Event("layoutNeeded"));
+        dispatchEvent(new Event("layoutNeeded"));
 
-//		((view as SparkDataContainerView).contentView as DataGroup).addEventListener("change", redispatcher);
-		((view as SparkDataContainerView).contentView as DataGroup).addEventListener("itemClick", redispatcher);
-		((view as SparkDataContainerView).contentView as DataGroup).addEventListener("doubleClick", redispatcher);
-		
-        setActualSize(getExplicitOrMeasuredWidth(), getExplicitOrMeasuredHeight());
+		(getLayoutHost().contentView as DataGroup).addEventListener("itemClick", redispatcher);
+		(getLayoutHost().contentView as DataGroup).addEventListener("doubleClick", redispatcher);
     }
 
     override protected function createChildren():void
@@ -988,12 +939,6 @@
         dispatchEvent(new Event("initBindings"));
     }
     
-    override public function setActualSize(w:Number, h:Number):void
-    {
-        super.setActualSize(w, h);
-        ((view as SparkDataContainerView).contentView as DataGroup).setActualSize(w, h);
-    }
-
 	private function redispatcher(event:Event):void
 	{
 		dispatchEvent(new Event(event.type));
diff --git a/frameworks/projects/SparkRoyale/src/main/royale/spark/components/TabBar.as b/frameworks/projects/SparkRoyale/src/main/royale/spark/components/TabBar.as
index 4148226..2f1a8aa 100644
--- a/frameworks/projects/SparkRoyale/src/main/royale/spark/components/TabBar.as
+++ b/frameworks/projects/SparkRoyale/src/main/royale/spark/components/TabBar.as
@@ -44,6 +44,7 @@
     import org.apache.royale.core.ILayoutHost;

     import org.apache.royale.core.IStrand;

     import mx.core.IUIComponent;

+

     /**

      *  Defines the radius of the TabBar buttons' top-left and top-right corners for the default

      *  TabBarButton skin.

@@ -189,16 +190,5 @@
             if (TabBar.createAccessibilityImplementation != null)

                 TabBar.createAccessibilityImplementation(this);

         } */

-

-        override public function get measuredWidth():Number

-        {

-            var contentView:IUIComponent = (this.view as ILayoutHost).contentView as IUIComponent;

-            if (contentView)

-            {

-                (contentView.getBeadByType(LayoutBase) as LayoutBase).measure();

-                measuredWidth = contentView.measuredWidth;

-            }

-            return super.measuredWidth;

-        }

     }

 }
\ No newline at end of file
diff --git a/frameworks/projects/SparkRoyale/src/main/royale/spark/components/beads/DataContainerView.as b/frameworks/projects/SparkRoyale/src/main/royale/spark/components/beads/DataContainerView.as
deleted file mode 100644
index 96f3c71..0000000
--- a/frameworks/projects/SparkRoyale/src/main/royale/spark/components/beads/DataContainerView.as
+++ /dev/null
@@ -1,52 +0,0 @@
-////////////////////////////////////////////////////////////////////////////////
-//
-//  Licensed to the Apache Software Foundation (ASF) under one or more
-//  contributor license agreements.  See the NOTICE file distributed with
-//  this work for additional information regarding copyright ownership.
-//  The ASF licenses this file to You under the Apache License, Version 2.0
-//  (the "License"); you may not use this file except in compliance with
-//  the License.  You may obtain a copy of the License at
-//
-//      http://www.apache.org/licenses/LICENSE-2.0
-//
-//  Unless required by applicable law or agreed to in writing, software
-//  distributed under the License is distributed on an "AS IS" BASIS,
-//  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-//  See the License for the specific language governing permissions and
-//  limitations under the License.
-//
-////////////////////////////////////////////////////////////////////////////////
-package spark.components.beads
-{	
-	import spark.events.RendererExistenceEvent;
-	import org.apache.royale.utils.sendStrandEvent;
-	import org.apache.royale.html.beads.DataContainerView;
-	import org.apache.royale.core.IItemRenderer;
-	import mx.core.IVisualElement;
-
-
-	/**
-	 *  The DataContainerView provides the visual elements for the DataContainer.
-	 *  
-	 *  @viewbead
-	 *  @langversion 3.0
-	 *  @playerversion Flash 10.2
-	 *  @playerversion AIR 2.6
-	 *  @productversion Royale 0.9.8
-	 */
-	public class DataContainerView extends org.apache.royale.html.beads.DataContainerView
-	{
-		public function DataContainerView()
-		{
-			super();
-		}
-		
-		override protected function dispatchItemAdded(renderer:IItemRenderer):void
-		{
-			super.dispatchItemAdded(renderer);
-		    var newEvent:RendererExistenceEvent = new RendererExistenceEvent(RendererExistenceEvent.RENDERER_ADD, false, false, renderer as IVisualElement);
-		    sendStrandEvent(_strand,newEvent);
-		}
-
-	}
-}
diff --git a/frameworks/projects/SparkRoyale/src/main/royale/spark/components/beads/SelfItemRendererInitializer.as b/frameworks/projects/SparkRoyale/src/main/royale/spark/components/beads/SelfItemRendererInitializer.as
index ab4fa04..2ec5555 100644
--- a/frameworks/projects/SparkRoyale/src/main/royale/spark/components/beads/SelfItemRendererInitializer.as
+++ b/frameworks/projects/SparkRoyale/src/main/royale/spark/components/beads/SelfItemRendererInitializer.as
@@ -19,6 +19,7 @@
 
 package spark.components.beads
 {
+	import mx.core.LayoutElementUIComponentUtils;
 	import org.apache.royale.core.Bead;
 	import org.apache.royale.core.IChild;
 	import org.apache.royale.core.IItemRenderer;
@@ -60,23 +61,17 @@
 			var sir:SelfItemRenderer = renderer as SelfItemRenderer;
 			if (sir == null) return;
 			
-			var plc:ILayoutChild = sir.parent as ILayoutChild;
 			var clc:ILayoutChild = child as ILayoutChild;
-			if (plc && clc)
+			if (clc)
 			{
-				sir.explicitWidth = NaN;
-				sir.percentWidth = NaN;
-				if (!plc.isWidthSizedToContent() && !clc.isWidthSizedToContent()) sir.percentWidth = 100;
-				sir.explicitHeight = NaN;
-				sir.percentHeight = NaN;
-				if (!plc.isHeightSizedToContent() && !clc.isHeightSizedToContent()) sir.percentHeight = 100;
+				LayoutElementUIComponentUtils.setSizeFromChild(sir, clc);
 			}
 			
 			sir.removeAllElements();
 			sir.addElement(child);
 			sir.invalidateSize();
 		}
-
+		
 		/**
 		 *  @private
 		 */
diff --git a/frameworks/projects/SparkRoyale/src/main/royale/spark/components/beads/SkinnableContainerView.as b/frameworks/projects/SparkRoyale/src/main/royale/spark/components/beads/SkinnableContainerView.as
index 70f322f..ef941db 100644
--- a/frameworks/projects/SparkRoyale/src/main/royale/spark/components/beads/SkinnableContainerView.as
+++ b/frameworks/projects/SparkRoyale/src/main/royale/spark/components/beads/SkinnableContainerView.as
@@ -19,125 +19,56 @@
 
 package spark.components.beads
 {
-
-import spark.components.SkinnableContainer;
-import spark.components.supportClasses.GroupBase;
-import spark.components.supportClasses.SkinnableComponent;
-import spark.components.supportClasses.Skin;
-import spark.layouts.BasicLayout;
-
-import org.apache.royale.core.IBead;
-import org.apache.royale.core.IContainer;
-import org.apache.royale.core.ILayoutChild;
-import org.apache.royale.core.IStrand;
-import org.apache.royale.core.UIBase;
-
-/**
- *  @private
- *  The SkinnableContainerView for emulation.
- */
-public class SkinnableContainerView extends SparkContainerView
-{
-	//--------------------------------------------------------------------------
-	//
-	//  Constructor
-	//
-	//--------------------------------------------------------------------------
-
+	import mx.core.UIComponent;
+	import org.apache.royale.core.IContainer;
+	import org.apache.royale.core.ILayoutChild;
+	import org.apache.royale.core.IStrand;
+	import org.apache.royale.events.Event;
+	import org.apache.royale.events.IEventDispatcher;
+	import spark.components.supportClasses.GroupBase;
+	import spark.components.supportClasses.SkinnableComponent;
+	import spark.components.supportClasses.Skin;
+	
 	/**
-	 *  Constructor.
-	 *  
-	 *  @langversion 3.0
-	 *  @playerversion Flash 9
-	 *  @playerversion AIR 1.1
-	 *  @productversion Flex 3
+	 *  @private
+	 *  The SkinnableContainerView for emulation.
 	 */
-	public function SkinnableContainerView()
+	public class SkinnableContainerView extends SparkContainerView
 	{
-		super();
+		/**
+		 *  Constructor.
+		 *  
+		 *  @langversion 3.0
+		 *  @playerversion Flash 9
+		 *  @playerversion AIR 1.1
+		 *  @productversion Royale 0.9.6
+		 */
+		public function SkinnableContainerView()
+		{
+			super();
+		}
+		
+		override public function get displayView():GroupBase
+		{
+			var skinhost:SkinnableComponent = _strand as SkinnableComponent;
+			if (skinhost && skinhost.skin)
+				return skinhost.skin as GroupBase;
+			else	
+				return super.displayView;
+		}
+
+		override protected function addViewport():void
+		{
+			var chost:IContainer = host as IContainer;
+			var skinhost:SkinnableComponent = _strand as SkinnableComponent;
+			if (chost && skinhost.skin)
+			{
+				chost.addElement(skinhost.skin);
+			}
+			else
+			{
+				super.addViewport();
+			}
+		}
 	}
-
-    override protected function prepareContentView():void
-    {
-        var host:SkinnableContainer = _strand as SkinnableContainer;
-        if (host.skin)
-        {
-            if (!host.isWidthSizedToContent())
-                host.skin.percentWidth = 100;
-            if (!host.isHeightSizedToContent())
-                host.skin.percentHeight = 100;            
-        }
-        else
-            super.prepareContentView();
-    }
-
-    /**
-     *  Adjusts the size of the host after the layout has been run if needed
-     *
-     *  @langversion 3.0
-     *  @playerversion Flash 10.2
-     *  @playerversion AIR 2.6
-     *  @productversion Royale 0.0
-     *  @royaleignorecoercion org.apache.royale.core.UIBase
-     */
-    override public function beforeLayout():Boolean
-    {
-        var host:SkinnableContainer = _strand as SkinnableContainer;
-        if (host.isWidthSizedToContent() && host.isHeightSizedToContent())
-        {
-            if (host.skin)
-            {
-                (host.skin as Skin).layout.measure();
-                host.measuredHeight = host.skin.measuredHeight;
-                host.measuredWidth = host.skin.measuredWidth;
-            }
-            else 
-            {
-                if (host.layout == null)
-                    host.layout = new BasicLayout();
-                host.layout.measure();
-            }
-        }
-        else
-        {
-            if (host.skin)
-            {
-			    (host.skin as Skin).layout.measure();
-			    if (host.isWidthSizedToContent()) 
-			    {
-				    host.skin.setLayoutBoundsSize(NaN, host.height);
-				    host.measuredWidth = host.skin.measuredWidth;
-			    } else
-			    {
-				    host.skin.setLayoutBoundsSize(host.width, NaN);
-				    host.measuredHeight = host.skin.measuredHeight;
-			    }
-            }
-            else
-            {
-                if (host.layout == null)
-                    host.layout = new BasicLayout();
-                host.layout.measure();
-				var h:Number = host.isHeightSizedToContent() ? host.measuredHeight : host.height;
-				var w:Number = host.isWidthSizedToContent() ? host.measuredWidth : host.width;
-                (viewport.contentView as ILayoutChild).setWidthAndHeight(w, h);
-            }
-                
-        }
-	return true;
-    }
-    
-    override protected function addViewport():void
-    {
-        var chost:IContainer = host as IContainer;
-        var skinhost:SkinnableComponent = host as SkinnableComponent;
-        if (chost != null && chost != viewport.contentView && skinhost.skin) {
-            chost.addElement(skinhost.skin);
-        }
-        else
-            super.addViewport();
-    }
-
-}
-
 }
diff --git a/frameworks/projects/SparkRoyale/src/main/royale/spark/components/beads/SkinnableDataContainerView.as b/frameworks/projects/SparkRoyale/src/main/royale/spark/components/beads/SkinnableDataContainerView.as
index bfd5e8d..faaa640 100644
--- a/frameworks/projects/SparkRoyale/src/main/royale/spark/components/beads/SkinnableDataContainerView.as
+++ b/frameworks/projects/SparkRoyale/src/main/royale/spark/components/beads/SkinnableDataContainerView.as
@@ -19,125 +19,56 @@
 
 package spark.components.beads
 {
-
-import spark.components.SkinnableDataContainer;
-import spark.components.supportClasses.GroupBase;
-import spark.components.supportClasses.SkinnableComponent;
-import spark.components.supportClasses.Skin;
-import spark.layouts.BasicLayout;
-
-import org.apache.royale.core.IBead;
-import org.apache.royale.core.IContainer;
-import org.apache.royale.core.ILayoutChild;
-import org.apache.royale.core.IStrand;
-import org.apache.royale.core.UIBase;
-
-/**
- *  @private
- *  The SkinnableDataContainerView for emulation.
- */
-public class SkinnableDataContainerView extends SparkDataContainerView
-{
-	//--------------------------------------------------------------------------
-	//
-	//  Constructor
-	//
-	//--------------------------------------------------------------------------
-
+	import mx.core.UIComponent;
+	import org.apache.royale.core.IContainer;
+	import org.apache.royale.core.ILayoutChild;
+	import org.apache.royale.core.IStrand;
+	import org.apache.royale.events.Event;
+	import org.apache.royale.events.IEventDispatcher;
+	import spark.components.supportClasses.GroupBase;
+	import spark.components.supportClasses.SkinnableComponent;
+	import spark.components.supportClasses.Skin;
+	
 	/**
-	 *  Constructor.
-	 *  
-	 *  @langversion 3.0
-	 *  @playerversion Flash 9
-	 *  @playerversion AIR 1.1
-	 *  @productversion Flex 3
+	 *  @private
+	 *  The SkinnableDataContainerView for emulation.
 	 */
-	public function SkinnableDataContainerView()
+	public class SkinnableDataContainerView extends SparkDataContainerView
 	{
-		super();
+		/**
+		 *  Constructor.
+		 *  
+		 *  @langversion 3.0
+		 *  @playerversion Flash 9
+		 *  @playerversion AIR 1.1
+		 *  @productversion Royale 0.9.8
+		 */
+		public function SkinnableDataContainerView()
+		{
+			super();
+		}
+		
+		override public function get displayView():GroupBase
+		{
+			var skinhost:SkinnableComponent = _strand as SkinnableComponent;
+			if (skinhost && skinhost.skin)
+				return skinhost.skin as GroupBase;
+			else	
+				return super.displayView;
+		}
+
+		override protected function addViewport():void
+		{
+			var chost:IContainer = host as IContainer;
+			var skinhost:SkinnableComponent = _strand as SkinnableComponent;
+			if (chost && skinhost.skin)
+			{
+				chost.addElement(skinhost.skin);
+			}
+			else
+			{
+				super.addViewport();
+			}
+		}
 	}
-
-    override protected function prepareContentView():void
-    {
-        var host:SkinnableDataContainer = _strand as SkinnableDataContainer;
-        if (host.skin)
-        {
-            if (!host.isWidthSizedToContent())
-                host.skin.percentWidth = 100;
-            if (!host.isHeightSizedToContent())
-                host.skin.percentHeight = 100;            
-        }
-        else
-            super.prepareContentView();
-    }
-
-    /**
-     *  Adjusts the size of the host after the layout has been run if needed
-     *
-     *  @langversion 3.0
-     *  @playerversion Flash 10.2
-     *  @playerversion AIR 2.6
-     *  @productversion Royale 0.0
-     *  @royaleignorecoercion org.apache.royale.core.UIBase
-     */
-    override public function beforeLayout():Boolean
-    {
-        var host:SkinnableDataContainer = _strand as SkinnableDataContainer;
-        if (host.isWidthSizedToContent() && host.isHeightSizedToContent())
-        {
-            if (host.skin)
-            {
-                (host.skin as Skin).layout.measure();
-                host.measuredHeight = host.skin.measuredHeight;
-                host.measuredWidth = host.skin.measuredWidth;
-            }
-            else 
-            {
-                if (host.layout == null)
-                    host.layout = new BasicLayout();
-                host.layout.measure();
-            }
-        }
-        else
-        {
-            if (host.skin)
-            {
-			    (host.skin as Skin).layout.measure();
-			    if (host.isWidthSizedToContent()) 
-			    {
-				    host.skin.setLayoutBoundsSize(NaN, host.height);
-				    host.measuredWidth = host.skin.measuredWidth;
-			    } else
-			    {
-				    host.skin.setLayoutBoundsSize(host.width, NaN);
-				    host.measuredHeight = host.skin.measuredHeight;
-			    }
-            }
-            else
-            {
-                if (host.layout == null)
-                    host.layout = new BasicLayout();
-                host.layout.measure();
-				var h:Number = host.isHeightSizedToContent() ? host.measuredHeight : host.height;
-				var w:Number = host.isWidthSizedToContent() ? host.measuredWidth : host.width;
-                (viewport.contentView as ILayoutChild).setWidthAndHeight(w, h);
-            }
-                
-        }
-	return true;
-    }
-    
-    override protected function addViewport():void
-    {
-        var chost:IContainer = host as IContainer;
-        var skinhost:SkinnableComponent = host as SkinnableComponent;
-        if (chost != null && chost != viewport.contentView && skinhost.skin) {
-            chost.addElement(skinhost.skin);
-        }
-        else
-            super.addViewport();
-    }
-
-}
-
 }
diff --git a/frameworks/projects/SparkRoyale/src/main/royale/spark/components/beads/SparkContainerView.as b/frameworks/projects/SparkRoyale/src/main/royale/spark/components/beads/SparkContainerView.as
index 3923423..5a8efad 100644
--- a/frameworks/projects/SparkRoyale/src/main/royale/spark/components/beads/SparkContainerView.as
+++ b/frameworks/projects/SparkRoyale/src/main/royale/spark/components/beads/SparkContainerView.as
@@ -19,112 +19,148 @@
 
 package spark.components.beads
 {
-
-import spark.components.SkinnableContainer;
-import spark.components.supportClasses.GroupBase;
-import spark.layouts.BasicLayout;
-
-import org.apache.royale.core.IBead;
-import org.apache.royale.core.IContainer;
-import org.apache.royale.core.ILayoutChild;
-import org.apache.royale.core.IStrand;
-import org.apache.royale.core.UIBase;
-import org.apache.royale.html.beads.ContainerView;
-import org.apache.royale.events.Event;
-import org.apache.royale.events.IEventDispatcher;
-
-/**
- *  @private
- *  The SparkContainerView for emulation.
- */
-public class SparkContainerView extends ContainerView
-{
-	//--------------------------------------------------------------------------
-	//
-	//  Constructor
-	//
-	//--------------------------------------------------------------------------
-
+	import mx.core.LayoutElementUIComponentUtils;
+	import mx.core.UIComponent;
+	import org.apache.royale.core.ILayoutChild;
+	import org.apache.royale.core.IStrand;
+	import org.apache.royale.events.Event;
+	import org.apache.royale.events.IEventDispatcher;
+	import org.apache.royale.html.beads.ContainerView;
+	import spark.components.supportClasses.GroupBase;
+	import spark.core.ISparkContainer;
+	import spark.core.ISparkLayoutHost;
+	import spark.layouts.BasicLayout;
+	
 	/**
-	 *  Constructor.
-	 *  
-	 *  @langversion 3.0
-	 *  @playerversion Flash 9
-	 *  @playerversion AIR 1.1
-	 *  @productversion Flex 3
+	 *  @private
+	 *  The SparkContainerView for emulation.
 	 */
-	public function SparkContainerView()
+	public class SparkContainerView extends ContainerView implements ISparkLayoutHost
 	{
-		super();
+		/**
+		 *  Constructor.
+		 *  
+		 *  @langversion 3.0
+		 *  @playerversion Flash 9
+		 *  @playerversion AIR 1.1
+		 *  @productversion Royale 0.9.6
+		 */
+		public function SparkContainerView()
+		{
+			super();
+		}
+		
+		override public function set strand(value:IStrand):void
+		{
+			super.strand = value;
+			prepareContentView();
+			prepareDisplayView();
+		}
+		
+		protected function prepareContentView():void
+		{
+			var host:ILayoutChild = _strand as ILayoutChild;
+			var g:GroupBase = contentView as GroupBase;
+			
+			if (!host || !g)
+				return;
+				
+			if (host == g)
+			{
+				if (g.layout == null)
+					g.layout = new BasicLayout();
+				return;
+			}
+
+			// only for the case where host.layout was set before view set
+			var hc:ISparkContainer = _strand as ISparkContainer;
+			if (hc.layout != null)
+				g.layout = hc.layout;
+
+			if (g.layout == null)
+				g.layout = new BasicLayout();
+		}
+
+		public function get displayView():GroupBase
+		{
+			return contentView as GroupBase;
+		}
+		
+		protected function prepareDisplayView():void
+		{
+			var host:ILayoutChild = _strand as ILayoutChild;
+			var g:GroupBase = displayView as GroupBase;
+
+			if (!host || !g || host == g)
+				return;
+
+			// Resize content to host, because 
+			// (a) ScrollingViewport sets content to 100% and
+			// (b) we don't yet have content reverse-proxing the explicit size functions 
+			//     (explicitXX, percentXX, isXXSizedToContent) back to the host.
+			// Layout asks target (content) for explicit sizes, sometimes.
+			//
+			LayoutElementUIComponentUtils.setSizeFromChild(g, host);
+		}
+		
+		/**
+		 *  Measure before layout.
+		 *
+		 *  @langversion 3.0
+		 *  @playerversion Flash 10.2
+		 *  @playerversion AIR 2.6
+		 *  @productversion Royale 0.9.6
+		 */
+		override public function beforeLayout():Boolean
+		{
+			if (_strand != displayView)
+			{
+				var host:UIComponent = _strand as UIComponent;
+				var g:GroupBase = displayView as GroupBase;
+
+				// Resize content to host, because 
+				// (a) ScrollingViewport sets content to 100% and
+				// (b) we don't yet have content reverse-proxing the explicit size functions 
+				//     (explicitXX, percentXX, isXXSizedToContent) back to the host.
+				// Layout asks target (content) for explicit sizes, sometimes.
+				//
+				LayoutElementUIComponentUtils.setSizeFromChild(g, host);
+				
+				if (g.isWidthSizedToContent() || g.isHeightSizedToContent())
+				{
+					g.layout.measure();
+				}
+			}
+			return true;
+		}
+		
+		/**
+		 *  Dispatch after layout.
+		 *
+		 *  @langversion 3.0
+		 *  @playerversion Flash 10.2
+		 *  @playerversion AIR 2.6
+		 *  @productversion Royale 0.9.6
+		 */
+		override public function afterLayout():void
+		{
+			if (_strand != displayView)
+			{
+				var host:UIComponent = _strand as UIComponent;
+				var g:GroupBase = displayView as GroupBase;
+
+				host.setActualSize(g.width, g.height);
+
+				if (g.isWidthSizedToContent() || g.isHeightSizedToContent())
+				{
+					// request re-run layout on the parent.  In theory, we should only
+					// end up in afterLayout if the content size changed.
+					if (host.parent)
+					{
+						(host.parent as IEventDispatcher).dispatchEvent(new Event("layoutNeeded"));   
+					}
+				}
+			}
+		}
 	}
-
-    /**
-     */
-    override public function set strand(value:IStrand):void
-    {
-        super.strand = value;
-        prepareContentView();
-    }
-    
-    protected function prepareContentView():void
-    {
-        var host:SkinnableContainer = _strand as SkinnableContainer;
-        var g:GroupBase = (contentView as GroupBase);
-        if (host.layout != null)
-            g.layout = host.layout;
-        if (g.layout == null)
-            g.layout = new BasicLayout();
-        
-        if (!host.isWidthSizedToContent())
-            g.percentWidth = 100;
-        if (!host.isHeightSizedToContent())
-            g.percentHeight = 100;
-
-    }
-    
-    /**
-     *  Adjusts the size of the host after the layout has been run if needed
-     *
-     *  @langversion 3.0
-     *  @playerversion Flash 10.2
-     *  @playerversion AIR 2.6
-     *  @productversion Royale 0.0
-     *  @royaleignorecoercion org.apache.royale.core.UIBase
-     */
-    override public function beforeLayout():Boolean
-    {
-        var host:SkinnableContainer = _strand as SkinnableContainer;
-        if (host.isWidthSizedToContent() || host.isHeightSizedToContent())
-        {
-            host.layout.measure();
-        }
-		return true;
-    }
-    
-    /**
-     *  Adjusts the size of the host after the layout has been run if needed
-     *
-     *  @langversion 3.0
-     *  @playerversion Flash 10.2
-     *  @playerversion AIR 2.6
-     *  @productversion Royale 0.0
-     *  @royaleignorecoercion org.apache.royale.core.UIBase
-     */
-    override public function afterLayout():void
-    {
-        var host:SkinnableContainer = _strand as SkinnableContainer;
-        if (host.isWidthSizedToContent() || host.isHeightSizedToContent())
-        {
-            // request re-run layout on the parent.  In theory, we should only
-            // end up in afterLayout if the content size changed.
-            if (host.parent)
-            {
-                (host.parent as IEventDispatcher).dispatchEvent(new Event("layoutNeeded"));   
-            }
-        }
-    }
-
-
-}
-
 }
diff --git a/frameworks/projects/SparkRoyale/src/main/royale/spark/components/beads/SparkDataContainerView.as b/frameworks/projects/SparkRoyale/src/main/royale/spark/components/beads/SparkDataContainerView.as
index be5e9b5..a33dc1f 100644
--- a/frameworks/projects/SparkRoyale/src/main/royale/spark/components/beads/SparkDataContainerView.as
+++ b/frameworks/projects/SparkRoyale/src/main/royale/spark/components/beads/SparkDataContainerView.as
@@ -19,112 +19,174 @@
 
 package spark.components.beads
 {
-
-import spark.components.SkinnableDataContainer;
-import spark.components.supportClasses.GroupBase;
-import spark.layouts.BasicLayout;
-
-import org.apache.royale.core.IBead;
-import org.apache.royale.core.IContainer;
-import org.apache.royale.core.ILayoutChild;
-import org.apache.royale.core.IStrand;
-import org.apache.royale.core.UIBase;
-import org.apache.royale.html.beads.ContainerView;
-import org.apache.royale.events.Event;
-import org.apache.royale.events.IEventDispatcher;
-
-/**
- *  @private
- *  The SparkDataContainerView for emulation.
- */
-public class SparkDataContainerView extends ContainerView
-{
-	//--------------------------------------------------------------------------
-	//
-	//  Constructor
-	//
-	//--------------------------------------------------------------------------
-
+	import mx.core.IVisualElement;
+	import mx.core.LayoutElementUIComponentUtils;
+	import mx.core.UIComponent;
+	import org.apache.royale.core.IItemRenderer;
+	import org.apache.royale.core.ILayoutChild;
+	import org.apache.royale.core.IStrand;
+	import org.apache.royale.events.Event;
+	import org.apache.royale.events.IEventDispatcher;
+	import org.apache.royale.html.beads.DataContainerView;
+	import org.apache.royale.utils.sendStrandEvent;
+	import spark.components.supportClasses.GroupBase;
+	import spark.core.ISparkContainer;
+	import spark.core.ISparkLayoutHost;
+	import spark.events.RendererExistenceEvent;
+	import spark.layouts.BasicLayout;
+	
 	/**
-	 *  Constructor.
-	 *  
-	 *  @langversion 3.0
-	 *  @playerversion Flash 9
-	 *  @playerversion AIR 1.1
-	 *  @productversion Flex 3
+	 *  @private
+	 *  The SparkDataContainerView for emulation.
 	 */
-	public function SparkDataContainerView()
+	public class SparkDataContainerView extends DataContainerView implements ISparkLayoutHost
 	{
-		super();
+		/**
+		 *  Constructor.
+		 *  
+		 *  @langversion 3.0
+		 *  @playerversion Flash 9
+		 *  @playerversion AIR 1.1
+		 *  @productversion Royale 0.9.8
+		 */
+		public function SparkDataContainerView()
+		{
+			super();
+		}
+		
+		override public function set strand(value:IStrand):void
+		{
+			super.strand = value;
+			prepareContentView();
+			prepareDisplayView();
+		}
+		
+		override protected function dispatchItemAdded(renderer:IItemRenderer):void
+		{
+			super.dispatchItemAdded(renderer);
+			var newEvent:RendererExistenceEvent = new RendererExistenceEvent(RendererExistenceEvent.RENDERER_ADD, false, false, renderer as IVisualElement);
+			sendStrandEvent(_strand,newEvent);
+		}
+
+		override protected function itemsCreatedHandler(event:Event):void
+		{
+			// Note that we assume host has same sizing as content group, if applicable
+			var host:UIComponent = _strand as UIComponent;
+			if (host.isWidthSizedToContent() || host.isHeightSizedToContent())
+			{
+				host.invalidateSize();
+				if (host.parent)
+				{
+					(host.parent as IEventDispatcher).dispatchEvent(new Event("layoutNeeded"));   
+				}
+			}
+			super.itemsCreatedHandler(event);
+		}
+
+		protected function prepareContentView():void
+		{
+			var host:ILayoutChild = _strand as ILayoutChild;
+			var g:GroupBase = contentView as GroupBase;
+			
+			if (!host || !g)
+				return;
+				
+			if (host == g)
+			{
+				if (g.layout == null)
+					g.layout = new BasicLayout();
+				return;
+			}
+
+			// only for the case where host.layout was set before view set
+			var hc:ISparkContainer = _strand as ISparkContainer;
+			if (hc.layout != null)
+				g.layout = hc.layout;
+
+			if (g.layout == null)
+				g.layout = new BasicLayout();
+		}
+
+		public function get displayView():GroupBase
+		{
+			return contentView as GroupBase;
+		}
+		
+		protected function prepareDisplayView():void
+		{
+			var host:ILayoutChild = _strand as ILayoutChild;
+			var g:GroupBase = displayView as GroupBase;
+
+			if (!host || !g || host == g)
+				return;
+
+			// Resize content to host, because 
+			// (a) ScrollingViewport sets content to 100% and
+			// (b) we don't yet have content reverse-proxing the explicit size functions 
+			//     (explicitXX, percentXX, isXXSizedToContent) back to the host.
+			// Layout asks target (content) for explicit sizes, sometimes.
+			//
+			LayoutElementUIComponentUtils.setSizeFromChild(g, host);
+		}
+		
+		/**
+		 *  Measure before layout.
+		 *
+		 *  @langversion 3.0
+		 *  @playerversion Flash 10.2
+		 *  @playerversion AIR 2.6
+		 *  @productversion Royale 0.9.6
+		 */
+		override public function beforeLayout():Boolean
+		{
+			if (_strand != displayView)
+			{
+				var host:UIComponent = _strand as UIComponent;
+				var g:GroupBase = displayView as GroupBase;
+
+				// Resize content to host, because 
+				// (a) ScrollingViewport sets content to 100% and
+				// (b) we don't yet have content reverse-proxing the explicit size functions 
+				//     (explicitXX, percentXX, isXXSizedToContent) back to the host.
+				// Layout asks target (content) for explicit sizes, sometimes.
+				//
+				LayoutElementUIComponentUtils.setSizeFromChild(g, host);
+				
+				if (g.isWidthSizedToContent() || g.isHeightSizedToContent())
+				{
+					g.layout.measure();
+				}
+			}
+			return true;
+		}
+		
+		/**
+		 *  Dispatch after layout.
+		 *
+		 *  @langversion 3.0
+		 *  @playerversion Flash 10.2
+		 *  @playerversion AIR 2.6
+		 *  @productversion Royale 0.9.6
+		 */
+		override public function afterLayout():void
+		{
+			if (_strand != displayView)
+			{
+				var host:UIComponent = _strand as UIComponent;
+				var g:GroupBase = displayView as GroupBase;
+
+				host.setActualSize(g.width, g.height);
+
+				if (g.isWidthSizedToContent() || g.isHeightSizedToContent())
+				{
+					// request re-run layout on the parent.  In theory, we should only
+					// end up in afterLayout if the content size changed.
+					if (host.parent)
+					{
+						(host.parent as IEventDispatcher).dispatchEvent(new Event("layoutNeeded"));   
+					}
+				}
+			}
+		}
 	}
-
-    /**
-     */
-    override public function set strand(value:IStrand):void
-    {
-        super.strand = value;
-        prepareContentView();
-    }
-    
-    protected function prepareContentView():void
-    {
-        var host:SkinnableDataContainer = _strand as SkinnableDataContainer;
-        var g:GroupBase = (contentView as GroupBase);
-        if (host.layout != null)
-            g.layout = host.layout;
-        if (g.layout == null)
-            g.layout = new BasicLayout();
-        
-        if (!host.isWidthSizedToContent())
-            g.percentWidth = 100;
-        if (!host.isHeightSizedToContent())
-            g.percentHeight = 100;
-
-    }
-    
-    /**
-     *  Adjusts the size of the host after the layout has been run if needed
-     *
-     *  @langversion 3.0
-     *  @playerversion Flash 10.2
-     *  @playerversion AIR 2.6
-     *  @productversion Royale 0.0
-     *  @royaleignorecoercion org.apache.royale.core.UIBase
-     */
-    override public function beforeLayout():Boolean
-    {
-        var host:SkinnableDataContainer = _strand as SkinnableDataContainer;
-        if (host.isWidthSizedToContent() || host.isHeightSizedToContent())
-        {
-            host.layout.measure();
-        }
-		return true;
-    }
-    
-    /**
-     *  Adjusts the size of the host after the layout has been run if needed
-     *
-     *  @langversion 3.0
-     *  @playerversion Flash 10.2
-     *  @playerversion AIR 2.6
-     *  @productversion Royale 0.0
-     *  @royaleignorecoercion org.apache.royale.core.UIBase
-     */
-    override public function afterLayout():void
-    {
-        var host:SkinnableDataContainer = _strand as SkinnableDataContainer;
-        if (host.isWidthSizedToContent() || host.isHeightSizedToContent())
-        {
-            // request re-run layout on the parent.  In theory, we should only
-            // end up in afterLayout if the content size changed.
-            if (host.parent)
-            {
-                (host.parent as IEventDispatcher).dispatchEvent(new Event("layoutNeeded"));   
-            }
-        }
-    }
-
-
-}
-
 }
diff --git a/frameworks/projects/SparkRoyale/src/main/royale/spark/components/beads/SparkSkinScrollingViewport.as b/frameworks/projects/SparkRoyale/src/main/royale/spark/components/beads/SparkSkinScrollingViewport.as
index 91ec1aa..f2cef5e 100644
--- a/frameworks/projects/SparkRoyale/src/main/royale/spark/components/beads/SparkSkinScrollingViewport.as
+++ b/frameworks/projects/SparkRoyale/src/main/royale/spark/components/beads/SparkSkinScrollingViewport.as
@@ -19,134 +19,99 @@
 
 package spark.components.beads
 {
+	import org.apache.royale.core.ILayoutChild;
+	import org.apache.royale.core.IStrand;
+	import org.apache.royale.core.ValuesManager;
+	import org.apache.royale.events.Event;
+	import org.apache.royale.html.supportClasses.ScrollingViewport;
+	import spark.components.supportClasses.GroupBase;
+	import spark.components.supportClasses.SkinnableComponent;
+	import spark.core.ISparkContainer;
+	import spark.layouts.BasicLayout;
 
-import mx.core.mx_internal;
-
-    import spark.core.IViewport;
-
-    use namespace mx_internal;
-
-import spark.components.supportClasses.GroupBase;
-import spark.components.supportClasses.SkinnableComponent;
-
-import org.apache.royale.core.IBead;
-import org.apache.royale.core.IContentView;
-import org.apache.royale.core.IStrand;
-import org.apache.royale.core.IUIBase;
-import org.apache.royale.core.IScrollingViewport;
-import org.apache.royale.core.UIBase;
-import org.apache.royale.core.ValuesManager;
-import org.apache.royale.events.Event;
-import org.apache.royale.events.EventDispatcher;
-import org.apache.royale.geom.Size;
-
-COMPILE::SWF
-{
-    import flash.geom.Rectangle;
-}
-
-/**
- *  @private
- *  The viewport that loads a Spark Skin.
- */
-public class SparkSkinScrollingViewport extends SparkSkinViewport implements IScrollingViewport
-{
-	//--------------------------------------------------------------------------
-	//
-	//  Constructor
-	//
-	//--------------------------------------------------------------------------
+	// for host.setSkin()
+	import mx.core.mx_internal;
+	use namespace mx_internal;
 
 	/**
-	 *  Constructor.
-	 *  
-	 *  @langversion 3.0
-	 *  @playerversion Flash 9
-	 *  @playerversion AIR 1.1
-	 *  @productversion Flex 3
+	 *  @private
+	 *  The scrolling viewport that loads a Spark Skin.
 	 */
-	public function SparkSkinScrollingViewport()
+	public class SparkSkinScrollingViewport extends org.apache.royale.html.supportClasses.ScrollingViewport
 	{
-		super();
+		/**
+		 *  Constructor.
+		 *  
+		 *  @langversion 3.0
+		 *  @playerversion Flash 9
+		 *  @playerversion AIR 1.1
+		 *  @productversion Royale 0.9.6
+		 */
+		public function SparkSkinScrollingViewport()
+		{
+			super();
+		}
+
+		override public function set strand(value:IStrand):void
+		{
+			var host:SkinnableComponent = value as SkinnableComponent;
+
+			super.strand = value;
+
+			var c:Class = ValuesManager.valuesImpl.getValue(value, "skinClass") as Class;
+			if (c)
+			{
+				if (!host.skin)
+				{
+					host.setSkin(new c());
+				}
+				host.skin.addEventListener("initComplete", initCompleteHandler);
+			}
+		}
+
+		protected function initCompleteHandler(event:Event):void
+		{
+			var host:SkinnableComponent = _strand as SkinnableComponent;
+
+			// can SkinPart do this better?
+			contentArea = host.skin["contentGroup"];
+			COMPILE::JS
+			{
+				setScrollStyle();
+			}
+			prepareContentView();
+		}
+
+		protected function prepareContentView():void
+		{
+			var host:ILayoutChild = _strand as ILayoutChild;
+			var g:GroupBase = contentView as GroupBase;
+			
+			if (!host || !g)
+				return;
+				
+			if (host == g)
+			{
+				if (g.layout == null)
+					g.layout = new BasicLayout();
+				return;
+			}
+
+			// only for the case where host.layout was set before view set
+			var hc:ISparkContainer = _strand as ISparkContainer;
+			if (hc.layout != null)
+				g.layout = hc.layout;
+
+			if (g.layout == null)
+				g.layout = new BasicLayout();
+		}
+
+		COMPILE::JS
+		override protected function setScrollStyle():void
+		{
+			// default GroupBase.clipAndEnableScrolling == false, so we initially disable scrolling
+			contentArea.element.style.overflow = "visible";
+			adaptContentArea();
+		}
 	}
-
-    override protected function initCompleteHandler(event:Event):void
-    {
-		super.initCompleteHandler(event);
-        COMPILE::JS
-        {
-            setScrollStyle();
-        }        
-    }
-    
-    /**
-     * Subclasses override this method to change scrolling behavior
-     */
-    COMPILE::JS
-    protected function setScrollStyle():void
-    {
-        contentArea.element.style.overflow = "auto";
-    }
-    
-    COMPILE::SWF
-    protected var _verticalScrollPosition:Number = 0;
-    
-    public function get verticalScrollPosition():Number
-    {
-        COMPILE::JS
-        {
-            return contentArea.element.scrollTop;
-        }
-        COMPILE::SWF
-        {
-            return _verticalScrollPosition;
-        }
-    }
-    public function set verticalScrollPosition(value:Number):void
-    {
-        COMPILE::JS
-        {
-            contentArea.element.scrollTop = value;
-        }
-        COMPILE::SWF
-        {
-            _verticalScrollPosition = value;
-            dispatchEvent(new Event("verticalScrollPositionChanged"));
-            // handleVerticalScrollChange();  figure out how to re-use from ScrollingViewport
-            // given we need different timing (waiting on initComplete)
-        }
-    }
-
-    COMPILE::SWF
-    protected var _horizontalScrollPosition:Number = 0;
-    
-    public function get horizontalScrollPosition():Number
-    {
-        COMPILE::JS
-        {
-            return contentArea.element.scrollLeft;
-        }
-        COMPILE::SWF
-        {
-            return _horizontalScrollPosition;
-        }
-    }
-    
-    public function set horizontalScrollPosition(value:Number):void
-    {
-        COMPILE::JS
-        {
-           contentArea.element.scrollLeft = value;
-        }
-        COMPILE::SWF
-        {
-            _horizontalScrollPosition = value;
-            dispatchEvent(new Event("horizontalScrollPositionChanged"));
-            // handleHorizontalScrollChange();     figure out how to re-use from ScrollingViewport
-            // given we need different timing (waiting on initComplete)         
-        }
-    }
-
-}
-
 }
diff --git a/frameworks/projects/SparkRoyale/src/main/royale/spark/components/beads/SparkSkinViewport.as b/frameworks/projects/SparkRoyale/src/main/royale/spark/components/beads/SparkSkinViewport.as
index b8af175..dab4f50 100644
--- a/frameworks/projects/SparkRoyale/src/main/royale/spark/components/beads/SparkSkinViewport.as
+++ b/frameworks/projects/SparkRoyale/src/main/royale/spark/components/beads/SparkSkinViewport.as
@@ -19,221 +19,87 @@
 
 package spark.components.beads
 {
+	import org.apache.royale.core.ILayoutChild;
+	import org.apache.royale.core.IStrand;
+	import org.apache.royale.core.ValuesManager;
+	import org.apache.royale.events.Event;
+	import org.apache.royale.html.supportClasses.Viewport;
+	import spark.components.supportClasses.GroupBase;
+	import spark.components.supportClasses.SkinnableComponent;
+	import spark.core.ISparkContainer;
+	import spark.layouts.BasicLayout;
 
-import mx.core.mx_internal;
-use namespace mx_internal;
-
-import spark.components.supportClasses.GroupBase;
-import spark.components.supportClasses.SkinnableComponent;
-
-import org.apache.royale.core.IBead;
-import org.apache.royale.core.IContentView;
-import org.apache.royale.core.IStrand;
-import org.apache.royale.core.IUIBase;
-import org.apache.royale.core.IViewport;
-import org.apache.royale.core.UIBase;
-import org.apache.royale.core.ValuesManager;
-import org.apache.royale.events.Event;
-import org.apache.royale.events.EventDispatcher;
-import org.apache.royale.geom.Size;
-import spark.components.SkinnableContainer;
-import spark.components.SkinnableDataContainer;
-import spark.layouts.supportClasses.LayoutBase;
-
-COMPILE::SWF
-{
-    import flash.geom.Rectangle;
-}
-
-/**
- *  @private
- *  The viewport that loads a Spark Skin.
- */
-public class SparkSkinViewport extends EventDispatcher implements IBead, IViewport
-{
-	//--------------------------------------------------------------------------
-	//
-	//  Constructor
-	//
-	//--------------------------------------------------------------------------
+	// for host.setSkin()
+	import mx.core.mx_internal;
+	use namespace mx_internal;
 
 	/**
-	 *  Constructor.
-	 *  
-	 *  @langversion 3.0
-	 *  @playerversion Flash 9
-	 *  @playerversion AIR 1.1
-	 *  @productversion Flex 3
+	 *  @private
+	 *  The viewport that loads a Spark Skin.
 	 */
-	public function SparkSkinViewport()
+	public class SparkSkinViewport extends org.apache.royale.html.supportClasses.Viewport
 	{
-		super();
-	}
-
-    protected var contentArea:UIBase;
-    
-    /**
-     * Get the actual parent of the container's content.
-     *
-     *  @langversion 3.0
-     *  @playerversion Flash 10.2
-     *  @playerversion AIR 2.6
-     *  @productversion Royale 0.0
-     */
-    public function get contentView():IUIBase
-    {
-        return contentArea;
-    }
-    
-    protected var host:SkinnableComponent;
-    
-    /**
-     */
-    public function set strand(value:IStrand):void
-    {
-        host = value as SkinnableComponent;
-        
-        var c:Class = ValuesManager.valuesImpl.getValue(value, "skinClass") as Class;
-        if (c)
-        {
-            if (!host.skin)
-            {
-                host.setSkin(new c());
-            }
-            host.skin.addEventListener("initComplete", initCompleteHandler);
-            contentArea = host.skin; // temporary assigment so that SkinnableXXContainer.addElement can add the skin
-        }
-        else
-        {
-            var f:Function = ValuesManager.valuesImpl.getValue(value, "iContentView") as Function;
-            if (f)
-            {
-                contentArea = new f() as UIBase;
-            }
-            
-            if (!contentArea)
-                contentArea = value as UIBase;
-        }
-    }
-    
-    protected function initCompleteHandler(event:Event):void
-    {
-        contentArea = host.skin["contentGroup"];
-        if (host is SkinnableContainer)
-        {
-            var sc:SkinnableContainer = host as SkinnableContainer;
-            if (sc.layout)
-                (contentArea as GroupBase).layout = sc.layout;       
-        }
-        else if (host is SkinnableDataContainer)
-        {
-            var sdc:SkinnableDataContainer = host as SkinnableDataContainer;
-            if (sdc.layout)
-                (contentArea as GroupBase).layout = sdc.layout;
-        }
-            
-		COMPILE::JS
+		/**
+		 *  Constructor.
+		 *  
+		 *  @langversion 3.0
+		 *  @playerversion Flash 9
+		 *  @playerversion AIR 1.1
+		 *  @productversion Royale 0.9.6
+		 */
+		public function SparkSkinViewport()
 		{
-		    adaptContentArea();
+			super();
 		}
-    }
-    
-    /**
-     * If the contentArea is not the same as the strand,
-     * we need to size it to 100% for scrolling to work correctly.
-     * @royaleignorecoercion org.apache.royale.events.IEventDispatcher
-     */
-    COMPILE::JS
-    protected function adaptContentArea():void
-    {
-        if(host != contentArea)
-        {
-            var scl:LayoutBase = null;
 
-            if (host is SkinnableContainer)
-            {
-                var sc:SkinnableContainer = host as SkinnableContainer;
-                scl = sc.layout;
-            }
-            else if (host is SkinnableDataContainer)
-            {
-                var sdc:SkinnableDataContainer = host as SkinnableDataContainer;
-                scl = sdc.layout;
-            }
+		override public function set strand(value:IStrand):void
+		{
+			var host:SkinnableComponent = value as SkinnableComponent;
 
-            if (scl)
-            {
-                if (!scl.isWidthSizedToContent())
-                    contentArea.percentWidth = 100;
-                if (!scl.isHeightSizedToContent())
-                   contentArea.percentHeight = 100;
-            }
-            else
-            {
-                if (host.isWidthSizedToContent())
-                    contentArea.percentWidth = 100;
-                if (host.isHeightSizedToContent())
-                    contentArea.percentHeight = 100;
-                
-            }
-            contentArea.element.style.position = "absolute";
-        }
-    }
-    
-    /**
-     * @copy org.apache.royale.core.IViewport#setPosition()
-     *
-     *  @langversion 3.0
-     *  @playerversion Flash 10.2
-     *  @playerversion AIR 2.6
-     *  @productversion Royale 0.0
-     */
-    public function setPosition(x:Number, y:Number):void
-    {
-        COMPILE::SWF {
-            contentArea.x = x;
-            contentArea.y = y;
-        }
-    }
-    
-    /**
-     * @copy org.apache.royale.core.IViewport#layoutViewportBeforeContentLayout()
-     *
-     *  @langversion 3.0
-     *  @playerversion Flash 10.2
-     *  @playerversion AIR 2.6
-     *  @productversion Royale 0.0
-     */
-    public function layoutViewportBeforeContentLayout(width:Number, height:Number):void
-    {
-        COMPILE::SWF {
-            if (!isNaN(width))
-                contentArea.width = width;
-            if (!isNaN(height))
-                contentArea.height = height;
-        }
-    }
-    
-    /**
-     * @copy org.apache.royale.core.IViewport#layoutViewportAfterContentLayout()
-     *
-     *  @langversion 3.0
-     *  @playerversion Flash 10.2
-     *  @playerversion AIR 2.6
-     *  @productversion Royale 0.0
-     */
-    public function layoutViewportAfterContentLayout(contentSize:Size):void
-    {
-        COMPILE::SWF {
-            var hostWidth:Number = UIBase(host).width;
-            var hostHeight:Number = UIBase(host).height;
-            
-            var rect:flash.geom.Rectangle = new flash.geom.Rectangle(0, 0, hostWidth, hostHeight);
-            contentArea.scrollRect = rect;
-            
-            return;
-        }
-    }
-}
+			super.strand = value;
 
+			var c:Class = ValuesManager.valuesImpl.getValue(value, "skinClass") as Class;
+			if (c)
+			{
+				if (!host.skin)
+				{
+					host.setSkin(new c());
+				}
+				host.skin.addEventListener("initComplete", initCompleteHandler);
+			}
+		}
+
+		protected function initCompleteHandler(event:Event):void
+		{
+			var host:SkinnableComponent = _strand as SkinnableComponent;
+
+			// can SkinPart do this better?
+			contentArea = host.skin["contentGroup"];
+			prepareContentView();
+		}
+
+		protected function prepareContentView():void
+		{
+			var host:ILayoutChild = _strand as ILayoutChild;
+			var g:GroupBase = contentView as GroupBase;
+			
+			if (!host || !g)
+				return;
+				
+			if (host == g)
+			{
+				if (g.layout == null)
+					g.layout = new BasicLayout();
+				return;
+			}
+
+			// only for the case where host.layout was set before view set
+			var hc:ISparkContainer = _strand as ISparkContainer;
+			if (hc.layout != null)
+				g.layout = hc.layout;
+
+			if (g.layout == null)
+				g.layout = new BasicLayout();
+		}
+	}
 }
diff --git a/frameworks/projects/SparkRoyale/src/main/royale/spark/components/beads/TabBarItemRendererInitializer.as b/frameworks/projects/SparkRoyale/src/main/royale/spark/components/beads/TabBarItemRendererInitializer.as
new file mode 100644
index 0000000..eb0ee18
--- /dev/null
+++ b/frameworks/projects/SparkRoyale/src/main/royale/spark/components/beads/TabBarItemRendererInitializer.as
@@ -0,0 +1,60 @@
+////////////////////////////////////////////////////////////////////////////////
+//
+//  Licensed to the Apache Software Foundation (ASF) under one or more
+//  contributor license agreements.  See the NOTICE file distributed with
+//  this work for additional information regarding copyright ownership.
+//  The ASF licenses this file to You under the Apache License, Version 2.0
+//  (the "License"); you may not use this file except in compliance with
+//  the License.  You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+//  Unless required by applicable law or agreed to in writing, software
+//  distributed under the License is distributed on an "AS IS" BASIS,
+//  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+//  See the License for the specific language governing permissions and
+//  limitations under the License.
+//
+////////////////////////////////////////////////////////////////////////////////
+package spark.components.beads
+{	
+	import org.apache.royale.core.IIndexedItemRenderer;
+	import org.apache.royale.core.SimpleCSSStyles;
+	import org.apache.royale.core.UIBase;
+	import org.apache.royale.html.beads.HorizontalListItemRendererInitializer;
+
+	/**
+	 *  The TabBarItemRendererInitializer class initializes item renderers
+	 *  in TabBar tab labels.
+	 *  
+	 *  @langversion 3.0
+	 *  @playerversion Flash 10.2
+	 *  @playerversion AIR 2.6
+	 *  @productversion Royale 0.9.8
+	 */
+	public class TabBarItemRendererInitializer extends org.apache.royale.html.beads.HorizontalListItemRendererInitializer
+	{
+		/**
+		 *  constructor.
+		 *
+		 *  @langversion 3.0
+		 *  @playerversion Flash 10.2
+		 *  @playerversion AIR 2.6
+		 *  @productversion Royale 0.9.8
+		 */
+		public function TabBarItemRendererInitializer() 
+		{
+		}
+		
+		/**
+		 * @royaleignorecoercion org.apache.royale.core.UIBase
+		 */
+		override protected function setupVisualsForItemRenderer(ir:IIndexedItemRenderer):void
+		{
+			var style:SimpleCSSStyles = new SimpleCSSStyles();
+			style.marginBottom = presentationModel.separatorThickness;
+			(ir as UIBase).style = style;
+			//(ir as UIBase).height = presentationModel.rowHeight;
+		}
+	}
+}
diff --git a/frameworks/projects/SparkRoyale/src/main/royale/spark/components/beads/TabBarSelectionUpdateFromSelectableDataProvider.as b/frameworks/projects/SparkRoyale/src/main/royale/spark/components/beads/TabBarSelectionUpdateFromSelectableDataProvider.as
deleted file mode 100644
index 2d5fa6a..0000000
--- a/frameworks/projects/SparkRoyale/src/main/royale/spark/components/beads/TabBarSelectionUpdateFromSelectableDataProvider.as
+++ /dev/null
@@ -1,158 +0,0 @@
-////////////////////////////////////////////////////////////////////////////////
-//
-//  Licensed to the Apache Software Foundation (ASF) under one or more
-//  contributor license agreements.  See the NOTICE file distributed with
-//  this work for additional information regarding copyright ownership.
-//  The ASF licenses this file to You under the Apache License, Version 2.0
-//  (the "License"); you may not use this file except in compliance with
-//  the License.  You may obtain a copy of the License at
-//
-//      http://www.apache.org/licenses/LICENSE-2.0
-//
-//  Unless required by applicable law or agreed to in writing, software
-//  distributed under the License is distributed on an "AS IS" BASIS,
-//  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-//  See the License for the specific language governing permissions and
-//  limitations under the License.
-//
-////////////////////////////////////////////////////////////////////////////////
-package spark.components.beads
-{
-	import org.apache.royale.core.IBead;
-	import org.apache.royale.core.IDataProviderModel;
-	import org.apache.royale.core.IStrand;
-	import org.apache.royale.core.IViewport;
-	import org.apache.royale.events.Event;
-	import org.apache.royale.events.IEventDispatcher;
-	import mx.core.ISelectableList;
-	import spark.components.TabBar;
-
-
-    /**
-	 *  Updates TabBar.selectedIndex when the selectable dataProvider (i.e. ViewStack)
-	 *  has a selectedIndex change.
-	 *
-	 *  @langversion 3.0
-	 *  @playerversion Flash 10.2
-	 *  @playerversion AIR 2.6
-	 *  @productversion Royale 0.9.8
-	 */
-	public class TabBarSelectionUpdateFromSelectableDataProvider implements IBead
-	{
-		/**
-		 *  Constructor
-		 *
-		 *  @langversion 3.0
-		 *  @playerversion Flash 10.2
-		 *  @playerversion AIR 2.6
-		 *  @productversion Royale 0.9.8
-		 */
-		public function TabBarSelectionUpdateFromSelectableDataProvider()
-		{
-		}
-
-		protected var _strand:IStrand;
-
-		/**
-		 *  @copy org.apache.royale.core.IStrand
-		 *
-		 *  @langversion 3.0
-		 *  @playerversion Flash 10.2
-		 *  @playerversion AIR 2.6
-		 *  @productversion Royale 0.9.8
-		 *  @royaleignorecoercion org.apache.royale.events.IEventDispatcher
-		 */
-		public function set strand(value:IStrand):void
-		{
-			_strand = value;
-			IEventDispatcher(value).addEventListener("initComplete", initComplete);
-		}
-
-		/**
-		 *  finish setup
-		 *
-		 *  @langversion 3.0
-		 *  @playerversion Flash 10.2
-		 *  @playerversion AIR 2.6
-		 *  @productversion Royale 0.9.8
-		 *  @royaleignorecoercion org.apache.royale.core.IDataProviderModel
-		 */
-		protected function initComplete(event:Event):void
-		{
-			IEventDispatcher(_strand).removeEventListener("initComplete", initComplete);
-
-			var contentView:IStrand = (_strand.getBeadByType(IViewport) as IViewport).contentView as IStrand;
-			_dataProviderModel = contentView.getBeadByType(IDataProviderModel) as IDataProviderModel;
-
-			dataProviderModel.addEventListener("dataProviderChanged", dataProviderChangeHandler);
-
-			// invoke now in case "dataProviderChanged" has already been dispatched.
-			dataProviderChangeHandler(null);
-		}
-
-		private var dp:ISelectableList;
-
-		/**
-		 * @private
-		 * @royaleignorecoercion org.apache.royale.events.IEventDispatcher
-		 */
-		protected function dataProviderChangeHandler(event:Event):void
-		{
-			if (dp)
-			{
-				dp.removeEventListener("change", handleIndexChange);
-				dp.removeEventListener("valueCommit", handleIndexChange);
-			}
-
-			dp = dataProviderModel.dataProvider as ISelectableList;
-			if (!dp) return;
-
-			dp.addEventListener("change", handleIndexChange);
-			dp.addEventListener("valueCommit", handleIndexChange);
-			
-			handleIndexChange(null);
-		}
-
-		/**
-		 *  Handles the selectedIndex change event.
-		 *
-		 *  @langversion 3.0
-		 *  @playerversion Flash 10.2
-		 *  @playerversion AIR 2.6
-		 *  @productversion Royale 0.9.8
-		 *  @royaleignorecoercion org.apache.royale.events.IEventDispatcher
-		 */
-		protected function handleIndexChange(event:Event):void
-		{
-			var tb:TabBar = _strand as TabBar;
-			var newSelectedIndex:int = dp.selectedIndex;
-			if (tb.selectedIndex != newSelectedIndex)
-			{
-				tb.selectedIndex = newSelectedIndex;
-			}
-		}
-
-		private var _dataProviderModel:IDataProviderModel;
-
-		/**
-		 *  The org.apache.royale.core.IDataProviderModel that contains the
-		 *  data source.
-		 *
-		 *  @langversion 3.0
-		 *  @playerversion Flash 10.2
-		 *  @playerversion AIR 2.6
-		 *  @productversion Royale 0.9.8
-		 *  @royaleignorecoercion org.apache.royale.core.IDataProviderModel
-		 */
-		public function get dataProviderModel():IDataProviderModel
-		{
-			if (!_dataProviderModel)
-			{
-				var contentView:IStrand = (_strand.getBeadByType(IViewport) as IViewport).contentView as IStrand;
-				_dataProviderModel = contentView.getBeadByType(IDataProviderModel) as IDataProviderModel;
-			}
-			return _dataProviderModel;
-		}
-		
-	}
-}
diff --git a/frameworks/projects/SparkRoyale/src/main/royale/spark/components/beads/VirtualListView.as b/frameworks/projects/SparkRoyale/src/main/royale/spark/components/beads/VirtualListView.as
new file mode 100644
index 0000000..528fdc7
--- /dev/null
+++ b/frameworks/projects/SparkRoyale/src/main/royale/spark/components/beads/VirtualListView.as
@@ -0,0 +1,186 @@
+////////////////////////////////////////////////////////////////////////////////
+//
+//  Licensed to the Apache Software Foundation (ASF) under one or more
+//  contributor license agreements.  See the NOTICE file distributed with
+//  this work for additional information regarding copyright ownership.
+//  The ASF licenses this file to You under the Apache License, Version 2.0
+//  (the "License"); you may not use this file except in compliance with
+//  the License.  You may obtain a copy of the License at
+//
+//	  http://www.apache.org/licenses/LICENSE-2.0
+//
+//  Unless required by applicable law or agreed to in writing, software
+//  distributed under the License is distributed on an "AS IS" BASIS,
+//  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+//  See the License for the specific language governing permissions and
+//  limitations under the License.
+//
+////////////////////////////////////////////////////////////////////////////////
+
+package spark.components.beads
+{
+	import mx.containers.beads.VirtualListView;
+	import mx.core.IVisualElement;
+	import mx.core.LayoutElementUIComponentUtils;
+	import mx.core.UIComponent;
+	import org.apache.royale.core.IItemRenderer;
+	import org.apache.royale.core.ILayoutChild;
+	import org.apache.royale.core.IStrand;
+	import org.apache.royale.events.Event;
+	import org.apache.royale.events.IEventDispatcher;
+	import org.apache.royale.utils.sendStrandEvent;
+	import spark.components.supportClasses.GroupBase;
+	import spark.core.ISparkContainer;
+	import spark.events.RendererExistenceEvent;
+	import spark.layouts.BasicLayout;
+		
+	/**
+	 *  @viewbead
+	 *  @langversion 3.0
+	 *  @playerversion Flash 10.2
+	 *  @playerversion AIR 2.6
+	 *  @productversion Royale 0.9.8
+	 */
+	public class VirtualListView extends mx.containers.beads.VirtualListView
+	{
+		public function VirtualListView()
+		{
+			super();
+		}
+
+		//
+		//  From SparkDataContainerView (also derived from Basic DataContainer)
+		//
+
+		override public function set strand(value:IStrand):void
+		{
+			super.strand = value;
+			prepareContentView();
+			prepareDisplayView();
+		}
+		
+		override protected function dispatchItemAdded(renderer:IItemRenderer):void
+		{
+			super.dispatchItemAdded(renderer);
+			var newEvent:RendererExistenceEvent = new RendererExistenceEvent(RendererExistenceEvent.RENDERER_ADD, false, false, renderer as IVisualElement);
+			sendStrandEvent(_strand,newEvent);
+		}
+
+		override protected function itemsCreatedHandler(event:Event):void
+		{
+			// Note that we assume host has same sizing as content group, if applicable
+			var host:UIComponent = _strand as UIComponent;
+			if (host.isWidthSizedToContent() || host.isHeightSizedToContent())
+			{
+				host.invalidateSize();
+			}
+			super.itemsCreatedHandler(event);
+		}
+
+		protected function prepareContentView():void
+		{
+			var host:ILayoutChild = _strand as ILayoutChild;
+			var g:GroupBase = contentView as GroupBase;
+			
+			if (!host || !g)
+				return;
+				
+			if (host == g)
+			{
+				if (g.layout == null)
+					g.layout = new BasicLayout();
+				return;
+			}
+
+			// only for the case where host.layout was set before view set
+			var hc:ISparkContainer = _strand as ISparkContainer;
+			if (hc.layout != null)
+				g.layout = hc.layout;
+
+			if (g.layout == null)
+				g.layout = new BasicLayout();
+		}
+
+		public function get displayView():GroupBase
+		{
+			return contentView as GroupBase;
+		}
+		
+		protected function prepareDisplayView():void
+		{
+			var host:ILayoutChild = _strand as ILayoutChild;
+			var g:GroupBase = displayView as GroupBase;
+
+			if (!host || !g || host == g)
+				return;
+
+			// Resize content to host, because 
+			// (a) ScrollingViewport sets content to 100% and
+			// (b) we don't yet have content reverse-proxing the explicit size functions 
+			//     (explicitXX, percentXX, isXXSizedToContent) back to the host.
+			// Layout asks target (content) for explicit sizes, sometimes.
+			//
+			LayoutElementUIComponentUtils.setSizeFromChild(g, host);
+		}
+		
+		/**
+		 *  Measure before layout.
+		 *
+		 *  @langversion 3.0
+		 *  @playerversion Flash 10.2
+		 *  @playerversion AIR 2.6
+		 *  @productversion Royale 0.9.6
+		 */
+		override public function beforeLayout():Boolean
+		{
+			if (_strand != displayView)
+			{
+				var host:UIComponent = _strand as UIComponent;
+				var g:GroupBase = displayView as GroupBase;
+
+				// Resize content to host, because 
+				// (a) ScrollingViewport sets content to 100% and
+				// (b) we don't yet have content reverse-proxing the explicit size functions 
+				//     (explicitXX, percentXX, isXXSizedToContent) back to the host.
+				// Layout asks target (content) for explicit sizes, sometimes.
+				//
+				LayoutElementUIComponentUtils.setSizeFromChild(g, host);
+				
+				if (g.isWidthSizedToContent() || g.isHeightSizedToContent())
+				{
+					g.layout.measure();
+				}
+			}
+			return true;
+		}
+		
+		/**
+		 *  Dispatch after layout.
+		 *
+		 *  @langversion 3.0
+		 *  @playerversion Flash 10.2
+		 *  @playerversion AIR 2.6
+		 *  @productversion Royale 0.9.6
+		 */
+		override public function afterLayout():void
+		{
+			if (_strand != displayView)
+			{
+				var host:UIComponent = _strand as UIComponent;
+				var g:GroupBase = displayView as GroupBase;
+
+				host.setActualSize(g.width, g.height);
+
+				if (g.isWidthSizedToContent() || g.isHeightSizedToContent())
+				{
+					// request re-run layout on the parent.  In theory, we should only
+					// end up in afterLayout if the content size changed.
+					if (host.parent)
+					{
+						(host.parent as IEventDispatcher).dispatchEvent(new Event("layoutNeeded"));   
+					}
+				}
+			}
+		}
+	}
+}
diff --git a/frameworks/projects/SparkRoyale/src/main/royale/spark/components/supportClasses/ListBase.as b/frameworks/projects/SparkRoyale/src/main/royale/spark/components/supportClasses/ListBase.as
index e1562dc..05a6950 100644
--- a/frameworks/projects/SparkRoyale/src/main/royale/spark/components/supportClasses/ListBase.as
+++ b/frameworks/projects/SparkRoyale/src/main/royale/spark/components/supportClasses/ListBase.as
@@ -48,8 +48,6 @@
 import org.apache.royale.html.beads.ItemRendererFunctionBead;

 import spark.components.DataGroup;

 import spark.components.SkinnableContainer;

-import spark.components.beads.SparkContainerView;

-import spark.layouts.VerticalLayout;

 

 import org.apache.royale.core.IBeadLayout;

 import org.apache.royale.core.IStrand;

@@ -269,7 +267,6 @@
     public function ListBase()

     {

         super();

-		layout = new VerticalLayout();

     }

     

     //--------------------------------------------------------------------------

@@ -493,42 +490,22 @@
      *  @productversion Royale 0.9.4

      * 

      *  @royaleignorecoercion spark.components.DataGroup

-     *  @royaleignorecoercion spark.components.beads.SparkContainerView

      */

     [Bindable("dataProviderChanged")]

     [Inspectable(category="Data")]

     

     public function get dataProvider():IList

     {       

-        return ((view as SparkContainerView).contentView as DataGroup).dataProvider;

+        return (getLayoutHost().contentView as DataGroup).dataProvider;

     }

     

     /**

      *  @private

      *  @royaleignorecoercion spark.components.DataGroup

-     *  @royaleignorecoercion spark.components.beads.SparkContainerView

      */

     public function set dataProvider(value:IList):void

     {

-        if (isWidthSizedToContent() || isHeightSizedToContent())

-            ((view as SparkContainerView).contentView as DataGroup).addEventListener("itemsCreated", itemsCreatedHandler);

-        ((view as SparkContainerView).contentView as DataGroup).dataProvider = value;

-    }

-    

-    private function itemsCreatedHandler(event:Event):void

-    {

-        if (parent)

-        {

-            COMPILE::JS

-            {

-                // clear last width/height so elements size to content

-                element.style.width = "";

-                element.style.height = "";

-                ((view as SparkContainerView).contentView as DataGroup).element.style.width = "";

-                ((view as SparkContainerView).contentView as DataGroup).element.style.height = "";

-            }

-            (parent as IEventDispatcher).dispatchEvent(new Event("layoutNeeded"));

-        }

+        (getLayoutHost().contentView as DataGroup).dataProvider = value;

     }

     

     //----------------------------------

@@ -546,24 +523,22 @@
      *  @productversion Royale 0.9.4

      * 

      *  @royaleignorecoercion spark.components.DataGroup

-     *  @royaleignorecoercion spark.components.beads.SparkContainerView

      */

     public function get itemRenderer():IFactory

     {

-        return ((view as SparkContainerView).contentView as DataGroup).itemRenderer;

+        return (getLayoutHost().contentView as DataGroup).itemRenderer;

     }

     

     /**

      *  @private

      *  @royaleignorecoercion spark.components.DataGroup

-     *  @royaleignorecoercion spark.components.beads.SparkContainerView

      */

     public function set itemRenderer(value:IFactory):void

     {

-        ((view as SparkContainerView).contentView as DataGroup).itemRenderer = value;

+        (getLayoutHost().contentView as DataGroup).itemRenderer = value;

         // the ItemRendererFactory was already put on the DataGroup's strand and

         // determined which factory to use so we have to set it up later here.

-        var factory:ItemRendererClassFactory = ((view as SparkContainerView).contentView as DataGroup).getBeadByType(ItemRendererClassFactory) as ItemRendererClassFactory;

+        var factory:ItemRendererClassFactory = (getLayoutHost().contentView as DataGroup).getBeadByType(ItemRendererClassFactory) as ItemRendererClassFactory;

         factory.createFunction = factory.createFromClass;

         factory.itemRendererFactory = value;

     }

@@ -586,7 +561,7 @@
     public function get itemRendererFunction():Function

     {

 

-	var contentView:IStrand = (view as SparkContainerView).contentView as IStrand;

+	var contentView:IStrand = getLayoutHost().contentView as IStrand;

         var itemRendererFunctionBead:ItemRendererFunctionBead = contentView.getBeadByType(ItemRendererFunctionBead) as ItemRendererFunctionBead;

 	if (itemRendererFunctionBead)

         {

@@ -601,7 +576,7 @@
      */

     public function set itemRendererFunction(value:Function):void

     {

-	var contentView:IStrand = (view as SparkContainerView).contentView as IStrand;

+	var contentView:IStrand = getLayoutHost().contentView as IStrand;

         var itemRendererFunctionBead:ItemRendererFunctionBead = contentView.getBeadByType(ItemRendererFunctionBead) as ItemRendererFunctionBead;

         if (!itemRendererFunctionBead)

         {

@@ -728,7 +703,7 @@
      */

     public function get labelField():String

     {

-         return (((view as SparkContainerView).contentView as DataGroup).model as ISelectionModel).labelField;

+         return ((getLayoutHost().contentView as DataGroup).model as ISelectionModel).labelField;

     } 

     

     /**

@@ -736,7 +711,7 @@
      */

     public function set labelField(value:String):void

     {

-        (((view as SparkContainerView).contentView as DataGroup).model as ISelectionModel).labelField = value;

+        ((getLayoutHost().contentView as DataGroup).model as ISelectionModel).labelField = value;

     } 

     

     //----------------------------------

@@ -984,7 +959,7 @@
        /*  if (_proposedSelectedIndex != NO_PROPOSED_SELECTION)

             return _proposedSelectedIndex; */

             

-        return (((view as SparkContainerView).contentView as DataGroup).model as ISelectionModel).selectedIndex;

+        return ((getLayoutHost().contentView as DataGroup).model as ISelectionModel).selectedIndex;

     }

     

     /**

@@ -992,7 +967,7 @@
      */

     public function set selectedIndex(value:int):void

     {

-        (((view as SparkContainerView).contentView as DataGroup).model as ISelectionModel).selectedIndex = value;

+        ((getLayoutHost().contentView as DataGroup).model as ISelectionModel).selectedIndex = value;

        /*  setSelectedIndex(value, false); */

     }

     

@@ -1083,7 +1058,7 @@
      */

     public function get selectedItem():*

     {

-        return (((view as SparkContainerView).contentView as DataGroup).model as ISelectionModel).selectedItem;

+        return ((getLayoutHost().contentView as DataGroup).model as ISelectionModel).selectedItem;

         /* if (_pendingSelectedItem !== undefined)

             return _pendingSelectedItem;

             

@@ -1101,7 +1076,7 @@
      */

     public function set selectedItem(value:*):void

     {

-        (((view as SparkContainerView).contentView as DataGroup).model as ISelectionModel).selectedItem = value;

+        ((getLayoutHost().contentView as DataGroup).model as ISelectionModel).selectedItem = value;

       //  setSelectedItem(value, false);

     }

 

@@ -2256,28 +2231,19 @@
     /**

      *  @private

      *  @royaleignorecoercion spark.components.DataGroup

-     *  @royaleignorecoercion spark.components.beads.SparkContainerView

      */

     override public function addedToParent():void

     {

-        if (!getBeadByType(IBeadLayout))

-            addBead(new ListBaseLayout());

         super.addedToParent();

         if (requireSelection && selectedIndex == -1)

             selectedIndex = 0;

-		((view as SparkContainerView).contentView as DataGroup).addEventListener("change", redispatcher);

-		((view as SparkContainerView).contentView as DataGroup).addEventListener("itemClick", redispatcher);

-		((view as SparkContainerView).contentView as DataGroup).addEventListener("doubleClick", redispatcher);

+		(getLayoutHost().contentView as DataGroup).addEventListener("change", redispatcher);

+		(getLayoutHost().contentView as DataGroup).addEventListener("itemClick", redispatcher);

+		(getLayoutHost().contentView as DataGroup).addEventListener("doubleClick", redispatcher);

 		

-        setActualSize(getExplicitOrMeasuredWidth(), getExplicitOrMeasuredHeight());

+        dispatchEvent(new Event("layoutNeeded"));

     }

     

-    override public function setActualSize(w:Number, h:Number):void

-    {

-        super.setActualSize(w, h);

-        ((view as SparkContainerView).contentView as DataGroup).setActualSize(w, h);

-    }

-

 	private function redispatcher(event:Event):void

 	{

 		dispatchEvent(new Event(event.type));

diff --git a/frameworks/projects/SparkRoyale/src/main/royale/spark/components/supportClasses/SkinnableContainerBase.as b/frameworks/projects/SparkRoyale/src/main/royale/spark/components/supportClasses/SkinnableContainerBase.as
index dfef503..2550a52 100644
--- a/frameworks/projects/SparkRoyale/src/main/royale/spark/components/supportClasses/SkinnableContainerBase.as
+++ b/frameworks/projects/SparkRoyale/src/main/royale/spark/components/supportClasses/SkinnableContainerBase.as
@@ -19,12 +19,15 @@
 
 package spark.components.supportClasses
 {
-    
+	import org.apache.royale.core.ILayoutHost;
+	import org.apache.royale.core.ILayoutParent;
 // import flash.display.DisplayObject;
 
 // import mx.core.ContainerGlobals;
 import mx.core.IFlexDisplayObject;
+	import mx.core.IUIComponent;
 import mx.managers.IFocusManagerContainer;
+	import spark.core.ISparkLayoutHost;
 
 /**
  *  Normal State
@@ -61,7 +64,7 @@
  *  @playerversion AIR 1.5
  *  @productversion Flex 4
  */
-public class SkinnableContainerBase extends SkinnableComponent implements IFocusManagerContainer
+public class SkinnableContainerBase extends SkinnableComponent implements IFocusManagerContainer, ILayoutParent
 {
     // include "../../core/Version.as";
 
@@ -146,5 +149,51 @@
     {
         return enabled ? "normal" : "disabled";
     }
+
+    /**
+     * Returns the ILayoutHost which is its view. From ILayoutParent.
+     *
+     *  @langversion 3.0
+     *  @playerversion Flash 10.2
+     *  @playerversion AIR 2.6
+     *  @productversion Royale 0.8
+     */
+    public function getLayoutHost():ILayoutHost
+    {
+        return view as ILayoutHost;
+    }
+
+		//
+		// Delegate to displayView
+		//
+
+		override public function get measuredWidth():Number
+		{
+			var lh:ISparkLayoutHost = getLayoutHost() as ISparkLayoutHost;
+			var g:IUIComponent = (lh ? lh.displayView as IUIComponent : null);
+			return g ? g.measuredWidth : super.measuredWidth;
+		}
+		
+		override public function get measuredHeight():Number
+		{
+			var lh:ISparkLayoutHost = getLayoutHost() as ISparkLayoutHost;
+			var g:IUIComponent = (lh ? lh.displayView as IUIComponent : null);
+			return g ? g.measuredHeight : super.measuredHeight;
+		}
+
+		override public function setActualSize(w:Number, h:Number):void
+		{
+			super.setActualSize(w, h);
+
+			var lh:ISparkLayoutHost = getLayoutHost() as ISparkLayoutHost;
+			var g:IUIComponent = (lh ? lh.displayView as IUIComponent : null);
+			if (g && g != this)
+			{
+				g.setActualSize(w, h);
+				// TODO: See note in Spark Application.setActualSize().
+//				g.width = w;
+//				g.height = h;
+			}
+		}
 }
 }
\ No newline at end of file
diff --git a/frameworks/projects/SparkRoyale/src/main/royale/spark/components/supportClasses/SparkTextButtonItemRenderer.as b/frameworks/projects/SparkRoyale/src/main/royale/spark/components/supportClasses/SparkTextButtonItemRenderer.as
index 5aa6919..8e5b8f2 100644
--- a/frameworks/projects/SparkRoyale/src/main/royale/spark/components/supportClasses/SparkTextButtonItemRenderer.as
+++ b/frameworks/projects/SparkRoyale/src/main/royale/spark/components/supportClasses/SparkTextButtonItemRenderer.as
@@ -292,6 +292,33 @@
         {
             throw new Error("Method not implemented.");
         }
+
+		COMPILE::JS
+		override public function get measuredWidth():Number
+		{
+			if (isNaN(_measuredWidth) || (!_measuredWidth && text != ""))
+				measure();
+			return super.measuredWidth;
+		}
+		
+		COMPILE::JS
+		override public function get measuredHeight():Number
+		{
+			if (isNaN(_measuredHeight) || (!_measuredHeight && text != ""))
+				measure();
+			return super.measuredHeight;
+		}
+
+		COMPILE::JS
+		override protected function measure():void
+		{
+			var oldParent = element.parentElement;
+			document.body.appendChild(element);
+			_measuredWidth = element.offsetWidth;
+			_measuredHeight = element.offsetHeight;
+			document.body.removeChild(element);
+			oldParent.appendChild(element);
+		}
     }
 
 }
diff --git a/frameworks/projects/SparkRoyale/src/main/royale/spark/core/ISparkContainer.as b/frameworks/projects/SparkRoyale/src/main/royale/spark/core/ISparkContainer.as
new file mode 100644
index 0000000..8b95d23
--- /dev/null
+++ b/frameworks/projects/SparkRoyale/src/main/royale/spark/core/ISparkContainer.as
@@ -0,0 +1,51 @@
+////////////////////////////////////////////////////////////////////////////////
+//
+//  Licensed to the Apache Software Foundation (ASF) under one or more
+//  contributor license agreements.  See the NOTICE file distributed with
+//  this work for additional information regarding copyright ownership.
+//  The ASF licenses this file to You under the Apache License, Version 2.0
+//  (the "License"); you may not use this file except in compliance with
+//  the License.  You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+//  Unless required by applicable law or agreed to in writing, software
+//  distributed under the License is distributed on an "AS IS" BASIS,
+//  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+//  See the License for the specific language governing permissions and
+//  limitations under the License.
+//
+////////////////////////////////////////////////////////////////////////////////
+
+package spark.core
+{
+	import spark.layouts.supportClasses.LayoutBase;
+
+	/**
+	 * 
+	 *  @langversion 3.0
+	 *  @playerversion Flash 10
+	 *  @playerversion AIR 1.5
+	 *  @productversion Royale 0.9.8
+	 */
+	public interface ISparkContainer
+	{
+		/**
+		 *  
+		 *  @langversion 3.0
+		 *  @playerversion Flash 10
+		 *  @playerversion AIR 1.5
+		 *  @productversion Royale 0.9.8
+		 */
+		function get layout():LayoutBase;
+
+		/**
+		 *  
+		 *  @langversion 3.0
+		 *  @playerversion Flash 10
+		 *  @playerversion AIR 1.5
+		 *  @productversion Royale 0.9.8
+		 */
+		function set layout(value:LayoutBase):void;
+	}
+}
diff --git a/frameworks/projects/SparkRoyale/src/main/royale/spark/core/ISparkLayoutHost.as b/frameworks/projects/SparkRoyale/src/main/royale/spark/core/ISparkLayoutHost.as
new file mode 100644
index 0000000..e011a32
--- /dev/null
+++ b/frameworks/projects/SparkRoyale/src/main/royale/spark/core/ISparkLayoutHost.as
@@ -0,0 +1,46 @@
+////////////////////////////////////////////////////////////////////////////////
+//
+//  Licensed to the Apache Software Foundation (ASF) under one or more
+//  contributor license agreements.  See the NOTICE file distributed with
+//  this work for additional information regarding copyright ownership.
+//  The ASF licenses this file to You under the Apache License, Version 2.0
+//  (the "License"); you may not use this file except in compliance with
+//  the License.  You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+//  Unless required by applicable law or agreed to in writing, software
+//  distributed under the License is distributed on an "AS IS" BASIS,
+//  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+//  See the License for the specific language governing permissions and
+//  limitations under the License.
+//
+////////////////////////////////////////////////////////////////////////////////
+
+package spark.core
+{
+	import spark.components.supportClasses.GroupBase;
+
+	/**
+	 *  The ISparkLayoutHost interface is an extension of ILayoutHost for
+	 *  Spark container views that have an IBeadLayout.  The layout implementation
+	 *  often needs to know certain things about other objects in the view.
+	 * 
+	 *  @langversion 3.0
+	 *  @playerversion Flash 10.2
+	 *  @playerversion AIR 2.6
+	 *  @productversion Royale 0.9.8
+	 */
+	public interface ISparkLayoutHost
+	{
+		/**
+		 *  The container which is displayed (contentView or skin).
+		 * 
+		 *  @langversion 3.0
+		 *  @playerversion Flash 10.2
+		 *  @playerversion AIR 2.6
+		 *  @productversion Royale 0.9.8
+		 */
+		function get displayView():GroupBase;
+	}
+}
diff --git a/frameworks/projects/SparkRoyale/src/main/royale/spark/layouts/supportClasses/LayoutBase.as b/frameworks/projects/SparkRoyale/src/main/royale/spark/layouts/supportClasses/LayoutBase.as
index 33b92f5..7eed160 100644
--- a/frameworks/projects/SparkRoyale/src/main/royale/spark/layouts/supportClasses/LayoutBase.as
+++ b/frameworks/projects/SparkRoyale/src/main/royale/spark/layouts/supportClasses/LayoutBase.as
@@ -2158,7 +2158,10 @@
     
     override public function layout():Boolean
     {
-        var n:int = layoutView.numElements;
+        // TODO: can we just use target all the time?  in other words, is target always host.view.contentView?
+        //       sometimes host == null, and SparkLayoutBead used target.numElements before
+        //
+        var n:int = (host ? layoutView.numElements : target.numElements);
         if (n == 0)
             return false;
         
diff --git a/frameworks/projects/SparkRoyale/src/main/royale/spark/layouts/supportClasses/SparkLayoutBead.as b/frameworks/projects/SparkRoyale/src/main/royale/spark/layouts/supportClasses/SparkLayoutBead.as
index c9cfa00..c963de3 100644
--- a/frameworks/projects/SparkRoyale/src/main/royale/spark/layouts/supportClasses/SparkLayoutBead.as
+++ b/frameworks/projects/SparkRoyale/src/main/royale/spark/layouts/supportClasses/SparkLayoutBead.as
@@ -19,140 +19,95 @@
 
 package spark.layouts.supportClasses
 {
-import mx.core.Container;
-import mx.core.ILayoutElement;
-import mx.core.IVisualElement;
-import mx.core.UIComponent;
-import mx.core.mx_internal;
-
-import spark.components.supportClasses.GroupBase;
-import spark.components.SkinnableContainer;
-import spark.components.SkinnableDataContainer;
-import spark.core.NavigationUnit;
-
-import org.apache.royale.core.IBeadLayout;
-import org.apache.royale.core.ILayoutHost;
-import org.apache.royale.core.IStrand;
-import org.apache.royale.core.LayoutBase;
-import org.apache.royale.core.UIBase;
-import org.apache.royale.events.Event;
-import org.apache.royale.events.EventDispatcher;
-import org.apache.royale.utils.MXMLDataInterpreter;
-import org.apache.royale.utils.loadBeadFromValuesManager;
-
-use namespace mx_internal;
-
-/**
- *  The SparkLayoutBead class is a layout bead that pumps the Spark 
- *  LayoutBase subclasses.
- *
- *  @langversion 3.0
- *  @playerversion Flash 10
- *  @playerversion AIR 1.5
- *  @productversion Flex 4
- */
-public class SparkLayoutBead extends org.apache.royale.core.LayoutBase
-{
-    //--------------------------------------------------------------------------
-    //
-    //  Constructor
-    //
-    //--------------------------------------------------------------------------
-
-    /**
-     *  Constructor. 
-     *  
-     *  @langversion 3.0
-     *  @playerversion Flash 10
-     *  @playerversion AIR 1.5
-     *  @productversion Flex 4
-     */    
-    public function SparkLayoutBead()
-    {
-        super();
-    }
-
-	private var sawSizeChanged:Boolean;
+	import mx.core.UIComponent;
+	import org.apache.royale.core.ILayoutHost;
+	import org.apache.royale.core.IStrand;
+	import org.apache.royale.core.LayoutBase;
+	import org.apache.royale.core.UIBase;
+	import org.apache.royale.events.Event;
+	import spark.components.supportClasses.GroupBase;
+	import spark.components.supportClasses.SkinnableComponent;
 	
-	override	 protected function handleSizeChange(event:Event):void
+	/**
+	 *  The SparkLayoutBead class is a layout bead that pumps the Spark 
+	 *  LayoutBase subclasses.
+	 *
+	 *  @langversion 3.0
+	 *  @playerversion Flash 10
+	 *  @playerversion AIR 1.5
+	 *  @productversion Royale 0.9.6
+	 */
+	public class SparkLayoutBead extends org.apache.royale.core.LayoutBase
 	{
-		sawSizeChanged = true;
-		super.handleSizeChange(event);
+		/**
+		 *  Constructor. 
+		 *  
+		 *  @langversion 3.0
+		 *  @playerversion Flash 10
+		 *  @playerversion AIR 1.5
+		 *  @productversion Royale 0.9.6
+		 */    
+		public function SparkLayoutBead()
+		{
+			super();
+		}
+		
+		private var sawSizeChanged:Boolean;
+		
+		override protected function handleSizeChange(event:Event):void
+		{
+			sawSizeChanged = true;
+			super.handleSizeChange(event);
+		}
+		
+		override public function layout():Boolean
+		{
+			// NOTE: Can't test numChildren, due to virtual layouts
+			//var n:int = target.numChildren;
+			//if (n == 0)
+			//	return false;
+			
+			var usingSkin:Boolean = false;
+			if (host is SkinnableComponent)
+				usingSkin = (host as SkinnableComponent).skin != null;
+			
+			if (!usingSkin && target != host)
+			{
+				var tlc:UIComponent = host as UIComponent;
+				if (!tlc.isWidthSizedToContent() && !tlc.isHeightSizedToContent())
+					target.setActualSize(tlc.width, tlc.height);
+			}
+			
+			if (!isNaN(target.percentWidth) || !isNaN(target.percentHeight))
+			{
+				if (!sawSizeChanged)
+					return false;
+			}
+			
+			target.layout.layout();
+			return true;
+		}
+		
+		private var _strand:IStrand;
+		
+		override public function set strand(value:IStrand):void
+		{
+			_strand = value;
+			var host:UIBase = value as UIBase;
+			_target = (host.view as ILayoutHost).contentView as GroupBase;
+			super.strand = value;
+		}
+		
+		private var _target:GroupBase;
+		
+		public function get target():GroupBase
+		{
+			return _target;
+		}
+		
+		public function set target(value:GroupBase):void
+		{
+			_target = value;
+		}
 	}
-
-    override public function layout():Boolean
-    {
-        var n:int = target.numChildren;
-        if (n == 0)
-            return false;
-        
-		var usingSkin:Boolean = false;
-		if (host is SkinnableContainer)
-			usingSkin = (host as SkinnableContainer).skin != null;
-		else if (host is SkinnableDataContainer)
-			usingSkin = (host as SkinnableDataContainer).skin != null;
-				
-        if (!usingSkin && target != host)
-        {
-            var tlc:UIComponent = host as UIComponent;
-            if (!tlc.isWidthSizedToContent() &&
-                !tlc.isHeightSizedToContent())
-                target.setActualSize(tlc.width, tlc.height);
-        }
-        
-		if ((!isNaN(target.percentWidth)) || (!isNaN(target.percentHeight)))
-			if (!sawSizeChanged)
-				return false;
-				
-        var w:Number = target.width;
-        var h:Number = target.height;
-        if (target.layout.isHeightSizedToContent())
-            h = target.measuredHeight;
-        if (target.layout.isWidthSizedToContent())
-            w = target.measuredWidth;
-        target.layout.updateDisplayList(w, h);
-        
-        // update the target's actual size if needed.
-        if (target.layout.isWidthSizedToContent() && target.layout.isHeightSizedToContent()) {
-            target.setActualSize(target.getExplicitOrMeasuredWidth(), 
-                target.getExplicitOrMeasuredHeight());
-        }
-        else if (target.layout.isWidthSizedToContent())
-            target.setWidth(target.getExplicitOrMeasuredWidth());
-        else if (target.layout.isHeightSizedToContent())
-            target.setHeight(target.getExplicitOrMeasuredHeight());
-        
-        return true;
-    }
-    
-    //--------------------------------------------------------------------------
-    //
-    //  Properties
-    //
-    //--------------------------------------------------------------------------
-    
-    private var _strand:IStrand;
-    
-    override public function set strand(value:IStrand):void
-    {
-        _strand = value;
-        var host:UIBase = value as UIBase;
-        _target = (host.view as ILayoutHost).contentView as GroupBase;
-        super.strand = value;
-        
-    }
-    
-    private var _target:GroupBase;
-    
-    public function get target():GroupBase
-    {
-        return _target;
-    }
-    
-    public function set target(value:GroupBase):void
-    {
-        _target = value;
-    }
-
-}
 }