Prepare StockList for use in stocks2

This CL does a bunch of ground work for getting StockList ready for use in
stocks2. It's still not quite working because of an interaction with Scaffold
that we don't fully understand.

R=eseidel@chromium.org, ianh@google.com

Review URL: https://codereview.chromium.org/1148793005

examples/stocks2/lib/stock_app.dart

@@ -20,7 +20,7 @@ import 'package:sky/framework/theme2/typography.dart' as typography;
 import 'package:sky/framework/theme2/colors.dart' as colors;
 import 'stock_data.dart';
 import 'package:sky/framework/rendering/box.dart';
-// import 'stock_list.dart';
+import 'stock_list.dart';
 // import 'stock_menu.dart';
 
 import 'dart:async';

examples/stocks2/lib/stock_data.dart

@@ -55,11 +55,11 @@ class StockDataFetcher {
   final StockDataCallback callback;
 
   StockDataFetcher(this.callback) {
-    // _fetchNextChunk(); // TODO(ianh): crashes
+    _fetchNextChunk();
   }
 
   void _fetchNextChunk() {
-    fetch('data/stock_data_${_currentChunk++}.json').then((Response response) {
+    fetch('../data/stock_data_${_currentChunk++}.json').then((Response response) {
       String json = response.bodyAsString();
       JsonDecoder decoder = new JsonDecoder();
 

examples/stocks2/lib/stock_list.dart

@@ -15,7 +15,7 @@ class Stocklist extends FixedHeightScrollable {
     Object key,
     this.stocks,
     this.query
-  }) : super(key: key);
+  }) : super(itemHeight: StockRow.kHeight, key: key);
 
   List<UINode> buildItems(int start, int count) {
     var filteredStocks = stocks.where((stock) {

examples/stocks2/lib/stock_row.dart

@@ -2,70 +2,81 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
+import 'dart:sky' as sky;
 import 'package:sky/framework/components2/ink_well.dart';
 import 'package:sky/framework/fn2.dart';
+import 'package:sky/framework/rendering/box.dart';
 import 'package:sky/framework/theme/typography.dart' as typography;
 import 'stock_arrow.dart';
 import 'stock_data.dart';
 
 class StockRow extends Component {
-  static final Style _style = new Style('''
-    align-items: center;
-    border-bottom: 1px solid #F4F4F4;
-    padding-top: 16px;
-    padding-left: 16px;
-    padding-right: 16px;
-    padding-bottom: 20px;'''
-  );
+  static const double kHeight = 100.0;
+  // static final Style _style = new Style('''
+  //   align-items: center;
+  //   border-bottom: 1px solid #F4F4F4;
+  //   padding-top: 16px;
+  //   padding-left: 16px;
+  //   padding-right: 16px;
+  //   padding-bottom: 20px;'''
+  // );
 
-  static final FlexBoxParentData _tickerFlex = new FlexBoxParentData()..flex = 1;
+  // static final FlexBoxParentData _tickerFlex = new FlexBoxParentData()..flex = 1;
 
-  static final Style _lastSaleStyle = new Style('''
-    text-align: right;
-    padding-right: 16px;'''
-  );
+  // static final Style _lastSaleStyle = new Style('''
+  //   text-align: right;
+  //   padding-right: 16px;'''
+  // );
 
-  static final Style _changeStyle = new Style('''
-    ${typography.black.caption};
-    text-align: right;'''
-  );
+  // static final Style _changeStyle = new Style('''
+  //   ${typography.black.caption};
+  //   text-align: right;'''
+  // );
 
   Stock stock;
 
-  StockRow({Stock stock}) : super(key: stock.symbol) {
+  StockRow({ Stock stock }) : super(key: stock.symbol) {
     this.stock = stock;
   }
 
   UINode build() {
-    String lastSale = "\$${stock.lastSale.toStringAsFixed(2)}";
+    // String lastSale = "\$${stock.lastSale.toStringAsFixed(2)}";
 
-    String changeInPrice = "${stock.percentChange.toStringAsFixed(2)}%";
-    if (stock.percentChange > 0)
-      changeInPrice = "+" + changeInPrice;
+    // String changeInPrice = "${stock.percentChange.toStringAsFixed(2)}%";
+    // if (stock.percentChange > 0)
+    //   changeInPrice = "+" + changeInPrice;
 
-    List<UINode> children = [
-      new StockArrow(
-        percentChange: stock.percentChange
-      ),
-      new ParentDataNode(
-        new Container(
-          key: 'Ticker',
-          children: [new Text(stock.symbol)]
-        ),
-        _tickerFlex
-      ),
-      new Container(
-        key: 'LastSale',
-        style: _lastSaleStyle,
-        children: [new Text(lastSale)]
-      ),
-      new Container(
-        key: 'Change',
-        style: _changeStyle,
-        children: [new Text(changeInPrice)]
-      )
-    ];
+    // List<UINode> children = [
+    //   new StockArrow(
+    //     percentChange: stock.percentChange
+    //   ),
+    //   new ParentDataNode(
+    //     new Container(
+    //       key: 'Ticker',
+    //       children: [new Text(stock.symbol)]
+    //     ),
+    //     _tickerFlex
+    //   ),
+    //   new Container(
+    //     key: 'LastSale',
+    //     style: _lastSaleStyle,
+    //     children: [new Text(lastSale)]
+    //   ),
+    //   new Container(
+    //     key: 'Change',
+    //     style: _changeStyle,
+    //     children: [new Text(changeInPrice)]
+    //   )
+    // ];
 
-    return new StyleNode(new InkWell(children: children), _style);
+    // return new StyleNode(new InkWell(children: children), _style);
+    return new Container(
+      desiredSize: const sky.Size.fromHeight(kHeight),
+      decoration: const BoxDecoration(
+        backgroundColor: const sky.Color(0xFFFFFFFF),
+        border: const Border(
+          bottom: const BorderSide(
+            color: const sky.Color(0xFFF4F4F4),
+            width: 1.0))));
   }
 }