Index: sky/sdk/example/stocks/lib/stock_row.dart |
diff --git a/sky/sdk/example/stocks/lib/stock_row.dart b/sky/sdk/example/stocks/lib/stock_row.dart |
index a0ef8bcf2978336886a45e8e7dad96ecee0d345f..c13b66f2c225371e42214a94cd0e8c27511769b9 100644 |
--- a/sky/sdk/example/stocks/lib/stock_row.dart |
+++ b/sky/sdk/example/stocks/lib/stock_row.dart |
@@ -2,71 +2,62 @@ |
// Use of this source code is governed by a BSD-style license that can be |
// found in the LICENSE file. |
-import 'package:sky/framework/components/ink_well.dart'; |
-import 'package:sky/framework/fn.dart'; |
-import 'package:sky/framework/layout.dart'; |
-import 'package:sky/framework/theme/typography.dart' as typography; |
+import 'package:sky/painting/text_style.dart'; |
+import 'package:sky/rendering/box.dart'; |
+import 'package:sky/widgets/ink_well.dart'; |
+import 'package:sky/widgets/basic.dart'; |
+import 'package:sky/widgets/theme.dart'; |
+ |
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 final FlexBoxParentData _tickerFlex = new FlexBoxParentData()..flex = 1; |
- static final Style _lastSaleStyle = new Style(''' |
- text-align: right; |
- padding-right: 16px;''' |
- ); |
+ StockRow({ Stock stock }) : this.stock = stock, super(key: stock.symbol); |
- static final Style _changeStyle = new Style(''' |
- ${typography.black.caption}; |
- text-align: right;''' |
- ); |
+ final Stock stock; |
- Stock stock; |
- |
- StockRow({Stock stock}) : super(key: stock.symbol) { |
- this.stock = stock; |
- } |
+ static const double kHeight = 79.0; |
- UINode build() { |
+ Widget build() { |
String lastSale = "\$${stock.lastSale.toStringAsFixed(2)}"; |
String changeInPrice = "${stock.percentChange.toStringAsFixed(2)}%"; |
- if (stock.percentChange > 0) |
- changeInPrice = "+" + changeInPrice; |
+ if (stock.percentChange > 0) changeInPrice = "+" + changeInPrice; |
- List<UINode> children = [ |
- new StockArrow( |
- percentChange: stock.percentChange |
+ List<Widget> children = [ |
+ new Container( |
+ child: new StockArrow(percentChange: stock.percentChange), |
+ margin: const EdgeDims.only(right: 5.0) |
), |
- new ParentDataNode( |
- new Container( |
- key: 'Ticker', |
- children: [new Text(stock.symbol)] |
- ), |
- _tickerFlex |
+ new Flexible( |
+ child: new Text(stock.symbol), |
+ flex: 2 |
), |
- new Container( |
- key: 'LastSale', |
- style: _lastSaleStyle, |
- children: [new Text(lastSale)] |
+ new Flexible( |
+ child: new Text( |
+ lastSale, |
+ style: const TextStyle(textAlign: TextAlign.right) |
+ ) |
), |
- new Container( |
- key: 'Change', |
- style: _changeStyle, |
- children: [new Text(changeInPrice)] |
+ new Flexible( |
+ child: new Text( |
+ changeInPrice, |
+ style: Theme.of(this).text.caption.copyWith(textAlign: TextAlign.right) |
+ ) |
) |
]; |
- return new StyleNode(new InkWell(children: children), _style); |
+ // TODO(hansmuller): An explicit |height| shouldn't be needed |
+ return new InkWell( |
+ child: new Container( |
+ padding: const EdgeDims(16.0, 16.0, 20.0, 16.0), |
+ height: kHeight, |
+ decoration: const BoxDecoration( |
+ border: const Border( |
+ bottom: const BorderSide(color: const Color(0xFFF4F4F4)))), |
+ child: new Flex(children) |
+ ) |
+ ); |
} |
} |