http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/9fd9b78b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/ContainerView.as
----------------------------------------------------------------------
diff --cc 
frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/ContainerView.as
index 3bd2e94,d62e799..4de5634
--- 
a/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/ContainerView.as
+++ 
b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/ContainerView.as
@@@ -17,18 -17,18 +17,20 @@@
  //
  
////////////////////////////////////////////////////////////////////////////////
  package org.apache.flex.html.beads
--{             
++{
        import org.apache.flex.core.BeadViewBase;
        import org.apache.flex.core.ContainerBase;
        import org.apache.flex.core.IBead;
        import org.apache.flex.core.IBeadLayout;
        import org.apache.flex.core.IBeadView;
--    import org.apache.flex.core.IChild;
++      import org.apache.flex.core.IChild;
        import org.apache.flex.core.IContainer;
        import org.apache.flex.core.IContainerView;
        import org.apache.flex.core.IContentViewHost;
        import org.apache.flex.core.ILayoutChild;
        import org.apache.flex.core.ILayoutHost;
++      import org.apache.flex.core.ILayoutView;
++      import org.apache.flex.core.IParent;
        import org.apache.flex.core.IParentIUIBase;
        import org.apache.flex.core.IStrand;
        import org.apache.flex.core.IUIBase;
@@@ -39,37 -39,37 +41,40 @@@
        import org.apache.flex.events.Event;
        import org.apache.flex.events.IEventDispatcher;
        import org.apache.flex.geom.Rectangle;
--    import org.apache.flex.geom.Size;
++      import org.apache.flex.geom.Size;
++      import org.apache.flex.html.Container;
        import org.apache.flex.html.beads.models.ViewportModel;
        import org.apache.flex.html.supportClasses.Border;
        import org.apache.flex.html.supportClasses.ContainerContentArea;
        import org.apache.flex.html.supportClasses.Viewport;
        import org.apache.flex.utils.CSSContainerUtils;
--    
++
        /**
         * This class creates and manages the contents of a Container. On the 
ActionScript
         * side, a Container has a contentView into which the offical children 
can be
         * placed. When adding an element that implements IChrome, that element 
is not
         * placed into the contentView, but is made a child of the Container 
directly.
--       * 
++       *
         * Containers also have a layout associated with them which controls 
the size and
         * placement of the elements in the contentView. When a Container does 
not have an
         * explicit size (including a percent size), the content dictates the 
size of the
         * Container.
--     *  
++     *
++       *  @viewbead
       *  @langversion 3.0
       *  @playerversion Flash 10.2
       *  @playerversion AIR 2.6
       *  @productversion FlexJS 0.0
         */
--      public class ContainerView extends BeadViewBase implements IBeadView, 
IContainerView, ILayoutHost
++      COMPILE::SWF
++      public class ContainerView extends GroupView
        {
                /**
         *  The ContainerView class is the default view for
           *  the org.apache.flex.core.ContainerBase classes.
           *  It lets you use some CSS styles to manage the border, background
           *  and padding around the content area.
--         *  
++         *
           *  @langversion 3.0
           *  @playerversion Flash 10.2
           *  @playerversion AIR 2.6
@@@ -78,41 -78,41 +83,26 @@@
                public function ContainerView()
                {
                        super();
--                      
--                      layoutRunning = false;
                }
--              
++
                /**
                 * The sub-element used as the parent of the container's 
elements. This does not
                 * include the chrome elements.
--               *  
--               *  @langversion 3.0
--               *  @playerversion Flash 10.2
--               *  @playerversion AIR 2.6
--               *  @productversion FlexJS 0.0
--               */
--              public function get contentView():IParentIUIBase
--              {
--                      return viewport.contentView as IParentIUIBase;
--              }
--              
--              /**
--               * The view that can be resized.
--               *  
++               *
                 *  @langversion 3.0
                 *  @playerversion Flash 10.2
                 *  @playerversion AIR 2.6
                 *  @productversion FlexJS 0.0
                 */
--              public function get resizableView():IUIBase
++              override public function get contentView():ILayoutView
                {
--                      return host;
++                      return viewport.contentView as ILayoutView;
                }
--              
++
                /**
                 * The viewport used to present the content and may display
                 * scroll bars (depending on the actual type of viewport).
--               *  
++               *
                 *  @langversion 3.0
                 *  @playerversion Flash 10.2
                 *  @playerversion AIR 2.6
@@@ -122,11 -122,11 +112,11 @@@
                {
                        return _viewport;
                }
--              
++
                /**
                 * The data model used by the viewport to determine how it 
should
                 * present the content area.
--               *  
++               *
                 *  @langversion 3.0
                 *  @playerversion Flash 10.2
                 *  @playerversion AIR 2.6
@@@ -136,62 -136,62 +126,14 @@@
                {
                        return _viewportModel;
                }
--              
++
                private var _viewportModel:IViewportModel;
                private var _viewport:IViewport;
                private var layoutRunning:Boolean;
--              
--              /**
--               * @private
--               */
--              public function addElement(c:IChild, dispatchEvent:Boolean = 
true):void
--              {
--                      contentView.addElement(c, dispatchEvent);
--              }
--              
--              /**
--               * @private
--               */
--              public function addElementAt(c:IChild, index:int, 
dispatchEvent:Boolean = true):void
--              {
--                      contentView.addElementAt(c, index, dispatchEvent);
--              }
--              
--              /**
--               * @private
--               */
--              public function getElementIndex(c:IChild):int
--              {
--                      return contentView.getElementIndex(c);
--              }
--              
--              /**
--               * @private
--               */
--              public function removeElement(c:IChild, dispatchEvent:Boolean = 
true):void
--              {
--                      contentView.removeElement(c, dispatchEvent);
--              }
--              
--              /**
--               * @private
--               */
--              public function get numElements():int
--              {
--                      return contentView.numElements;
--              }
--              
--              /**
--               * @private
--               */
--              public function getElementAt(index:int):IChild
--              {
--                      return contentView.getElementAt(index);
--              }
--              
++
                /**
                 * Strand setter.
--               *  
++               *
                 *  @langversion 3.0
                 *  @playerversion Flash 10.2
                 *  @playerversion AIR 2.6
@@@ -200,127 -200,127 +142,37 @@@
                override public function set strand(value:IStrand):void
                {
                        _strand = value;
--                      super.strand = value;
--                      
++
              createViewport();
--                      
--                      (host as 
IContentViewHost).strandChildren.addElement(viewport.contentView, false);
--                      
--                      displayBackgroundAndBorder(host as UIBase);
--                      
--                      // listen for initComplete to signal that the strand is 
set with its size
--                      // and beads.
-             host.addEventListener("beadsAdded", beadsAddedHandler);
 -                      host.addEventListener("initComplete", 
initCompleteHandler);
--              }
--              
--              /**
--               * Handles the initComplete event by completing the setup and 
kicking off the
--               * presentation of the Container.
--               *  
--               *  @langversion 3.0
--               *  @playerversion Flash 10.2
--               *  @playerversion AIR 2.6
--               *  @productversion FlexJS 0.0
--               */
-               protected function beadsAddedHandler(event:Event):void
 -              protected function initCompleteHandler(event:Event):void
--              {
--            var ilc:ILayoutChild = host as ILayoutChild;
--                      // Complete the setup if the height is sized to content 
or has been explicitly set
--            // and the width is sized to content or has been explicitly set
--                      if ((ilc.isHeightSizedToContent() || 
!isNaN(ilc.explicitHeight)) &&
--                (ilc.isWidthSizedToContent() || !isNaN(ilc.explicitWidth))) {
--                              completeSetup();
--                              
--                              var num:Number = contentView.numElements;
--                              if (num > 0) performLayout(event);
--                      }
--                      else {
--                              // otherwise, wait until the unknown sizes have 
been set and then finish
--                              host.addEventListener("sizeChanged", 
deferredSizeHandler);
--                host.addEventListener("widthChanged", deferredSizeHandler);
--                host.addEventListener("heightChanged", deferredSizeHandler);
--                      }
--              }
--              
--              /**
--               * Handles the case where the size of the host is not 
immediately known, usually do
--               * to one of its dimensions being indicated as a percent size.
--               *  
--               *  @langversion 3.0
--               *  @playerversion Flash 10.2
--               *  @playerversion AIR 2.6
--               *  @productversion FlexJS 0.0
--               */
--              private function deferredSizeHandler(event:Event):void
--              {
--            host.removeEventListener("sizeChanged", deferredSizeHandler);
--            host.removeEventListener("widthChanged", deferredSizeHandler);
--            host.removeEventListener("heightChanged", deferredSizeHandler);
--                      completeSetup();
--                      
--                      var num:Number = contentView.numElements;
--                      if (num > 0) 
--            {
--                performLayout(event);
--            }
++
++                      var chost:IContainer = host as IContainer;
++                      chost.strandChildren.addElement(viewport.contentView);
++
++                      super.strand = value;
                }
--              
++
                /**
                 * Called when the host is ready to complete its setup (usually 
after its size has been
                 * determined).
--               *  
++               *
                 *  @langversion 3.0
                 *  @playerversion Flash 10.2
                 *  @playerversion AIR 2.6
                 *  @productversion FlexJS 0.0
                 */
--              protected function completeSetup():void
++              override protected function completeSetup():void
                {
++                      super.completeSetup();
++
                        // when the first layout is complete, set up listeners 
for changes
                        // to the childrens' sizes.
                        host.addEventListener("layoutComplete", 
childrenChangedHandler);
--                      
--                      host.addEventListener("childrenAdded", performLayout);
--                      host.addEventListener("layoutNeeded", performLayout);
--                      host.addEventListener("widthChanged", resizeHandler);
--                      host.addEventListener("heightChanged", resizeHandler);
--                      host.addEventListener("sizeChanged", resizeHandler);
--                      host.addEventListener("viewCreated", 
viewCreatedHandler);
--              }
--              
--              /**
--               * Handles the viewCreated event by performing the first layout 
if
--               * there are children already present (ie, from MXML).
--               *  
--               *  @langversion 3.0
--               *  @playerversion Flash 10.2
--               *  @playerversion AIR 2.6
--               *  @productversion FlexJS 0.0
--               */
--              protected function viewCreatedHandler(event:Event):void
--              {                       
--                      if ((host as UIBase).numElements > 0) {
--                              performLayout(null);
--                      }
                }
--              
--        /**
--         * Calculate the space taken up by non-content children like a 
TItleBar in a Panel.
--         *  
--         *  @langversion 3.0
--         *  @playerversion Flash 10.2
--         *  @playerversion AIR 2.6
--         *  @productversion FlexJS 0.0
--         */
--        protected function getChromeMetrics():Rectangle
--        {
--            return new Rectangle(0, 0, 0, 0);
--        }
--        
++
                /**
                 * Creates the Viewport (or ScrollableViewport) through which 
the content
                 * area is presented.
--               *  
++               *
                 *  @langversion 3.0
                 *  @playerversion Flash 10.2
                 *  @playerversion AIR 2.6
@@@ -340,7 -340,7 +192,7 @@@
                      }
                  }
                        }
--                      
++
                        if (viewport == null) {
                                _viewport = _strand.getBeadByType(IViewport) as 
IViewport;
                                if (viewport == null) {
@@@ -351,72 -351,72 +203,48 @@@
                                                _strand.addBead(viewport);
                                        }
                                }
--                      }                       
++                      }
                }
--              
++
                /**
--               *  Positions the viewport, then sets any known sizes of the 
Viewport prior
--         *  to laying out its content.
--               *  
++               * Calculate the space taken up by non-content children like a 
TitleBar in a Panel.
++               *
                 *  @langversion 3.0
                 *  @playerversion Flash 10.2
                 *  @playerversion AIR 2.6
                 *  @productversion FlexJS 0.0
                 */
--              protected function layoutViewBeforeContentLayout():void
++              protected function getChromeMetrics():Rectangle
                {
--            var host:ILayoutChild = this.host as ILayoutChild;
--            var vm:IViewportModel = viewportModel;
--            vm.borderMetrics = CSSContainerUtils.getBorderMetrics(host);
--            vm.chromeMetrics = getChromeMetrics();
--            viewport.setPosition(vm.borderMetrics.left + 
vm.chromeMetrics.left,
--                                 vm.borderMetrics.top + vm.chromeMetrics.top)
--            viewport.layoutViewportBeforeContentLayout(
--                !host.isWidthSizedToContent() ? 
--                              host.width - vm.borderMetrics.left - 
vm.borderMetrics.right -
--                        vm.chromeMetrics.left - vm.chromeMetrics.right : NaN,
--                !host.isHeightSizedToContent() ? 
--                    host.height - vm.borderMetrics.top - 
vm.borderMetrics.bottom -
--                        vm.chromeMetrics.top - vm.chromeMetrics.bottom : NaN);
--                      
++                      var paddingMetrics:Rectangle = 
CSSContainerUtils.getPaddingMetrics(host);
++                      return paddingMetrics;
                }
                
                /**
--               * Executes the layout associated with this container. Once the 
layout has been
--               * run, it may affect the size of the host or may cause the 
host to present scroll
--               * bars view its viewport.
--               *  
++               *  Positions the viewport, then sets any known sizes of the 
Viewport prior
++         *  to laying out its content.
++               *
                 *  @langversion 3.0
                 *  @playerversion Flash 10.2
                 *  @playerversion AIR 2.6
                 *  @productversion FlexJS 0.0
                 */
--              protected function performLayout(event:Event):void
++              override protected function layoutViewBeforeContentLayout():void
                {
--                      layoutRunning = true;
--                      
--                      layoutViewBeforeContentLayout();
--                      
--                      var host:UIBase = _strand as UIBase;
--                      
--                      var layout:IBeadLayout = 
_strand.getBeadByType(IBeadLayout) as IBeadLayout;
--                      if (layout == null) {
--                              var c:Class = 
ValuesManager.valuesImpl.getValue(host, "iBeadLayout");
--                              if (c) {
--                                      layout = new c() as IBeadLayout;
--                                      _strand.addBead(layout);
--                              }
--                      }
--                      
--                      if (layout) {
--                              layout.layout();
--                      }
--                      
--                      layoutViewAfterContentLayout();
--                      
--                      layoutRunning = false;
++            var host:ILayoutChild = this.host as ILayoutChild;
++            var vm:IViewportModel = viewportModel;
++                      var hostWidth:Number = host.width;
++                      var hostHeight:Number = host.height;
++
++            vm.borderMetrics = CSSContainerUtils.getBorderMetrics(host);
++
++            viewport.setPosition(vm.borderMetrics.left, vm.borderMetrics.top);
++
++                      viewport.layoutViewportBeforeContentLayout(
++                              host.isWidthSizedToContent() ? NaN : hostWidth 
- vm.borderMetrics.left - vm.borderMetrics.right,
++                              host.isHeightSizedToContent() ? NaN : 
hostHeight - vm.borderMetrics.top - vm.borderMetrics.bottom);
                }
--              
++
                /**
                 * @private
                 */
@@@ -425,61 -425,61 +253,46 @@@
                /**
                 * Adjusts the size of the host, or adds scrollbars to the 
viewport, after
                 * the layout has been run.
--               *  
++               *
                 *  @langversion 3.0
                 *  @playerversion Flash 10.2
                 *  @playerversion AIR 2.6
                 *  @productversion FlexJS 0.0
                 */
--              protected function layoutViewAfterContentLayout():void
++              override protected function layoutViewAfterContentLayout():void
                {
--                      var host:UIBase = _strand as UIBase;
--            var vm:IViewportModel = viewportModel;
--            
++                      if (adjusting) return;
++
                        adjusting = true;
--                      
--            var viewportSize:Size = 
viewport.layoutViewportAfterContentLayout();
--            
--                      if (host.isWidthSizedToContent() && 
host.isHeightSizedToContent()) {                                    
--                              host.setWidthAndHeight(viewportSize.width + 
vm.borderMetrics.left + vm.borderMetrics.right +
--                                           vm.chromeMetrics.left + 
vm.chromeMetrics.right, 
--                                                         viewportSize.height 
+ vm.borderMetrics.top + vm.borderMetrics.bottom +
--                                           vm.chromeMetrics.top + 
vm.chromeMetrics.bottom,
--                                       false);
--                      }
--                      else if (!host.isWidthSizedToContent() && 
host.isHeightSizedToContent())
--                      {
--                              host.setHeight(viewportSize.height + 
vm.borderMetrics.top + vm.borderMetrics.bottom +
--                    vm.chromeMetrics.top + vm.chromeMetrics.bottom, false);
--                      }
--                      else if (host.isWidthSizedToContent() && 
!host.isHeightSizedToContent())
--                      {
--                              host.setWidth(viewportSize.width + 
vm.borderMetrics.left + vm.borderMetrics.right +
--                    vm.chromeMetrics.left + vm.chromeMetrics.right, false);
--                      }                       
++
++                      super.layoutViewAfterContentLayout();
++
++                      var contentSize:Size = calculateContentSize();
++                      viewport.layoutViewportAfterContentLayout(contentSize);
++
                        adjusting = false;
                }
--              
++
                /**
                 * Handles dynamic changes to the host's size by running the 
layout once
                 * the viewport has been adjusted.
--               *  
++               *
                 *  @langversion 3.0
                 *  @playerversion Flash 10.2
                 *  @playerversion AIR 2.6
                 *  @productversion FlexJS 0.0
                 */
--              protected function resizeHandler(event:Event):void
++              override protected function resizeHandler(event:Event):void
                {
                        if (!adjusting) {
                                performLayout(event);
                        }
                }
--              
++
                /**
                 * Whenever children are added, listeners are added to detect 
changes
--               * in their size. 
--               *  
++               * in their size.
++               *
                 *  @langversion 3.0
                 *  @playerversion Flash 10.2
                 *  @playerversion AIR 2.6
@@@ -489,7 -489,7 +302,7 @@@
                {
                        var host:UIBase = _strand as UIBase;
                        host.removeEventListener(event.type, 
childrenChangedHandler);
--                      
++
                        var n:Number = contentView.numElements;
                        for (var i:int=0; i < n; i++) {
                                var child:IUIBase = contentView.getElementAt(i) 
as IUIBase;
@@@ -498,55 -498,55 +311,79 @@@
                                child.addEventListener("sizeChanged", 
childResizeHandler);
                        }
                }
--                              
++      }
++
++      COMPILE::JS
++      public class ContainerView extends GroupView //??implements IParent
++      {
++              private var _viewport:IViewport;
++
                /**
--               * This event handles changes to the size of children of the 
container by running
--               * the layout again and adjusting the size of the container or 
viewport as necessary. 
--               *  
++               * The viewport used to present the content and may display
++               * scroll bars (depending on the actual type of viewport).
++               *
                 *  @langversion 3.0
                 *  @playerversion Flash 10.2
                 *  @playerversion AIR 2.6
                 *  @productversion FlexJS 0.0
                 */
--              protected function childResizeHandler(event:Event):void
++              protected function get viewport():IViewport
                {
--                      // during this process we don't want the layout to 
trigger
--                      // an endless event chain should any children get 
resized
--                      // by the layout.
--                      if (layoutRunning) return;                      
--                      performLayout(event);
++                      return _viewport;
                }
                
--              protected function displayBackgroundAndBorder(host:UIBase) : 
void
++              /**
++               * The sub-element used as the parent of the container's 
elements. This does not
++               * include the chrome elements.
++               *
++               *  @langversion 3.0
++               *  @playerversion Flash 10.2
++               *  @playerversion AIR 2.6
++               *  @productversion FlexJS 0.0
++               */
++              override public function get contentView():ILayoutView
                {
--                      var backgroundColor:Object = 
ValuesManager.valuesImpl.getValue(host, "background-color");
--                      var backgroundImage:Object = 
ValuesManager.valuesImpl.getValue(host, "background-image");
--                      if (backgroundColor != null || backgroundImage != null)
--                      {
--                              if (host.getBeadByType(IBackgroundBead) == null)
--                                      var c:Class = 
ValuesManager.valuesImpl.getValue(host, "iBackgroundBead");
--                              if (c) {
--                                      host.addBead( new c() as IBead );
++                      if (viewport != null) {
++                              return viewport.contentView as ILayoutView;
++                      } else {
++                              return host as ILayoutView;
++                      }
++              }
++
++              /**
++               * Strand setter.
++               *
++               *  @langversion 3.0
++               *  @playerversion Flash 10.2
++               *  @playerversion AIR 2.6
++               *  @productversion FlexJS 0.0
++               */
++              override public function set strand(value:IStrand):void
++              {
++                      _strand = value;
++                      super.strand = value;
++
++                      var c:Class;
++
++                      if (viewport == null) {
++                              _viewport = _strand.getBeadByType(IViewport) as 
IViewport;
++                              if (viewport == null) {
++                                      c = 
ValuesManager.valuesImpl.getValue(host, "iViewport");
++                                      if (c)
++                                      {
++                                              _viewport = new c() as 
IViewport;
++                                              _strand.addBead(viewport);
++                                      }
                                }
                        }
                        
--                      var borderStyle:String;
--                      var borderStyles:Object = 
ValuesManager.valuesImpl.getValue(host, "border");
--                      if (borderStyles is Array)
--                      {
--                              borderStyle = borderStyles[1];
--                      }
--                      if (borderStyle == null)
--                      {
--                              borderStyle = 
ValuesManager.valuesImpl.getValue(host, "border-style") as String;
--                      }
--                      if (borderStyle != null && borderStyle != "none")
--                      {
--                              if (host.getBeadByType(IBorderBead) == null) {
--                                      c = 
ValuesManager.valuesImpl.getValue(host, "iBorderBead");
--                                      if (c) {
--                                              host.addBead( new c() as IBead 
);
--                                      }
++                      if (viewport != null) {
++                              var chost:IContainer = host as IContainer;
++                              // add the viewport's contentView to this host 
ONLY if
++                              // the contentView is not the host itself, 
which is likely
++                              // most situations.
++                              if (chost != viewport.contentView) {
++                                      chost.addElement(viewport.contentView);
                                }
                        }
                }

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/9fd9b78b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/DataContainerView.as
----------------------------------------------------------------------
diff --cc 
frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/DataContainerView.as
index b32df59,0000000..36ed489
mode 100644,000000..100644
--- 
a/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/DataContainerView.as
+++ 
b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/DataContainerView.as
@@@ -1,170 -1,0 +1,230 @@@
 
+////////////////////////////////////////////////////////////////////////////////
 +//
 +//  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 org.apache.flex.html.beads
 +{     
 +      import org.apache.flex.core.BeadViewBase;
 +      import org.apache.flex.core.ContainerBase;
 +      import org.apache.flex.core.IBead;
 +      import org.apache.flex.core.IBeadLayout;
 +      import org.apache.flex.core.IBeadModel;
 +      import org.apache.flex.core.IBeadView;
++      import org.apache.flex.core.IList;
 +      import org.apache.flex.core.ISelectableItemRenderer;
 +      import org.apache.flex.core.IItemRenderer;
 +      import org.apache.flex.core.IItemRendererParent;
 +      import org.apache.flex.core.IParent;
 +    import org.apache.flex.core.IParentIUIBase;
 +      import org.apache.flex.core.IDataProviderModel;
++      import org.apache.flex.core.ISelectionModel;
 +      import org.apache.flex.core.IStrand;
 +    import org.apache.flex.core.IUIBase;
 +      import org.apache.flex.core.Strand;
 +      import org.apache.flex.core.UIBase;
 +      import org.apache.flex.core.ValuesManager;
 +      import org.apache.flex.events.Event;
 +      import org.apache.flex.events.IEventDispatcher;
 +      import org.apache.flex.html.beads.models.ScrollBarModel;
 +      import org.apache.flex.html.beads.models.SingleLineBorderModel;
 +      import org.apache.flex.html.supportClasses.Border;
 +      import org.apache.flex.html.supportClasses.DataGroup;
 +      import org.apache.flex.html.supportClasses.ScrollBar;
 +
 +      /**
-        *  The List class creates the visual elements of the 
org.apache.flex.html.List 
-        *  component. A List consists of the area to display the data (in the 
dataGroup), any 
-        *  scrollbars, and so forth.
++       *  The DataContainerView provides the visual elements for the 
DataContainer.
 +       *  
 +       *  @viewbead
 +       *  @langversion 3.0
 +       *  @playerversion Flash 10.2
 +       *  @playerversion AIR 2.6
-        *  @productversion FlexJS 0.0
++       *  @productversion FlexJS 0.8
 +       */
++      COMPILE::JS
 +      public class DataContainerView extends ContainerView implements 
IListView
 +      {
 +              public function DataContainerView()
 +              {
++                      super();
 +              }
-                                               
-               protected var listModel:IDataProviderModel;
-               
-               private var _border:Border;
 +              
 +              /**
-                *  The border surrounding the org.apache.flex.html.List.
-                *
++               *  @copy org.apache.flex.core.IBead#strand
++               *  
 +               *  @langversion 3.0
 +               *  @playerversion Flash 10.2
 +               *  @playerversion AIR 2.6
-                *  @productversion FlexJS 0.0
++               *  @productversion FlexJS 0.8
 +               */
-         public function get border():Border
-         {
-             return _border;
-         }
++              override public function set strand(value:IStrand):void
++              {
++                      _strand = value;
++                      super.strand = value;
++                      
++                      host.addEventListener("beadsAdded", beadsAddedHandler);
++              }
++              
++              protected var dataModel:IDataProviderModel;
 +              
 +              /**
-                *  The area holding the itemRenderers.
-                *
-                *  @langversion 3.0
-                *  @playerversion Flash 10.2
-                *  @playerversion AIR 2.6
-                *  @productversion FlexJS 0.0
++               * @flexjsignorecoercion 
org.apache.flex.core.IItemRendererParent
 +               */
 +              public function get dataGroup():IItemRendererParent
 +              {
-                       (contentView as UIBase).className = "ListDataGroup";
-                       return contentView as IItemRendererParent;
++                      return super.contentView as IItemRendererParent;
 +              }
-                               
++              
++              protected function beadsAddedHandler(event:Event):void
++              {
++                      dataModel = _strand.getBeadByType(IDataProviderModel) 
as IDataProviderModel;
++                      host.addEventListener("itemsCreated", 
itemsCreatedHandler);
++                      dataModel.addEventListener("dataProviderChanged", 
dataProviderChangeHandler);
++              }
++              
 +              /**
 +               * @private
 +               */
-               override public function get resizableView():IUIBase
++              override protected function handleInitComplete(event:Event):void
++              {
++                      super.handleInitComplete(event);
++              }
++              
++              /**
++               * @private
++               */
++              protected function itemsCreatedHandler(event:Event):void
++              {
++                      performLayout(event);
++              }
++              
++              /**
++               * @private
++               */
++              protected function dataProviderChangeHandler(event:Event):void
++              {
++                      performLayout(event);
++              }
++      }
++      
++      COMPILE::SWF
++      public class DataContainerView extends ContainerView implements 
IListView
++      {
++              public function DataContainerView()
++              {
++                      super();
++              }
++                                              
++              protected var dataModel:IDataProviderModel;
++              
++              /**
++               * @private
++               */
++              override public function get host():IUIBase
 +              {
 +                      return _strand as IUIBase;
 +              }
-         
-         /**
-          * @private
-          */
-         override public function get host():IUIBase
-         {
-             return _strand as IUIBase;
-         }
-                       
++              
 +              /**
 +               *  @copy org.apache.flex.core.IBead#strand
 +               *  
 +               *  @langversion 3.0
 +               *  @playerversion Flash 10.2
 +               *  @playerversion AIR 2.6
-                *  @productversion FlexJS 0.0
++               *  @productversion FlexJS 0.8
 +               */
 +              override public function set strand(value:IStrand):void
 +              {
 +                      _strand = value;
 +                      super.strand = value;
++                      
++                      host.addEventListener("beadsAdded", beadsAddedHandler);
 +              }
 +              
 +              override protected function completeSetup():void
 +              {
 +                      super.completeSetup();
 +                      
 +                      // list is not interested in UI children, it wants to 
know when new items
 +                      // have been added or the dataProvider has changed.
-                       
 +                      host.removeEventListener("childrenAdded", 
childrenChangedHandler);
 +                      host.removeEventListener("childrenAdded", 
performLayout);
 +                      host.addEventListener("itemsCreated", 
itemsCreatedHandler);
-                       
-                       listModel = _strand.getBeadByType(IDataProviderModel) 
as IDataProviderModel;
-                       listModel.addEventListener("dataProviderChanged", 
dataProviderChangeHandler);
 +              }
 +              
-               protected var lastSelectedIndex:int = -1;
++              protected function beadsAddedHandler(event:Event):void
++              {
++                      dataModel = _strand.getBeadByType(IDataProviderModel) 
as IDataProviderModel;
++                      dataModel.addEventListener("dataProviderChanged", 
dataProviderChangeHandler);
++              }
++              
++              override protected function handleInitComplete(event:Event):void
++              {
++                      super.handleInitComplete(event);
++              }
++              
++              /**
++               *  The area holding the itemRenderers.
++               *
++               *  @langversion 3.0
++               *  @playerversion Flash 10.2
++               *  @playerversion AIR 2.6
++               *  @productversion FlexJS 0.8
++               */
++              public function get dataGroup():IItemRendererParent
++              {
++                      return super.contentView as IItemRendererParent;
++              }
++                              
++              /**
++               * @private
++               */
++              override public function get resizableView():IUIBase
++              {
++                      return _strand as IUIBase;
++              }
 +              
 +              /**
 +               * @private
 +               */
 +              protected function itemsCreatedHandler(event:Event):void
 +              {
 +                      performLayout(event);
 +              }
 +              
 +              /**
 +               * @private
 +               */
 +              protected function dataProviderChangeHandler(event:Event):void
 +              {
 +                      performLayout(event);
 +              }
 +                      
 +        /**
 +         *  respond to a change in size or request to re-layout everything
 +         *  
 +         *  @langversion 3.0
 +         *  @playerversion Flash 10.2
 +         *  @playerversion AIR 2.6
 +         *  @productversion FlexJS 0.0
 +         */
 +              override protected function resizeHandler(event:Event):void
 +              {
++                      // might need to do something here, not sure yet.
 +                      super.resizeHandler(event);
 +              }
 +      }
 +}

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/9fd9b78b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/DataGridPercentageView.as
----------------------------------------------------------------------
diff --cc 
frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/DataGridPercentageView.as
index 0000000,0000000..510e18d
new file mode 100644
--- /dev/null
+++ 
b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/DataGridPercentageView.as
@@@ -1,0 -1,0 +1,293 @@@
++////////////////////////////////////////////////////////////////////////////////
++//
++//  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 org.apache.flex.html.beads
++{
++      import org.apache.flex.core.IBeadModel;
++      import org.apache.flex.core.IBeadView;
++      import org.apache.flex.core.IDataGridModel;
++      import org.apache.flex.core.IDataGridPresentationModel;
++      import org.apache.flex.core.ISelectionModel;
++      import org.apache.flex.core.IStrand;
++      import org.apache.flex.core.IUIBase;
++      import org.apache.flex.core.ValuesManager;
++      import org.apache.flex.events.Event;
++      import org.apache.flex.events.IEventDispatcher;
++      import org.apache.flex.html.DataGrid;
++      import org.apache.flex.html.DataGridButtonBar;
++      import org.apache.flex.html.Container;
++      import org.apache.flex.html.beads.layouts.ButtonBarLayout;
++      import org.apache.flex.html.beads.models.ButtonBarModel;
++      import org.apache.flex.html.supportClasses.DataGridColumn;
++      import org.apache.flex.html.supportClasses.DataGridColumnList;
++      import org.apache.flex.html.supportClasses.Viewport;
++      
++      COMPILE::SWF {
++              import org.apache.flex.core.SimpleCSSStyles;
++      }
++
++      /**
++       *  The DataGridPercentageView class is the visual bead for the 
org.apache.flex.html.DataGrid.
++       *  This class constructs the items that make the DataGrid: Lists for 
each column and a
++       *  org.apache.flex.html.ButtonBar for the column headers. This class 
interprets the
++       *  columnWidth value of each column to be a percentage rather than a 
pixel value.
++       *
++       *  @viewbead
++       *  @langversion 3.0
++       *  @playerversion Flash 10.2
++       *  @playerversion AIR 2.6
++       *  @productversion FlexJS 0.0
++       */
++      public class DataGridPercentageView extends GroupView implements 
IBeadView
++      {
++              /**
++               *  constructor.
++               *
++               *  @langversion 3.0
++               *  @playerversion Flash 10.2
++               *  @playerversion AIR 2.6
++               *  @productversion FlexJS 0.0
++               */
++              public function DataGridPercentageView()
++              {
++                      super();
++              }
++
++              private var _strand:IStrand;
++              private var _header:DataGridButtonBar;
++              private var _listArea:Container;
++              
++              private var _lists:Array;
++              
++              /**
++               * An array of List objects the comprise the columns of the 
DataGrid.
++               */
++              public function get columnLists():Array
++              {
++                      return _lists;
++              }
++              
++              /**
++               * The area used to hold the columns
++               *
++               */
++              public function get listArea():Container
++              {
++                      return _listArea;
++              }
++              
++              /**
++               * Returns the component used as the header for the DataGrid.
++               */
++              public function get header():IUIBase
++              {
++                      return _header;
++              }
++
++              /**
++               *  @copy org.apache.flex.core.IBead#strand
++               *
++               *  @langversion 3.0
++               *  @playerversion Flash 10.2
++               *  @playerversion AIR 2.6
++               *  @productversion FlexJS 0.0
++               */
++              override public function set strand(value:IStrand):void
++              {
++                      super.strand = value;
++                      _strand = value;
++
++                      var host:DataGrid = value as DataGrid;
++
++                      _header = new DataGridButtonBar();
++                      _header.height = 30;
++                      _header.percentWidth = 100;
++
++                      _listArea = new Container();
++                      _listArea.percentWidth = 100;
++                      _listArea.className = "DataGridListArea";
++                      
++                      COMPILE::SWF {
++                              _header.style = new SimpleCSSStyles();
++                              _header.style.flexGrow = 0;
++                              
++                              _listArea.style = new SimpleCSSStyles();
++                              _listArea.style.flexGrow = 1;
++                      }
++                      COMPILE::JS {
++                              _header.element.style["flex-grow"] = "0";
++                              _header.element.style["min-height"] = "30px";
++                              _listArea.element.style["flex-grow"] = "1";
++                      }
++                      
++                      
IEventDispatcher(_strand).addEventListener("initComplete", finishSetup);
++              }
++
++              /**
++               * @private
++               */
++              private function finishSetup(event:Event):void
++              {
++                      var host:DataGrid = _strand as DataGrid;
++                      
++                      if (_lists == null || _lists.length == 0) {
++                              createLists();
++                      }
++
++                      // see if there is a presentation model already in 
place. if not, add one.
++                      var presentationModel:IDataGridPresentationModel = 
host.presentationModel;
++                      var sharedModel:IDataGridModel = host.model as 
IDataGridModel;
++                      
IEventDispatcher(sharedModel).addEventListener("dataProviderChanged",handleDataProviderChanged);
++                      
IEventDispatcher(sharedModel).addEventListener("selectedIndexChanged", 
handleSelectedIndexChanged);
++
++                      var columnLabels:Array = new Array();
++                      var buttonWidths:Array = new Array();
++
++                      for(var i:int=0; i < sharedModel.columns.length; i++) {
++                              var dgc:DataGridColumn = sharedModel.columns[i] 
as DataGridColumn;
++                              columnLabels.push(dgc.label);
++                              var colWidth:Number = dgc.columnWidth;
++                              buttonWidths.push(colWidth);
++                              
++                              var list:DataGridColumnList = _lists[i] as 
DataGridColumnList;
++                              if (!isNaN(colWidth)) {
++                                      list.percentWidth = Number(colWidth);
++                              } else {
++                                      COMPILE::SWF {
++                                              list.style = new 
SimpleCSSStyles();
++                                              list.style.flexGrow = 1;
++                                      }
++                                              COMPILE::JS {
++                                                      
list.element.style["flex-grow"] = "1";
++                                              }
++                              }
++                      }
++
++                      var bblayout:ButtonBarLayout = new ButtonBarLayout();
++                      _header.buttonWidths = buttonWidths
++                      _header.widthType = ButtonBarModel.PERCENT_WIDTHS;
++                      _header.dataProvider = columnLabels;
++                      _header.addBead(bblayout);
++                      _header.addBead(new Viewport());
++                      host.addElement(_header);
++
++                      host.addElement(_listArea);
++
++                      handleDataProviderChanged(event);
++              }
++
++              /**
++               * @private
++               */
++              private function handleSizeChanges(event:Event):void
++              {       
++                      _header.dispatchEvent(new Event("layoutChanged"));
++                      _listArea.dispatchEvent(new Event("layoutChanged"));
++              }
++
++              /**
++               * @private
++               */
++              private function handleDataProviderChanged(event:Event):void
++              {
++                      var sharedModel:IDataGridModel = 
_strand.getBeadByType(IBeadModel) as IDataGridModel;
++
++                      for (var i:int=0; i < _lists.length; i++)
++                      {
++                              var list:DataGridColumnList = _lists[i] as 
DataGridColumnList;
++                              var listModel:ISelectionModel = 
list.getBeadByType(IBeadModel) as ISelectionModel;
++                              listModel.dataProvider = 
sharedModel.dataProvider;
++                      }
++
++                      host.dispatchEvent(new Event("layoutNeeded"));
++              }
++              
++              /**
++               * @private
++               */
++              private function handleSelectedIndexChanged(event:Event):void
++              {
++                      var sharedModel:IDataGridModel = 
_strand.getBeadByType(IBeadModel) as IDataGridModel;
++                      var newIndex:int = sharedModel.selectedIndex;
++                      
++                      for (var i:int=0; i < _lists.length; i++)
++                      {
++                              var list:DataGridColumnList = _lists[i] as 
DataGridColumnList;
++                              list.selectedIndex = newIndex;
++                      }
++              }
++
++              /**
++               * @private
++               */
++              private function handleColumnListChange(event:Event):void
++              {
++                      var sharedModel:IDataGridModel = 
_strand.getBeadByType(IBeadModel) as IDataGridModel;
++                      var list:DataGridColumnList = event.target as 
DataGridColumnList;
++                      sharedModel.selectedIndex = list.selectedIndex;
++
++                      for(var i:int=0; i < _lists.length; i++) {
++                              if (list != _lists[i]) {
++                                      var otherList:DataGridColumnList = 
_lists[i] as DataGridColumnList;
++                                      otherList.selectedIndex = 
list.selectedIndex;
++                              }
++                      }
++
++                      host.dispatchEvent(new Event('change'));
++              }
++
++              /**
++               * @private
++               */
++              private function createLists():void
++              {
++                      var host:DataGrid = _strand as DataGrid;
++                      
++                      var sharedModel:IDataGridModel = host.model as 
IDataGridModel;
++                      var presentationModel:IDataGridPresentationModel = 
host.presentationModel;
++
++                      _lists = new Array();
++
++                      for (var i:int=0; i < sharedModel.columns.length; i++) {
++                              var dataGridColumn:DataGridColumn = 
sharedModel.columns[i] as DataGridColumn;
++
++                              var list:DataGridColumnList = new 
DataGridColumnList();
++                              list.id = "dataGridColumn"+String(i);
++                              list.addBead(sharedModel);
++                              list.itemRenderer = dataGridColumn.itemRenderer;
++                              list.labelField = dataGridColumn.dataField;
++                              
list.addEventListener('change',handleColumnListChange);
++                              list.addBead(presentationModel);
++                              
++                              if (i == 0) {
++                                      list.className = "first";
++                              } else if (i == sharedModel.columns.length-1) {
++                                      list.className = "last";
++                              } else {
++                                      list.className = "middle";
++                              }
++
++                              _listArea.addElement(list);
++                              _lists.push(list);
++                      }
++
++                      host.dispatchEvent(new Event("layoutNeeded"));
++              }
++      }
++}
++

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/9fd9b78b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/DataGridView.as
----------------------------------------------------------------------
diff --cc 
frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/DataGridView.as
index fe4b14f,8393057..68e5d95
--- 
a/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/DataGridView.as
+++ 
b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/DataGridView.as
@@@ -18,263 -18,249 +18,283 @@@
  
////////////////////////////////////////////////////////////////////////////////
  package org.apache.flex.html.beads
  {
--      import org.apache.flex.core.IBead;
        import org.apache.flex.core.IBeadModel;
--      import org.apache.flex.core.IBeadLayout;
        import org.apache.flex.core.IBeadView;
        import org.apache.flex.core.IDataGridModel;
-     import org.apache.flex.core.IDataGridPresentationModel;
--      import org.apache.flex.core.ISelectableItemRenderer;
++      import org.apache.flex.core.IDataGridPresentationModel;
        import org.apache.flex.core.ISelectionModel;
        import org.apache.flex.core.IStrand;
        import org.apache.flex.core.IUIBase;
--      import org.apache.flex.core.UIBase;
        import org.apache.flex.core.ValuesManager;
        import org.apache.flex.events.Event;
        import org.apache.flex.events.IEventDispatcher;
-     import org.apache.flex.html.DataGrid;
++      import org.apache.flex.html.DataGrid;
        import org.apache.flex.html.DataGridButtonBar;
        import org.apache.flex.html.Container;
        import org.apache.flex.html.beads.layouts.ButtonBarLayout;
--      import org.apache.flex.html.beads.layouts.VerticalLayout;
--      import org.apache.flex.html.beads.layouts.HorizontalLayout;
--      import org.apache.flex.html.beads.layouts.IDataGridLayout;
--      import org.apache.flex.html.beads.models.ArraySelectionModel;
 -      import org.apache.flex.html.beads.models.DataGridPresentationModel;
++      import org.apache.flex.html.beads.models.ButtonBarModel;
        import org.apache.flex.html.supportClasses.DataGridColumn;
        import org.apache.flex.html.supportClasses.DataGridColumnList;
--      import org.apache.flex.html.supportClasses.ScrollingViewport;
        import org.apache.flex.html.supportClasses.Viewport;
--
--      /**
--       *  The DataGridView class is the visual bead for the 
org.apache.flex.html.DataGrid.
--       *  This class constructs the items that make the DataGrid: Lists for 
each column and a
--       *  org.apache.flex.html.ButtonBar for the column headers.
--       *
--       *  @langversion 3.0
--       *  @playerversion Flash 10.2
--       *  @playerversion AIR 2.6
--       *  @productversion FlexJS 0.0
--       */
--      public class DataGridView implements IBeadView
--      {
--              /**
--               *  constructor.
--               *
--               *  @langversion 3.0
--               *  @playerversion Flash 10.2
--               *  @playerversion AIR 2.6
--               *  @productversion FlexJS 0.0
--               */
--              public function DataGridView()
--              {
--              }
--
--              private var _strand:IStrand;
--              private var _header:DataGridButtonBar;
--              private var _listArea:Container;
--              
--              private var _lists:Array;
--              
--              /**
--               * An array of List objects the comprise the columns of the 
DataGrid.
--               */
--              public function get columnLists():Array
--              {
--                      return _lists;
--              }
--              
--              /**
--               * The area used to hold the columns
--               *
--               */
--              public function get listArea():Container
--              {
--                      return _listArea;
--              }
--
--              /**
--               * @private
--               */
--              public function get host():IUIBase
--              {
--                      return _strand as IUIBase;
--              }
++      
++      COMPILE::SWF {
++              import org.apache.flex.core.SimpleCSSStyles;
++      }
                
                /**
--               * Returns the component used as the header for the DataGrid.
--               */
--              public function get header():IUIBase
--              {
--                      return _header;
--              }
--
--              /**
--               *  @copy org.apache.flex.core.IBead#strand
++               *  The DataGridView class is the visual bead for the 
org.apache.flex.html.DataGrid.
++               *  This class constructs the items that make the DataGrid: 
Lists for each column and a
++               *  org.apache.flex.html.ButtonBar for the column headers.
                 *
++               *  @viewbead
                 *  @langversion 3.0
                 *  @playerversion Flash 10.2
                 *  @playerversion AIR 2.6
                 *  @productversion FlexJS 0.0
                 */
--              public function set strand(value:IStrand):void
++              public class DataGridView extends GroupView implements IBeadView
                {
--                      _strand = value;
--
--                      var host:UIBase = value as UIBase;
--
--                      _header = new DataGridButtonBar();
--                      _header.id = "dataGridHeader";
--
--                      var scrollPort:ScrollingViewport = new 
ScrollingViewport();
--
--                      _listArea = new Container();
--                      _listArea.id = "dataGridListArea";
--                      _listArea.className = "DataGridListArea";
--                      _listArea.addBead(scrollPort);
++                      /**
++                       *  constructor.
++                       *
++                       *  @langversion 3.0
++                       *  @playerversion Flash 10.2
++                       *  @playerversion AIR 2.6
++                       *  @productversion FlexJS 0.0
++                       */
++                      public function DataGridView()
++                      {
++                              super();
++                      }
                        
--                      if (_strand.getBeadByType(IBeadLayout) == null) {
--                              var c:Class = 
ValuesManager.valuesImpl.getValue(host, "iBeadLayout");
--                              if (c)
--                              {
--                                      var layout:IBeadLayout = new c() as 
IBeadLayout;
--                                      _strand.addBead(layout);
++                      private var _strand:IStrand;
++                      private var _header:DataGridButtonBar;
++                      private var _listArea:Container;
++                      
++                      private var _lists:Array;
++                      
++                      /**
++                       * An array of List objects the comprise the columns of 
the DataGrid.
++                       */
++                      public function get columnLists():Array
++                      {
++                              return _lists;
++                      }
++                      
++                      /**
++                       * The area used to hold the columns
++                       *
++                       */
++                      public function get listArea():Container
++                      {
++                              return _listArea;
++                      }
++                      
++                      /**
++                       * Returns the component used as the header for the 
DataGrid.
++                       */
++                      public function get header():IUIBase
++                      {
++                              return _header;
++                      }
++                      
++                      /**
++                       *  @copy org.apache.flex.core.IBead#strand
++                       *
++                       *  @langversion 3.0
++                       *  @playerversion Flash 10.2
++                       *  @playerversion AIR 2.6
++                       *  @productversion FlexJS 0.0
++                       */
++                      override public function set strand(value:IStrand):void
++                      {
++                              super.strand = value;
++                              _strand = value;
++                              
++                              var host:DataGrid = value as DataGrid;
++                              
++                              _header = new DataGridButtonBar();
++                              _header.height = 30;
++                              _header.percentWidth = 100;
++                              
++                              _listArea = new Container();
++                              _listArea.percentWidth = 100;
++                              _listArea.className = "DataGridListArea";
++                              
++                              COMPILE::SWF {
++                                      _header.style = new SimpleCSSStyles();
++                                      _header.style.flexGrow = 0;
++                                      
++                                      _listArea.style = new SimpleCSSStyles();
++                                      _listArea.style.flexGrow = 1;
                                }
++                              COMPILE::JS {
++                                      _header.element.style["flex-grow"] = 
"0";
++                                      _header.element.style["min-height"] = 
"30px";
++                                      _listArea.element.style["flex-grow"] = 
"1";
++                              }
++                              
++                              
IEventDispatcher(_strand).addEventListener("initComplete", finishSetup);
                        }
--
--                      finishSetup(null);
--              }
--
--              /**
--               * @private
--               */
--              private function finishSetup(event:Event):void
--              {
-             var host:DataGrid = _strand as DataGrid;
-             
-                       // see if there is a presentation model already in 
place. if not, add one.
-             var presentationModel:IDataGridPresentationModel = 
host.presentationModel;
-             var sharedModel:IDataGridModel = host.model as IDataGridModel;
-                       
IEventDispatcher(sharedModel).addEventListener("dataProviderChanged",handleDataProviderChanged);
-             
IEventDispatcher(sharedModel).addEventListener("selectedIndexChanged", 
handleSelectedIndexChanged);
- 
-                       var columnLabels:Array = new Array();
 -                      var host:UIBase = _strand as UIBase;
--
-                       for(var i:int=0; i < sharedModel.columns.length; i++) {
-                               var dgc:DataGridColumn = sharedModel.columns[i] 
as DataGridColumn;
-                               columnLabels.push(dgc.label);
 -                      // see if there is a presentation model already in 
place. if not, add one.
 -                      var presentationModel:DataGridPresentationModel = 
_strand.getBeadByType(DataGridPresentationModel) as DataGridPresentationModel;
 -                      if (presentationModel == null) {
 -                              presentationModel = new 
DataGridPresentationModel();
 -                              _strand.addBead(presentationModel);
++                      
++                      /**
++                       * @private
++                       */
++                      private function finishSetup(event:Event):void
++                      {
++                              var host:DataGrid = _strand as DataGrid;
++                              
++                              if (_lists == null || _lists.length == 0) {
++                                      createLists();
++                              }
++                              
++                              // see if there is a presentation model already 
in place. if not, add one.
++                              var 
presentationModel:IDataGridPresentationModel = host.presentationModel;
++                              var sharedModel:IDataGridModel = host.model as 
IDataGridModel;
++                              
IEventDispatcher(sharedModel).addEventListener("dataProviderChanged",handleDataProviderChanged);
++                              
IEventDispatcher(sharedModel).addEventListener("selectedIndexChanged", 
handleSelectedIndexChanged);
++                              
++                              var columnLabels:Array = new Array();
++                              var buttonWidths:Array = new Array();
++                              
++                              var marginBorderOffset:int = 0;
++                              COMPILE::SWF {
++                                      marginBorderOffset = 1;
++                              }
++                                      
++                              for(var i:int=0; i < 
sharedModel.columns.length; i++) {
++                                      var dgc:DataGridColumn = 
sharedModel.columns[i] as DataGridColumn;
++                                      columnLabels.push(dgc.label);
++                                      var colWidth:Number = dgc.columnWidth - 
marginBorderOffset;
++                                      buttonWidths.push(colWidth);
++                                      
++                                      var list:DataGridColumnList = _lists[i] 
as DataGridColumnList;
++                                      if (!isNaN(colWidth)) {
++                                              list.width = Number(colWidth - 
marginBorderOffset);
++                                      } else {
++                                              COMPILE::SWF {
++                                                      list.style = new 
SimpleCSSStyles();
++                                                      list.style.flexGrow = 1;
++                                              }
++                                                      COMPILE::JS {
++                                                              
list.element.style["flex-grow"] = "1";
++                                                      }
++                                      }
++                              }
++                                      
++                              var bblayout:ButtonBarLayout = new 
ButtonBarLayout();
++                              _header.buttonWidths = buttonWidths
++                              _header.widthType = ButtonBarModel.PIXEL_WIDTHS;
++                              _header.dataProvider = columnLabels;
++                              _header.addBead(bblayout);
++                              _header.addBead(new Viewport());
++                              host.addElement(_header);
++                              
++                              host.addElement(_listArea);
++                              
++                              handleDataProviderChanged(event);
++                              
++                              host.addEventListener("widthChanged", 
handleSizeChanges);
++                              host.addEventListener("heightChanged", 
handleSizeChanges);
                        }
- 
-                       var bblayout:ButtonBarLayout = new ButtonBarLayout();
-                       var buttonBarModel:ArraySelectionModel = new 
ArraySelectionModel();
-                       buttonBarModel.dataProvider = columnLabels;
- 
-                       _header.addBead(buttonBarModel);
-                       _header.addBead(bblayout);
-                       _header.addBead(new Viewport());
-                       host.addElement(_header);
- 
-                       host.addElement(_listArea);
- 
-                       handleDataProviderChanged(event);
-               }
- 
-               /**
-                * @private
-                */
-               private function handleSizeChanges(event:Event):void
-               {       
-                       var layoutBead:IDataGridLayout = 
_strand.getBeadByType(IBeadLayout) as IDataGridLayout;
-                       layoutBead.header = _header;
-                       layoutBead.columns = _lists;
-                       layoutBead.listArea = _listArea;
-                       layoutBead.layout();
-               }
--
-               /**
-                * @private
-                */
-               private function handleDataProviderChanged(event:Event):void
-               {
--                      var sharedModel:IDataGridModel = 
_strand.getBeadByType(IBeadModel) as IDataGridModel;
 -                      
IEventDispatcher(sharedModel).addEventListener("dataProviderChanged",handleDataProviderChanged);
--
-                       if (_lists == null || _lists.length == 0) {
-                               createLists();
 -                      var columnLabels:Array = new Array();
 -
 -                      for(var i:int=0; i < sharedModel.columns.length; i++) {
 -                              var dgc:DataGridColumn = sharedModel.columns[i] 
as DataGridColumn;
 -                              columnLabels.push(dgc.label);
++                      
++                      /**
++                       * @private
++                       */
++                      private function handleSizeChanges(event:Event):void
++                      {       
++                              _header.dispatchEvent(new 
Event("layoutChanged"));
++                              _listArea.dispatchEvent(new 
Event("layoutChanged"));
                        }
--
-                       for (var i:int=0; i < _lists.length; i++)
 -                      var bblayout:ButtonBarLayout = new ButtonBarLayout();
 -                      var buttonBarModel:ArraySelectionModel = new 
ArraySelectionModel();
 -                      buttonBarModel.dataProvider = columnLabels;
 -
 -                      _header.addBead(buttonBarModel);
 -                      _header.addBead(bblayout);
 -                      _header.addBead(new Viewport());
 -                      host.addElement(_header);
 -
 -                      host.addElement(_listArea);
 -
 -                      handleDataProviderChanged(event);
 -              }
 -
 -              /**
 -               * @private
 -               */
 -              private function handleSizeChanges(event:Event):void
 -              {       
 -                      var layoutBead:IDataGridLayout = 
_strand.getBeadByType(IBeadLayout) as IDataGridLayout;
 -                      layoutBead.header = _header;
 -                      layoutBead.columns = _lists;
 -                      layoutBead.listArea = _listArea;
 -                      layoutBead.layout();
 -              }
 -
 -              /**
 -               * @private
 -               */
 -              private function handleDataProviderChanged(event:Event):void
 -              {
 -                      var sharedModel:IDataGridModel = 
_strand.getBeadByType(IBeadModel) as IDataGridModel;
 -
 -                      if (_lists == null || _lists.length == 0) {
 -                              createLists();
++                      
++                      /**
++                       * @private
++                       */
++                      private function 
handleDataProviderChanged(event:Event):void
 +                      {
-                               var list:DataGridColumnList = _lists[i] as 
DataGridColumnList;
-                               var listModel:ISelectionModel = 
list.getBeadByType(IBeadModel) as ISelectionModel;
-                               listModel.dataProvider = 
sharedModel.dataProvider;
++                              var sharedModel:IDataGridModel = 
_strand.getBeadByType(IBeadModel) as IDataGridModel;
++                              
++                              for (var i:int=0; i < _lists.length; i++)
++                              {
++                                      var list:DataGridColumnList = _lists[i] 
as DataGridColumnList;
++                                      var listModel:ISelectionModel = 
list.getBeadByType(IBeadModel) as ISelectionModel;
++                                      listModel.dataProvider = 
sharedModel.dataProvider;
++                              }
++                              
++                              host.dispatchEvent(new Event("layoutNeeded"));
                        }
- 
-                       host.dispatchEvent(new Event("layoutNeeded"));
-               }
- 
-         /**
-          * @private
-          */
-         private function handleSelectedIndexChanged(event:Event):void
-         {
-             var sharedModel:IDataGridModel = 
_strand.getBeadByType(IBeadModel) as IDataGridModel;
-             var newIndex:int = sharedModel.selectedIndex;
-             
-             for (var i:int=0; i < _lists.length; i++)
-             {
-                 var list:DataGridColumnList = _lists[i] as DataGridColumnList;
-                 list.selectedIndex = newIndex;
-             }
-         }
- 
-               /**
-                * @private
-                */
-               private function handleColumnListChange(event:Event):void
-               {
-                       var sharedModel:IDataGridModel = 
_strand.getBeadByType(IBeadModel) as IDataGridModel;
-                       var list:DataGridColumnList = event.target as 
DataGridColumnList;
-                       sharedModel.selectedIndex = list.selectedIndex;
--
-                       for(var i:int=0; i < _lists.length; i++) {
-                               if (list != _lists[i]) {
-                                       var otherList:DataGridColumnList = 
_lists[i] as DataGridColumnList;
-                                       otherList.selectedIndex = 
list.selectedIndex;
 -                      for (var i:int=0; i < _lists.length; i++)
++                      
++                      /**
++                       * @private
++                       */
++                      private function 
handleSelectedIndexChanged(event:Event):void
+                       {
 -                              var list:DataGridColumnList = _lists[i] as 
DataGridColumnList;
 -                              var listModel:ISelectionModel = 
list.getBeadByType(IBeadModel) as ISelectionModel;
 -                              listModel.dataProvider = 
sharedModel.dataProvider;
++                              var sharedModel:IDataGridModel = 
_strand.getBeadByType(IBeadModel) as IDataGridModel;
++                              var newIndex:int = sharedModel.selectedIndex;
++                              
++                              for (var i:int=0; i < _lists.length; i++)
++                              {
++                                      var list:DataGridColumnList = _lists[i] 
as DataGridColumnList;
++                                      list.selectedIndex = newIndex;
 +                              }
                        }
--
-                       host.dispatchEvent(new Event('change'));
 -                      host.dispatchEvent(new Event("layoutNeeded"));
--              }
--
--              /**
--               * @private
--               */
-               private function createLists():void
 -              private function handleColumnListChange(event:Event):void
--              {
-             var host:DataGrid = _strand as DataGrid;
-             
-             var sharedModel:IDataGridModel = host.model as IDataGridModel;
-             var presentationModel:IDataGridPresentationModel = 
host.presentationModel;
-                       var listWidth:Number = host.width / 
sharedModel.columns.length;
- 
-                       _lists = new Array();
- 
-                       for (var i:int=0; i < sharedModel.columns.length; i++) {
-                               var dataGridColumn:DataGridColumn = 
sharedModel.columns[i] as DataGridColumn;
- 
-                               var list:DataGridColumnList = new 
DataGridColumnList();
-                               list.id = "dataGridColumn"+String(i);
-                               list.addBead(sharedModel);
-                               list.itemRenderer = dataGridColumn.itemRenderer;
-                               list.labelField = dataGridColumn.dataField;
-                               
list.addEventListener('change',handleColumnListChange);
-                               list.addBead(presentationModel);
 -                      var sharedModel:IDataGridModel = 
_strand.getBeadByType(IBeadModel) as IDataGridModel;
 -                      var list:DataGridColumnList = event.target as 
DataGridColumnList;
 -                      sharedModel.selectedIndex = list.selectedIndex;
--
-                               _listArea.addElement(list);
-                               _lists.push(list);
 -                      for(var i:int=0; i < _lists.length; i++) {
 -                              if (list != _lists[i]) {
 -                                      var otherList:DataGridColumnList = 
_lists[i] as DataGridColumnList;
 -                                      otherList.selectedIndex = 
list.selectedIndex;
++                      
++                      /**
++                       * @private
++                       */
++                      private function 
handleColumnListChange(event:Event):void
++                      {
++                              var sharedModel:IDataGridModel = 
_strand.getBeadByType(IBeadModel) as IDataGridModel;
++                              var list:DataGridColumnList = event.target as 
DataGridColumnList;
++                              sharedModel.selectedIndex = list.selectedIndex;
++                              
++                              for(var i:int=0; i < _lists.length; i++) {
++                                      if (list != _lists[i]) {
++                                              var 
otherList:DataGridColumnList = _lists[i] as DataGridColumnList;
++                                              otherList.selectedIndex = 
list.selectedIndex;
++                                      }
+                               }
++                              
++                              host.dispatchEvent(new Event('change'));
+                       }
 -
 -                      host.dispatchEvent(new Event('change'));
 -              }
 -
 -              /**
 -               * @private
 -               */
 -              private function createLists():void
 -              {
 -                      var sharedModel:IDataGridModel = 
_strand.getBeadByType(IBeadModel) as IDataGridModel;
 -                      var presentationModel:DataGridPresentationModel = 
_strand.getBeadByType(DataGridPresentationModel) as DataGridPresentationModel;
 -                      var listWidth:Number = host.width / 
sharedModel.columns.length;
 -
 -                      _lists = new Array();
 -
 -                      for (var i:int=0; i < sharedModel.columns.length; i++) {
 -                              var dataGridColumn:DataGridColumn = 
sharedModel.columns[i] as DataGridColumn;
 -
 -                              var list:DataGridColumnList = new 
DataGridColumnList();
 -                              list.id = "dataGridColumn"+String(i);
 -                              list.addBead(sharedModel);
 -                              list.itemRenderer = dataGridColumn.itemRenderer;
 -                              list.labelField = dataGridColumn.dataField;
 -                              
list.addEventListener('change',handleColumnListChange);
 -                              list.addBead(presentationModel);
 -
 -                              _listArea.addElement(list);
 -                              _lists.push(list);
++                      
++                      /**
++                       * @private
++                       */
++                      private function createLists():void
++                      {
++                              var host:DataGrid = _strand as DataGrid;
++                              
++                              var sharedModel:IDataGridModel = host.model as 
IDataGridModel;
++                              var 
presentationModel:IDataGridPresentationModel = host.presentationModel;
++                              
++                              _lists = new Array();
++                              
++                              for (var i:int=0; i < 
sharedModel.columns.length; i++) {
++                                      var dataGridColumn:DataGridColumn = 
sharedModel.columns[i] as DataGridColumn;
++                                      
++                                      var list:DataGridColumnList = new 
DataGridColumnList();
++                                      list.id = "dataGridColumn"+String(i);
++                                      list.addBead(sharedModel);
++                                      list.itemRenderer = 
dataGridColumn.itemRenderer;
++                                      list.labelField = 
dataGridColumn.dataField;
++                                      
list.addEventListener('change',handleColumnListChange);
++                                      list.addBead(presentationModel);
++                                      
++                                      if (i == 0) {
++                                              list.className = "first";
++                                      } else if (i == 
sharedModel.columns.length-1) {
++                                              list.className = "last";
++                                      } else {
++                                              list.className = "middle";
++                                      }
++                                      
++                                      _listArea.addElement(list);
++                                      _lists.push(list);
++                              }
++                              
++                              host.dispatchEvent(new Event("layoutNeeded"));
                        }
--
--                      host.dispatchEvent(new Event("layoutNeeded"));
                }
--      }
  }
  

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/9fd9b78b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/DataItemRendererFactoryForArrayData.as
----------------------------------------------------------------------
diff --cc 
frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/DataItemRendererFactoryForArrayData.as
index 30024ec,fdfd9b3..bcd837b
--- 
a/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/DataItemRendererFactoryForArrayData.as
+++ 
b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/DataItemRendererFactoryForArrayData.as
@@@ -36,6 -36,6 +36,11 @@@ package org.apache.flex.html.bead
        import org.apache.flex.events.ItemRendererEvent;
        import org.apache.flex.html.List;
        
++      import org.apache.flex.core.IList;
++      import org.apache.flex.core.IChild;
++      import org.apache.flex.core.ILayoutHost;
++      import org.apache.flex.core.IParentIUIBase;
++      
        
[Event(name="itemRendererCreated",type="org.apache.flex.events.ItemRendererEvent")]
        
      /**
@@@ -64,11 -64,11 +69,11 @@@
                {
                        super(target);
                }
--              
-         protected var dataProviderModel:IDataProviderModel;
 -              private var selectionModel:ISelectionModel;
--              
-         protected var labelField:String;
 -              private var labelField:String;
--              
++
++              protected var dataProviderModel:IDataProviderModel;
++
++              protected var labelField:String;
++
                private var _strand:IStrand;
                
          /**
@@@ -82,21 -82,21 +87,22 @@@
                public function set strand(value:IStrand):void
                {
                        _strand = value;
--                      
IEventDispatcher(value).addEventListener("beadsAdded",finishSetup);
                        
IEventDispatcher(value).addEventListener("initComplete",finishSetup);
                }
                
++              /**
++               * @private
++               */
                private function finishSetup(event:Event):void
--              {
-             dataProviderModel = _strand.getBeadByType(IDataProviderModel) as 
IDataProviderModel;
 -                      selectionModel = _strand.getBeadByType(ISelectionModel) 
as ISelectionModel;
--                      var listView:IListView = 
_strand.getBeadByType(IListView) as IListView;
--                      dataGroup = listView.dataGroup;
-             dataProviderModel.addEventListener("dataProviderChanged", 
dataProviderChangeHandler);
 -                      selectionModel.addEventListener("dataProviderChanged", 
dataProviderChangeHandler);
++              {                       
++                      dataProviderModel = 
_strand.getBeadByType(IDataProviderModel) as IDataProviderModel;
++                      
dataProviderModel.addEventListener("dataProviderChanged", 
dataProviderChangeHandler);
++                      labelField = dataProviderModel.labelField;
                        
-             labelField = dataProviderModel.labelField;
 -                      labelField = (listView.host as List).labelField;
--                      
--                      if (!itemRendererFactory)
--                      {
++                      // if the host component inherits from 
DataContainerBase, the itemRendererClassFactory will 
++                      // already have been loaded by 
DataContainerBase.addedToParent function.
++                      _itemRendererFactory = 
_strand.getBeadByType(IItemRendererClassFactory) as IItemRendererClassFactory;
++                      if (itemRendererFactory == null) {
                                _itemRendererFactory = new 
(ValuesManager.valuesImpl.getValue(_strand, "iItemRendererClassFactory")) as 
IItemRendererClassFactory;
                                _strand.addBead(_itemRendererFactory);
                        }
@@@ -136,25 -136,24 +142,25 @@@
           *  @playerversion Flash 10.2
           *  @playerversion AIR 2.6
           *  @productversion FlexJS 0.0
--         */
--              protected var dataGroup:IItemRendererParent;
--              
-         protected function dataProviderChangeHandler(event:Event):void
 -              private function dataProviderChangeHandler(event:Event):void
++         */           
++              protected function dataProviderChangeHandler(event:Event):void
                {
-             var dp:Array = dataProviderModel.dataProvider as Array;
 -                      var dp:Array = selectionModel.dataProvider as Array;
++                      var dp:Array = dataProviderModel.dataProvider as Array;
                        if (!dp)
                                return;
                        
--                      dataGroup.removeAllElements();
++                      var list:IList = _strand as IList;
++                      var dataGroup:IItemRendererParent = list.dataGroup;
++                      
++                      dataGroup.removeAllItemRenderers();
                        
--                      var listView:IListView = 
_strand.getBeadByType(IListView) as IListView;
                        var presentationModel:IListPresentationModel = 
_strand.getBeadByType(IListPresentationModel) as IListPresentationModel;
                        
                        var n:int = dp.length; 
                        for (var i:int = 0; i < n; i++)
                        {                               
                                var ir:ISelectableItemRenderer = 
itemRendererFactory.createItemRenderer(dataGroup) as ISelectableItemRenderer;
-                 dataGroup.addElement(ir);
++                              dataGroup.addItemRenderer(ir);
                                ir.index = i;
                                ir.labelField = labelField;
                                if (presentationModel) {
@@@ -162,8 -161,8 +168,8 @@@
                                        style.marginBottom = 
presentationModel.separatorThickness;
                                        UIBase(ir).style = style;
                                        UIBase(ir).height = 
presentationModel.rowHeight;
-                     UIBase(ir).percentWidth = 100;
-                 }
++                                      UIBase(ir).percentWidth = 100;
+                               }
 -                              dataGroup.addElement(ir);
                                ir.data = dp[i];
                                
                                var newEvent:ItemRendererEvent = new 
ItemRendererEvent(ItemRendererEvent.CREATED);

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/9fd9b78b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/DataItemRendererFactoryForArrayList.as
----------------------------------------------------------------------
diff --cc 
frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/DataItemRendererFactoryForArrayList.as
index 3d8f1fc,42b159c..c35f07f
--- 
a/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/DataItemRendererFactoryForArrayList.as
+++ 
b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/DataItemRendererFactoryForArrayList.as
@@@ -35,7 -35,7 +35,8 @@@ package org.apache.flex.html.bead
        import org.apache.flex.events.IEventDispatcher;
        import org.apache.flex.events.EventDispatcher;
        import org.apache.flex.events.ItemRendererEvent;
--      import org.apache.flex.html.List;
++      //import org.apache.flex.html.List;
++      import org.apache.flex.core.IList;
        
        
[Event(name="itemRendererCreated",type="org.apache.flex.events.ItemRendererEvent")]
        
@@@ -66,7 -66,7 +67,7 @@@
                        super(target);
                }
                
-         protected var dataProviderModel:IDataProviderModel;
 -              protected var selectionModel:ISelectionModel;
++              protected var dataProviderModel:IDataProviderModel;
                
                protected var labelField:String;
                
@@@ -83,26 -83,26 +84,21 @@@
                public function set strand(value:IStrand):void
                {
                        _strand = value;
--                      
IEventDispatcher(_strand).addEventListener("beadsAdded", finishSetup);
                        
IEventDispatcher(_strand).addEventListener("initComplete", finishSetup);
                }
                
                private function finishSetup(event:Event):void
--              {
-             dataProviderModel = _strand.getBeadByType(IDataProviderModel) as 
IDataProviderModel;
 -                      selectionModel = _strand.getBeadByType(ISelectionModel) 
as ISelectionModel;
--                      var listView:IListView = 
_strand.getBeadByType(IListView) as IListView;
--                      dataGroup = listView.dataGroup;
-             dataProviderModel.addEventListener("dataProviderChanged", 
dataProviderChangeHandler);
 -                      selectionModel.addEventListener("dataProviderChanged", 
dataProviderChangeHandler);
--                      
 -                      labelField = (listView.host as List).labelField;
++              {                       
++                      dataProviderModel = 
_strand.getBeadByType(IDataProviderModel) as IDataProviderModel;
++                      
dataProviderModel.addEventListener("dataProviderChanged", 
dataProviderChangeHandler);
 +                      labelField = dataProviderModel.labelField;
                        
--                      if (!itemRendererFactory)
--                      {
--                              _itemRendererFactory = 
_strand.getBeadByType(IItemRendererClassFactory) as IItemRendererClassFactory;
--                              if (_itemRendererFactory == null) {
--                                      _itemRendererFactory = new 
(ValuesManager.valuesImpl.getValue(_strand, "iItemRendererClassFactory")) as 
IItemRendererClassFactory;
--                                      _strand.addBead(_itemRendererFactory);
--                              }
++                      // if the host component inherits from 
DataContainerBase, the itemRendererClassFactory will 
++                      // already have been loaded by 
DataContainerBase.addedToParent function.
++                      _itemRendererFactory = 
_strand.getBeadByType(IItemRendererClassFactory) as IItemRendererClassFactory;
++                      if (itemRendererFactory == null) {
++                              _itemRendererFactory = new 
(ValuesManager.valuesImpl.getValue(_strand, "iItemRendererClassFactory")) as 
IItemRendererClassFactory;
++                              _strand.addBead(_itemRendererFactory);
                        }
                        
                        dataProviderChangeHandler(null);
@@@ -132,17 -132,17 +128,6 @@@
                        _itemRendererFactory = value;
                }
                
--        /**
--         *  The org.apache.flex.core.IItemRendererParent that will
--         *  parent the item renderers.
--         *  
--         *  @langversion 3.0
--         *  @playerversion Flash 10.2
--         *  @playerversion AIR 2.6
--         *  @productversion FlexJS 0.0
--         */
--              protected var dataGroup:IItemRendererParent;
--              
                /**
                 * @private
                 */
@@@ -162,25 -162,25 +147,25 @@@
                        if (!dp)
                                return;
                        
--                      dataGroup.removeAllElements();
++                      var list:IList = _strand as IList;
++                      var dataGroup:IItemRendererParent = list.dataGroup;
++                      
++                      dataGroup.removeAllItemRenderers();
                        
--                      var listView:IListView = 
_strand.getBeadByType(IListView) as IListView;
                        var presentationModel:IListPresentationModel = 
_strand.getBeadByType(IListPresentationModel) as IListPresentationModel;
                        
                        var n:int = dp.length; 
                        for (var i:int = 0; i < n; i++)
                        {                               
                                var ir:ISelectableItemRenderer = 
itemRendererFactory.createItemRenderer(dataGroup) as ISelectableItemRenderer;
++                              dataGroup.addItemRenderer(ir);
                                if (presentationModel) {
--                                      UIBase(ir).height = 
presentationModel.rowHeight;
--                                      
--                                      // ensure that the IR spans the width 
of its column
                                        var style:SimpleCSSStyles = new 
SimpleCSSStyles();
--                                      style.right = 0;
--                                      style.left = 0;
++                                      style.marginBottom = 
presentationModel.separatorThickness;
                                        UIBase(ir).style = style;
++                                      UIBase(ir).height = 
presentationModel.rowHeight;
++                                      UIBase(ir).percentWidth = 100;
                                }
--                              dataGroup.addElement(ir);
                                setData(ir, dp.getItemAt(i), i);
                                
                                var newEvent:ItemRendererEvent = new 
ItemRendererEvent(ItemRendererEvent.CREATED);

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/9fd9b78b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/DataItemRendererFactoryForColumnData.as
----------------------------------------------------------------------
diff --cc 
frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/DataItemRendererFactoryForColumnData.as
index 4cd66ef,d399cfb..554a9c9
--- 
a/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/DataItemRendererFactoryForColumnData.as
+++ 
b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/DataItemRendererFactoryForColumnData.as
@@@ -24,6 -24,6 +24,7 @@@ package org.apache.flex.html.bead
        import org.apache.flex.core.IDataProviderItemRendererMapper;
        import org.apache.flex.core.IItemRendererClassFactory;
        import org.apache.flex.core.IItemRendererParent;
++      import org.apache.flex.core.IList;
        import org.apache.flex.core.IStrand;
        import org.apache.flex.core.ValuesManager;
        import org.apache.flex.events.Event;
@@@ -69,13 -69,13 +70,21 @@@
                public function set strand(value:IStrand):void
                {
                        _strand = value;
--                      selectionModel = value.getBeadByType(IDataGridModel) as 
IDataGridModel;
--                      var listView:IListView = value.getBeadByType(IListView) 
as IListView;
--                      dataGroup = listView.dataGroup;
++                      
IEventDispatcher(value).addEventListener("initComplete",finishSetup);
++              }
++              
++              /**
++               * @private
++               */
++              private function finishSetup(event:Event):void
++              {                       
++                      selectionModel = _strand.getBeadByType(IDataGridModel) 
as IDataGridModel;
                        selectionModel.addEventListener("dataProviderChanged", 
dataProviderChangeHandler);
                        
--                      if (!itemRendererFactory)
--                      {
++                      // if the host component inherits from 
DataContainerBase, the itemRendererClassFactory will 
++                      // already have been loaded by 
DataContainerBase.addedToParent function.
++                      _itemRendererFactory = 
_strand.getBeadByType(IItemRendererClassFactory) as IItemRendererClassFactory;
++                      if (itemRendererFactory == null) {
                                _itemRendererFactory = new 
(ValuesManager.valuesImpl.getValue(_strand, "iItemRendererClassFactory")) as 
IItemRendererClassFactory;
                                _strand.addBead(_itemRendererFactory);
                        }
@@@ -110,7 -110,7 +119,7 @@@
                 *  @playerversion AIR 2.6
                 *  @productversion FlexJS 0.0
                 */
--              protected var dataGroup:IItemRendererParent;
++//            protected var dataGroup:IItemRendererParent;
                
                /**
                 * @private
@@@ -121,8 -121,8 +130,11 @@@
                        if (!dp)
                                return;
                        
--                      dataGroup.removeAllElements();
++                      var list:IList = _strand as IList;
++                      var dataGroup:IItemRendererParent = list.dataGroup;
                        
++                      dataGroup.removeAllItemRenderers();
++                                              
                        var view:DataGridColumnView = 
_strand.getBeadByType(IBeadView) as DataGridColumnView;
                        if (view == null) return;
                                                
@@@ -130,9 -130,9 +142,9 @@@
                        for (var i:int = 0; i < n; i++)
                        {
                                var tf:DataItemRenderer = 
itemRendererFactory.createItemRenderer(dataGroup) as DataItemRenderer;
-                 dataGroup.addElement(tf);
++                              dataGroup.addItemRenderer(tf);
                                tf.index = i;
                                tf.labelField = view.column.dataField;
 -                              dataGroup.addElement(tf);
                                tf.data = dp[i];
                        }
                        

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/9fd9b78b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/DataProviderChangeNotifier.as
----------------------------------------------------------------------
diff --cc 
frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/DataProviderChangeNotifier.as
index a24810b,a24810b..e8c28bd
--- 
a/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/DataProviderChangeNotifier.as
+++ 
b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/DataProviderChangeNotifier.as
@@@ -18,17 -18,17 +18,13 @@@
  
////////////////////////////////////////////////////////////////////////////////
  package org.apache.flex.html.beads
  {
--      import org.apache.flex.core.IBead;
--      import org.apache.flex.core.IBeadModel;
--      import org.apache.flex.core.IDocument;
        import org.apache.flex.core.ISelectionModel;
--      import org.apache.flex.core.IStrand;
--      import org.apache.flex.core.UIBase;
        import org.apache.flex.events.IEventDispatcher;
        import org.apache.flex.events.Event;
        import org.apache.flex.collections.ArrayList;
--      
--      /**
++    import org.apache.flex.html.supportClasses.DataProviderNotifierBase;
++
++    /**
         *  The DataProviderChangeNotifier notifies listeners when a selection 
model's
         *  ArrayList dataProvider has changed.
         *  
@@@ -37,7 -37,7 +33,7 @@@
         *  @playerversion AIR 2.6
         *  @productversion FlexJS 0.0
         */
--      public class DataProviderChangeNotifier implements IBead, IDocument
++      public class DataProviderChangeNotifier extends DataProviderNotifierBase
        {
                /**
                 *  constructor.
@@@ -51,144 -51,144 +47,31 @@@
                {
                }
                
--              protected var _dataProvider:ArrayList;
--              
--              private var _strand:IStrand;
--              
--              /**
--               *  @copy org.apache.flex.core.IBead#strand
--               *  
--               *  @langversion 3.0
--               *  @playerversion Flash 10.2
--               *  @playerversion AIR 2.6
--               *  @productversion FlexJS 0.0
--               */
--              public function set strand(value:IStrand):void
++              override protected function 
destinationChangedHandler(event:Event):void
                {
--                      _strand = value;
--                      
--                      if (_strand[destinationPropertyName] == null) {
--                              var model:IBeadModel = UIBase(_strand).model as 
IBeadModel;
--                              
IEventDispatcher(model).addEventListener(changeEventName, 
destinationChangedHandler);
--                      }
--                      else {
--                              destinationChangedHandler(null);
--                      }
--              }
--              
--              private function destinationChangedHandler(event:Event):void
--              {
--                      if (_dataProvider == null) {
++                      if (dataProvider == null)
++                      {
                                var object:Object = document[sourceID];
--                              _dataProvider = object[propertyName] as 
ArrayList;
++                              dataProvider = object[propertyName] as 
ArrayList;
                        }
--                      else {
--                              _dataProvider.removeEventListener("itemAdded", 
handleItemAdded);
--                              
_dataProvider.removeEventListener("itemRemoved", handleItemRemoved);
--                              
_dataProvider.removeEventListener("itemUpdated", handleItemUpdated);
++                      else
++                      {
++                dataProvider.removeEventListener("itemAdded", 
handleDataProviderChanges);
++                dataProvider.removeEventListener("itemRemoved", 
handleDataProviderChanges);
++                dataProvider.removeEventListener("itemUpdated", 
handleDataProviderChanges);
++                dataProvider.removeEventListener("collectionChanged", 
handleDataProviderChanges);
                        }
--                      
--                      _dataProvider.addEventListener("itemAdded", 
handleItemAdded);
--                      _dataProvider.addEventListener("itemRemoved", 
handleItemRemoved);
--                      _dataProvider.addEventListener("itemUpdated", 
handleItemUpdated);
--              }
--              
--              protected var document:Object;
--              
--              /**
--               * @private
--               */
--              public function setDocument(document:Object, id:String = 
null):void
--              {
--                      this.document = document;
--              }
--              
--              private var _destinationPropertyName:String;
--              
--              public function get destinationPropertyName():String
--              {
--                      return _destinationPropertyName;
--              }
--              public function set destinationPropertyName(value:String):void
--              {
--                      _destinationPropertyName = value;
--              }
--              
--              private var _changeEventName:String;
--              
--              public function get changeEventName():String
--              {
--                      return _changeEventName;
--              }
--              public function set changeEventName(value:String):void
--              {
--                      _changeEventName = value;
--              }
--              
--              private var _sourceID:String;
--              
--              /**
--               *  The ID of the object holding the ArrayList, usually a model.
--               *  
--               *  @langversion 3.0
--               *  @playerversion Flash 10.2
--               *  @playerversion AIR 2.6
--               *  @productversion FlexJS 0.0
--               */
--              public function get sourceID():String
--              {
--                      return _sourceID;
--              }
--              public function set sourceID(value:String):void
--              {
--                      _sourceID = value;
--              }
--              
--              private var _propertyName:String;
--              
--              /**
--               *  The property in the sourceID that is the ArrayList.
--               *  
--               *  @langversion 3.0
--               *  @playerversion Flash 10.2
--               *  @playerversion AIR 2.6
--               *  @productversion FlexJS 0.0
--               */
--              public function get propertyName():String
--              {
--                      return _propertyName;
--              }
--              
--              public function set propertyName(value:String):void
--              {
--                      _propertyName = value;
--              }
--              
--              /**
--               * @private
--               */
--              private function handleItemAdded(event:Event):void
--              {
--                      var selectionModel:ISelectionModel = 
_strand.getBeadByType(ISelectionModel) as ISelectionModel;
--                      selectionModel.dispatchEvent(new 
Event("dataProviderChanged"));
++
++            dataProvider.addEventListener("itemAdded", 
handleDataProviderChanges);
++            dataProvider.addEventListener("itemRemoved", 
handleDataProviderChanges);
++            dataProvider.addEventListener("itemUpdated", 
handleDataProviderChanges);
++            dataProvider.addEventListener("collectionChanged", 
handleDataProviderChanges);
                }
--              
--              /**
--               * @private
--               */
--              private function handleItemRemoved(event:Event):void
--              {
--                      var selectionModel:ISelectionModel = 
_strand.getBeadByType(ISelectionModel) as ISelectionModel;
--                      selectionModel.dispatchEvent(new 
Event("dataProviderChanged"));
--              }
--              
--              /**
--               * @private
--               */
--              private function handleItemUpdated(event:Event):void
++
++              private function handleDataProviderChanges(event:Event):void
                {
--                      var selectionModel:ISelectionModel = 
_strand.getBeadByType(ISelectionModel) as ISelectionModel;
--                      selectionModel.dispatchEvent(new 
Event("dataProviderChanged"));
++            var selectionModel:ISelectionModel = 
_strand.getBeadByType(ISelectionModel) as ISelectionModel;
++            selectionModel.dispatchEvent(new Event("dataProviderChanged"));
                }
        }
  }

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/9fd9b78b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/DataProviderCollectionChangeNotifier.as
----------------------------------------------------------------------
diff --cc 
frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/DataProviderCollectionChangeNotifier.as
index 0000000,0000000..2d58795
new file mode 100644
--- /dev/null
+++ 
b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/DataProviderCollectionChangeNotifier.as
@@@ -1,0 -1,0 +1,71 @@@
++////////////////////////////////////////////////////////////////////////////////
++//
++//  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 org.apache.flex.html.beads
++{
++      import org.apache.flex.core.ISelectionModel;
++      import org.apache.flex.events.IEventDispatcher;
++      import org.apache.flex.events.Event;
++      import org.apache.flex.collections.ArrayList;
++    import org.apache.flex.html.supportClasses.DataProviderNotifierBase;
++
++    /**
++       *  The DataProviderCollectionChangeNotifier notifies listeners when a 
selection model's
++       *  ArrayList dataProvider disptached collectionChanged event.
++       *  
++       *  @langversion 3.0
++       *  @playerversion Flash 10.2
++       *  @playerversion AIR 2.6
++       *  @productversion FlexJS 0.0
++       */
++      public class DataProviderCollectionChangeNotifier extends 
DataProviderNotifierBase
++      {
++              /**
++               *  constructor.
++               *  
++               *  @langversion 3.0
++               *  @playerversion Flash 10.2
++               *  @playerversion AIR 2.6
++               *  @productversion FlexJS 0.0
++               */
++              public function DataProviderCollectionChangeNotifier()
++              {
++              }
++              
++              override protected function 
destinationChangedHandler(event:Event):void
++              {
++                      if (dataProvider == null)
++                      {
++                              var object:Object = document[sourceID];
++                              dataProvider = object[propertyName] as 
ArrayList;
++                      }
++                      else
++                      {
++                dataProvider.removeEventListener("collectionChanged", 
handleCollectionChanged);
++                      }
++
++            dataProvider.addEventListener("collectionChanged", 
handleCollectionChanged);
++              }
++
++              private function handleCollectionChanged(event:Event):void
++              {
++            var selectionModel:ISelectionModel = 
_strand.getBeadByType(ISelectionModel) as ISelectionModel;
++            selectionModel.dispatchEvent(new Event("dataProviderChanged"));
++              }
++      }
++}

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/9fd9b78b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/DataProviderItemsChangeNotifier.as
----------------------------------------------------------------------
diff --cc 
frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/DataProviderItemsChangeNotifier.as
index 0000000,0000000..eee1990
new file mode 100644
--- /dev/null
+++ 
b/frameworks/projects/Basic/src/main/flex/org/apache/flex/html/beads/DataProviderItemsChangeNotifier.as
@@@ -1,0 -1,0 +1,95 @@@
++////////////////////////////////////////////////////////////////////////////////
++//
++//  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 org.apache.flex.html.beads
++{
++      import org.apache.flex.core.ISelectionModel;
++      import org.apache.flex.events.IEventDispatcher;
++      import org.apache.flex.events.Event;
++      import org.apache.flex.collections.ArrayList;
++      import org.apache.flex.events.CollectionEvent;
++    import org.apache.flex.html.supportClasses.DataProviderNotifierBase;
++
++    /**
++       *  The DataProviderItemsChangeNotifier notifies listeners when to 
selection model's
++       *  ArrayList dataProvider item has been added, removed or updated.
++       *  
++       *  @langversion 3.0
++       *  @playerversion Flash 10.2
++       *  @playerversion AIR 2.6
++       *  @productversion FlexJS 0.0
++       */
++      public class DataProviderItemsChangeNotifier extends 
DataProviderNotifierBase
++      {
++              /**
++               *  constructor.
++               *  
++               *  @langversion 3.0
++               *  @playerversion Flash 10.2
++               *  @playerversion AIR 2.6
++               *  @productversion FlexJS 0.0
++               */
++              public function DataProviderItemsChangeNotifier()
++              {
++              }
++
++              private function destinationChangedHandler(event:Event):void
++              {
++                      if (dataProvider == null) {
++                              var object:Object = document[sourceID];
++                              dataProvider = object[propertyName] as 
ArrayList;
++                      }
++                      else {
++                              
dataProvider.removeEventListener(CollectionEvent.ITEM_ADDED, handleItemAdded);
++                              
dataProvider.removeEventListener(CollectionEvent.ITEM_REMOVED, 
handleItemRemoved);
++                              
dataProvider.removeEventListener(CollectionEvent.ITEM_UPDATED, 
handleItemUpdated);
++                      }
++                      
++                      
dataProvider.addEventListener(CollectionEvent.ITEM_ADDED, handleItemAdded);
++                      
dataProvider.addEventListener(CollectionEvent.ITEM_REMOVED, handleItemRemoved);
++            dataProvider.addEventListener(CollectionEvent.ITEM_UPDATED, 
handleItemUpdated);
++              }
++
++              /**
++               * @private
++               */
++              private function handleItemAdded(event:CollectionEvent):void
++              {
++                      var selectionModel:ISelectionModel = 
_strand.getBeadByType(ISelectionModel) as ISelectionModel;
++                      selectionModel.dispatchEvent(event.cloneEvent() as 
CollectionEvent);
++              }
++              
++              /**
++               * @private
++               */
++              private function handleItemRemoved(event:CollectionEvent):void
++              {
++                      var selectionModel:ISelectionModel = 
_strand.getBeadByType(ISelectionModel) as ISelectionModel;
++                      selectionModel.dispatchEvent(event.cloneEvent() as 
CollectionEvent);
++              }
++
++        /**
++         * @private
++         */
++        private function handleItemUpdated(event:CollectionEvent):void
++        {
++            var selectionModel:ISelectionModel = 
_strand.getBeadByType(ISelectionModel) as ISelectionModel;
++            selectionModel.dispatchEvent(event.cloneEvent() as 
CollectionEvent);
++        }
++      }
++}

Reply via email to