Merge pull request #33 from pedromassango/nnbd

Null Safety Support (and more)

CHANGELOG.md

@@ -1,3 +1,11 @@
+
+## 5.0.0-nullsafety.0
+
+* Null Safety support
+* [breaking change] TitledNavigationBarItem.icon is now of type Widget rather than IconData.
+* Added TitledBottomNavigationBar.height
+* Added TitledBottomNavigationBar.indicatorHeight
+
 ## 4.1.0
 
 * Added support RTL TextDirection. See (#22)

README.md

@@ -41,7 +41,7 @@ Follow these steps to use this library
 ```yaml
 dependencies:
   ...
-  titled_navigation_bar: ^4.1.0
+  titled_navigation_bar: ^5.0.0-nullsafety.0
 ```
 
 ### Import the package

example/lib/main.dart

@@ -20,11 +20,11 @@ class HomePage extends StatefulWidget {
 
 class _HomePageState extends State<HomePage> {
   final List<TitledNavigationBarItem> items = [
-    TitledNavigationBarItem(title: Text('Home'), icon: Icons.home),
-    TitledNavigationBarItem(title: Text('Search'), icon: Icons.search),
-    TitledNavigationBarItem(title: Text('Bag'), icon: Icons.card_travel),
-    TitledNavigationBarItem(title: Text('Orders'), icon: Icons.shopping_cart),
-    TitledNavigationBarItem(title: Text('Profile'), icon: Icons.person_outline),
+    TitledNavigationBarItem(title: Text('Home'), icon: Icon(Icons.home)),
+    TitledNavigationBarItem(title: Text('Search'), icon: Icon(Icons.search)),
+    TitledNavigationBarItem(title: Text('Bag'), icon: Icon(Icons.card_travel)),
+    TitledNavigationBarItem(title: Text('Orders'), icon: Icon(Icons.shopping_cart)),
+    TitledNavigationBarItem(title: Text('Profile'), icon: Icon(Icons.person_outline)),
   ];
 
   bool navBarMode = false;
@@ -50,6 +50,8 @@ class _HomePageState extends State<HomePage> {
         ),
       ),
       bottomNavigationBar: TitledBottomNavigationBar(
+        height: 60,
+        indicatorHeight: 2,
         onTap: (index) => print("Selected Index: $index"),
         reverse: navBarMode,
         curve: Curves.easeInBack,

example/pubspec.yaml

@@ -1,74 +1,23 @@
 name: example
 description: A new Flutter project.
-
-# The following defines the version and build number for your application.
-# A version number is three numbers separated by dots, like 1.2.43
-# followed by an optional build number separated by a +.
-# Both the version and the builder number may be overridden in flutter
-# build by specifying --build-name and --build-number, respectively.
-# In Android, build-name is used as versionName while build-number used as versionCode.
-# Read more about Android versioning at https://developer.android.com/studio/publish/versioning
-# In iOS, build-name is used as CFBundleShortVersionString while build-number used as CFBundleVersion.
-# Read more about iOS versioning at
-# https://developer.apple.com/library/archive/documentation/General/Reference/InfoPlistKeyReference/Articles/CoreFoundationKeys.html
 version: 1.0.0+1
 
 environment:
-  sdk: ">=2.1.0 <3.0.0"
+  sdk: ">=2.12.0-0 <3.0.0"
 
 dependencies:
   flutter:
     sdk: flutter
 
-  # The following adds the Cupertino Icons font to your application.
-  # Use with the CupertinoIcons class for iOS style icons.
-  cupertino_icons: ^0.1.2
+  titled_navigation_bar:
+
+dependency_overrides:
   titled_navigation_bar:
     path: ../
 
 dev_dependencies:
   flutter_test:
     sdk: flutter
 
-
-# For information on the generic Dart part of this file, see the
-# following page: https://www.dartlang.org/tools/pub/pubspec
-
-# The following section is specific to Flutter.
 flutter:
-
-  # The following line ensures that the Material Icons font is
-  # included with your application, so that you can use the icons in
-  # the material Icons class.
   uses-material-design: true
-
-  # To add assets to your application, add an assets section, like this:
-  # assets:
-  #  - images/a_dot_burr.jpeg
-  #  - images/a_dot_ham.jpeg
-
-  # An image asset can refer to one or more resolution-specific "variants", see
-  # https://flutter.io/assets-and-images/#resolution-aware.
-
-  # For details regarding adding assets from package dependencies, see
-  # https://flutter.io/assets-and-images/#from-packages
-
-  # To add custom fonts to your application, add a fonts section here,
-  # in this "flutter" section. Each entry in this list should have a
-  # "family" key with the font family name, and a "fonts" key with a
-  # list giving the asset and other descriptors for the font. For
-  # example:
-  # fonts:
-  #   - family: Schyler
-  #     fonts:
-  #       - asset: fonts/Schyler-Regular.ttf
-  #       - asset: fonts/Schyler-Italic.ttf
-  #         style: italic
-  #   - family: Trajan Pro
-  #     fonts:
-  #       - asset: fonts/TrajanPro.ttf
-  #       - asset: fonts/TrajanPro_Bold.ttf
-  #         weight: 700
-  #
-  # For details regarding fonts from package dependencies,
-  # see https://flutter.io/custom-fonts/#from-packages

lib/src/navigation_bar.dart

@@ -4,45 +4,64 @@ import 'package:flutter/material.dart';
 
 import 'navigation_bar_item.dart';
 
+const double DEFAULT_BAR_HEIGHT = 60;
+
+const double DEFAULT_INDICATOR_HEIGHT = 2;
+
+
 // ignore: must_be_immutable
 class TitledBottomNavigationBar extends StatefulWidget {
   final bool reverse;
   final Curve curve;
-  final Color activeColor;
-  final Color inactiveColor;
-  final Color inactiveStripColor;
-  final Color indicatorColor;
+  final Color? activeColor;
+  final Color? inactiveColor;
+  final Color? inactiveStripColor;
+  final Color? indicatorColor;
   final bool enableShadow;
   int currentIndex;
+
+  /// Called when a item is tapped.
+  ///
+  /// This provide the selected item's index.
   final ValueChanged<int> onTap;
+
+  /// The items of this navigation bar.
+  ///
+  /// This should contain at least two items and five at most.
   final List<TitledNavigationBarItem> items;
 
+  /// The selected item is indicator height.
+  ///
+  /// Defaults to [DEFAULT_INDICATOR_HEIGHT].
+  final double indicatorHeight;
+
+  /// Change the navigation bar's size.
+  ///
+  /// Defaults to [DEFAULT_BAR_HEIGHT].
+  final double height;
+
   TitledBottomNavigationBar({
-    Key key,
+    Key? key,
     this.reverse = false,
     this.curve = Curves.linear,
-    @required this.onTap,
-    @required this.items,
+    required this.onTap,
+    required this.items,
     this.activeColor,
     this.inactiveColor,
     this.inactiveStripColor,
     this.indicatorColor,
     this.enableShadow = true,
     this.currentIndex = 0,
-  })  : assert(items != null),
-        assert(items.length >= 2 && items.length <= 5),
-        assert(onTap != null),
-        assert(currentIndex != null),
-        assert(enableShadow != null),
+    this.height = DEFAULT_BAR_HEIGHT,
+    this.indicatorHeight = DEFAULT_INDICATOR_HEIGHT,
+  })  : assert(items.length >= 2 && items.length <= 5),
         super(key: key);
 
   @override
   State createState() => _TitledBottomNavigationBarState();
 }
 
 class _TitledBottomNavigationBarState extends State<TitledBottomNavigationBar> {
-  static const double BAR_HEIGHT = 60;
-  static const double INDICATOR_HEIGHT = 2;
 
   bool get reverse => widget.reverse;
 
@@ -51,15 +70,15 @@ class _TitledBottomNavigationBarState extends State<TitledBottomNavigationBar> {
   List<TitledNavigationBarItem> get items => widget.items;
 
   double width = 0;
-  Color activeColor;
+  Color? activeColor;
   Duration duration = Duration(milliseconds: 270);
 
   double _getIndicatorPosition(int index) {
     var isLtr = Directionality.of(context) == TextDirection.ltr;
     if (isLtr)
-      return lerpDouble(-1.0, 1.0, index / (items.length - 1));
+      return lerpDouble(-1.0, 1.0, index / (items.length - 1))!;
     else
-      return lerpDouble(1.0, -1.0, index / (items.length - 1));
+      return lerpDouble(1.0, -1.0, index / (items.length - 1))!;
   }
 
   @override
@@ -68,7 +87,7 @@ class _TitledBottomNavigationBarState extends State<TitledBottomNavigationBar> {
     activeColor = widget.activeColor ?? Theme.of(context).indicatorColor;
 
     return Container(
-      height: BAR_HEIGHT + MediaQuery.of(context).viewPadding.bottom,
+      height: widget.height + MediaQuery.of(context).viewPadding.bottom,
       width: width,
       decoration: BoxDecoration(
         color: widget.inactiveStripColor ?? Theme.of(context).cardColor,
@@ -79,10 +98,9 @@ class _TitledBottomNavigationBarState extends State<TitledBottomNavigationBar> {
             : null,
       ),
       child: Stack(
-        overflow: Overflow.visible,
         children: <Widget>[
           Positioned(
-            top: INDICATOR_HEIGHT,
+            top: widget.indicatorHeight,
             child: Row(
               crossAxisAlignment: CrossAxisAlignment.end,
               children: items.map((item) {
@@ -105,7 +123,7 @@ class _TitledBottomNavigationBarState extends State<TitledBottomNavigationBar> {
               child: Container(
                 color: widget.indicatorColor ?? activeColor,
                 width: width / items.length,
-                height: INDICATOR_HEIGHT,
+                height: widget.indicatorHeight,
               ),
             ),
           ),
@@ -114,17 +132,19 @@ class _TitledBottomNavigationBarState extends State<TitledBottomNavigationBar> {
     );
   }
 
-  _select(int index) {
+  void _select(int index) {
     widget.currentIndex = index;
     widget.onTap(widget.currentIndex);
 
     setState(() {});
   }
 
   Widget _buildIcon(TitledNavigationBarItem item) {
-    return Icon(
-      item.icon,
-      color: reverse ? widget.inactiveColor : activeColor,
+    return IconTheme(
+      data: IconThemeData(
+        color: reverse ? widget.inactiveColor : activeColor,
+      ),
+      child: item.icon,
     );
   }
 
@@ -138,7 +158,7 @@ class _TitledBottomNavigationBarState extends State<TitledBottomNavigationBar> {
   Widget _buildItemWidget(TitledNavigationBarItem item, bool isSelected) {
     return Container(
       color: item.backgroundColor,
-      height: BAR_HEIGHT,
+      height: widget.height,
       width: width / items.length,
       child: Stack(
         alignment: AlignmentDirectional.center,

lib/src/navigation_bar_item.dart

@@ -1,13 +1,23 @@
 import 'package:flutter/material.dart';
 
 class TitledNavigationBarItem {
+
+  /// The title of this item.
   final Widget title;
-  final IconData icon;
+
+  /// The icon of this item.
+  ///
+  /// If this is not a [Icon] widget, you must handle the color manually.
+  final Widget icon;
+
+  /// The background color of this item.
+  ///
+  /// Defaults to [Colors.white].
   final Color backgroundColor;
 
   TitledNavigationBarItem({
-    @required this.icon,
-    @required this.title,
+    required this.icon,
+    required this.title,
     this.backgroundColor = Colors.white,
   });
 }

pubspec.yaml

@@ -1,10 +1,10 @@
 name: titled_navigation_bar
 description: A beautiful, clean and simple bottom navigation bar with smooth animation on click. This package is high customizable, read more bellow for more details.
-version: 4.1.0
+version: 5.0.0-nullsafety.0
 homepage: https://github.com/pedromassango/titled_navigation_bar
 
 environment:
-  sdk: ">=2.2.2 <3.0.0"
+  sdk: ">=2.12.0-0 <3.0.0"
 
 dependencies:
   flutter: