firka/flutter
firka/flutter
5
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge pull request #3022 from abarth/polish_selection_controls

Browse Source 
Polish selection controls
This commit is contained in:
Adam Barth 2016-04-01 11:14:04 -07:00
commit c1440e2261
4 changed files with 24 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
packages/flutter/lib/src/material/checkbox.dart
View File

@ -133,7 +133,7 @@ class _RenderCheckbox extends RenderToggleable {
final double offsetX = _kOffset + offset.dx; final double offsetX = _kOffset + offset.dx;
final double offsetY = _kOffset + offset.dy; final double offsetY = _kOffset + offset.dy;
paintRadialReaction(canvas, offset + const Offset(kRadialReactionRadius, kRadialReactionRadius)); paintRadialReaction(canvas, offset, const Point(kRadialReactionRadius, kRadialReactionRadius));
double t = position.value; double t = position.value;

2
packages/flutter/lib/src/material/radio.dart
View File

@ -150,7 +150,7 @@ class _RenderRadio extends RenderToggleable {
void paint(PaintingContext context, Offset offset) { void paint(PaintingContext context, Offset offset) {
final Canvas canvas = context.canvas; final Canvas canvas = context.canvas;
paintRadialReaction(canvas, offset + const Offset(kRadialReactionRadius, kRadialReactionRadius)); paintRadialReaction(canvas, offset, const Point(kRadialReactionRadius, kRadialReactionRadius));
Point center = (offset & size).center; Point center = (offset & size).center;
Color radioColor = onChanged != null ? activeColor : inactiveColor; Color radioColor = onChanged != null ? activeColor : inactiveColor;

17
packages/flutter/lib/src/material/switch.dart
View File

@ -173,7 +173,6 @@ class _RenderSwitch extends RenderToggleable {
activeColor: activeColor, activeColor: activeColor,
inactiveColor: inactiveColor, inactiveColor: inactiveColor,
onChanged: onChanged, onChanged: onChanged,
minRadialReactionRadius: _kThumbRadius,
size: const Size(_kSwitchWidth, _kSwitchHeight) size: const Size(_kSwitchWidth, _kSwitchHeight)
) { ) {
_drag = new HorizontalDragGestureRecognizer() _drag = new HorizontalDragGestureRecognizer()
@ -286,12 +285,12 @@ class _RenderSwitch extends RenderToggleable {
RRect trackRRect = new RRect.fromRectXY(trackRect, _kTrackRadius, _kTrackRadius); RRect trackRRect = new RRect.fromRectXY(trackRect, _kTrackRadius, _kTrackRadius);
canvas.drawRRect(trackRRect, paint); canvas.drawRRect(trackRRect, paint);
Offset thumbOffset = new Offset( Point thumbPosition = new Point(
offset.dx + kRadialReactionRadius + currentPosition * _trackInnerLength, kRadialReactionRadius + currentPosition * _trackInnerLength,
offset.dy + size.height / 2.0 size.height / 2.0
); );
paintRadialReaction(canvas, thumbOffset); paintRadialReaction(canvas, offset, thumbPosition);
BoxPainter thumbPainter; BoxPainter thumbPainter;
if (_inactiveThumbDecoration == null && _activeThumbDecoration == null) { if (_inactiveThumbDecoration == null && _activeThumbDecoration == null) {
@ -310,10 +309,10 @@ class _RenderSwitch extends RenderToggleable {
// The thumb contracts slightly during the animation // The thumb contracts slightly during the animation
double inset = 2.0 - (currentPosition - 0.5).abs() * 2.0; double inset = 2.0 - (currentPosition - 0.5).abs() * 2.0;
double radius = _kThumbRadius - inset; double radius = _kThumbRadius - inset;
Rect thumbRect = new Rect.fromLTRB(thumbOffset.dx - radius, Rect thumbRect = new Rect.fromLTRB(thumbPosition.x + offset.dx - radius,
thumbOffset.dy - radius, thumbPosition.y + offset.dy - radius,
thumbOffset.dx + radius, thumbPosition.x + offset.dx + radius,
thumbOffset.dy + radius); thumbPosition.y + offset.dy + radius);
thumbPainter.paint(canvas, thumbRect); thumbPainter.paint(canvas, thumbRect);
} }
} }

24
packages/flutter/lib/src/material/toggleable.dart
View File

@ -9,6 +9,7 @@ import 'package:flutter/rendering.dart';
import 'constants.dart'; import 'constants.dart';
const Duration _kToggleDuration = const Duration(milliseconds: 200); const Duration _kToggleDuration = const Duration(milliseconds: 200);
final Tween<double> _kRadialReactionRadiusTween = new Tween<double>(begin: 0.0, end: kRadialReactionRadius);
// RenderToggleable is a base class for material style toggleable controls with // RenderToggleable is a base class for material style toggleable controls with
// toggle animations. It handles storing the current value, dispatching // toggle animations. It handles storing the current value, dispatching
@ -20,8 +21,7 @@ abstract class RenderToggleable extends RenderConstrainedBox implements Semantic
Size size, Size size,
Color activeColor, Color activeColor,
Color inactiveColor, Color inactiveColor,
ValueChanged<bool> onChanged, ValueChanged<bool> onChanged
double minRadialReactionRadius: 0.0
}) : _value = value, }) : _value = value,
_activeColor = activeColor, _activeColor = activeColor,
_inactiveColor = inactiveColor, _inactiveColor = inactiveColor,
@ -46,13 +46,10 @@ abstract class RenderToggleable extends RenderConstrainedBox implements Semantic
..addStatusListener(_handlePositionStateChanged); ..addStatusListener(_handlePositionStateChanged);
_reactionController = new AnimationController(duration: kRadialReactionDuration); _reactionController = new AnimationController(duration: kRadialReactionDuration);
_reaction = new Tween<double>( _reaction = new CurvedAnimation(
begin: minRadialReactionRadius,
end: kRadialReactionRadius
).animate(new CurvedAnimation(
parent: _reactionController, parent: _reactionController,
curve: Curves.ease curve: Curves.ease
))..addListener(markNeedsPaint); )..addListener(markNeedsPaint);
} }
bool get value => _value; bool get value => _value;
@ -118,6 +115,7 @@ abstract class RenderToggleable extends RenderConstrainedBox implements Semantic
Animation<double> _reaction; Animation<double> _reaction;
TapGestureRecognizer _tap; TapGestureRecognizer _tap;
Point _downPosition;
void _handlePositionStateChanged(AnimationStatus status) { void _handlePositionStateChanged(AnimationStatus status) {
if (isInteractive) { if (isInteractive) {
@ -129,8 +127,10 @@ abstract class RenderToggleable extends RenderConstrainedBox implements Semantic
} }
void _handleTapDown(Point globalPosition) { void _handleTapDown(Point globalPosition) {
if (isInteractive) if (isInteractive) {
_downPosition = globalToLocal(globalPosition);
_reactionController.forward(); _reactionController.forward();
}
} }
void _handleTap() { void _handleTap() {
@ -139,11 +139,13 @@ abstract class RenderToggleable extends RenderConstrainedBox implements Semantic
} }
void _handleTapUp(Point globalPosition) { void _handleTapUp(Point globalPosition) {
_downPosition = null;
if (isInteractive) if (isInteractive)
_reactionController.reverse(); _reactionController.reverse();
} }
void _handleTapCancel() { void _handleTapCancel() {
_downPosition = null;
if (isInteractive) if (isInteractive)
_reactionController.reverse(); _reactionController.reverse();
} }
@ -157,11 +159,13 @@ abstract class RenderToggleable extends RenderConstrainedBox implements Semantic
_tap.addPointer(event); _tap.addPointer(event);
} }
void paintRadialReaction(Canvas canvas, Offset offset) { void paintRadialReaction(Canvas canvas, Offset offset, Point origin) {
if (!_reaction.isDismissed) { if (!_reaction.isDismissed) {
// TODO(abarth): We should have a different reaction color when position is zero. // TODO(abarth): We should have a different reaction color when position is zero.
Paint reactionPaint = new Paint()..color = activeColor.withAlpha(kRadialReactionAlpha); Paint reactionPaint = new Paint()..color = activeColor.withAlpha(kRadialReactionAlpha);
canvas.drawCircle(offset.toPoint(), _reaction.value, reactionPaint); Point center = Point.lerp(_downPosition ?? origin, origin, _reaction.value);
double radius = _kRadialReactionRadiusTween.evaluate(_reaction);
canvas.drawCircle(center + offset, radius, reactionPaint);
} }
} }