feat(ui_kit): make top bar selector customizable

This commit is contained in:
Hugo Pointcheval 2023-04-07 17:26:35 +02:00 committed by Hugo Pointcheval
parent 30a7cc4894
commit 8c06f98624
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,22 +69,37 @@ class NavigationItem extends StatelessWidget {
),
),
),
SizedBox(
height: 50,
child: Center(
child: Text(
item.data,
style: ThemeHelper.getThemeElement<TextStyle, TextStyle>(
[
context.textTheme.titleMedium,
context
.themeExtension<TopBarThemeExtension>()
?.subTitleStyle,
item.style,
],
combine: (value, element) => value?.merge(element),
valueValidator: (value) => value != null,
transform: (value) => value,
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(
item.data,
style: ThemeHelper.getThemeElement<TextStyle, TextStyle>(
[
context.textTheme.titleMedium,
context
.themeExtension<TopBarThemeExtension>()
?.subTitleStyle,
item.style,
],
combine: (value, element) => value?.merge(element),
valueValidator: (value) => value != null,
transform: (value) => value,
),
),
),
),

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;
}