switch.dart 6.75 KB
Newer Older
1 2 3 4
// Copyright 2015 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.

5
import 'package:flutter/gestures.dart';
6 7
import 'package:flutter/rendering.dart';
import 'package:flutter/widgets.dart';
8

9
import 'colors.dart';
10
import 'constants.dart';
11
import 'debug.dart';
Adam Barth's avatar
Adam Barth committed
12
import 'shadows.dart';
13
import 'theme.dart';
14
import 'toggleable.dart';
15

16
class Switch extends StatelessComponent {
17
  Switch({ Key key, this.value, this.activeColor, this.onChanged })
18 19 20
      : super(key: key);

  final bool value;
21
  final Color activeColor;
Hixie's avatar
Hixie committed
22
  final ValueChanged<bool> onChanged;
23

24
  Widget build(BuildContext context) {
25
    assert(debugCheckHasMaterial(context));
26
    ThemeData themeData = Theme.of(context);
27
    final bool isDark = themeData.brightness == ThemeBrightness.dark;
28

29
    Color activeThumbColor = activeColor ?? themeData.accentColor;
30 31 32 33 34 35 36 37 38 39 40 41
    Color activeTrackColor = activeThumbColor.withAlpha(0x80);

    Color inactiveThumbColor;
    Color inactiveTrackColor;
    if (onChanged != null) {
      inactiveThumbColor = isDark ? Colors.grey[400] : Colors.grey[50];
      inactiveTrackColor = isDark ? Colors.white30 : Colors.black26;
    } else {
      inactiveThumbColor = isDark ? Colors.grey[800] : Colors.grey[400];
      inactiveTrackColor = isDark ? Colors.white10 : Colors.black12;
    }

42
    return new _SwitchRenderObjectWidget(
43
      value: value,
44 45 46 47
      activeColor: activeThumbColor,
      inactiveColor: inactiveThumbColor,
      activeTrackColor: activeTrackColor,
      inactiveTrackColor: inactiveTrackColor,
48 49 50 51 52
      onChanged: onChanged
    );
  }
}

53 54 55 56
class _SwitchRenderObjectWidget extends LeafRenderObjectWidget {
  _SwitchRenderObjectWidget({
    Key key,
    this.value,
57 58 59 60
    this.activeColor,
    this.inactiveColor,
    this.activeTrackColor,
    this.inactiveTrackColor,
61 62
    this.onChanged
  }) : super(key: key);
63 64

  final bool value;
65 66 67 68
  final Color activeColor;
  final Color inactiveColor;
  final Color activeTrackColor;
  final Color inactiveTrackColor;
Hixie's avatar
Hixie committed
69
  final ValueChanged<bool> onChanged;
70

71
  _RenderSwitch createRenderObject(BuildContext context) => new _RenderSwitch(
72
    value: value,
73 74 75 76
    activeColor: activeColor,
    inactiveColor: inactiveColor,
    activeTrackColor: activeTrackColor,
    inactiveTrackColor: inactiveTrackColor,
77 78
    onChanged: onChanged
  );
79

80
  void updateRenderObject(BuildContext context, _RenderSwitch renderObject) {
81 82 83 84 85 86 87
    renderObject
      ..value = value
      ..activeColor = activeColor
      ..inactiveColor = inactiveColor
      ..activeTrackColor = activeTrackColor
      ..inactiveTrackColor = inactiveTrackColor
      ..onChanged = onChanged;
88 89 90
  }
}

91 92 93 94 95 96 97
const double _kTrackHeight = 14.0;
const double _kTrackWidth = 29.0;
const double _kTrackRadius = _kTrackHeight / 2.0;
const double _kThumbRadius = 10.0;
const double _kSwitchWidth = _kTrackWidth - 2 * _kTrackRadius + 2 * kRadialReactionRadius;
const double _kSwitchHeight = 2 * kRadialReactionRadius;

