Use sliver-based scrolling in more places (#7892)

This patch uses sliver-based two more gallery demos, the stocks example,
in the date picker, and in markdown.

examples/flutter_gallery/lib/demo/date_and_time_picker_demo.dart

@@ -128,75 +128,69 @@ class _DateAndTimePickerDemoState extends State<DateAndTimePickerDemo> {
   Widget build(BuildContext context) {
     return new Scaffold(
       appBar: new AppBar(title: new Text('Date and time pickers')),
-      body: new ScrollableViewport(
-        child: new Container(
+      body: new DropdownButtonHideUnderline(
+        child: new ListView(
           padding: const EdgeInsets.all(16.0),
-          alignment: FractionalOffset.topLeft,
-          child: new DropdownButtonHideUnderline(
-            child: new Column(
-              crossAxisAlignment: CrossAxisAlignment.stretch,
-              children: <Widget>[
-                new TextField(
-                  labelText: 'Event name',
-                  style: Theme.of(context).textTheme.display1,
-                ),
-                new TextField(
-                  labelText: 'Location',
-                  style: Theme.of(context).textTheme.display1.copyWith(fontSize: 20.0),
-                ),
-                new _DateTimePicker(
-                  labelText: 'From',
-                  selectedDate: _fromDate,
-                  selectedTime: _fromTime,
-                  selectDate: (DateTime date) {
-                    setState(() {
-                      _fromDate = date;
-                    });
-                  },
-                  selectTime: (TimeOfDay time) {
-                    setState(() {
-                      _fromTime = time;
-                    });
-                  },
-                ),
-                new _DateTimePicker(
-                  labelText: 'To',
-                  selectedDate: _toDate,
-                  selectedTime: _toTime,
-                  selectDate: (DateTime date) {
-                    setState(() {
-                      _toDate = date;
-                    });
-                  },
-                  selectTime: (TimeOfDay time) {
-                    setState(() {
-                      _toTime = time;
-                    });
-                  },
-                ),
-                new InputContainer(
-                  labelText: 'Activity',
-                  hintText: 'Choose an activity',
-                  isEmpty: _activity == null,
-                  child: new DropdownButton<String>(
-                    value: _activity,
-                    isDense: true,
-                    onChanged: (String newValue) {
-                      setState(() {
-                        _activity = newValue;
-                      });
-                    },
-                    items: _allActivities.map((String value) {
-                      return new DropdownMenuItem<String>(
-                        value: value,
-                        child: new Text(value),
-                      );
-                    }).toList(),
-                  ),
-                ),
-              ],
+          children: <Widget>[
+            new TextField(
+              labelText: 'Event name',
+              style: Theme.of(context).textTheme.display1,
             ),
-          ),
+            new TextField(
+              labelText: 'Location',
+              style: Theme.of(context).textTheme.display1.copyWith(fontSize: 20.0),
+            ),
+            new _DateTimePicker(
+              labelText: 'From',
+              selectedDate: _fromDate,
+              selectedTime: _fromTime,
+              selectDate: (DateTime date) {
+                setState(() {
+                  _fromDate = date;
+                });
+              },
+              selectTime: (TimeOfDay time) {
+                setState(() {
+                  _fromTime = time;
+                });
+              },
+            ),
+            new _DateTimePicker(
+              labelText: 'To',
+              selectedDate: _toDate,
+              selectedTime: _toTime,
+              selectDate: (DateTime date) {
+                setState(() {
+                  _toDate = date;
+                });
+              },
+              selectTime: (TimeOfDay time) {
+                setState(() {
+                  _toTime = time;
+                });
+              },
+            ),
+            new InputContainer(
+              labelText: 'Activity',
+              hintText: 'Choose an activity',
+              isEmpty: _activity == null,
+              child: new DropdownButton<String>(
+                value: _activity,
+                isDense: true,
+                onChanged: (String newValue) {
+                  setState(() {
+                    _activity = newValue;
+                  });
+                },
+                items: _allActivities.map((String value) {
+                  return new DropdownMenuItem<String>(
+                    value: value,
+                    child: new Text(value),
+                  );
+                }).toList(),
+              ),
+            ),
+          ],
         ),
       ),
     );

examples/flutter_gallery/lib/demo/progress_indicator_demo.dart

@@ -101,7 +101,7 @@ class _ProgressIndicatorDemoState extends State<ProgressIndicatorDemo> with Sing
     return new Scaffold(
       appBar: new AppBar(title: new Text('Progress indicators')),
       body: new Center(
-        child: new ScrollableViewport(
+        child: new SingleChildScrollView(
           child: new DefaultTextStyle(
             style: Theme.of(context).textTheme.title,
             child: new GestureDetector(

examples/stocks/lib/stock_list.dart

@@ -17,17 +17,18 @@ class StockList extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    return new ScrollableList(
+    return new ListView.builder(
       key: const ValueKey<String>('stock-list'),
       itemExtent: StockRow.kHeight,
-      children: stocks.map((Stock stock) {
+      itemCount: stocks.length,
+      itemBuilder: (BuildContext context, int index) {
         return new StockRow(
-          stock: stock,
+          stock: stocks[index],
           onPressed: onOpen,
           onDoubleTap: onShow,
           onLongPressed: onAction
         );
-      })
+      },
     );
   }
 }

packages/flutter/lib/src/material/date_picker.dart

@@ -544,34 +544,28 @@ class YearPicker extends StatefulWidget {
 class _YearPickerState extends State<YearPicker> {
   static const double _itemExtent = 50.0;
 
-  List<Widget> _buildItems(BuildContext context, int start, int count) {
-    final ThemeData themeData = Theme.of(context);
-    final TextStyle style = themeData.textTheme.body1;
-    final List<Widget> items = new List<Widget>();
-    for (int i = start; i < start + count; i++) {
-      final int year = config.firstDate.year + i;
-      final TextStyle itemStyle = year == config.selectedDate.year ?
-        themeData.textTheme.headline.copyWith(color: themeData.accentColor) : style;
-      items.add(new InkWell(
-        key: new ValueKey<int>(year),
-        onTap: () {
-          config.onChanged(new DateTime(year, config.selectedDate.month, config.selectedDate.day));
-        },
-        child: new Center(
-          child: new Text(year.toString(), style: itemStyle)
-        )
-      ));
-    }
-    return items;
-  }
-
   @override
   Widget build(BuildContext context) {
     assert(debugCheckHasMaterial(context));
-    return new ScrollableLazyList(
+    final ThemeData themeData = Theme.of(context);
+    final TextStyle style = themeData.textTheme.body1;
+    return new ListView.builder(
       itemExtent: _itemExtent,
       itemCount: config.lastDate.year - config.firstDate.year + 1,
-      itemBuilder: _buildItems
+      itemBuilder: (BuildContext context, int index) {
+        final int year = config.firstDate.year + index;
+        final TextStyle itemStyle = year == config.selectedDate.year ?
+            themeData.textTheme.headline.copyWith(color: themeData.accentColor) : style;
+        return new InkWell(
+          key: new ValueKey<int>(year),
+          onTap: () {
+            config.onChanged(new DateTime(year, config.selectedDate.month, config.selectedDate.day));
+          },
+          child: new Center(
+            child: new Text(year.toString(), style: itemStyle),
+          ),
+        );
+      },
     );
   }
 }

packages/flutter/lib/src/widgets/scroll_view.dart

@@ -168,6 +168,25 @@ class ListView extends BoxScrollView {
     padding: padding,
   );
 
+  ListView.builder({
+    Key key,
+    Axis scrollDirection: Axis.vertical,
+    bool reverse: false,
+    ScrollPhysics physics,
+    bool shrinkWrap: false,
+    EdgeInsets padding,
+    this.itemExtent,
+    IndexedWidgetBuilder itemBuilder,
+    int itemCount,
+  }) : childrenDelegate = new SliverChildBuilderDelegate(itemBuilder, childCount: itemCount), super(
+    key: key,
+    scrollDirection: scrollDirection,
+    reverse: reverse,
+    physics: physics,
+    shrinkWrap: shrinkWrap,
+    padding: padding,
+  );
+
   ListView.custom({
     Key key,
     Axis scrollDirection: Axis.vertical,
@@ -190,7 +209,7 @@ class ListView extends BoxScrollView {
 
   final double itemExtent;
 
-  final SliverChildListDelegate childrenDelegate;
+  final SliverChildDelegate childrenDelegate;
 
   @override
   Widget buildChildLayout(BuildContext context) {
@@ -317,7 +336,7 @@ class GridView extends BoxScrollView {
 
   final SliverGridDelegate gridDelegate;
 
-  final SliverChildListDelegate childrenDelegate;
+  final SliverChildDelegate childrenDelegate;
 
   @override
   Widget buildChildLayout(BuildContext context) {
@@ -373,7 +392,7 @@ class PageView extends BoxScrollView {
     assert(childrenDelegate != null);
   }
 
-  final SliverChildListDelegate childrenDelegate;
+  final SliverChildDelegate childrenDelegate;
 
   @override
   Widget buildChildLayout(BuildContext context) {

packages/flutter/lib/src/widgets/sliver.dart

@@ -63,7 +63,7 @@ class SliverChildBuilderDelegate extends SliverChildDelegate {
   int get estimatedChildCount => childCount;
 
   @override
-  bool shouldRebuild(@checked SliverChildListDelegate oldDelegate) => true;
+  bool shouldRebuild(@checked SliverChildBuilderDelegate oldDelegate) => true;
 }
 
 // ///

packages/flutter_markdown/lib/src/markdown.dart

@@ -64,15 +64,15 @@ class MarkdownBody extends MarkdownBodyRaw {
   /// by default not using syntax highlighting, but it's possible to pass in
   /// a custom [syntaxHighlighter].
   ///
-  /// Typically, you may want to wrap the [MarkdownBody] widget in a [Padding] and
-  /// a [ScrollableViewport], or use the [Markdown] class
+  /// Typically, you may want to wrap the [MarkdownBody] widget in a
+  /// [SingleChildScrollView], or use the [Markdown] class.
   ///
-  ///     new ScrollableViewport(
-  ///       child: new Padding(
-  ///         padding: new EdgeInsets.all(16.0),
-  ///         child: new Markdown(data: markdownSource)
-  ///       )
-  ///     )
+  /// ```dart
+  /// new SingleChildScrollView(
+  ///   padding: new EdgeInsets.all(16.0),
+  ///   child: new Markdown(data: markdownSource),
+  /// ),
+  /// ```
   MarkdownBody({
     String data,
     SyntaxHighlighter syntaxHighlighter,

packages/flutter_markdown/lib/src/markdown_raw.dart

@@ -52,16 +52,16 @@ class MarkdownRaw extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    return new ScrollableViewport(
-      child: new Padding(
-        padding: padding,
-        child: createMarkdownBody(
-          data: data,
-          markdownStyle: markdownStyle,
-          syntaxHighlighter: syntaxHighlighter,
-          onTapLink: onTapLink
-        )
-      )
+    // TODO(abarth): We should use a ListView here and lazily build the widgets
+    // from the markdown.
+    return new SingleChildScrollView(
+      padding: padding,
+      child: createMarkdownBody(
+        data: data,
+        markdownStyle: markdownStyle,
+        syntaxHighlighter: syntaxHighlighter,
+        onTapLink: onTapLink,
+      ),
     );
   }
 
@@ -93,17 +93,17 @@ class MarkdownBodyRaw extends StatefulWidget {
   /// highlighting, but it's possible to pass in a custom [syntaxHighlighter].
   ///
   /// Typically, you may want to wrap the [MarkdownBodyRaw] widget in a
-  /// [Padding] and a [ScrollableViewport], or use the [Markdown class]
+  /// a [ScrollableViewport], or use the [Markdown class].
   ///
-  ///     new ScrollableViewport(
-  ///       child: new Padding(
-  ///         padding: new EdgeInsets.all(16.0),
-  ///         child: new MarkdownBodyRaw(
-  ///           data: markdownSource,
-  ///           markdownStyle: myStyle
-  ///         )
-  ///       )
-  ///     )
+  /// ```dart
+  /// new SingleChildScrollView(
+  ///   padding: new EdgeInsets.all(16.0),
+  ///   child: new MarkdownBodyRaw(
+  ///     data: markdownSource,
+  ///     markdownStyle: myStyle,
+  ///   ),
+  /// ),
+  /// ```
   MarkdownBodyRaw({
     this.data,
     this.markdownStyle,