diff --git a/packages/wyatt_ui_kit/example/assets/images/studio_logo.png b/packages/wyatt_ui_kit/example/assets/images/studio_logo.png new file mode 100644 index 00000000..e3fe86fd Binary files /dev/null and b/packages/wyatt_ui_kit/example/assets/images/studio_logo.png differ diff --git a/packages/wyatt_ui_kit/example/lib/bars/bars.dart b/packages/wyatt_ui_kit/example/lib/bars/bars.dart new file mode 100644 index 00000000..2290e006 --- /dev/null +++ b/packages/wyatt_ui_kit/example/lib/bars/bars.dart @@ -0,0 +1,69 @@ +import 'package:flutter/material.dart'; +import 'package:gap/gap.dart'; +import 'package:wyatt_ui_components/wyatt_wyatt_ui_components.dart'; +import 'package:wyatt_ui_kit/wyatt_ui_kit.dart'; +import 'package:wyatt_ui_kit_example/demo_page.dart'; + +class Bars extends DemoPage { + const Bars({super.key}); + + @override + Widget build(BuildContext context) => ListView( + cacheExtent: 1000, + children: [ + const Gap(20), + TopAppBar( + leading: Padding( + padding: const EdgeInsets.all(8), + child: Image.asset('assets/images/studio_logo.png'), + ), + title: 'Wyatt Studio'.wrap( + gradientColors: const MultiColor( + [ + Color.fromRGBO(57, 167, 254, 1), + Color.fromRGBO(71, 94, 241, 1), + ], + ), + ), + actions: [ + IconButton(onPressed: () {}, icon: const Icon(Icons.menu)) + ], + ), + const Gap(20), + TopAppBar( + leading: Padding( + padding: const EdgeInsets.all(8), + child: Image.asset('assets/images/studio_logo.png'), + ), + title: 'Wyatt Studio'.wrap( + gradientColors: const MultiColor( + [ + Color.fromRGBO(57, 167, 254, 1), + Color.fromRGBO(71, 94, 241, 1), + ], + ), + ), + expandedWidget: const [ + ListTile( + title: Text('Votre programme'), + ), + ListTile( + title: Text('Votre programme'), + ), + ListTile( + title: Text('Votre programme'), + ) + ], + actions: [ + IconButton( + onPressed: () {}, + icon: const Icon(Icons.clear), + ) + ], + ), + ], + ); + + @override + String get title => 'Bars'; +} diff --git a/packages/wyatt_ui_kit/example/lib/home.dart b/packages/wyatt_ui_kit/example/lib/home.dart index 9d772a61..70a20107 100644 --- a/packages/wyatt_ui_kit/example/lib/home.dart +++ b/packages/wyatt_ui_kit/example/lib/home.dart @@ -1,6 +1,7 @@ import 'package:adaptive_theme/adaptive_theme.dart'; import 'package:flutter/material.dart'; import 'package:gap/gap.dart'; +import 'package:wyatt_ui_kit_example/bars/bars.dart'; import 'package:wyatt_ui_kit_example/buttons/buttons.dart'; import 'package:wyatt_ui_kit_example/cards/cards.dart'; import 'package:wyatt_ui_kit_example/demo_page.dart'; @@ -28,6 +29,7 @@ class _HomeState extends State { Loaders(), RichTextBuilders(), TextInputs(), + Bars(), ]; int currentIndex = 0; diff --git a/packages/wyatt_ui_kit/example/lib/theme/themes.dart b/packages/wyatt_ui_kit/example/lib/theme/themes.dart index 6bb52867..e36014d6 100644 --- a/packages/wyatt_ui_kit/example/lib/theme/themes.dart +++ b/packages/wyatt_ui_kit/example/lib/theme/themes.dart @@ -25,6 +25,7 @@ import 'package:wyatt_ui_kit_example/theme/rich_text_builder_theme.dart'; import 'package:wyatt_ui_kit_example/theme/simple_icon_button_theme.dart'; import 'package:wyatt_ui_kit_example/theme/symbol_button_theme.dart'; import 'package:wyatt_ui_kit_example/theme/text_input_theme.dart'; +import 'package:wyatt_ui_kit_example/theme/top_app_bar_theme.dart'; /// Easely switch between Material and Studio themes. abstract class Themes { @@ -92,6 +93,7 @@ abstract class Themes { // Rich Text RichTextBuilderTheme.light(), TextInputTheme.light(), + TopAppBarTheme.light(), ], ); @@ -124,6 +126,7 @@ abstract class Themes { // Rich Text RichTextBuilderTheme.dark(), TextInputTheme.dark(), + TopAppBarTheme.dark(), ], ); } diff --git a/packages/wyatt_ui_kit/example/lib/theme/top_app_bar_theme.dart b/packages/wyatt_ui_kit/example/lib/theme/top_app_bar_theme.dart new file mode 100644 index 00000000..8be94e42 --- /dev/null +++ b/packages/wyatt_ui_kit/example/lib/theme/top_app_bar_theme.dart @@ -0,0 +1,71 @@ +import 'package:flutter/material.dart'; +import 'package:google_fonts/google_fonts.dart'; +import 'package:wyatt_ui_components/wyatt_wyatt_ui_components.dart'; +import 'package:wyatt_ui_kit/wyatt_ui_kit.dart'; + +class TopAppBarTheme extends TopAppBarThemeExtension { + const TopAppBarTheme({ + super.iconTheme, + super.backgroundColors, + super.expandedDividerStyle, + super.titleStyle, + }); + + factory TopAppBarTheme.light() => TopAppBarTheme( + backgroundColors: const MultiColor.single( + Color.fromRGBO(246, 246, 246, 1), + ), + expandedDividerStyle: Colors.black.withOpacity(0.1), + titleStyle: GoogleFonts.montserrat( + fontWeight: FontWeight.bold, + fontSize: 18, + ), + iconTheme: const IconThemeData(color: Colors.black), + ); + + factory TopAppBarTheme.dark() => TopAppBarTheme( + backgroundColors: const MultiColor([ + Color.fromRGBO(44, 50, 56, 1), + Color.fromRGBO(39, 47, 61, 1), + Color.fromRGBO(44, 50, 56, 1), + ]), + expandedDividerStyle: Colors.white.withOpacity(0.1), + titleStyle: GoogleFonts.montserrat( + fontWeight: FontWeight.bold, + fontSize: 18, + ), + iconTheme: const IconThemeData(color: Colors.white), + ); + + @override + ThemeExtension copyWith({ + IconThemeData? iconTheme, + MultiColor? backgroundColors, + Color? expandedDividerStyle, + TextStyle? titleStyle, + }) => + TopAppBarTheme( + iconTheme: iconTheme ?? this.iconTheme, + backgroundColors: backgroundColors ?? this.backgroundColors, + expandedDividerStyle: expandedDividerStyle ?? this.expandedDividerStyle, + titleStyle: titleStyle ?? this.titleStyle, + ); + + @override + ThemeExtension lerp( + covariant ThemeExtension? other, + double t, + ) { + if (other is! TopAppBarTheme) { + return this; + } + return TopAppBarTheme( + iconTheme: IconThemeData.lerp(iconTheme, other.iconTheme, t), + backgroundColors: + MultiColor.lerp(backgroundColors, other.backgroundColors, t), + expandedDividerStyle: + Color.lerp(expandedDividerStyle, other.expandedDividerStyle, t), + titleStyle: TextStyle.lerp(titleStyle, other.titleStyle, t), + ); + } +} diff --git a/packages/wyatt_ui_kit/lib/src/components/app_bars/app_bars.dart b/packages/wyatt_ui_kit/lib/src/components/app_bars/app_bars.dart new file mode 100644 index 00000000..a7a986ee --- /dev/null +++ b/packages/wyatt_ui_kit/lib/src/components/app_bars/app_bars.dart @@ -0,0 +1,17 @@ +// Copyright (C) 2023 WYATT GROUP +// Please see the AUTHORS file for details. +// +// super program is free software: you can redistribute it and/or modify +// it under the terms of the GNU General Public License as published by +// the Free Software Foundation, either version 3 of the License, or +// any later version. +// +// super program is distributed in the hope that it will be useful, +// but WITHOUT ANY WARRANTY; without even the implied warranty of +// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the +// GNU General Public License for more details. +// +// You should have received a copy of the GNU General Public License +// along with super program. If not, see . + +export 'top_app_bar.dart'; diff --git a/packages/wyatt_ui_kit/lib/src/components/app_bars/top_app_bar.dart b/packages/wyatt_ui_kit/lib/src/components/app_bars/top_app_bar.dart new file mode 100644 index 00000000..d8f433d9 --- /dev/null +++ b/packages/wyatt_ui_kit/lib/src/components/app_bars/top_app_bar.dart @@ -0,0 +1,139 @@ +// Copyright (C) 2023 WYATT GROUP +// Please see the AUTHORS file for details. +// +// super program is free software: you can redistribute it and/or modify +// it under the terms of the GNU General Public License as published by +// the Free Software Foundation, either version 3 of the License, or +// any later version. +// +// super program is distributed in the hope that it will be useful, +// but WITHOUT ANY WARRANTY; without even the implied warranty of +// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the +// GNU General Public License for more details. +// +// You should have received a copy of the GNU General Public License +// along with super program. If not, see . + +import 'package:flutter/material.dart'; +import 'package:flutter/services.dart'; +import 'package:wyatt_component_copy_with_extension/component_copy_with_extension.dart'; +import 'package:wyatt_ui_components/wyatt_wyatt_ui_components.dart'; +import 'package:wyatt_ui_kit/wyatt_ui_kit.dart'; +part 'top_app_bar.g.dart'; + +@ComponentCopyWithExtension() +class TopAppBar extends AppBarComponent with $TopAppBarCWMixin { + const TopAppBar({ + super.systemOverlayStyle, + super.automaticallyImplyLeading, + super.flexibleSpace, + super.bottom, + super.elevation, + super.scrolledUnderElevation, + super.shadowColor, + super.surfaceTintColor, + super.backgroundColor, + super.iconTheme, + super.primary, + super.excludeHeaderSemantics, + super.toolbarHeight, + super.leadingWidth, + super.title, + super.leading, + super.actions, + super.centerTitle, + super.shape, + super.expandedWidget, + super.key, + }); + + @override + Widget build(BuildContext context) => DecoratedBox( + decoration: BoxDecoration( + gradient: ThemeHelper.getThemeElement( + [ + backgroundColor, + context + .themeExtension() + ?.backgroundColors, + ], + valueValidator: (value) => value?.isGradient, + transform: (value) => + LinearGradientHelper.fromNullableColors(value?.colors), + defaultValue: null, + ), + color: ThemeHelper.getThemeElement( + [ + backgroundColor, + context + .themeExtension() + ?.backgroundColors, + ], + valueValidator: (value) => value?.isColor, + transform: (value) => value?.color, + defaultValue: Theme.of(context).appBarTheme.backgroundColor, + ), + ), + child: Column( + children: [ + AppBar( + titleSpacing: 0, + backgroundColor: Colors.transparent, + systemOverlayStyle: systemOverlayStyle, + automaticallyImplyLeading: automaticallyImplyLeading ?? true, + flexibleSpace: flexibleSpace, + bottom: bottom, + elevation: elevation ?? 0, + scrolledUnderElevation: scrolledUnderElevation, + shadowColor: shadowColor, + surfaceTintColor: surfaceTintColor, + iconTheme: + ThemeHelper.getThemeElement( + [ + iconTheme, + context.themeExtension()?.iconTheme, + ], + valueValidator: (value) => value != null, + transform: (value) => value, + defaultValue: Theme.of(context).iconTheme, + ), + primary: primary ?? true, + excludeHeaderSemantics: excludeHeaderSemantics ?? false, + leadingWidth: leadingWidth, + title: Text( + title?.data ?? '', + style: ThemeHelper.getThemeElement( + [ + title?.style, + context + .themeExtension() + ?.titleStyle + ], + valueValidator: (value) => value != null, + transform: (value) => value, + defaultValue: context.textTheme.titleLarge, + ), + ).toGradient(gradientColors: title?.gradientColors), + leading: leading, + actions: actions, + centerTitle: centerTitle ?? false, + ), + if (expandedWidget != null) + ...ListTile.divideTiles( + color: ThemeHelper.getThemeElement( + [ + context + .themeExtension() + ?.expandedDividerStyle, + ], + valueValidator: (value) => value != null, + transform: (value) => value, + defaultValue: Theme.of(context).dividerColor, + ), + context: context, + tiles: expandedWidget!, + ), + ], + ), + ); +} diff --git a/packages/wyatt_ui_kit/lib/src/components/app_bars/top_app_bar.g.dart b/packages/wyatt_ui_kit/lib/src/components/app_bars/top_app_bar.g.dart new file mode 100644 index 00000000..88c9e759 --- /dev/null +++ b/packages/wyatt_ui_kit/lib/src/components/app_bars/top_app_bar.g.dart @@ -0,0 +1,119 @@ +// GENERATED CODE - DO NOT MODIFY BY HAND + +part of 'top_app_bar.dart'; + +// ************************************************************************** +// ComponentCopyWithGenerator +// ************************************************************************** + +class $TopAppBarCWProxyImpl implements $AppBarComponentCWProxy { + const $TopAppBarCWProxyImpl(this._value); + final TopAppBar _value; + @override + TopAppBar shape(ShapeBorder? shape) => this(shape: shape); + @override + TopAppBar systemOverlayStyle(SystemUiOverlayStyle? systemOverlayStyle) => + this(systemOverlayStyle: systemOverlayStyle); + @override + TopAppBar automaticallyImplyLeading(bool? automaticallyImplyLeading) => + this(automaticallyImplyLeading: automaticallyImplyLeading); + @override + TopAppBar flexibleSpace(Widget? flexibleSpace) => + this(flexibleSpace: flexibleSpace); + @override + TopAppBar bottom(PreferredSizeWidget? bottom) => this(bottom: bottom); + @override + TopAppBar elevation(double? elevation) => this(elevation: elevation); + @override + TopAppBar scrolledUnderElevation(double? scrolledUnderElevation) => + this(scrolledUnderElevation: scrolledUnderElevation); + @override + TopAppBar shadowColor(Color? shadowColor) => this(shadowColor: shadowColor); + @override + TopAppBar surfaceTintColor(Color? surfaceTintColor) => + this(surfaceTintColor: surfaceTintColor); + @override + TopAppBar backgroundColor(MultiColor? backgroundColor) => + this(backgroundColor: backgroundColor); + @override + TopAppBar iconTheme(IconThemeData? iconTheme) => this(iconTheme: iconTheme); + @override + TopAppBar primary(bool? primary) => this(primary: primary); + @override + TopAppBar excludeHeaderSemantics(bool? excludeHeaderSemantics) => + this(excludeHeaderSemantics: excludeHeaderSemantics); + @override + TopAppBar toolbarHeight(double? toolbarHeight) => + this(toolbarHeight: toolbarHeight); + @override + TopAppBar leadingWidth(double? leadingWidth) => + this(leadingWidth: leadingWidth); + @override + TopAppBar title(TextWrapper? title) => this(title: title); + @override + TopAppBar leading(Widget? leading) => this(leading: leading); + @override + TopAppBar actions(List? actions) => this(actions: actions); + @override + TopAppBar centerTitle(bool? centerTitle) => this(centerTitle: centerTitle); + @override + TopAppBar expandedWidget(List? expandedWidget) => + this(expandedWidget: expandedWidget); + @override + TopAppBar key(Key? key) => this(key: key); + @override + TopAppBar call({ + ShapeBorder? shape, + SystemUiOverlayStyle? systemOverlayStyle, + bool? automaticallyImplyLeading, + Widget? flexibleSpace, + PreferredSizeWidget? bottom, + double? elevation, + double? scrolledUnderElevation, + Color? shadowColor, + Color? surfaceTintColor, + MultiColor? backgroundColor, + IconThemeData? iconTheme, + bool? primary, + bool? excludeHeaderSemantics, + double? toolbarHeight, + double? leadingWidth, + TextWrapper? title, + Widget? leading, + List? actions, + bool? centerTitle, + List? expandedWidget, + Key? key, + }) => + TopAppBar( + systemOverlayStyle: systemOverlayStyle ?? _value.systemOverlayStyle, + automaticallyImplyLeading: + automaticallyImplyLeading ?? _value.automaticallyImplyLeading, + flexibleSpace: flexibleSpace ?? _value.flexibleSpace, + bottom: bottom ?? _value.bottom, + elevation: elevation ?? _value.elevation, + scrolledUnderElevation: + scrolledUnderElevation ?? _value.scrolledUnderElevation, + shadowColor: shadowColor ?? _value.shadowColor, + surfaceTintColor: surfaceTintColor ?? _value.surfaceTintColor, + backgroundColor: backgroundColor ?? _value.backgroundColor, + iconTheme: iconTheme ?? _value.iconTheme, + primary: primary ?? _value.primary, + excludeHeaderSemantics: + excludeHeaderSemantics ?? _value.excludeHeaderSemantics, + toolbarHeight: toolbarHeight ?? _value.toolbarHeight, + leadingWidth: leadingWidth ?? _value.leadingWidth, + title: title ?? _value.title, + leading: leading ?? _value.leading, + actions: actions ?? _value.actions, + centerTitle: centerTitle ?? _value.centerTitle, + shape: shape ?? _value.shape, + expandedWidget: expandedWidget ?? _value.expandedWidget, + key: key ?? _value.key, + ); +} + +mixin $TopAppBarCWMixin on Component { + $AppBarComponentCWProxy get copyWith => + $TopAppBarCWProxyImpl(this as TopAppBar); +} diff --git a/packages/wyatt_ui_kit/lib/src/components/components.dart b/packages/wyatt_ui_kit/lib/src/components/components.dart index 34d4753d..9b4c399c 100644 --- a/packages/wyatt_ui_kit/lib/src/components/components.dart +++ b/packages/wyatt_ui_kit/lib/src/components/components.dart @@ -14,6 +14,7 @@ // You should have received a copy of the GNU General Public License // along with this program. If not, see . +export './app_bars/app_bars.dart'; export './buttons/buttons.dart'; export './cards/cards.dart'; export './gradients/gradients.dart'; diff --git a/packages/wyatt_ui_kit/lib/src/components/top_navigation_bars/top_navigation_bar.dart b/packages/wyatt_ui_kit/lib/src/components/top_navigation_bars/top_navigation_bar.dart new file mode 100644 index 00000000..d236b884 --- /dev/null +++ b/packages/wyatt_ui_kit/lib/src/components/top_navigation_bars/top_navigation_bar.dart @@ -0,0 +1,35 @@ +// Copyright (C) 2023 WYATT GROUP +// Please see the AUTHORS file for details. +// +// This program is free software: you can redistribute it and/or modify +// it under the terms of the GNU General Public License as published by +// the Free Software Foundation, either version 3 of the License, or +// any later version. +// +// This program is distributed in the hope that it will be useful, +// but WITHOUT ANY WARRANTY; without even the implied warranty of +// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the +// GNU General Public License for more details. +// +// You should have received a copy of the GNU General Public License +// along with this program. If not, see . + +import 'package:flutter/material.dart'; +import 'package:wyatt_component_copy_with_extension/component_copy_with_extension.dart'; +import 'package:wyatt_ui_components/wyatt_wyatt_ui_components.dart'; +part 'top_navigation_bar.g.dart'; + +@ComponentCopyWithExtension() +class TopNavigationBar extends TopNavigationBarComponent + with $TopNavigationBarCWMixin { + const TopNavigationBar({ + super.leading, + super.actions, + super.onTap, + super.currentIndex = 0, + super.key, + }); + + @override + Widget build(BuildContext context) => const Placeholder(); +} diff --git a/packages/wyatt_ui_kit/lib/src/components/top_navigation_bars/top_navigation_bar.g.dart b/packages/wyatt_ui_kit/lib/src/components/top_navigation_bars/top_navigation_bar.g.dart new file mode 100644 index 00000000..ba8e5a42 --- /dev/null +++ b/packages/wyatt_ui_kit/lib/src/components/top_navigation_bars/top_navigation_bar.g.dart @@ -0,0 +1,45 @@ +// GENERATED CODE - DO NOT MODIFY BY HAND + +part of 'top_navigation_bar.dart'; + +// ************************************************************************** +// ComponentCopyWithGenerator +// ************************************************************************** + +class $TopNavigationBarCWProxyImpl + implements $TopNavigationBarComponentCWProxy { + const $TopNavigationBarCWProxyImpl(this._value); + final TopNavigationBar _value; + @override + TopNavigationBar leading(Widget? leading) => this(leading: leading); + @override + TopNavigationBar actions(List? actions) => this(actions: actions); + @override + TopNavigationBar onTap(void Function(BuildContext, int)? onTap) => + this(onTap: onTap); + @override + TopNavigationBar currentIndex(int? currentIndex) => + this(currentIndex: currentIndex); + @override + TopNavigationBar key(Key? key) => this(key: key); + @override + TopNavigationBar call({ + Widget? leading, + List? actions, + void Function(BuildContext, int)? onTap, + int? currentIndex, + Key? key, + }) => + TopNavigationBar( + leading: leading ?? _value.leading, + actions: actions ?? _value.actions, + onTap: onTap ?? _value.onTap, + currentIndex: currentIndex ?? _value.currentIndex, + key: key ?? _value.key, + ); +} + +mixin $TopNavigationBarCWMixin on Component { + $TopNavigationBarComponentCWProxy get copyWith => + $TopNavigationBarCWProxyImpl(this as TopNavigationBar); +} diff --git a/packages/wyatt_ui_kit/lib/src/domain/domain.dart b/packages/wyatt_ui_kit/lib/src/domain/domain.dart index 6cf19139..8433530b 100644 --- a/packages/wyatt_ui_kit/lib/src/domain/domain.dart +++ b/packages/wyatt_ui_kit/lib/src/domain/domain.dart @@ -19,3 +19,4 @@ export './card_theme_extension.dart'; export './loader_theme_extension.dart'; export './rich_text_builder_theme_extension.dart'; export './text_input_theme_extension.dart'; +export './top_app_bar_extension.dart'; diff --git a/packages/wyatt_ui_kit/lib/src/domain/top_app_bar_extension.dart b/packages/wyatt_ui_kit/lib/src/domain/top_app_bar_extension.dart new file mode 100644 index 00000000..ea6718bb --- /dev/null +++ b/packages/wyatt_ui_kit/lib/src/domain/top_app_bar_extension.dart @@ -0,0 +1,34 @@ +// Copyright (C) 2023 WYATT GROUP +// Please see the AUTHORS file for details. +// +// This program is free software: you can redistribute it and/or modify +// it under the terms of the GNU General Public License as published by +// the Free Software Foundation, either version 3 of the License, or +// any later version. +// +// This program is distributed in the hope that it will be useful, +// but WITHOUT ANY WARRANTY; without even the implied warranty of +// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the +// GNU General Public License for more details. +// +// You should have received a copy of the GNU General Public License +// along with this program. If not, see . + +import 'package:flutter/material.dart'; +import 'package:wyatt_ui_components/wyatt_wyatt_ui_components.dart'; + +abstract class TopAppBarThemeExtension + extends ThemeExtension { + const TopAppBarThemeExtension({ + this.iconTheme, + this.backgroundColors, + this.expandedDividerStyle, + this.titleStyle, + }); + + final MultiColor? backgroundColors; + final IconThemeData? iconTheme; + final Color? expandedDividerStyle; + + final TextStyle? titleStyle; +}