98
class _RenderSwitch extends RenderToggleable {
99 100
  _RenderSwitch({
    bool value,
101 102 103 104
    Color activeColor,
    Color inactiveColor,
    Color activeTrackColor,
    Color inactiveTrackColor,
Hixie's avatar
Hixie committed
105
    ValueChanged<bool> onChanged
106
  }) : super(
107 108 109 110 111 112 113
     value: value,
     activeColor: activeColor,
     inactiveColor: inactiveColor,
     onChanged: onChanged,
     minRadialReactionRadius: _kThumbRadius,
     size: const Size(_kSwitchWidth, _kSwitchHeight)
   ) {
114 115
    _activeTrackColor = activeTrackColor;
    _inactiveTrackColor = inactiveTrackColor;
116
    _drag = new HorizontalDragGestureRecognizer()
117 118 119
      ..onStart = _handleDragStart
      ..onUpdate = _handleDragUpdate
      ..onEnd = _handleDragEnd;
120 121
  }

122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141
  Color get activeTrackColor => _activeTrackColor;
  Color _activeTrackColor;
  void set activeTrackColor(Color value) {
    assert(value != null);
    if (value == _activeTrackColor)
      return;
    _activeTrackColor = value;
    markNeedsPaint();
  }

  Color get inactiveTrackColor => _inactiveTrackColor;
  Color _inactiveTrackColor;
  void set inactiveTrackColor(Color value) {
    assert(value != null);
    if (value == _inactiveTrackColor)
      return;
    _inactiveTrackColor = value;
    markNeedsPaint();
  }

142
  double get _trackInnerLength => size.width - 2.0 * kRadialReactionRadius;
143

144 145 146 147
  HorizontalDragGestureRecognizer _drag;

  void _handleDragStart(Point globalPosition) {
    if (onChanged != null)
148
      reactionController.forward();
149 150 151 152
  }

  void _handleDragUpdate(double delta) {
    if (onChanged != null) {
153
      position
154 155
        ..curve = null
        ..reverseCurve = null;
156
      positionController.value += delta / _trackInnerLength;
157 158 159
    }
  }

160
  void _handleDragEnd(Velocity velocity) {
161 162
    if (position.value >= 0.5)
      positionController.forward();
163
    else
164 165
      positionController.reverse();
    reactionController.reverse();
166 167
  }

Ian Hickson's avatar
Ian Hickson committed
168 169
  void handleEvent(PointerEvent event, BoxHitTestEntry entry) {
    if (event is PointerDownEvent && onChanged != null)
170 171
      _drag.addPointer(event);
    super.handleEvent(event, entry);
172 173
  }

174 175
  Color _cachedThumbColor;
  BoxPainter _thumbPainter;
176

177
  void paint(PaintingContext context, Offset offset) {
Adam Barth's avatar
Adam Barth committed
178
    final Canvas canvas = context.canvas;
179

180 181
    final bool isActive = onChanged != null;

182 183
    Color thumbColor = isActive ? Color.lerp(inactiveColor, activeColor, position.value) : inactiveColor;
    Color trackColor = isActive ? Color.lerp(inactiveTrackColor, activeTrackColor, position.value) : inactiveTrackColor;
184

185
    // Paint the track
186
    Paint paint = new Paint()
187 188 189 190 191 192 193 194
      ..color = trackColor;
    double trackHorizontalPadding = kRadialReactionRadius - _kTrackRadius;
    Rect trackRect = new Rect.fromLTWH(
      offset.dx + trackHorizontalPadding,
      offset.dy + (size.height - _kTrackHeight) / 2.0,
      size.width - 2.0 * trackHorizontalPadding,
      _kTrackHeight
    );
195
    RRect trackRRect = new RRect.fromRectXY(trackRect, _kTrackRadius, _kTrackRadius);
196 197 198 199
    canvas.drawRRect(trackRRect, paint);

    Offset thumbOffset = new Offset(
      offset.dx + kRadialReactionRadius + position.value * _trackInnerLength,
200 201
      offset.dy + size.height / 2.0
    );
202 203 204

    paintRadialReaction(canvas, thumbOffset);

205 206 207 208 209 210 211 212
    if (_cachedThumbColor != thumbColor) {
      _thumbPainter = new BoxDecoration(
        backgroundColor: thumbColor,
        shape: BoxShape.circle,
        boxShadow: elevationToShadow[1]
      ).createBoxPainter();
      _cachedThumbColor = thumbColor;
    }
213 214

    // The thumb contracts slightly during the animation
215 216 217 218 219 220 221
    double inset = 2.0 - (position.value - 0.5).abs() * 2.0;
    double radius = _kThumbRadius - inset;
    Rect thumbRect = new Rect.fromLTRB(thumbOffset.dx - radius,
                                       thumbOffset.dy - radius,
                                       thumbOffset.dx + radius,
                                       thumbOffset.dy + radius);
    _thumbPainter.paint(canvas, thumbRect);
222 223
  }
}