feat(ui_layout): add loading & error widget to component theme (close #69) #70

Merged
hugo merged 2 commits from feat/ui-component/error-loading-widgets into master 2022-12-07 23:57:28 +00:00
9 changed files with 161 additions and 16 deletions
Showing only changes of commit d792f4cbe9 - Show all commits

View File

@ -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(),
);
}

View File

@ -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,
);
}

View File

@ -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,
);
}

View File

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

View File

@ -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,
);
}

View File

@ -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,
);
}

View File

@ -2,4 +2,6 @@ import 'package:flutter/material.dart';
abstract class Component extends StatelessWidget { abstract class Component extends StatelessWidget {
const Component({super.key}); const Component({super.key});
Component configure();
} }

View File

@ -21,6 +21,7 @@ abstract class AppBarComponent extends Component {
final String? title; final String? title;
const AppBarComponent({this.title, super.key}); const AppBarComponent({this.title, super.key});
@override
AppBarComponent configure({String? title}); AppBarComponent configure({String? title});
} }
@ -33,17 +34,25 @@ abstract class BottomNavigationBarComponent extends Component {
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 ErrorWidget extends Component { abstract class ErrorWidgetComponent extends Component {
final String error; final String? error;
const ErrorWidget({required this.error, super.key}); const ErrorWidgetComponent({required this.error, super.key});
@override
ErrorWidgetComponent configure({String? error});
} }
abstract class LoadingWidget extends Component { abstract class LoadingWidgetComponent extends Component {
const LoadingWidget({super.key}); final Color? color;
const LoadingWidgetComponent({required this.color, super.key});
@override
LoadingWidgetComponent configure({Color? color});
} }

View File

@ -19,8 +19,8 @@ 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 ErrorWidget errorWidget; final ErrorWidgetComponent errorWidget;
final LoadingWidget loadingWidget; final LoadingWidgetComponent loadingWidget;
const ComponentThemeData.raw({ const ComponentThemeData.raw({
required this.appBar, required this.appBar,