ui_kit/feat/cascade-theme-helper #156

Merged
hugo merged 2 commits from ui_kit/feat/cascade-theme-helper into master 2023-02-22 19:07:18 +00:00
5 changed files with 36 additions and 32 deletions

View File

@ -58,16 +58,15 @@ class TopAppBar extends TopAppBarComponent with $TopAppBarCWMixin {
valueValidator: (value) => value?.isGradient, valueValidator: (value) => value?.isGradient,
transform: (value) => transform: (value) =>
LinearGradientHelper.fromNullableColors(value?.colors), LinearGradientHelper.fromNullableColors(value?.colors),
defaultValue: null,
), ),
color: ThemeHelper.getThemeElement<MultiColor, Color>( color: ThemeHelper.getThemeElement<MultiColor, Color>(
[ [
backgroundColor, backgroundColor,
context.themeExtension<TopBarThemeExtension>()?.backgroundColors, context.themeExtension<TopBarThemeExtension>()?.backgroundColors,
MultiColor.single(Theme.of(context).appBarTheme.backgroundColor),
], ],
valueValidator: (value) => value?.isColor, valueValidator: (value) => value?.isColor,
transform: (value) => value?.color, transform: (value) => value?.color,
defaultValue: Theme.of(context).appBarTheme.backgroundColor,
), ),
), ),
child: Column( child: Column(
@ -88,10 +87,10 @@ class TopAppBar extends TopAppBarComponent with $TopAppBarCWMixin {
[ [
iconTheme, iconTheme,
context.themeExtension<TopBarThemeExtension>()?.iconTheme, context.themeExtension<TopBarThemeExtension>()?.iconTheme,
Theme.of(context).iconTheme,
], ],
valueValidator: (value) => value != null, valueValidator: (value) => value != null,
transform: (value) => value, transform: (value) => value,
defaultValue: Theme.of(context).iconTheme,
), ),
primary: primary ?? true, primary: primary ?? true,
excludeHeaderSemantics: excludeHeaderSemantics ?? false, excludeHeaderSemantics: excludeHeaderSemantics ?? false,
@ -100,12 +99,13 @@ class TopAppBar extends TopAppBarComponent with $TopAppBarCWMixin {
title?.data ?? '', title?.data ?? '',
style: ThemeHelper.getThemeElement<TextStyle, TextStyle>( style: ThemeHelper.getThemeElement<TextStyle, TextStyle>(
[ [
context.textTheme.titleLarge,
context.themeExtension<TopBarThemeExtension>()?.titleStyle,
title?.style, title?.style,
context.themeExtension<TopBarThemeExtension>()?.titleStyle
], ],
valueValidator: (value) => value != null, valueValidator: (value) => value != null,
combine: (p0, p1) => p0?.merge(p1),
transform: (value) => value, transform: (value) => value,
defaultValue: context.textTheme.titleLarge,
), ),
).toGradient(gradientColors: title?.gradientColors), ).toGradient(gradientColors: title?.gradientColors),
leading: leading, leading: leading,
@ -120,10 +120,10 @@ class TopAppBar extends TopAppBarComponent with $TopAppBarCWMixin {
.themeExtension<TopBarThemeExtension>() .themeExtension<TopBarThemeExtension>()
?.secondaryColor ?.secondaryColor
?.withOpacity(0.1), ?.withOpacity(0.1),
Theme.of(context).dividerColor,
], ],
valueValidator: (value) => value != null, valueValidator: (value) => value != null,
transform: (value) => value, transform: (value) => value,
defaultValue: Theme.of(context).dividerColor,
), ),
context: context, context: context,
tiles: expandedWidget!, tiles: expandedWidget!,

View File

@ -62,16 +62,15 @@ class TopNavigationBar extends TopNavigationBarComponent
valueValidator: (value) => value?.isGradient, valueValidator: (value) => value?.isGradient,
transform: (value) => transform: (value) =>
LinearGradientHelper.fromNullableColors(value?.colors), LinearGradientHelper.fromNullableColors(value?.colors),
defaultValue: null,
), ),
color: ThemeHelper.getThemeElement<MultiColor, Color>( color: ThemeHelper.getThemeElement<MultiColor, Color>(
[ [
backgroundColor, backgroundColor,
context.themeExtension<TopBarThemeExtension>()?.backgroundColors, context.themeExtension<TopBarThemeExtension>()?.backgroundColors,
MultiColor.single(Theme.of(context).appBarTheme.backgroundColor),
], ],
valueValidator: (value) => value?.isColor, valueValidator: (value) => value?.isColor,
transform: (value) => value?.color, transform: (value) => value?.color,
defaultValue: Theme.of(context).appBarTheme.backgroundColor,
), ),
), ),
child: AppBar( child: AppBar(
@ -90,10 +89,10 @@ class TopNavigationBar extends TopNavigationBarComponent
[ [
iconTheme, iconTheme,
context.themeExtension<TopBarThemeExtension>()?.iconTheme, context.themeExtension<TopBarThemeExtension>()?.iconTheme,
Theme.of(context).iconTheme,
], ],
valueValidator: (value) => value != null, valueValidator: (value) => value != null,
transform: (value) => value, transform: (value) => value,
defaultValue: Theme.of(context).iconTheme,
), ),
primary: primary ?? true, primary: primary ?? true,
excludeHeaderSemantics: excludeHeaderSemantics ?? false, excludeHeaderSemantics: excludeHeaderSemantics ?? false,

