diff --git a/lib/circle_nav_bar.dart b/lib/circle_nav_bar.dart index 6bc44fc..6d68463 100644 --- a/lib/circle_nav_bar.dart +++ b/lib/circle_nav_bar.dart @@ -1,5 +1,7 @@ library circle_nav_bar; +import 'dart:math'; + import 'package:flutter/material.dart'; class CircleNavBar extends StatefulWidget { @@ -63,6 +65,7 @@ class CircleNavBar extends StatefulWidget { this.levels, this.activeLevelsStyle, this.inactiveLevelsStyle, + this.maxWidth, }) : assert(circleWidth <= height, "circleWidth <= height"), assert(activeIcons.length == inactiveIcons.length, "activeIcons.length and inactiveIcons.length must be equal!"), @@ -74,6 +77,22 @@ class CircleNavBar extends StatefulWidget { /// ![](doc/value-05.png) final double height; + /// User can set the max width according to their requirements. + /// If not set [double.maxFinite] will be used. + /// Change this value if the [activeIcons] are misaligned. + /// + /// [Use case]: Using with [bottomSheet] instead of [bottomNavigationBar] you + /// can make responsive apps that show a full width bar or limit it to + /// [maxWidth]. + /// + /// You are advised to use this whenever the Navbar is being rendered in a + /// width different from screenSize of the device. + /// Parent Widget also must bind its width to [maxWidth]. + /// + /// [E.g.] SizedBox(width: min(MediaQuery.of(context).size.width, maxWidth), + /// child: CircleNavBar(...)), + final double? maxWidth; + /// Circle icon diameter /// /// ![](doc/value-05.png) @@ -229,10 +248,12 @@ class _CircleNavBarState extends State @override Widget build(BuildContext context) { - double deviceWidth = MediaQuery.of(context).size.width; + double deviceWidth = widget.maxWidth != null + ? min(MediaQuery.of(context).size.width, widget.maxWidth!) + : MediaQuery.of(context).size.width; return Container( margin: widget.padding, - width: double.infinity, + width: deviceWidth, height: widget.height, child: Stack( children: [