perfect IconToggle

master
lmy 5 years ago
parent 4e74c20352
commit ac95bee85f

@ -41,6 +41,7 @@ class _IconToggleState extends State<IconToggle>
with SingleTickerProviderStateMixin { with SingleTickerProviderStateMixin {
AnimationController _controller; AnimationController _controller;
Animation<double> _position; Animation<double> _position;
bool _cancel = false;
@override @override
void initState() { void initState() {
@ -51,7 +52,9 @@ class _IconToggleState extends State<IconToggle>
reverseDuration: Duration(milliseconds: 50)); reverseDuration: Duration(milliseconds: 50));
_position = CurvedAnimation(parent: _controller, curve: Curves.linear); _position = CurvedAnimation(parent: _controller, curve: Curves.linear);
_position.addStatusListener((status) { _position.addStatusListener((status) {
if (status == AnimationStatus.dismissed && widget.onChanged != null) { if (status == AnimationStatus.dismissed &&
widget.onChanged != null &&
_cancel == false) {
widget.onChanged(!widget.value); widget.onChanged(!widget.value);
} }
}); });
@ -66,25 +69,34 @@ class _IconToggleState extends State<IconToggle>
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return GestureDetector( return GestureDetector(
behavior: HitTestBehavior.opaque,
onTapDown: (event) { onTapDown: (event) {
_cancel = false;
_controller?.forward(); _controller?.forward();
}, },
onTapUp: (event) { onTapUp: (event) {
_controller?.reverse(); _controller?.reverse();
}, },
child: _IconToggleable<double>( onTapCancel: () {
listenable: _position, _cancel = true;
activeColor: widget.activeColor, _controller?.reverse();
inactiveColor: widget.inactiveColor, },
child: AnimatedSwitcher( child: Padding(
duration: widget.duration, padding: const EdgeInsets.all(10.0),
reverseDuration: widget.reverseDuration, child: _IconToggleable<double>(
transitionBuilder: widget.transitionBuilder, listenable: _position,
child: Icon( activeColor: widget.activeColor,
widget.value ? widget.checkedIconData : widget.uncheckedIconData, inactiveColor: widget.inactiveColor,
color: widget.value ? widget.activeColor : widget.inactiveColor, child: AnimatedSwitcher(
size: 22, duration: widget.duration,
key: ValueKey<bool>(widget.value), reverseDuration: widget.reverseDuration,
transitionBuilder: widget.transitionBuilder,
child: Icon(
widget.value ? widget.checkedIconData : widget.uncheckedIconData,
color: widget.value ? widget.activeColor : widget.inactiveColor,
size: 22,
key: ValueKey<bool>(widget.value),
),
), ),
), ),
), ),
@ -131,7 +143,7 @@ class _IconPainter extends CustomPainter {
void paint(Canvas canvas, Size size) { void paint(Canvas canvas, Size size) {
final Paint paint = Paint() final Paint paint = Paint()
..color = Color.lerp(inactiveColor, activeColor, _value) ..color = Color.lerp(inactiveColor, activeColor, _value)
.withOpacity(math.min(_value, 0.1)) .withOpacity(math.min(_value, 0.15))
..style = PaintingStyle.fill ..style = PaintingStyle.fill
..strokeWidth = 2.0; ..strokeWidth = 2.0;
canvas.drawCircle( canvas.drawCircle(

Loading…
Cancel
Save