Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(241)

Side by Side Diff: sky/sdk/lib/widgets/switch.dart

Issue 1204523002: Material light and dark themes for Sky widgets (Closed) Base URL: git@github.com:domokit/mojo.git@master
Patch Set: fix analyzer warning properly Created 5 years, 6 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
1 // Copyright 2015 The Chromium Authors. All rights reserved. 1 // Copyright 2015 The Chromium Authors. All rights reserved.
2 // Use of this source code is governed by a BSD-style license that can be 2 // Use of this source code is governed by a BSD-style license that can be
3 // found in the LICENSE file. 3 // found in the LICENSE file.
4 4
5 import 'dart:sky' as sky; 5 import 'dart:sky' as sky;
6 6
7 import 'package:sky/theme/colors.dart' as colors;
8 import 'package:sky/theme/shadows.dart'; 7 import 'package:sky/theme/shadows.dart';
9 8
10 import '../painting/shadows.dart'; 9 import '../painting/shadows.dart';
11 import '../rendering/box.dart'; 10 import '../rendering/box.dart';
12 import 'basic.dart'; 11 import 'basic.dart';
12 import 'theme.dart';
13 import 'toggleable.dart'; 13 import 'toggleable.dart';
14 export 'toggleable.dart' show ValueChanged; 14 export 'toggleable.dart' show ValueChanged;
15 15
16 // TODO(jackson): This should change colors with the theme
17 sky.Color _kThumbOnColor = colors.Purple[500];
18 const sky.Color _kThumbOffColor = const sky.Color(0xFFFAFAFA); 16 const sky.Color _kThumbOffColor = const sky.Color(0xFFFAFAFA);
19 sky.Color _kTrackOnColor = new sky.Color(_kThumbOnColor.value & (0x80 << 24));
20 const sky.Color _kTrackOffColor = const sky.Color(0x42000000); 17 const sky.Color _kTrackOffColor = const sky.Color(0x42000000);
21 const double _kSwitchWidth = 35.0; 18 const double _kSwitchWidth = 35.0;
22 const double _kThumbRadius = 10.0; 19 const double _kThumbRadius = 10.0;
23 const double _kSwitchHeight = _kThumbRadius * 2.0; 20 const double _kSwitchHeight = _kThumbRadius * 2.0;
24 const double _kTrackHeight = 14.0; 21 const double _kTrackHeight = 14.0;
25 const double _kTrackRadius = _kTrackHeight / 2.0; 22 const double _kTrackRadius = _kTrackHeight / 2.0;
26 const double _kTrackWidth = _kSwitchWidth - (_kThumbRadius - _kTrackRadius) * 2. 0; 23 const double _kTrackWidth = _kSwitchWidth - (_kThumbRadius - _kTrackRadius) * 2. 0;
27 24
28 class Switch extends Toggleable { 25 class Switch extends Toggleable {
29 // TODO(jackson): Hit-test the switch so that it can respond to both taps and swipe gestures 26 // TODO(jackson): Hit-test the switch so that it can respond to both taps and swipe gestures
30 27
31 Switch({ 28 Switch({
32 String key, 29 String key,
33 bool value, 30 bool value,
34 ValueChanged onChanged 31 ValueChanged onChanged
35 }) : super(key: key, value: value, onChanged: onChanged); 32 }) : super(key: key, value: value, onChanged: onChanged);
36 33
37 Size get size => const Size(_kSwitchWidth + 2.0, _kSwitchHeight + 2.0); 34 Size get size => const Size(_kSwitchWidth + 2.0, _kSwitchHeight + 2.0);
38 35
39 void customPaintCallback(sky.Canvas canvas, Size size) { 36 void customPaintCallback(sky.Canvas canvas, Size size) {
40 sky.Color thumbColor = value ? _kThumbOnColor : _kThumbOffColor; 37 sky.Color thumbColor = _kThumbOffColor;
41 sky.Color trackColor = value ? _kTrackOnColor : _kTrackOffColor; 38 sky.Color trackColor = _kTrackOffColor;
39 if (value) {
40 thumbColor = Theme.of(this).primary[500];
41 trackColor = new sky.Color(thumbColor.value & 0x80FFFFFF);
42 }
42 43
43 // Draw the track rrect 44 // Draw the track rrect
44 sky.Paint paint = new sky.Paint()..color = trackColor; 45 sky.Paint paint = new sky.Paint()..color = trackColor;
45 paint.setStyle(sky.PaintingStyle.fill); 46 paint.setStyle(sky.PaintingStyle.fill);
46 sky.Rect rect = new sky.Rect.fromLTRB( 47 sky.Rect rect = new sky.Rect.fromLTRB(
47 0.0, 48 0.0,
48 _kSwitchHeight / 2.0 - _kTrackHeight / 2.0, 49 _kSwitchHeight / 2.0 - _kTrackHeight / 2.0,
49 _kTrackWidth, 50 _kTrackWidth,
50 _kSwitchHeight / 2.0 + _kTrackHeight / 2.0 51 _kSwitchHeight / 2.0 + _kTrackHeight / 2.0
51 ); 52 );
52 sky.RRect rrect = new sky.RRect()..setRectXY(rect, _kTrackRadius, _kTrackRad ius); 53 sky.RRect rrect = new sky.RRect()..setRectXY(rect, _kTrackRadius, _kTrackRad ius);
53 canvas.drawRRect(rrect, paint); 54 canvas.drawRRect(rrect, paint);
54 55
55 // Draw the raised thumb with a shadow 56 // Draw the raised thumb with a shadow
56 paint.color = thumbColor; 57 paint.color = thumbColor;
57 var builder = new ShadowDrawLooperBuilder(); 58 var builder = new ShadowDrawLooperBuilder();
58 for (BoxShadow boxShadow in shadows[1]) 59 for (BoxShadow boxShadow in shadows[1])
59 builder.addShadow(boxShadow.offset, boxShadow.color, boxShadow.blur); 60 builder.addShadow(boxShadow.offset, boxShadow.color, boxShadow.blur);
60 paint.setDrawLooper(builder.build()); 61 paint.setDrawLooper(builder.build());
61 62
62 // The thumb contracts slightly during the animation 63 // The thumb contracts slightly during the animation
63 double inset = 2.0 - (toggleAnimation.value - 0.5).abs() * 2.0; 64 double inset = 2.0 - (toggleAnimation.value - 0.5).abs() * 2.0;
64 Point thumbPos = new Point( 65 Point thumbPos = new Point(
65 _kTrackRadius + toggleAnimation.value * (_kTrackWidth - _kTrackRadius * 2) , 66 _kTrackRadius + toggleAnimation.value * (_kTrackWidth - _kTrackRadius * 2) ,
66 _kSwitchHeight / 2.0 67 _kSwitchHeight / 2.0
67 ); 68 );
68 canvas.drawCircle(thumbPos.x, thumbPos.y, _kThumbRadius - inset, paint); 69 canvas.drawCircle(thumbPos.x, thumbPos.y, _kThumbRadius - inset, paint);
69 } 70 }
70 } 71 }
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698