OLD | NEW |
(Empty) | |
| 1 part of stocksapp; |
| 2 |
| 3 class StockArrow extends Component { |
| 4 |
| 5 double percentChange; |
| 6 |
| 7 static Style _style = new Style(''' |
| 8 width: 40px; |
| 9 height: 40px; |
| 10 display: flex; |
| 11 align-items: center; |
| 12 justify-content: center; |
| 13 border-radius: 40px; |
| 14 margin-right: 16px; |
| 15 border: 1px solid transparent;''' |
| 16 ); |
| 17 |
| 18 static Style _upStyle = new Style(''' |
| 19 width: 0; |
| 20 height: 0; |
| 21 border-left: 9px solid transparent; |
| 22 border-right: 9px solid transparent; |
| 23 margin-bottom: 3px; |
| 24 border-bottom: 9px solid white;''' |
| 25 ); |
| 26 |
| 27 static Style _downStyle = new Style(''' |
| 28 width: 0; |
| 29 height: 0; |
| 30 border-left: 9px solid transparent; |
| 31 border-right: 9px solid transparent; |
| 32 margin-top: 3px; |
| 33 border-top: 9px solid white''' |
| 34 ); |
| 35 |
| 36 StockArrow({ Object key, this.percentChange }) : super(key: key); |
| 37 |
| 38 final List<String> _kRedColors = [ |
| 39 '#E57373', |
| 40 '#EF5350', |
| 41 '#F44336', |
| 42 '#E53935', |
| 43 '#D32F2F', |
| 44 '#C62828', |
| 45 '#B71C1C', |
| 46 ]; |
| 47 |
| 48 final List<String> _kGreenColors = [ |
| 49 '#81C784', |
| 50 '#66BB6A', |
| 51 '#4CAF50', |
| 52 '#43A047', |
| 53 '#388E3C', |
| 54 '#2E7D32', |
| 55 '#1B5E20', |
| 56 ]; |
| 57 |
| 58 int _colorIndexForPercentChange(double percentChange) { |
| 59 // Currently the max is 10%. |
| 60 double maxPercent = 10.0; |
| 61 return max(0, ((percentChange.abs() / maxPercent) * _kGreenColors.length).fl
oor()); |
| 62 } |
| 63 |
| 64 String _colorForPercentChange(double percentChange) { |
| 65 if (percentChange > 0) |
| 66 return _kGreenColors[_colorIndexForPercentChange(percentChange)]; |
| 67 return _kRedColors[_colorIndexForPercentChange(percentChange)]; |
| 68 } |
| 69 |
| 70 Node render() { |
| 71 String border = _colorForPercentChange(percentChange).toString(); |
| 72 bool up = percentChange > 0; |
| 73 String type = up ? 'bottom' : 'top'; |
| 74 |
| 75 return new Container( |
| 76 inlineStyle: 'border-color: $border', |
| 77 style: _style, |
| 78 children: [ |
| 79 new Container( |
| 80 inlineStyle: 'border-$type-color: $border', |
| 81 style: up ? _upStyle : _downStyle |
| 82 ) |
| 83 ] |
| 84 ); |
| 85 } |
| 86 } |
OLD | NEW |