feat(ui_kit): make top bar selector customizable

This commit is contained in:
Hugo Pointcheval 2023-04-07 17:26:35 +02:00
parent 5ff5a2ab9e
commit 105e390984
Signed by: hugo
GPG Key ID: 3AAC487E131E00BC
2 changed files with 58 additions and 18 deletions

View File

@ -33,8 +33,28 @@ class NavigationItem extends StatelessWidget {
children: [
if (selected)
Container(
height: 5,
width: 70,
height: ThemeHelper.getThemeElement<double, double>(
[
context
.themeExtension<TopBarThemeExtension>()
?.selectedIndicatorHeight,
// TODO: move default value
5,
],
valueValidator: (value) => value != null,
transform: (value) => value,
),
width: ThemeHelper.getThemeElement<double, double>(
[
context
.themeExtension<TopBarThemeExtension>()
?.selectedIndicatorWidth,
// TODO: move default value
70,
],
valueValidator: (value) => value != null,
transform: (value) => value,
),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(100),
color: ThemeHelper.getThemeElement<Color, Color>(
@ -49,7 +69,21 @@ class NavigationItem extends StatelessWidget {
),
),
),
SizedBox(
ConstrainedBox(
constraints: BoxConstraints(
minWidth: ThemeHelper.getThemeElement<double, double>(
[
context
.themeExtension<TopBarThemeExtension>()
?.selectedIndicatorWidth,
// TODO: move default value
70,
],
valueValidator: (value) => value != null,
transform: (value) => value,
) ?? double.infinity,
),
child: SizedBox(
height: 50,
child: Center(
child: Text(
@ -69,6 +103,7 @@ class NavigationItem extends StatelessWidget {
),
),
),
),
],
);
}

View File

@ -25,6 +25,8 @@ abstract class TopBarThemeExtension
this.secondaryColor,
this.titleStyle,
this.subTitleStyle,
this.selectedIndicatorHeight,
this.selectedIndicatorWidth,
});
final MultiColor? backgroundColors;
@ -33,4 +35,7 @@ abstract class TopBarThemeExtension
final TextStyle? titleStyle;
final TextStyle? subTitleStyle;
final double? selectedIndicatorHeight;
final double? selectedIndicatorWidth;
}