[Effen] Convert action_bar.dart to using a FlexContainer.

sky/framework/layout.dart

 library layout;
 
 import 'node.dart';
 import 'dart:sky' as sky;
 import 'dart:collection';
 
 // UTILS
 
 // Bridge to legacy CSS-like style specification
 // Eventually we'll replace this with something else
@@ skipping 236 matching lines @@
   sky.Element _skyElement;
 
   RenderCSS(this.debug) {
     _skyElement = createSkyElement();
     registerEventTarget(_skyElement, this);
   }
 
   sky.Element createSkyElement();
 
   void updateStyles(List<Style> styles) {
-    _skyElement.setAttribute('class', styles.map((s) => s._className).join(' '));
+    _skyElement.setAttribute('class', stylesToClasses(styles));
+  }
+
+  String stylesToClasses(List<Style> styles) {
+    return styles.map((s) => s._className).join(' ');
   }
 
   void updateInlineStyle(String newStyle) {
     _skyElement.setAttribute('style', newStyle);
   }
 
   double get width {
     sky.ClientRect rect = _skyElement.getBoundingClientRect();
     return rect.width;
   }
@@ skipping 41 matching lines @@
       _skyElement.appendChild(child._skyElement);
     }    
   }
   void remove(RenderCSS child) {
     child._skyElement.remove();
     super.remove(child);
   }
 
 }
 
+class FlexBoxParentData extends CSSParentData { }
+
+enum FlexDirection { Row }

[eseidel, 2015/05/11 22:04:24]

Did you wish to support both?

[Hixie, 2015/05/11 22:06:07]

Eventually. I'll add column when I run into something that needs it.

+
+class RenderCSSFlex extends RenderCSSContainer {
+
+  RenderCSSFlex(debug, FlexDirection direction) : _direction = direction, super(debug);
+
+  FlexDirection _direction;
+  FlexDirection get direction => _direction;
+  void set direction (FlexDirection value) {
+    _direction = value;
+    markNeedsLayout();
+  }
+
+  void setupPos(RenderNode child) {
+    if (child.parentData is! FlexBoxParentData)
+      child.parentData = new FlexBoxParentData();
+  }
+
+  static final Style _displayFlex = new Style('display:flex');
+  static final Style _displayFlexRow = new Style('flex-direction:row');
+
+  String stylesToClasses(List<Style> styles) {
+    var settings = _displayFlex._className;
+    switch (_direction) {
+      case FlexDirection.Row: settings += ' ' + _displayFlexRow._className;
+    }
+    return super.stylesToClasses(styles) + ' ' + settings;
+  }
+
+}
+
 class RenderCSSText extends RenderCSS {
 
   RenderCSSText(debug, String newData) : super(debug) {
     data = newData;
   }
 
   static final Style _displayParagraph = new Style('display:paragraph');
 
   sky.Element createSkyElement() {
     return sky.document.createElement('div')
@@ skipping 68 matching lines @@
   print(prefix + node.toString() + _attributes(node));
   var children = node.getChildNodes();
   prefix = prefix + '  ';
   for (var child in children)
     _serialiseDOM(child, prefix);
 }
 
 void dumpState() {
   _serialiseDOM(sky.document);
 }