View File

@ -41,11 +41,11 @@ class NavigationItem extends StatelessWidget {
[ [
context context
.themeExtension<TopBarThemeExtension>() .themeExtension<TopBarThemeExtension>()
?.secondaryColor ?.secondaryColor,
Theme.of(context).primaryColor,
], ],
valueValidator: (value) => value != null, valueValidator: (value) => value != null,
transform: (value) => value, transform: (value) => value,
defaultValue: Theme.of(context).primaryColor,
), ),
), ),
), ),
@ -56,14 +56,15 @@ class NavigationItem extends StatelessWidget {
item.data, item.data,
style: ThemeHelper.getThemeElement<TextStyle, TextStyle>( style: ThemeHelper.getThemeElement<TextStyle, TextStyle>(
[ [
item.style, context.textTheme.titleMedium,
context context
.themeExtension<TopBarThemeExtension>() .themeExtension<TopBarThemeExtension>()
?.subTitleStyle ?.subTitleStyle,
item.style,
], ],
combine: (value, element) => value?.merge(element),
valueValidator: (value) => value != null, valueValidator: (value) => value != null,
transform: (value) => value, transform: (value) => value,
defaultValue: context.textTheme.titleMedium,
), ),
), ),
), ),

View File

@ -74,7 +74,6 @@ class CardWrapper extends StatelessWidget {
], ],
valueValidator: (shadow) => shadow != null, valueValidator: (shadow) => shadow != null,
transform: (shadow) => shadow, transform: (shadow) => shadow,
defaultValue: null,
); );
return (themeShadow != null) ? [themeShadow] : []; return (themeShadow != null) ? [themeShadow] : [];
} }
@ -92,11 +91,9 @@ class CardWrapper extends StatelessWidget {
.extension<CardThemeExtension>() .extension<CardThemeExtension>()
?.backgroundColors, ?.backgroundColors,
], ],
valueValidator: (multiColor) => valueValidator: (multiColor) => multiColor?.isGradient,
multiColor != null && multiColor.isGradient,
transform: (multiColor) => transform: (multiColor) =>
LinearGradientHelper.fromMultiColor(multiColor!), LinearGradientHelper.fromMultiColor(multiColor!),
defaultValue: null,
), ),
color: ThemeHelper.getThemeElement<MultiColor, Color>( color: ThemeHelper.getThemeElement<MultiColor, Color>(
[ [
@ -104,11 +101,11 @@ class CardWrapper extends StatelessWidget {
Theme.of(context) Theme.of(context)
.extension<CardThemeExtension>() .extension<CardThemeExtension>()
?.backgroundColors, ?.backgroundColors,
MultiColor.single(Theme.of(context).cardColor),
], ],
valueValidator: (multiColor) => valueValidator: (multiColor) =>
multiColor != null && multiColor.isColor, multiColor != null && multiColor.isColor,
transform: (multiColor) => multiColor?.color, transform: (multiColor) => multiColor?.color,
defaultValue: Theme.of(context).cardColor,
), ),
border: ThemeHelper.getThemeElement<MultiColor, BoxBorder>( border: ThemeHelper.getThemeElement<MultiColor, BoxBorder>(
[ [
@ -130,7 +127,6 @@ class CardWrapper extends StatelessWidget {
color: multiColor.color, color: multiColor.color,
); );
}, },
defaultValue: null,
), ),
boxShadow: _shadow(context), boxShadow: _shadow(context),
), ),

View File

@ -16,26 +16,34 @@
/// A helper class for getting theme elements. /// A helper class for getting theme elements.
abstract class ThemeHelper { abstract class ThemeHelper {
/// Gets a theme element from a list of styles. /// Gets a theme element from a list of styles.
/// Styles are checked in order, and the first one that passes the /// Styles are checked in order, and the first one that passes the
/// [valueValidator] is returned. /// [valueValidator] is returned.
/// If no style passes the [valueValidator], the [defaultValue] is returned.
/// If [styles] is null or empty, the [defaultValue] is returned.
/// Style elements are transformed using the [transform] function. /// Style elements are transformed using the [transform] function.
///
/// [styles]: A list of styles that need to be checked.
/// [transform]: A function that transforms each style element
/// to a [T] type.
/// [valueValidator]: An optional validation function that
/// determines if a style element is valid.
/// [combine]: A function that combines two [P] type objects to create
/// a new object.
static T? getThemeElement<P, T>( static T? getThemeElement<P, T>(
List<P?>? styles, { List<P?>? styles, {
required T? Function(P?)? transform, required T? Function(P?)? transform,
required T? defaultValue,
bool? Function(P?)? valueValidator, bool? Function(P?)? valueValidator,
P? Function(P?, P?)? combine,
}) { }) {
if (styles?.isNotEmpty ?? false) { final Iterable<P?>? validStyles = styles?.where(
for (final element in styles!) { (element) => valueValidator?.call(element) ?? (element != null),
if (valueValidator?.call(element) ?? false) { );
return transform?.call(element); return (validStyles?.isNotEmpty ?? false)
} ? transform?.call(
} validStyles?.reduce(
} (value, element) => combine?.call(value, element) ?? value,
return defaultValue; ),
)
: null;
} }
} }