feat(ui_layout): add loading & error widget to component theme (close #69) #70
| @ -0,0 +1,14 @@ | |||||||
|  | import 'package:wyatt_ui_components/wyatt_wyatt_ui_components.dart'; | ||||||
|  | import 'package:wyatt_ui_components_example/components/custom_app_bar.dart'; | ||||||
|  | import 'package:wyatt_ui_components_example/components/custom_bottom_bar.dart'; | ||||||
|  | import 'package:wyatt_ui_components_example/components/custom_error_widget.dart'; | ||||||
|  | import 'package:wyatt_ui_components_example/components/custom_loading_widget.dart'; | ||||||
|  | 
 | ||||||
|  | class AppThemeComponent { | ||||||
|  |   static ComponentThemeData get components => const ComponentThemeData.raw( | ||||||
|  |         appBar: CustomAppBar(), | ||||||
|  |         bottomNavigationBar: CustomBottomNavigationBar(), | ||||||
|  |         errorWidget: CustomErrorWidget(), | ||||||
|  |         loadingWidget: CustomLoadingWidget(), | ||||||
|  |       ); | ||||||
|  | } | ||||||
| @ -0,0 +1,16 @@ | |||||||
|  | import 'package:flutter/material.dart'; | ||||||
|  | import 'package:wyatt_ui_components/wyatt_wyatt_ui_components.dart'; | ||||||
|  | 
 | ||||||
|  | class CustomAppBar extends AppBarComponent { | ||||||
|  |   const CustomAppBar({super.title, super.key}); | ||||||
|  | 
 | ||||||
|  |   @override | ||||||
|  |   Widget build(BuildContext context) => AppBar( | ||||||
|  |         title: Text(super.title ?? ''), | ||||||
|  |       ); | ||||||
|  | 
 | ||||||
|  |   @override | ||||||
|  |   AppBarComponent configure({String? title}) => CustomAppBar( | ||||||
|  |         title: title ?? this.title, | ||||||
|  |       ); | ||||||
|  | } | ||||||
| @ -0,0 +1,40 @@ | |||||||
|  | import 'package:flutter/material.dart'; | ||||||
|  | import 'package:wyatt_ui_components/wyatt_wyatt_ui_components.dart'; | ||||||
|  | 
 | ||||||
|  | class CustomBottomNavigationBar extends BottomNavigationBarComponent { | ||||||
|  |   const CustomBottomNavigationBar({ | ||||||
|  |     super.currentIndex, | ||||||
|  |     super.onTap, | ||||||
|  |     super.key, | ||||||
|  |   }); | ||||||
|  | 
 | ||||||
|  |   @override | ||||||
|  |   Widget build(BuildContext context) => BottomNavigationBar( | ||||||
|  |         currentIndex: currentIndex, | ||||||
|  |         onTap: (index) => super.onTap?.call(context, index), | ||||||
|  |         items: const [ | ||||||
|  |           BottomNavigationBarItem( | ||||||
|  |             label: 'Icon 1', | ||||||
|  |             icon: Icon( | ||||||
|  |               Icons.nearby_off, | ||||||
|  |             ), | ||||||
|  |           ), | ||||||
|  |           BottomNavigationBarItem( | ||||||
|  |             label: 'Icon 2', | ||||||
|  |             icon: Icon( | ||||||
|  |               Icons.dangerous, | ||||||
|  |             ), | ||||||
|  |           ), | ||||||
|  |         ], | ||||||
|  |       ); | ||||||
|  | 
 | ||||||
|  |   @override | ||||||
|  |   CustomBottomNavigationBar configure({ | ||||||
|  |     void Function(BuildContext, int)? onTap, | ||||||
|  |     int currentIndex = 0, | ||||||
|  |   }) => | ||||||
|  |       CustomBottomNavigationBar( | ||||||
|  |         onTap: onTap ?? this.onTap, | ||||||
|  |         currentIndex: currentIndex, | ||||||
|  |       ); | ||||||
|  | } | ||||||
| @ -0,0 +1,16 @@ | |||||||
|  | import 'package:flutter/material.dart'; | ||||||
|  | import 'package:wyatt_ui_components/wyatt_wyatt_ui_components.dart'; | ||||||
|  | 
 | ||||||
|  | class CustomErrorWidget extends ErrorWidgetComponent { | ||||||
|  |   const CustomErrorWidget({super.error, super.key}); | ||||||
|  | 
 | ||||||
|  |   @override | ||||||
|  |   Widget build(BuildContext context) => ColoredBox( | ||||||
|  |         color: Colors.red, | ||||||
|  |         child: Center(child: Text(error ?? 'Error')), | ||||||
|  |       ); | ||||||
|  | 
 | ||||||
|  |   @override | ||||||
|  |   ErrorWidgetComponent configure({String? error}) => | ||||||
|  |       CustomErrorWidget(error: error ?? this.error); | ||||||
|  | } | ||||||
| @ -0,0 +1,18 @@ | |||||||
|  | import 'package:flutter/material.dart'; | ||||||
|  | import 'package:wyatt_ui_components/wyatt_wyatt_ui_components.dart'; | ||||||
|  | 
 | ||||||
|  | class CustomLoadingWidget extends LoadingWidgetComponent { | ||||||
|  |   const CustomLoadingWidget({super.color, super.key}); | ||||||
|  | 
 | ||||||
|  |   @override | ||||||
|  |   Widget build(BuildContext context) => Center( | ||||||
|  |         child: CircularProgressIndicator( | ||||||
|  |           color: color, | ||||||
|  |         ), | ||||||
|  |       ); | ||||||
|  | 
 | ||||||
|  |   @override | ||||||
|  |   CustomLoadingWidget configure({Color? color}) => CustomLoadingWidget( | ||||||
|  |         color: color ?? this.color, | ||||||
|  |       ); | ||||||
|  | } | ||||||
| @ -15,6 +15,8 @@ | |||||||
| // along with this program. If not, see <https://www.gnu.org/licenses/>. | // along with this program. If not, see <https://www.gnu.org/licenses/>. | ||||||
| 
 | 
 | ||||||
| import 'package:flutter/material.dart'; | import 'package:flutter/material.dart'; | ||||||
|  | import 'package:wyatt_ui_components/wyatt_wyatt_ui_components.dart'; | ||||||
|  | import 'package:wyatt_ui_components_example/component_theme.dart'; | ||||||
| 
 | 
 | ||||||
| void main() { | void main() { | ||||||
|   runApp(const MyApp()); |   runApp(const MyApp()); | ||||||
| @ -26,17 +28,45 @@ class MyApp extends StatelessWidget { | |||||||
|   // This widget is the root of your application. |   // This widget is the root of your application. | ||||||
|   @override |   @override | ||||||
|   Widget build(BuildContext context) { |   Widget build(BuildContext context) { | ||||||
|     return MaterialApp( |     return ComponentTheme( | ||||||
|       title: 'Wyatt Ui Components Example', |       componentThemeWidget: AppThemeComponent.components, | ||||||
|       theme: ThemeData( |       child: MaterialApp( | ||||||
|         primarySwatch: Colors.blue, |         title: 'Wyatt Ui Components Example', | ||||||
|       ), |         theme: ThemeData( | ||||||
|       home: Scaffold( |           primarySwatch: Colors.blue, | ||||||
|         appBar: AppBar( |         ), | ||||||
|           title: const Text('Wyatt Ui Components Example'), |         home: const Scaffold( | ||||||
|  |           body: Home(), | ||||||
|         ), |         ), | ||||||
|         body: const Center(child: Text('')), |  | ||||||
|       ), |       ), | ||||||
|     ); |     ); | ||||||
|   } |   } | ||||||
| } | } | ||||||
|  | 
 | ||||||
|  | class Home extends StatelessWidget { | ||||||
|  |   const Home({super.key}); | ||||||
|  | 
 | ||||||
|  |   @override | ||||||
|  |   Widget build(BuildContext context) => Scaffold( | ||||||
|  |         appBar: PreferredSize( | ||||||
|  |           preferredSize: const Size.fromHeight(60), | ||||||
|  |           child: context.components.appBar.configure(title: 'Example title'), | ||||||
|  |         ), | ||||||
|  |         body: Column( | ||||||
|  |           children: [ | ||||||
|  |             Expanded( | ||||||
|  |               child: context.components.errorWidget | ||||||
|  |                   .configure(error: 'Example erreur'), | ||||||
|  |             ), | ||||||
|  |             const SizedBox( | ||||||
|  |               height: 10, | ||||||
|  |             ), | ||||||
|  |             Expanded( | ||||||
|  |               child: context.components.loadingWidget | ||||||
|  |                   .configure(color: Colors.green), | ||||||
|  |             ), | ||||||
|  |           ], | ||||||
|  |         ), | ||||||
|  |         bottomNavigationBar: context.components.bottomNavigationBar, | ||||||
|  |       ); | ||||||
|  | } | ||||||
|  | |||||||
| @ -0,0 +1,7 @@ | |||||||
|  | import 'package:flutter/material.dart'; | ||||||
|  | 
 | ||||||
|  | abstract class Component extends StatelessWidget { | ||||||
|  |   const Component({super.key}); | ||||||
|  | 
 | ||||||
|  |   Component configure(); | ||||||
|  | } | ||||||
| @ -15,19 +15,17 @@ | |||||||
| // along with this program. If not, see <https://www.gnu.org/licenses/>. | // along with this program. If not, see <https://www.gnu.org/licenses/>. | ||||||
| 
 | 
 | ||||||
| import 'package:flutter/material.dart'; | import 'package:flutter/material.dart'; | ||||||
|  | import 'package:wyatt_ui_components/src/domain/entities/component.dart'; | ||||||
| 
 | 
 | ||||||
| abstract class AppBarComponent extends PreferredSize { | abstract class AppBarComponent extends Component { | ||||||
|   final String? title; |   final String? title; | ||||||
|   const AppBarComponent({this.title, super.key}) |   const AppBarComponent({this.title, super.key}); | ||||||
|       : super( |  | ||||||
|           preferredSize: const Size.fromHeight(60), |  | ||||||
|           child: const SizedBox.shrink(), |  | ||||||
|         ); |  | ||||||
| 
 | 
 | ||||||
|  |   @override | ||||||
|   AppBarComponent configure({String? title}); |   AppBarComponent configure({String? title}); | ||||||
| } | } | ||||||
| 
 | 
 | ||||||
| abstract class BottomNavigationBarComponent extends StatelessWidget { | abstract class BottomNavigationBarComponent extends Component { | ||||||
|   final int currentIndex; |   final int currentIndex; | ||||||
|   final void Function(BuildContext, int)? onTap; |   final void Function(BuildContext, int)? onTap; | ||||||
|   const BottomNavigationBarComponent({ |   const BottomNavigationBarComponent({ | ||||||
| @ -36,8 +34,25 @@ abstract class BottomNavigationBarComponent extends StatelessWidget { | |||||||
|     super.key, |     super.key, | ||||||
|   }); |   }); | ||||||
| 
 | 
 | ||||||
|  |   @override | ||||||
|   BottomNavigationBarComponent configure({ |   BottomNavigationBarComponent configure({ | ||||||
|     void Function(BuildContext, int)? onTap, |     void Function(BuildContext, int)? onTap, | ||||||
|     int currentIndex = 0, |     int currentIndex = 0, | ||||||
|   }); |   }); | ||||||
| } | } | ||||||
|  | 
 | ||||||
|  | abstract class ErrorWidgetComponent extends Component { | ||||||
|  |   final String? error; | ||||||
|  |   const ErrorWidgetComponent({required this.error, super.key}); | ||||||
|  | 
 | ||||||
|  |   @override | ||||||
|  |   ErrorWidgetComponent configure({String? error}); | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | abstract class LoadingWidgetComponent extends Component { | ||||||
|  |   final Color? color; | ||||||
|  |   const LoadingWidgetComponent({required this.color, super.key}); | ||||||
|  | 
 | ||||||
|  |   @override | ||||||
|  |   LoadingWidgetComponent configure({Color? color}); | ||||||
|  | } | ||||||
|  | |||||||
| @ -19,9 +19,13 @@ import 'package:wyatt_ui_components/src/domain/entities/components.dart'; | |||||||
| class ComponentThemeData { | class ComponentThemeData { | ||||||
|   final AppBarComponent appBar; |   final AppBarComponent appBar; | ||||||
|   final BottomNavigationBarComponent bottomNavigationBar; |   final BottomNavigationBarComponent bottomNavigationBar; | ||||||
|  |   final ErrorWidgetComponent errorWidget; | ||||||
|  |   final LoadingWidgetComponent loadingWidget; | ||||||
| 
 | 
 | ||||||
|   const ComponentThemeData.raw({ |   const ComponentThemeData.raw({ | ||||||
|     required this.appBar, |     required this.appBar, | ||||||
|     required this.bottomNavigationBar, |     required this.bottomNavigationBar, | ||||||
|  |     required this.errorWidget, | ||||||
|  |     required this.loadingWidget, | ||||||
|   }); |   }); | ||||||
| } | } | ||||||
|  | |||||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user