add a check box delegate to build preview page's right bottom checkbox.

example/lib/main.dart

@@ -35,16 +35,17 @@ class _MyHomePageState extends State<MyHomePage> {
 
       /// The following are optional parameters.
       themeColor: Colors.green, // the title color and bottom color
-      padding: 5.0, // item padding
+      padding: 1.0, // item padding
       dividerColor: Colors.deepOrange, // divider color
       disableColor: Colors.grey.shade300, // the check box disable color
       itemRadio: 0.88, // the content item radio
       maxSelected: 8, // max picker image count
-      provider: CNProvider(), // i18n provider ,default is chinese. , you can custom I18nProvider or use ENProvider()
+      provider: I18nProvider.chinese, // i18n provider ,default is chinese. , you can custom I18nProvider or use ENProvider()
       rowCount: 5,  // item row count
       textColor: Colors.white, // text color
       thumbSize: 150, // preview thumb size , default is 64
       sortDelegate: SortDelegate.common, // default is common ,or you make custom delegate to sort your gallery
+      checkBoxBuilderDelegate: DefaultCheckBoxBuilderDelegate(), // default is DefaultCheckBoxBuilderDelegate ,or you make custom delegate to create checkbox
     );
 
     if (imgList == null) {

lib/photo.dart

@@ -10,10 +10,12 @@ import 'package:photo/src/provider/i18n_provider.dart';
 import 'package:photo/src/ui/dialog/not_permission_dialog.dart';
 import 'package:photo/src/ui/photo_app.dart';
 import 'package:photo/src/delegate/sort_delegate.dart';
+import 'package:photo/src/delegate/checkbox_builder_delegate.dart';
 
 export 'package:photo/src/provider/i18n_provider.dart'
     show I18NCustomProvider, I18nProvider, CNProvider, ENProvider;
 export 'package:photo/src/delegate/sort_delegate.dart';
+export 'package:photo/src/delegate/checkbox_builder_delegate.dart';
 
 class PhotoPicker {
   static PhotoPicker _instance;
@@ -58,6 +60,7 @@ class PhotoPicker {
     int thumbSize = 64,
     I18nProvider provider = I18nProvider.chinese,
     SortDelegate sortDelegate,
+    CheckBoxBuilderDelegate checkBoxBuilderDelegate,
   }) {
     assert(provider != null, "provider must be not null");
     assert(context != null, "context must be not null");
@@ -68,6 +71,7 @@ class PhotoPicker {
     textColor ??= Colors.white;
 
     sortDelegate ??= SortDelegate.common;
+    checkBoxBuilderDelegate ??= DefaultCheckBoxBuilderDelegate();
 
     var options = Options(
       rowCount: rowCount,
@@ -80,6 +84,7 @@ class PhotoPicker {
       themeColor: themeColor,
       thumbSize: thumbSize,
       sortDelegate: sortDelegate,
+      checkBoxBuilderDelegate: checkBoxBuilderDelegate,
     );
 
     return PhotoPicker()._pickImage(

lib/src/delegate/checkbox_builder_delegate.dart

@@ -0,0 +1,75 @@
+import 'package:flutter/material.dart' hide CheckboxListTile;
+import 'package:photo/src/entity/options.dart';
+import 'package:photo/src/provider/i18n_provider.dart';
+import 'package:photo/src/ui/widget/check_tile_copy.dart';
+
+abstract class CheckBoxBuilderDelegate {
+  Widget buildCheckBox(
+    BuildContext context,
+    bool checked,
+    int index,
+    Options options,
+    I18nProvider i18nProvider,
+  );
+}
+
+class DefaultCheckBoxBuilderDelegate extends CheckBoxBuilderDelegate {
+  Color activeColor;
+
+  DefaultCheckBoxBuilderDelegate({this.activeColor = Colors.white});
+
+  @override
+  Widget buildCheckBox(
+    BuildContext context,
+    bool checked,
+    int index,
+    Options options,
+    I18nProvider i18nProvider,
+  ) {
+    return CheckboxListTile(
+      value: checked,
+      onChanged: (bool check) {},
+      activeColor: activeColor,
+      title: Text(
+        i18nProvider.getSelectedOptionsText(options),
+        textAlign: TextAlign.end,
+        style: TextStyle(color: options.textColor),
+      ),
+    );
+  }
+}
+
+class RadioCheckBoxBuilderDelegate extends CheckBoxBuilderDelegate {
+  Color activeColor;
+  Color unselectedColor;
+
+  RadioCheckBoxBuilderDelegate({
+    this.activeColor = Colors.white,
+    this.unselectedColor = Colors.white,
+  });
+
+  @override
+  Widget buildCheckBox(
+    BuildContext context,
+    bool checked,
+    int index,
+    Options options,
+    I18nProvider i18nProvider,
+  ) {
+    return Theme(
+      data: Theme.of(context).copyWith(unselectedWidgetColor: unselectedColor),
+      child: RadioListTile<bool>(
+        value: true,
+        onChanged: (bool check) {},
+        activeColor: activeColor,
+        title: Text(
+          i18nProvider.getSelectedOptionsText(options),
+          textAlign: TextAlign.end,
+          style: TextStyle(color: options.textColor, fontSize: 14.0),
+        ),
+        groupValue: checked,
+        controlAffinity: ListTileControlAffinity.trailing,
+      ),
+    );
+  }
+}

lib/src/entity/options.dart

@@ -1,4 +1,5 @@
 import 'package:flutter/material.dart';
+import 'package:photo/src/delegate/checkbox_builder_delegate.dart';
 import 'package:photo/src/delegate/sort_delegate.dart';
 
 class Options {
@@ -22,6 +23,8 @@ class Options {
 
   final SortDelegate sortDelegate;
 
+  final CheckBoxBuilderDelegate checkBoxBuilderDelegate;
+
   const Options({
     this.rowCount,
     this.maxSelected,
@@ -33,5 +36,6 @@ class Options {
     this.disableColor,
     this.thumbSize,
     this.sortDelegate,
+    this.checkBoxBuilderDelegate,
   });
 }

lib/src/ui/page/photo_preview_page.dart

@@ -116,15 +116,15 @@ class _PhotoPreviewPageState extends State<PhotoPreviewPage> {
             StreamBuilder(
               stream: pageStream,
               builder: (ctx, s) => FlatButton(
-                splashColor: Colors.transparent,
-                onPressed: selectedList.length == 0 ? null : sure,
-                child: Text(
+                    splashColor: Colors.transparent,
+                    onPressed: selectedList.length == 0 ? null : sure,
+                    child: Text(
                       config.provider.getSureText(options, selectedList.length),
                       style: selectedList.length == 0
                           ? textStyle.copyWith(color: options.disableColor)
                           : textStyle,
                     ),
-              ),
+                  ),
             ),
           ],
         ),
@@ -168,21 +168,24 @@ class _PhotoPreviewPageState extends State<PhotoPreviewPage> {
         builder: (ctx, snapshot) {
           var index = snapshot.data;
           var data = list[index];
-          return CheckboxListTile(
-            value: selectedList.contains(data),
-            onChanged: (bool check) {
-              if (changeProviderOnCheckChange) {
-                _onChangeProvider(check, index);
-              } else {
-                _onCheckInOnlyPreview(check, index);
-              }
-            },
-            activeColor: Color.lerp(textColor, themeColor, 0.6),
-            title: Text(
-              config.provider.getSelectedOptionsText(options),
-              textAlign: TextAlign.end,
-              style: TextStyle(color: options.textColor),
-            ),
+          var checked = selectedList.contains(data);
+          return Stack(
+            children: <Widget>[
+              IgnorePointer(
+                child: _buildCheckboxContent(checked, index),
+              ),
+              Positioned(
+                top: 0.0,
+                bottom: 0.0,
+                left: 0.0,
+                right: 0.0,
+                child: GestureDetector(
+                  onTap: () => _changeSelected(!checked, index),
+                  behavior: HitTestBehavior.translucent,
+                  child: Container(),
+                ),
+              ),
+            ],
           );
         },
         initialData: widget.initIndex,
@@ -191,6 +194,25 @@ class _PhotoPreviewPageState extends State<PhotoPreviewPage> {
     );
   }
 
+  Widget _buildCheckboxContent(bool checked, int index) {
+    return options.checkBoxBuilderDelegate.buildCheckBox(
+      context,
+      checked,
+      index,
+      options,
+      config.provider,
+    );
+  }
+
+  void _changeSelected(bool isChecked, int index) {
+    print("onTap out to change checkbox value = $isChecked, index = $index");
+    if (changeProviderOnCheckChange) {
+      _onChangeProvider(isChecked, index);
+    } else {
+      _onCheckInOnlyPreview(isChecked, index);
+    }
+  }
+
   /// 仅仅修改预览时的状态,在退出时,再更新provider的顺序,这里无论添加与否不修改顺序
   void _onCheckInOnlyPreview(bool check, int index) {
     var item = list[index];

lib/src/ui/widget/check_box_copy.dart

@@ -0,0 +1,371 @@
+import 'dart:math' as math;
+
+import 'package:flutter/material.dart' hide Checkbox;
+import 'package:flutter/rendering.dart';
+import 'package:flutter/widgets.dart';
+
+/// A material design checkbox.
+///
+/// The checkbox itself does not maintain any state. Instead, when the state of
+/// the checkbox changes, the widget calls the [onChanged] callback. Most
+/// widgets that use a checkbox will listen for the [onChanged] callback and
+/// rebuild the checkbox with a new [value] to update the visual appearance of
+/// the checkbox.
+///
+/// The checkbox can optionally display three values - true, false, and null -
+/// if [tristate] is true. When [value] is null a dash is displayed. By default
+/// [tristate] is false and the checkbox's [value] must be true or false.
+///
+/// Requires one of its ancestors to be a [Material] widget.
+///
+/// See also:
+///
+///  * [CheckboxListTile], which combines this widget with a [ListTile] so that
+///    you can give the checkbox a label.
+///  * [Switch], a widget with semantics similar to [Checkbox].
+///  * [Radio], for selecting among a set of explicit values.
+///  * [Slider], for selecting a value in a range.
+///  * <https://material.google.com/components/selection-controls.html#selection-controls-checkbox>
+///  * <https://material.google.com/components/lists-controls.html#lists-controls-types-of-list-controls>
+class Checkbox extends StatefulWidget {
+  /// Creates a material design checkbox.
+  ///
+  /// The checkbox itself does not maintain any state. Instead, when the state of
+  /// the checkbox changes, the widget calls the [onChanged] callback. Most
+  /// widgets that use a checkbox will listen for the [onChanged] callback and
+  /// rebuild the checkbox with a new [value] to update the visual appearance of
+  /// the checkbox.
+  ///
+  /// The following arguments are required:
+  ///
+  /// * [value], which determines whether the checkbox is checked. The [value]
+  ///   can only be null if [tristate] is true.
+  /// * [onChanged], which is called when the value of the checkbox should
+  ///   change. It can be set to null to disable the checkbox.
+  ///
+  /// The value of [tristate] must not be null.
+  const Checkbox({
+    Key key,
+    @required this.value,
+    this.tristate = false,
+    @required this.onChanged,
+    this.activeColor,
+    this.checkColor,
+    this.materialTapTargetSize,
+  }) : assert(tristate != null),
+        assert(tristate || value != null),
+        super(key: key);
+
+  /// Whether this checkbox is checked.
+  ///
+  /// This property must not be null.
+  final bool value;
+
+  /// Called when the value of the checkbox should change.
+  ///
+  /// The checkbox passes the new value to the callback but does not actually
+  /// change state until the parent widget rebuilds the checkbox with the new
+  /// value.
+  ///
+  /// If this callback is null, the checkbox will be displayed as disabled
+  /// and will not respond to input gestures.
+  ///
+  /// When the checkbox is tapped, if [tristate] is false (the default) then
+  /// the [onChanged] callback will be applied to `!value`. If [tristate] is
+  /// true this callback cycle from false to true to null.
+  ///
+  /// The callback provided to [onChanged] should update the state of the parent
+  /// [StatefulWidget] using the [State.setState] method, so that the parent
+  /// gets rebuilt; for example:
+  ///
+  /// ```dart
+  /// Checkbox(
+  ///   value: _throwShotAway,
+  ///   onChanged: (bool newValue) {
+  ///     setState(() {
+  ///       _throwShotAway = newValue;
+  ///     });
+  ///   },
+  /// )
+  /// ```
+  final ValueChanged<bool> onChanged;
+
+  /// The color to use when this checkbox is checked.
+  ///
+  /// Defaults to [ThemeData.toggleableActiveColor].
+  final Color activeColor;
+
+  final Color checkColor;
+
+  /// If true the checkbox's [value] can be true, false, or null.
+  ///
+  /// Checkbox displays a dash when its value is null.
+  ///
+  /// When a tri-state checkbox is tapped its [onChanged] callback will be
+  /// applied to true if the current value is null or false, false otherwise.
+  /// Typically tri-state checkboxes are disabled (the onChanged callback is
+  /// null) so they don't respond to taps.
+  ///
+  /// If tristate is false (the default), [value] must not be null.
+  final bool tristate;
+
+  /// Configures the minimum size of the tap target.
+  ///
+  /// Defaults to [ThemeData.materialTapTargetSize].
+  ///
+  /// See also:
+  ///
+  ///   * [MaterialTapTargetSize], for a description of how this affects tap targets.
+  final MaterialTapTargetSize materialTapTargetSize;
+
+  /// The width of a checkbox widget.
+  static const double width = 18.0;
+
+  @override
+  _CheckboxState createState() => _CheckboxState();
+}
+
+class _CheckboxState extends State<Checkbox> with TickerProviderStateMixin {
+  @override
+  Widget build(BuildContext context) {
+    assert(debugCheckHasMaterial(context));
+    final ThemeData themeData = Theme.of(context);
+    Size size;
+    switch (widget.materialTapTargetSize ?? themeData.materialTapTargetSize) {
+      case MaterialTapTargetSize.padded:
+        size = const Size(2 * kRadialReactionRadius + 8.0, 2 * kRadialReactionRadius + 8.0);
+        break;
+      case MaterialTapTargetSize.shrinkWrap:
+        size = const Size(2 * kRadialReactionRadius, 2 * kRadialReactionRadius);
+        break;
+    }
+    final BoxConstraints additionalConstraints = BoxConstraints.tight(size);
+    return _CheckboxRenderObjectWidget(
+      value: widget.value,
+      tristate: widget.tristate,
+      activeColor: widget.activeColor ?? themeData.toggleableActiveColor,
+      checkColor: widget.checkColor ?? themeData.primaryColor,
+      inactiveColor: widget.onChanged != null ? themeData.unselectedWidgetColor : themeData.disabledColor,
+      onChanged: widget.onChanged,
+      additionalConstraints: additionalConstraints,
+      vsync: this,
+    );
+  }
+}
+
+class _CheckboxRenderObjectWidget extends LeafRenderObjectWidget {
+  const _CheckboxRenderObjectWidget({
+    Key key,
+    @required this.value,
+    @required this.tristate,
+    @required this.activeColor,
+    @required this.inactiveColor,
+    @required this.checkColor,
+    @required this.onChanged,
+    @required this.vsync,
+    @required this.additionalConstraints,
+  }) : assert(tristate != null),
+        assert(tristate || value != null),
+        assert(activeColor != null),
+        assert(inactiveColor != null),
+        assert(vsync != null),
+        super(key: key);
+
+  final bool value;
+  final bool tristate;
+  final Color activeColor;
+  final Color checkColor;
+  final Color inactiveColor;
+  final ValueChanged<bool> onChanged;
+  final TickerProvider vsync;
+  final BoxConstraints additionalConstraints;
+
+  @override
+  _RenderCheckbox createRenderObject(BuildContext context) => _RenderCheckbox(
+    value: value,
+    tristate: tristate,
+    activeColor: activeColor,
+    inactiveColor: inactiveColor,
+    onChanged: onChanged,
+    vsync: vsync,
+    additionalConstraints: additionalConstraints,
+  );
+
+  @override
+  void updateRenderObject(BuildContext context, _RenderCheckbox renderObject) {
+    renderObject
+      ..value = value
+      ..tristate = tristate
+      ..activeColor = activeColor
+      ..inactiveColor = inactiveColor
+      ..checkColor = checkColor
+      ..onChanged = onChanged
+      ..additionalConstraints = additionalConstraints
+      ..vsync = vsync;
+  }
+}
+
+const double _kEdgeSize = Checkbox.width;
+const Radius _kEdgeRadius = Radius.circular(1.0);
+const double _kStrokeWidth = 2.0;
+
+class _RenderCheckbox extends RenderToggleable {
+  _RenderCheckbox({
+    bool value,
+    bool tristate,
+    Color activeColor,
+    Color inactiveColor,
+    BoxConstraints additionalConstraints,
+    ValueChanged<bool> onChanged,
+    @required TickerProvider vsync,
+  }): _oldValue = value,
+        super(
+        value: value,
+        tristate: tristate,
+        activeColor: activeColor,
+        inactiveColor: inactiveColor,
+        onChanged: onChanged,
+        additionalConstraints: additionalConstraints,
+        vsync: vsync,
+      );
+
+  bool _oldValue;
+
+  Color checkColor;
+
+  @override
+  set value(bool newValue) {
+    if (newValue == value)
+      return;
+    _oldValue = value;
+    super.value = newValue;
+  }
+
+  @override
+  void describeSemanticsConfiguration(SemanticsConfiguration config) {
+    super.describeSemanticsConfiguration(config);
+    config.isChecked = value == true;
+  }
+
+  // The square outer bounds of the checkbox at t, with the specified origin.
+  // At t == 0.0, the outer rect's size is _kEdgeSize (Checkbox.width)
+  // At t == 0.5, .. is _kEdgeSize - _kStrokeWidth
+  // At t == 1.0, .. is _kEdgeSize
+  RRect _outerRectAt(Offset origin, double t) {
+    final double inset = 1.0 - (t - 0.5).abs() * 2.0;
+    final double size = _kEdgeSize - inset * _kStrokeWidth;
+    final Rect rect = Rect.fromLTWH(origin.dx + inset, origin.dy + inset, size, size);
+    return RRect.fromRectAndRadius(rect, _kEdgeRadius);
+  }
+
+  // The checkbox's border color if value == false, or its fill color when
+  // value == true or null.
+  Color _colorAt(double t) {
+    // As t goes from 0.0 to 0.25, animate from the inactiveColor to activeColor.
+    return onChanged == null
+        ? inactiveColor
+        : (t >= 0.25 ? activeColor : Color.lerp(inactiveColor, activeColor, t * 4.0));
+  }
+
+  // White stroke used to paint the check and dash.
+  void _initStrokePaint(Paint paint) {
+    paint
+      ..color = checkColor
+      ..style = PaintingStyle.stroke
+      ..strokeWidth = _kStrokeWidth;
+  }
+
+  void _drawBorder(Canvas canvas, RRect outer, double t, Paint paint) {
+    assert(t >= 0.0 && t <= 0.5);
+    final double size = outer.width;
+    // As t goes from 0.0 to 1.0, gradually fill the outer RRect.
+    final RRect inner = outer.deflate(math.min(size / 2.0, _kStrokeWidth + size * t));
+    canvas.drawDRRect(outer, inner, paint);
+  }
+
+  void _drawCheck(Canvas canvas, Offset origin, double t, Paint paint) {
+    assert(t >= 0.0 && t <= 1.0);
+    // As t goes from 0.0 to 1.0, animate the two check mark strokes from the
+    // short side to the long side.
+    final Path path = Path();
+    const Offset start = Offset(_kEdgeSize * 0.15, _kEdgeSize * 0.45);
+    const Offset mid = Offset(_kEdgeSize * 0.4, _kEdgeSize * 0.7);
+    const Offset end = Offset(_kEdgeSize * 0.85, _kEdgeSize * 0.25);
+    if (t < 0.5) {
+      final double strokeT = t * 2.0;
+      final Offset drawMid = Offset.lerp(start, mid, strokeT);
+      path.moveTo(origin.dx + start.dx, origin.dy + start.dy);
+      path.lineTo(origin.dx + drawMid.dx, origin.dy + drawMid.dy);
+    } else {
+      final double strokeT = (t - 0.5) * 2.0;
+      final Offset drawEnd = Offset.lerp(mid, end, strokeT);
+      path.moveTo(origin.dx + start.dx, origin.dy + start.dy);
+      path.lineTo(origin.dx + mid.dx, origin.dy + mid.dy);
+      path.lineTo(origin.dx + drawEnd.dx, origin.dy + drawEnd.dy);
+    }
+    canvas.drawPath(path, paint);
+  }
+
+  void _drawDash(Canvas canvas, Offset origin, double t, Paint paint) {
+    assert(t >= 0.0 && t <= 1.0);
+    // As t goes from 0.0 to 1.0, animate the horizontal line from the
+    // mid point outwards.
+    const Offset start = Offset(_kEdgeSize * 0.2, _kEdgeSize * 0.5);
+    const Offset mid = Offset(_kEdgeSize * 0.5, _kEdgeSize * 0.5);
+    const Offset end = Offset(_kEdgeSize * 0.8, _kEdgeSize * 0.5);
+    final Offset drawStart = Offset.lerp(start, mid, 1.0 - t);
+    final Offset drawEnd = Offset.lerp(mid, end, t);
+    canvas.drawLine(origin + drawStart, origin + drawEnd, paint);
+  }
+
+  @override
+  void paint(PaintingContext context, Offset offset) {
+    final Canvas canvas = context.canvas;
+    paintRadialReaction(canvas, offset, size.center(Offset.zero));
+
+    final Offset origin = offset + (size / 2.0 - const Size.square(_kEdgeSize) / 2.0);
+    final AnimationStatus status = position.status;
+    final double tNormalized = status == AnimationStatus.forward || status == AnimationStatus.completed
+        ? position.value
+        : 1.0 - position.value;
+
+    // Four cases: false to null, false to true, null to false, true to false
+    if (_oldValue == false || value == false) {
+      final double t = value == false ? 1.0 - tNormalized : tNormalized;
+      final RRect outer = _outerRectAt(origin, t);
+      final Paint paint = Paint()..color = _colorAt(t);
+
+      if (t <= 0.5) {
+        _drawBorder(canvas, outer, t, paint);
+      } else {
+        canvas.drawRRect(outer, paint);
+
+        _initStrokePaint(paint);
+        final double tShrink = (t - 0.5) * 2.0;
+        if (_oldValue == null)
+          _drawDash(canvas, origin, tShrink, paint);
+        else
+          _drawCheck(canvas, origin, tShrink, paint);
+      }
+    } else { // Two cases: null to true, true to null
+      final RRect outer = _outerRectAt(origin, 1.0);
+      final Paint paint = Paint() ..color = _colorAt(1.0);
+      canvas.drawRRect(outer, paint);
+
+      _initStrokePaint(paint);
+      if (tNormalized <= 0.5) {
+        final double tShrink = 1.0 - tNormalized * 2.0;
+        if (_oldValue == true)
+          _drawCheck(canvas, origin, tShrink, paint);
+        else
+          _drawDash(canvas, origin, tShrink, paint);
+      } else {
+        final double tExpand = (tNormalized - 0.5) * 2.0;
+        if (value == true)
+          _drawCheck(canvas, origin, tExpand, paint);
+        else
+          _drawDash(canvas, origin, tExpand, paint);
+      }
+    }
+  }
+}

lib/src/ui/widget/check_tile_copy.dart

@@ -0,0 +1,208 @@
+// Copyright 2017 The Chromium Authors. All rights reserved.
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+import 'package:flutter/material.dart' hide Checkbox,CheckboxListTile;
+
+import 'package:photo/src/ui/widget/check_box_copy.dart';
+
+/// A [ListTile] with a [Checkbox]. In other words, a checkbox with a label.
+///
+/// The entire list tile is interactive: tapping anywhere in the tile toggles
+/// the checkbox.
+///
+/// The [value], [onChanged], and [activeColor] properties of this widget are
+/// identical to the similarly-named properties on the [Checkbox] widget.
+///
+/// The [title], [subtitle], [isThreeLine], and [dense] properties are like
+/// those of the same name on [ListTile].
+///
+/// The [selected] property on this widget is similar to the [ListTile.selected]
+/// property, but the color used is that described by [activeColor], if any,
+/// defaulting to the accent color of the current [Theme]. No effort is made to
+/// coordinate the [selected] state and the [value] state; to have the list tile
+/// appear selected when the checkbox is checked, pass the same value to both.
+///
+/// The checkbox is shown on the right by default in left-to-right languages
+/// (i.e. the trailing edge). This can be changed using [controlAffinity]. The
+/// [secondary] widget is placed on the opposite side. This maps to the
+/// [ListTile.leading] and [ListTile.trailing] properties of [ListTile].
+///
+/// To show the [CheckboxListTile] as disabled, pass null as the [onChanged]
+/// callback.
+///
+/// ## Sample code
+///
+/// This widget shows a checkbox that, when checked, slows down all animations
+/// (including the animation of the checkbox itself getting checked!).
+///
+/// ```dart
+/// CheckboxListTile(
+///   title: const Text('Animate Slowly'),
+///   value: timeDilation != 1.0,
+///   onChanged: (bool value) {
+///     setState(() { timeDilation = value ? 20.0 : 1.0; });
+///   },
+///   secondary: const Icon(Icons.hourglass_empty),
+/// )
+/// ```
+///
+/// This sample requires that you also import 'package:flutter/scheduler.dart',
+/// so that you can reference [timeDilation].
+///
+/// See also:
+///
+///  * [ListTileTheme], which can be used to affect the style of list tiles,
+///    including checkbox list tiles.
+///  * [RadioListTile], a similar widget for radio buttons.
+///  * [SwitchListTile], a similar widget for switches.
+///  * [ListTile] and [Checkbox], the widgets from which this widget is made.
+class CheckboxListTile extends StatelessWidget {
+  /// Creates a combination of a list tile and a checkbox.
+  ///
+  /// The checkbox tile itself does not maintain any state. Instead, when the
+  /// state of the checkbox changes, the widget calls the [onChanged] callback.
+  /// Most widgets that use a checkbox will listen for the [onChanged] callback
+  /// and rebuild the checkbox tile with a new [value] to update the visual
+  /// appearance of the checkbox.
+  ///
+  /// The following arguments are required:
+  ///
+  /// * [value], which determines whether the checkbox is checked, and must not
+  ///   be null.
+  ///
+  /// * [onChanged], which is called when the value of the checkbox should
+  ///   change. It can be set to null to disable the checkbox.
+  const CheckboxListTile({
+    Key key,
+    @required this.value,
+    @required this.onChanged,
+    this.activeColor,
+    this.checkColor,
+    this.title,
+    this.subtitle,
+    this.isThreeLine = false,
+    this.dense,
+    this.secondary,
+    this.selected = false,
+    this.controlAffinity = ListTileControlAffinity.platform,
+  }) : assert(value != null),
+        assert(isThreeLine != null),
+        assert(!isThreeLine || subtitle != null),
+        assert(selected != null),
+        assert(controlAffinity != null),
+        super(key: key);
+
+  /// Whether this checkbox is checked.
+  ///
+  /// This property must not be null.
+  final bool value;
+
+  /// Called when the value of the checkbox should change.
+  ///
+  /// The checkbox passes the new value to the callback but does not actually
+  /// change state until the parent widget rebuilds the checkbox tile with the
+  /// new value.
+  ///
+  /// If null, the checkbox will be displayed as disabled.
+  ///
+  /// The callback provided to [onChanged] should update the state of the parent
+  /// [StatefulWidget] using the [State.setState] method, so that the parent
+  /// gets rebuilt; for example:
+  ///
+  /// ```dart
+  /// CheckboxListTile(
+  ///   value: _throwShotAway,
+  ///   onChanged: (bool newValue) {
+  ///     setState(() {
+  ///       _throwShotAway = newValue;
+  ///     });
+  ///   },
+  ///   title: Text('Throw away your shot'),
+  /// )
+  /// ```
+  final ValueChanged<bool> onChanged;
+
+  /// The color to use when this checkbox is checked.
+  ///
+  /// Defaults to accent color of the current [Theme].
+  final Color activeColor;
+
+  final Color checkColor;
+
+  /// The primary content of the list tile.
+  ///
+  /// Typically a [Text] widget.
+  final Widget title;
+
+  /// Additional content displayed below the title.
+  ///
+  /// Typically a [Text] widget.
+  final Widget subtitle;
+
+  /// A widget to display on the opposite side of the tile from the checkbox.
+  ///
+  /// Typically an [Icon] widget.
+  final Widget secondary;
+
+  /// Whether this list tile is intended to display three lines of text.
+  ///
+  /// If false, the list tile is treated as having one line if the subtitle is
+  /// null and treated as having two lines if the subtitle is non-null.
+  final bool isThreeLine;
+
+  /// Whether this list tile is part of a vertically dense list.
+  ///
+  /// If this property is null then its value is based on [ListTileTheme.dense].
+  final bool dense;
+
+  /// Whether to render icons and text in the [activeColor].
+  ///
+  /// No effort is made to automatically coordinate the [selected] state and the
+  /// [value] state. To have the list tile appear selected when the checkbox is
+  /// checked, pass the same value to both.
+  ///
+  /// Normally, this property is left to its default value, false.
+  final bool selected;
+
+  /// Where to place the control relative to the text.
+  final ListTileControlAffinity controlAffinity;
+
+  @override
+  Widget build(BuildContext context) {
+    final Widget control = Checkbox(
+      value: value,
+      onChanged: onChanged,
+      activeColor: activeColor,
+      materialTapTargetSize: MaterialTapTargetSize.shrinkWrap,
+    );
+    Widget leading, trailing;
+    switch (controlAffinity) {
+      case ListTileControlAffinity.leading:
+        leading = control;
+        trailing = secondary;
+        break;
+      case ListTileControlAffinity.trailing:
+      case ListTileControlAffinity.platform:
+        leading = secondary;
+        trailing = control;
+        break;
+    }
+    return MergeSemantics(
+      child: ListTileTheme.merge(
+        selectedColor: activeColor ?? Theme.of(context).accentColor,
+        child: ListTile(
+          leading: leading,
+          title: title,
+          subtitle: subtitle,
+          trailing: trailing,
+          isThreeLine: isThreeLine,
+          dense: dense,
+          enabled: onChanged != null,
+          onTap: onChanged != null ? () { onChanged(!value); } : null,
+          selected: selected,
+        ),
+      ),
+    );
+  }
+}