Commit ebe60bab authored by Jason Simmons's avatar Jason Simmons Committed by GitHub

BottomNavigationBar: fix the calculation of the expanding circle animation (#6373)

The circle's offset represents the position of a navigation button within the
row of buttons.  Previously, this offset had been applied to the entire width
of the bottom bar, not just the button region.

Fixes https://github.com/flutter/flutter/issues/6046
parent 1eda886e
...@@ -456,7 +456,8 @@ class BottomNavigationBarState extends State<BottomNavigationBar> with TickerPro ...@@ -456,7 +456,8 @@ class BottomNavigationBarState extends State<BottomNavigationBar> with TickerPro
bottom: 0.0, bottom: 0.0,
child: new CustomPaint( child: new CustomPaint(
painter: new _RadialPainter( painter: new _RadialPainter(
circles: _circles.toList() circles: _circles.toList(),
bottomNavMaxWidth: _maxWidth,
), ),
), ),
), ),
...@@ -514,10 +515,12 @@ class _Circle { ...@@ -514,10 +515,12 @@ class _Circle {
class _RadialPainter extends CustomPainter { class _RadialPainter extends CustomPainter {
_RadialPainter({ _RadialPainter({
this.circles this.circles,
this.bottomNavMaxWidth,
}); });
final List<_Circle> circles; final List<_Circle> circles;
final double bottomNavMaxWidth;
// Computes the maximum radius attainable such that at least one of the // Computes the maximum radius attainable such that at least one of the
// bounding rectangle's corners touches the egde of the circle. Drawing a // bounding rectangle's corners touches the egde of the circle. Drawing a
...@@ -533,6 +536,9 @@ class _RadialPainter extends CustomPainter { ...@@ -533,6 +536,9 @@ class _RadialPainter extends CustomPainter {
@override @override
bool shouldRepaint(_RadialPainter oldPainter) { bool shouldRepaint(_RadialPainter oldPainter) {
if (bottomNavMaxWidth != oldPainter.bottomNavMaxWidth)
return true;
if (circles == oldPainter.circles) if (circles == oldPainter.circles)
return false; return false;
if (circles.length != oldPainter.circles.length) if (circles.length != oldPainter.circles.length)
...@@ -555,8 +561,13 @@ class _RadialPainter extends CustomPainter { ...@@ -555,8 +561,13 @@ class _RadialPainter extends CustomPainter {
final Paint paint = new Paint()..color = circle.color; final Paint paint = new Paint()..color = circle.color;
final Rect rect = new Rect.fromLTWH(0.0, 0.0, size.width, size.height); final Rect rect = new Rect.fromLTWH(0.0, 0.0, size.width, size.height);
canvas.clipRect(rect); canvas.clipRect(rect);
double navWidth = math.min(bottomNavMaxWidth, size.width);
Point center = new Point(
(size.width - navWidth) / 2.0 + circle.offset.dx * navWidth,
circle.offset.dy * size.height
);
canvas.drawCircle( canvas.drawCircle(
circle.offset.withinRect(rect), center,
radiusTween.lerp(circle.animation.value), radiusTween.lerp(circle.animation.value),
paint paint
); );
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment