Refactors detail view in advance of trivia (#60)

veggieseasons/lib/data/local_veggie_provider.dart

@@ -15,6 +15,10 @@ class LocalVeggieProvider {
       shortDescription: 'Green or red, they\'re generally round and tasty.',
       accentColor: Color(0x40de8c66),
       seasons: [Season.winter, Season.spring, Season.summer, Season.autumn],
+      vitaminAPercentage: 2,
+      vitaminCPercentage: 8,
+      servingSize: 'One large apple',
+      caloriesPerServing: 130,
     ),
     Veggie(
       id: 2,
@@ -24,6 +28,10 @@ class LocalVeggieProvider {
       shortDescription: 'The armadillo of vegetables.',
       accentColor: Color(0x408ea26d),
       seasons: [Season.autumn, Season.spring],
+      vitaminAPercentage: 0,
+      vitaminCPercentage: 25,
+      servingSize: '1 medium artichoke',
+      caloriesPerServing: 60,
     ),
     Veggie(
       id: 3,
@@ -33,6 +41,10 @@ class LocalVeggieProvider {
       shortDescription: 'It\'s been used a food and medicine for millenia.',
       accentColor: Color(0x408cb437),
       seasons: [Season.spring],
+      vitaminAPercentage: 10,
+      vitaminCPercentage: 15,
+      servingSize: '5 spears',
+      caloriesPerServing: 20,
     ),
     Veggie(
       id: 4,
@@ -42,6 +54,10 @@ class LocalVeggieProvider {
       shortDescription: 'One of the oiliest, richest vegetables money can buy.',
       accentColor: Color(0x40b0ba59),
       seasons: [Season.winter, Season.spring, Season.summer],
+      vitaminAPercentage: 0,
+      vitaminCPercentage: 4,
+      servingSize: '1/5 medium avocado',
+      caloriesPerServing: 50,
     ),
     Veggie(
       id: 5,
@@ -51,6 +67,10 @@ class LocalVeggieProvider {
       shortDescription: 'Find them on backroads and fences in the Northwest.',
       accentColor: Color(0x409d5adb),
       seasons: [Season.summer],
+      vitaminAPercentage: 6,
+      vitaminCPercentage: 4,
+      servingSize: '1 cup',
+      caloriesPerServing: 62,
     ),
     Veggie(
       id: 6,
@@ -60,6 +80,10 @@ class LocalVeggieProvider {
       shortDescription: 'A fruit so tasty there\'s a utensil just for it.',
       accentColor: Color(0x40f6bd56),
       seasons: [Season.summer],
+      vitaminAPercentage: 120,
+      vitaminCPercentage: 80,
+      servingSize: '1/4 medium canteloupe',
+      caloriesPerServing: 50,
     ),
     Veggie(
       id: 7,
@@ -69,6 +93,10 @@ class LocalVeggieProvider {
       shortDescription: 'Looks like white broccoli and explodes when cut.',
       accentColor: Color(0x40c891a8),
       seasons: [Season.autumn],
+      vitaminAPercentage: 0,
+      vitaminCPercentage: 100,
+      servingSize: '1/6 medium head',
+      caloriesPerServing: 25,
     ),
     Veggie(
       id: 8,
@@ -78,6 +106,10 @@ class LocalVeggieProvider {
       shortDescription: 'It\'s basically the veal of lettuce.',
       accentColor: Color(0x40c5be53),
       seasons: [Season.winter, Season.autumn, Season.spring],
+      vitaminAPercentage: 10,
+      vitaminCPercentage: 2,
+      servingSize: '1/2 cup, chopped',
+      caloriesPerServing: 4,
     ),
     Veggie(
       id: 9,
@@ -87,6 +119,10 @@ class LocalVeggieProvider {
       shortDescription: 'Delicious when sliced and wrapped in prosciutto.',
       accentColor: Color(0x40aa6d7c),
       seasons: [Season.autumn, Season.summer],
+      vitaminAPercentage: 2,
+      vitaminCPercentage: 2,
+      servingSize: '1 large fig',
+      caloriesPerServing: 50,
     ),
     Veggie(
       id: 10,
@@ -96,6 +132,10 @@ class LocalVeggieProvider {
       shortDescription: 'Couldn\'t have wine without them.',
       accentColor: Color(0x40ac708a),
       seasons: [Season.autumn],
+      vitaminAPercentage: 0,
+      vitaminCPercentage: 2,
+      servingSize: '3/4 cup',
+      caloriesPerServing: 90,
     ),
     Veggie(
       id: 11,
@@ -105,6 +145,10 @@ class LocalVeggieProvider {
       shortDescription: 'Pleasantly bitter, like a sad movie.',
       accentColor: Color(0x408eb332),
       seasons: [Season.summer],
+      vitaminAPercentage: 4,
+      vitaminCPercentage: 190,
+      servingSize: '1 medium pepper',
+      caloriesPerServing: 25,
     ),
     Veggie(
       id: 12,
@@ -114,6 +158,10 @@ class LocalVeggieProvider {
       shortDescription: 'Delicious... in extremely small quantities.',
       accentColor: Color(0x40ff7a01),
       seasons: [Season.autumn, Season.summer],
+      vitaminAPercentage: 9,
+      vitaminCPercentage: 100,
+      servingSize: '1 pepper',
+      caloriesPerServing: 20,
     ),
     Veggie(
       id: 13,
@@ -123,6 +171,10 @@ class LocalVeggieProvider {
       shortDescription: 'The meanest vegetable. Does not want to be eaten.',
       accentColor: Color(0x40a86bd8),
       seasons: [Season.winter, Season.autumn],
+      vitaminAPercentage: 133,
+      vitaminCPercentage: 134,
+      servingSize: '1 cup, chopped',
+      caloriesPerServing: 33,
     ),
     Veggie(
       id: 14,
@@ -132,6 +184,10 @@ class LocalVeggieProvider {
       shortDescription: 'Also known as Chinese gooseberry.',
       accentColor: Color(0x40b47b37),
       seasons: [Season.summer],
+      vitaminAPercentage: 2,
+      vitaminCPercentage: 240,
+      servingSize: '2 medium kiwis',
+      caloriesPerServing: 90,
     ),
     Veggie(
       id: 15,
@@ -141,6 +197,10 @@ class LocalVeggieProvider {
       shortDescription: 'Similar to limes, only yellow.',
       accentColor: Color(0x40e2a500),
       seasons: [Season.winter],
+      vitaminAPercentage: 0,
+      vitaminCPercentage: 40,
+      servingSize: '1 medium lemon',
+      caloriesPerServing: 15,
     ),
     Veggie(
       id: 16,
@@ -150,6 +210,10 @@ class LocalVeggieProvider {
       shortDescription: 'Couldn\'t have ceviche and margaritas without them.',
       accentColor: Color(0x4089b733),
       seasons: [Season.winter],
+      vitaminAPercentage: 0,
+      vitaminCPercentage: 35,
+      servingSize: '1 medium lime',
+      caloriesPerServing: 20,
     ),
     Veggie(
       id: 17,
@@ -159,6 +223,10 @@ class LocalVeggieProvider {
       shortDescription: 'A fun orange fruit popular with smoothie enthusiasts.',
       accentColor: Color(0x40fcc93c),
       seasons: [Season.summer, Season.autumn],
+      vitaminAPercentage: 72,
+      vitaminCPercentage: 203,
+      servingSize: '1 fruit',
+      caloriesPerServing: 201,
     ),
     Veggie(
       id: 18,
@@ -168,6 +236,10 @@ class LocalVeggieProvider {
       shortDescription: 'They\'re not truffles, but they\'re still tasty.',
       accentColor: Color(0x40ba754b),
       seasons: [Season.spring, Season.autumn],
+      vitaminAPercentage: 0,
+      vitaminCPercentage: 2,
+      servingSize: '5 medium \'shrooms',
+      caloriesPerServing: 20,
     ),
     Veggie(
       id: 19,
@@ -177,6 +249,10 @@ class LocalVeggieProvider {
       shortDescription: 'Tiny, bald peaches.',
       accentColor: Color(0x40e45b3b),
       seasons: [Season.summer],
+      vitaminAPercentage: 8,
+      vitaminCPercentage: 15,
+      servingSize: '1 medium nectarine',
+      caloriesPerServing: 60,
     ),
     Veggie(
       id: 20,
@@ -186,6 +262,10 @@ class LocalVeggieProvider {
       shortDescription: 'It\'s like a plum and an apple had a baby together.',
       accentColor: Color(0x40979852),
       seasons: [Season.winter, Season.autumn],
+      vitaminAPercentage: 0,
+      vitaminCPercentage: 27,
+      servingSize: '1 fruit',
+      caloriesPerServing: 32,
     ),
     Veggie(
       id: 21,
@@ -195,6 +275,10 @@ class LocalVeggieProvider {
       shortDescription: 'Popular in fruit salads and children\'s tales.',
       accentColor: Color(0x40e48b47),
       seasons: [Season.summer],
+      vitaminAPercentage: 8,
+      vitaminCPercentage: 10,
+      servingSize: '2 medium plums',
+      caloriesPerServing: 70,
     ),
     Veggie(
       id: 22,
@@ -204,6 +288,10 @@ class LocalVeggieProvider {
       shortDescription: 'King of starches and giver of french fries.',
       accentColor: Color(0x40c65c63),
       seasons: [Season.winter, Season.autumn],
+      vitaminAPercentage: 0,
+      vitaminCPercentage: 45,
+      servingSize: '1 medium spud',
+      caloriesPerServing: 110,
     ),
     Veggie(
       id: 23,
@@ -213,6 +301,10 @@ class LocalVeggieProvider {
       shortDescription: 'It\'s that bitter taste in the salad you\'re eating.',
       accentColor: Color(0x40d75875),
       seasons: [Season.autumn, Season.spring],
+      vitaminAPercentage: 0,
+      vitaminCPercentage: 10,
+      servingSize: '2 cups shredded',
+      caloriesPerServing: 20,
     ),
     Veggie(
       id: 24,
@@ -222,6 +314,10 @@ class LocalVeggieProvider {
       shortDescription: 'Try roasting them in addition to slicing them up raw.',
       accentColor: Color(0x40819e4e),
       seasons: [Season.spring, Season.autumn],
+      vitaminAPercentage: 0,
+      vitaminCPercentage: 30,
+      servingSize: '7 radishes',
+      caloriesPerServing: 10,
     ),
     Veggie(
       id: 25,
@@ -231,6 +327,10 @@ class LocalVeggieProvider {
       shortDescription: 'Just slather them in butter and pop \'em in the oven.',
       accentColor: Color(0x40dbb721),
       seasons: [Season.winter, Season.autumn],
+      vitaminAPercentage: 297,
+      vitaminCPercentage: 48,
+      servingSize: '1 cup diced butternut',
+      caloriesPerServing: 63,
     ),
     Veggie(
       id: 26,
@@ -241,6 +341,10 @@ class LocalVeggieProvider {
           'A delicious fruit that keeps its seeds on the outside.',
       accentColor: Color(0x40f06a44),
       seasons: [Season.spring, Season.summer],
+      vitaminAPercentage: 0,
+      vitaminCPercentage: 160,
+      servingSize: '8 medium strawberries',
+      caloriesPerServing: 50,
     ),
     Veggie(
       id: 27,
@@ -250,6 +354,10 @@ class LocalVeggieProvider {
       shortDescription: 'No one\'s sure what they are or where they came from.',
       accentColor: Color(0x40f88c06),
       seasons: [Season.winter, Season.autumn],
+      vitaminAPercentage: 6,
+      vitaminCPercentage: 181,
+      servingSize: '1 medium tangelo',
+      caloriesPerServing: 60,
     ),
     Veggie(
       id: 28,
@@ -259,6 +367,10 @@ class LocalVeggieProvider {
       shortDescription: 'A new world food with old world tradition.',
       accentColor: Color(0x40ea3628),
       seasons: [Season.summer],
+      vitaminAPercentage: 20,
+      vitaminCPercentage: 40,
+      servingSize: '1 medium tomato',
+      caloriesPerServing: 25,
     ),
     Veggie(
       id: 29,
@@ -268,6 +380,10 @@ class LocalVeggieProvider {
       shortDescription: 'Everyone\'s favorite closing act at the picnic.',
       accentColor: Color(0x40fa8c75),
       seasons: [Season.summer],
+      vitaminAPercentage: 30,
+      vitaminCPercentage: 25,
+      servingSize: '2 cups diced',
+      caloriesPerServing: 80,
     ),
     Veggie(
       id: 30,
@@ -277,6 +393,10 @@ class LocalVeggieProvider {
       shortDescription: 'Like green pepper, but nicer.',
       accentColor: Color(0x40fd8e00),
       seasons: [Season.summer],
+      vitaminAPercentage: 4,
+      vitaminCPercentage: 190,
+      servingSize: '1 medium pepper',
+      caloriesPerServing: 25,
     ),
   ];
 }

veggieseasons/lib/data/preferences.dart

@@ -70,7 +70,7 @@ class Preferences extends Model {
     _preferredCategories.clear();
     final names = prefs.getString(_preferredCategoriesKey);
 
-    if (names != null) {
+    if (names != null && names.isNotEmpty) {
       for (final name in names.split(',')) {
         final index = int.tryParse(name) ?? -1;
         if (VeggieCategory.values[index] != null) {

veggieseasons/lib/data/veggie.dart

@@ -63,6 +63,10 @@ class Veggie {
     @required this.shortDescription,
     @required this.accentColor,
     @required this.seasons,
+    @required this.vitaminAPercentage,
+    @required this.vitaminCPercentage,
+    @required this.servingSize,
+    @required this.caloriesPerServing,
     this.isFavorite = false,
   });
 
@@ -76,6 +80,7 @@ class Veggie {
 
   final VeggieCategory category;
 
+  /// A short, snappy line, possibly with trivia.
   final String shortDescription;
 
   /// A color value to use when constructing UI elements to match the image
@@ -85,6 +90,20 @@ class Veggie {
   /// Seasons during which a veggie is harvested.
   final List<Season> seasons;
 
+  /// Percentage of the FDA's recommended daily value of vitamin A for someone
+  /// with a 2,000 calorie diet.
+  final int vitaminAPercentage;
+
+  /// Percentage of the FDA's recommended daily value of vitamin C for someone
+  /// with a 2,000 calorie diet.
+  final int vitaminCPercentage;
+
+  /// A text description of a single serving (e.g. '1 apple' or '1/2 cup').
+  final String servingSize;
+
+  /// Calories per serving (as described in [servingSize]).
+  final int caloriesPerServing;
+
   /// Whether or not the veggie has been saved to the user's garden (i.e. marked
   /// as a favorite).
   bool isFavorite;

veggieseasons/lib/screens/details.dart

@@ -6,68 +6,242 @@ import 'package:flutter/cupertino.dart';
 import 'package:flutter/widgets.dart';
 import 'package:scoped_model/scoped_model.dart';
 import 'package:veggieseasons/data/app_state.dart';
+import 'package:veggieseasons/data/preferences.dart';
 import 'package:veggieseasons/data/veggie.dart';
 import 'package:veggieseasons/styles.dart';
 import 'package:veggieseasons/widgets/close_button.dart';
 
-/// A circular widget that represents a season of the year.
+class ServingInfoChart extends StatelessWidget {
-///
+  const ServingInfoChart(this.veggie, this.prefs);
-/// The season can be displayed as a valid harvest time or one during which a
-/// particular veggie cannot be harvested. Bright colors are used in the first
-/// case, and grays in the latter.
-class SeasonCircle extends StatelessWidget {
-  const SeasonCircle(this.season, this.isHarvestTime);
 
-  /// Season to be displayed by this widget.
+  final Veggie veggie;
-  final Season season;
 
-  /// Whether or not [season] should be presented as a valid harvest season.
+  final Preferences prefs;
-  final bool isHarvestTime;
 
-  String get _firstChars {
+  // Creates a [Text] widget to display a veggie's "percentage of your daily
-    return '${season.toString().substring(7, 8).toUpperCase()}'
+  // value of this vitamin" data adjusted for the user's preferred calorie
-        '${season.toString().substring(8, 9)}';
+  // target.
+  Widget _buildVitaminText(int standardPercentage, Future<int> targetCalories) {
+    return FutureBuilder(
+      future: targetCalories,
+      builder: (context, snapshot) {
+        final target = snapshot?.data ?? 2000;
+        final percent = standardPercentage * 2000 ~/ target;
+
+        return Text(
+          '$percent% DV',
+          textAlign: TextAlign.end,
+          style: Styles.detailsServingValueText,
+        );
+      },
+    );
   }
 
   @override
   Widget build(BuildContext context) {
-    return Padding(
+    return Column(
-      padding: const EdgeInsets.all(4.0),
+      children: [
-      child: DecoratedBox(
+        SizedBox(height: 16.0),
-        decoration: BoxDecoration(
+        Align(
-          color: isHarvestTime
+          alignment: Alignment.centerLeft,
-              ? Styles.seasonColors[season]
+          child: Padding(
-              : Styles.transparentColor,
+            padding: const EdgeInsets.only(
-          borderRadius: BorderRadius.circular(25.0),
+              left: 9.0,
-          border: Styles.seasonBorder,
+              bottom: 4.0,
             ),
-        child: SizedBox(
-          height: 50.0,
-          width: 50.0,
-          child: Center(
             child: Text(
-              _firstChars,
+              'Serving info',
-              style: isHarvestTime
+              style: Styles.detailsServingHeaderText,
-                  ? Styles.activeSeasonText
-                  : Styles.inactiveSeasonText,
             ),
           ),
         ),
+        Container(
+          decoration: BoxDecoration(
+            border: Border.all(color: Styles.servingInfoBorderColor),
+          ),
+          padding: const EdgeInsets.all(8.0),
+          child: Column(
+            children: [
+              Table(
+                children: [
+                  TableRow(
+                    children: [
+                      TableCell(
+                        child: Text(
+                          'Serving size:',
+                          style: Styles.detailsServingLabelText,
+                        ),
+                      ),
+                      TableCell(
+                        child: Text(
+                          veggie.servingSize,
+                          textAlign: TextAlign.end,
+                          style: Styles.detailsServingValueText,
+                        ),
+                      ),
+                    ],
+                  ),
+                  TableRow(
+                    children: [
+                      TableCell(
+                        child: Text(
+                          'Calories:',
+                          style: Styles.detailsServingLabelText,
+                        ),
+                      ),
+                      TableCell(
+                        child: Text(
+                          '${veggie.caloriesPerServing} kCal',
+                          textAlign: TextAlign.end,
+                          style: Styles.detailsServingValueText,
+                        ),
+                      ),
+                    ],
+                  ),
+                  TableRow(
+                    children: [
+                      TableCell(
+                        child: Text(
+                          'Vitamin A:',
+                          style: Styles.detailsServingLabelText,
+                        ),
+                      ),
+                      TableCell(
+                        child: _buildVitaminText(
+                          veggie.vitaminAPercentage,
+                          prefs.desiredCalories,
+                        ),
+                      ),
+                    ],
+                  ),
+                  TableRow(
+                    children: [
+                      TableCell(
+                        child: Text(
+                          'Vitamin C:',
+                          style: Styles.detailsServingLabelText,
+                        ),
+                      ),
+                      TableCell(
+                        child: _buildVitaminText(
+                          veggie.vitaminCPercentage,
+                          prefs.desiredCalories,
+                        ),
+                      ),
+                    ],
+                  ),
+                ],
+              ),
+              Padding(
+                padding: const EdgeInsets.only(top: 16.0),
+                child: FutureBuilder(
+                  future: prefs.desiredCalories,
+                  builder: (context, snapshot) {
+                    return Text(
+                      'Percent daily values based on a diet of ' +
+                          '${snapshot?.data ?? '2,000'} calories.',
+                      style: Styles.detailsServingNoteText,
+                    );
+                  },
+                ),
+              ),
+            ],
+          ),
+        )
+      ],
+    );
+  }
+}
+
+class InfoView extends StatelessWidget {
+  final int id;
+
+  const InfoView(this.id);
+
+  Widget build(BuildContext context) {
+    final appState = ScopedModel.of<AppState>(context, rebuildOnChange: true);
+    final prefs = ScopedModel.of<Preferences>(context, rebuildOnChange: true);
+    final veggie = appState.getVeggie(id);
+
+    return Padding(
+      padding: const EdgeInsets.all(24.0),
+      child: Column(
+        crossAxisAlignment: CrossAxisAlignment.stretch,
+        children: [
+          FutureBuilder(
+            future: prefs.preferredCategories,
+            builder: (context, snapshot) {
+              return Text(
+                veggie.categoryName.toUpperCase(),
+                style: (snapshot.hasData &&
+                        snapshot.data.contains(veggie.category))
+                    ? Styles.detailsPreferredCategoryText
+                    : Styles.detailsCategoryText,
+              );
+            },
+          ),
+          SizedBox(height: 8.0),
+          Text(
+            veggie.name,
+            style: Styles.detailsTitleText,
+          ),
+          SizedBox(height: 8.0),
+          Text(
+            veggie.shortDescription,
+            style: Styles.detailsShortDescriptionText,
+          ),
+          ServingInfoChart(veggie, prefs),
+          SizedBox(height: 24.0),
+          Row(
+            mainAxisSize: MainAxisSize.min,
+            children: [
+              CupertinoSwitch(
+                value: veggie.isFavorite,
+                onChanged: (value) {
+                  appState.setFavorite(id, value);
+                },
+              ),
+              SizedBox(width: 8.0),
+              Text('Save to Garden'),
+            ],
+          ),
+        ],
       ),
     );
   }
 }
 
-class DetailsScreen extends StatelessWidget {
+class TriviaView extends StatelessWidget {
+  final int id;
+
+  const TriviaView(this.id);
+
+  @override
+  Widget build(BuildContext context) {
+    return Padding(
+      padding: const EdgeInsets.all(32.0),
+      child: Text('Trivia goes here.'),
+    );
+  }
+}
+
+class DetailsScreen extends StatefulWidget {
   final int id;
 
   DetailsScreen(this.id);
 
-  Widget _createHeader(BuildContext context, AppState model) {
+  @override
-    final veggie = model.getVeggie(id);
+  _DetailsScreenState createState() => _DetailsScreenState();
+}
+
+class _DetailsScreenState extends State<DetailsScreen> {
+  int _selectedViewIndex = 0;
+
+  Widget _buildHeader(BuildContext context, AppState model) {
+    final veggie = model.getVeggie(widget.id);
 
     return SizedBox(
-      height: 200.0,
+      height: 150.0,
       child: Stack(
         children: [
           Positioned(
@@ -88,68 +262,6 @@ class DetailsScreen extends StatelessWidget {
               }),
             ),
           ),
-          Positioned(
-            bottom: 0.0,
-            left: 0.0,
-            right: 0.0,
-            child: DecoratedBox(
-              decoration: BoxDecoration(
-                gradient: Styles.shadowGradient,
-              ),
-              child: Padding(
-                padding: const EdgeInsets.fromLTRB(16.0, 50.0, 16.0, 16.0),
-                child: Text(
-                  veggie.name,
-                  style: Styles.subheadText,
-                ),
-              ),
-            ),
-          ),
-        ],
-      ),
-    );
-  }
-
-  Widget _createDetails(AppState model) {
-    final veggie = model.getVeggie(id);
-
-    return Padding(
-      padding: const EdgeInsets.all(24.0),
-      child: Column(
-        crossAxisAlignment: CrossAxisAlignment.stretch,
-        children: [
-          Wrap(
-            children: Season.values.map((s) {
-              return SeasonCircle(s, veggie.seasons.contains(s));
-            }).toList(),
-          ),
-          SizedBox(height: 8.0),
-          Row(
-            mainAxisSize: MainAxisSize.min,
-            children: [
-              CupertinoSwitch(
-                value: veggie.isFavorite,
-                onChanged: (value) {
-                  model.setFavorite(id, value);
-                },
-              ),
-              SizedBox(width: 8.0),
-              Text('Save to Garden'),
-            ],
-          ),
-          SizedBox(height: 24.0),
-          Align(
-            alignment: Alignment.centerRight,
-            child: Text(
-              veggieCategoryNames[veggie.category].toUpperCase(),
-              style: Styles.minorText,
-            ),
-          ),
-          SizedBox(width: 8.0),
-          Padding(
-            padding: const EdgeInsets.symmetric(vertical: 10.0),
-            child: Text(veggie.shortDescription),
-          ),
         ],
       ),
     );
@@ -157,14 +269,27 @@ class DetailsScreen extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    final model = ScopedModel.of<AppState>(context, rebuildOnChange: true);
+    final appState = ScopedModel.of<AppState>(context, rebuildOnChange: true);
 
     return CupertinoPageScaffold(
       child: Column(
         crossAxisAlignment: CrossAxisAlignment.stretch,
         children: [
-          _createHeader(context, model),
+          _buildHeader(context, appState),
-          _createDetails(model),
+          Padding(
+            padding: const EdgeInsets.only(top: 16.0),
+            child: CupertinoSegmentedControl(
+              children: {
+                0: Text('Facts & Info'),
+                1: Text('Trivia'),
+              },
+              groupValue: _selectedViewIndex,
+              onValueChanged: (value) {
+                setState(() => _selectedViewIndex = value);
+              },
+            ),
+          ),
+          _selectedViewIndex == 0 ? InfoView(widget.id) : TriviaView(widget.id),
         ],
       ),
     );

veggieseasons/lib/screens/settings.dart

@@ -137,7 +137,7 @@ class SettingsScreen extends StatelessWidget {
         future: prefs.desiredCalories,
         builder: (context, snapshot) {
           return Row(
-            children: <Widget>[
+            children: [
               Text(snapshot.data?.toString() ?? ''),
               SizedBox(width: 8.0),
               SettingsNavigationIndicator(),

veggieseasons/lib/styles.dart

@@ -15,14 +15,6 @@ abstract class Styles {
     fontWeight: FontWeight.bold,
   );
 
-  static const subheadText = TextStyle(
-    color: Color.fromRGBO(240, 240, 240, 1.0),
-    fontFamily: 'NotoSans',
-    fontSize: 30.0,
-    fontStyle: FontStyle.normal,
-    fontWeight: FontWeight.bold,
-  );
-
   static const minorText = TextStyle(
     color: Color.fromRGBO(128, 128, 128, 1.0),
     fontFamily: 'NotoSans',
@@ -47,22 +39,6 @@ abstract class Styles {
     fontWeight: FontWeight.normal,
   );
 
-  static const activeSeasonText = TextStyle(
-    color: Color.fromRGBO(255, 255, 255, 0.9),
-    fontFamily: 'NotoSans',
-    fontSize: 24.0,
-    fontStyle: FontStyle.normal,
-    fontWeight: FontWeight.normal,
-  );
-
-  static const inactiveSeasonText = TextStyle(
-    color: Color.fromRGBO(80, 80, 80, 0.9),
-    fontFamily: 'NotoSans',
-    fontSize: 24.0,
-    fontStyle: FontStyle.normal,
-    fontWeight: FontWeight.normal,
-  );
-
   static const cardTitleText = TextStyle(
     color: Color.fromRGBO(0, 0, 0, 0.9),
     fontFamily: 'NotoSans',
@@ -87,6 +63,70 @@ abstract class Styles {
     fontWeight: FontWeight.normal,
   );
 
+  static const detailsTitleText = TextStyle(
+    color: Color.fromRGBO(0, 0, 0, 0.9),
+    fontFamily: 'NotoSans',
+    fontSize: 30.0,
+    fontStyle: FontStyle.normal,
+    fontWeight: FontWeight.bold,
+  );
+
+  static const detailsPreferredCategoryText = TextStyle(
+    color: Color.fromRGBO(0, 80, 0, 0.7),
+    fontFamily: 'NotoSans',
+    fontSize: 16.0,
+    fontStyle: FontStyle.normal,
+    fontWeight: FontWeight.bold,
+  );
+
+  static const detailsCategoryText = TextStyle(
+    color: Color.fromRGBO(0, 0, 0, 0.7),
+    fontFamily: 'NotoSans',
+    fontSize: 16.0,
+    fontStyle: FontStyle.normal,
+    fontWeight: FontWeight.normal,
+  );
+
+  static const detailsShortDescriptionText = TextStyle(
+    color: Color.fromRGBO(0, 0, 0, 0.9),
+    fontFamily: 'NotoSans',
+    fontSize: 16.0,
+    fontStyle: FontStyle.normal,
+    fontWeight: FontWeight.normal,
+  );
+
+  static const detailsServingHeaderText = TextStyle(
+    color: Color.fromRGBO(176, 176, 176, 1.0),
+    fontFamily: 'NotoSans',
+    fontSize: 16.0,
+    fontStyle: FontStyle.normal,
+    fontWeight: FontWeight.bold,
+  );
+
+  static const detailsServingLabelText = TextStyle(
+    color: Color.fromRGBO(0, 0, 0, 0.9),
+    fontFamily: 'NotoSans',
+    fontSize: 16.0,
+    fontStyle: FontStyle.normal,
+    fontWeight: FontWeight.bold,
+  );
+
+  static const detailsServingValueText = TextStyle(
+    color: Color.fromRGBO(0, 0, 0, 0.9),
+    fontFamily: 'NotoSans',
+    fontSize: 16.0,
+    fontStyle: FontStyle.normal,
+    fontWeight: FontWeight.normal,
+  );
+
+  static const detailsServingNoteText = TextStyle(
+    color: Color.fromRGBO(0, 0, 0, 0.9),
+    fontFamily: 'NotoSans',
+    fontSize: 16.0,
+    fontStyle: FontStyle.italic,
+    fontWeight: FontWeight.normal,
+  );
+
   static const appBackground = Color(0xffd0d0d0);
 
   static const scaffoldBackground = Color(0xfff0f0f0);
@@ -178,4 +218,6 @@ abstract class Styles {
     fontFamily: CupertinoIcons.iconFont,
     fontPackage: CupertinoIcons.iconFontPackage,
   );
+
+  static const servingInfoBorderColor = Color(0xffb0b0b0);
 }

veggieseasons/pubspec.yaml

@@ -4,7 +4,7 @@ description: An iOS app that shows the fruits and veggies currently in season.
 version: 1.0.0+1
 
 environment:
-  sdk: ">=2.0.0-dev.68.0 <3.0.0"
+  sdk: ">=2.1.0 <3.0.0"
 
 dependencies:
   flutter: