Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Add row alignment of the icon and text alignment #79

Open
wants to merge 4 commits into
base: master
Choose a base branch
from
Open

Add row alignment of the icon and text alignment #79

Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
6da90ce
Update bottom_navy_bar.dart
ARIFCSE10 Nov 19, 2020
a4ba013
Update bottom_navy_bar.dart
ARIFCSE10 Nov 19, 2020
95e35c5
implement item row alignment
ARIFCSE10 Mar 12, 2021
282ac75
fix overflow
ARIFCSE10 Mar 12, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
38 changes: 22 additions & 16 deletions lib/bottom_navy_bar.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,6 @@ import 'package:flutter/widgets.dart';
/// Update [selectedIndex] to change the selected item.
/// [selectedIndex] is required and must not be null.
class BottomNavyBar extends StatelessWidget {

BottomNavyBar({
Key? key,
this.selectedIndex = 0,
Expand All @@ -23,8 +22,9 @@ class BottomNavyBar extends StatelessWidget {
required this.items,
required this.onItemSelected,
this.curve = Curves.linear,
}) : assert(items.length >= 2 && items.length <= 5),
super(key: key);
this.itemRowAlignment = MainAxisAlignment.start,
}) : assert(items.length >= 2 && items.length <= 5),
super(key: key);

/// The selected item is index. Changing this property will change and animate
/// the item being selected. Defaults to zero.
Expand Down Expand Up @@ -63,6 +63,10 @@ class BottomNavyBar extends StatelessWidget {
/// Used to configure the animation curve. Defaults to [Curves.linear].
final Curve curve;

/// Defines the alignment of the icon and text row.
/// Defaults to [MainAxisAlignment.start].
final MainAxisAlignment itemRowAlignment;

@override
Widget build(BuildContext context) {
final bgColor = backgroundColor ?? Theme.of(context).bottomAppBarColor;
Expand Down Expand Up @@ -97,6 +101,7 @@ class BottomNavyBar extends StatelessWidget {
itemCornerRadius: itemCornerRadius,
animationDuration: animationDuration,
curve: curve,
itemRowAlignment: itemRowAlignment,
),
);
}).toList(),
Expand All @@ -108,14 +113,6 @@ class BottomNavyBar extends StatelessWidget {
}

class _ItemWidget extends StatelessWidget {
final double iconSize;
final bool isSelected;
final BottomNavyBarItem item;
final Color backgroundColor;
final double itemCornerRadius;
final Duration animationDuration;
final Curve curve;

const _ItemWidget({
Key? key,
required this.item,
Expand All @@ -125,7 +122,17 @@ class _ItemWidget extends StatelessWidget {
required this.itemCornerRadius,
required this.iconSize,
this.curve = Curves.linear,
}) : super(key: key);
this.itemRowAlignment = MainAxisAlignment.start,
}) : super(key: key);

final double iconSize;
final bool isSelected;
final BottomNavyBarItem item;
final Color backgroundColor;
final double itemCornerRadius;
final Duration animationDuration;
final Curve curve;
final MainAxisAlignment itemRowAlignment;

@override
Widget build(BuildContext context) {
Expand All @@ -150,7 +157,7 @@ class _ItemWidget extends StatelessWidget {
padding: EdgeInsets.symmetric(horizontal: 8),
child: Row(
mainAxisSize: MainAxisSize.max,
mainAxisAlignment: MainAxisAlignment.start,
mainAxisAlignment: itemRowAlignment,
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
IconTheme(
Expand All @@ -165,7 +172,8 @@ class _ItemWidget extends StatelessWidget {
child: item.icon,
),
if (isSelected)
Expanded(
Flexible(
fit: FlexFit.loose,
child: Container(
padding: EdgeInsets.symmetric(horizontal: 4),
child: DefaultTextStyle.merge(
Expand All @@ -190,7 +198,6 @@ class _ItemWidget extends StatelessWidget {

/// The [BottomNavyBar.items] definition.
class BottomNavyBarItem {

BottomNavyBarItem({
required this.icon,
required this.title,
Expand All @@ -216,5 +223,4 @@ class BottomNavyBarItem {
///
/// This will take effect only if [title] it a [Text] widget.
final TextAlign? textAlign;

}