MarianumMobile/Client
MarianumMobile/Client
5
1
Fork 0
Code Issues34 Pull Requests Actions Packages Projects1 Releases Wiki Activity

WIP state management loadable errorbar

Browse Source
This commit is contained in:
Elias Müller 2024-04-23 14:48:12 +02:00
parent 7129c0dee8
commit 450c26b187
4 changed files with 73 additions and 21 deletions
lib
state
app/application/marianumMessage
marianum_message_controller.dart
infrastructure
loadable_state.dart
widgets
loadable_controller_consumer.dart
view/pages/more
test.dart

2
lib/state/app/application/marianumMessage/marianum_message_controller.dart

@ -19,6 +19,6 @@ class MarianumMessageController extends Controller<LoadableState<MarianumMessage
}
void error() {
emit(state.error(state: const MarianumMessageState(test: [])));
}
}

10
lib/state/infrastructure/loadable_state.dart

@ -14,14 +14,20 @@ class LoadableState<TState> {
LoadableState<TState> done(TState state) =>
LoadableState<TState>(loadingState: LoadingState.none, data: state);
LoadableState<TState> error(TState state) =>
LoadableState<TState>(loadingState: LoadingState.none, data: state);
LoadableState<TState> error({TState? state}) =>
LoadableState<TState>(loadingState: LoadingState.failed, data: state);
bool isBackgroundLoading() =>
loadingState == LoadingState.loading && data != null;
bool hasError() =>
loadingState == LoadingState.failed;
bool hasStateData() =>
data != null;
bool errorBarVisible() =>
hasError() && hasStateData();
}
enum LoadingState {

72
lib/state/widgets/loadable_controller_consumer.dart

@ -5,35 +5,77 @@ import '../infrastructure/loadable_state.dart';
import '../infrastructure/state_extensions.dart';
class LoadableControllerConsumer<TController extends Controller<TState>, TState extends LoadableState> extends StatelessWidget {
final Widget Function(BuildContext context, TState state) child;
final Widget child;
const LoadableControllerConsumer({required this.child, super.key});
final Duration animationDuration = const Duration(milliseconds: 200);
@override
Widget build(BuildContext context) {
var state = context.readController<TController>().state;
return Stack(
var loadableContent = Stack(
children: [
if(!state.hasStateData()) const Center(child: CircularProgressIndicator()),
AnimatedOpacity(
opacity: !state.hasStateData() ? 1.0 : 0.0,
duration: animationDuration,
curve: Curves.easeInOut,
child: const Center(child: CircularProgressIndicator()),
),
AnimatedSwitcher(
duration: const Duration(milliseconds: 100),
duration: animationDuration,
transitionBuilder: (Widget child, Animation<double> animation) => SlideTransition(
position: Tween<Offset>(
begin: const Offset(0.0, -1.0),
end: Offset.zero,
).animate(animation),
child: child,
),
child: state.isBackgroundLoading() ? const LinearProgressIndicator() : const SizedBox.shrink(),
position: Tween<Offset>(
begin: const Offset(0.0, -1.0),
end: Offset.zero,
).animate(animation),
child: child,
),
child: state.isBackgroundLoading() && !state.errorBarVisible() ? const LinearProgressIndicator() : const SizedBox.shrink(),
),
AnimatedOpacity(
opacity: state.hasStateData() ? 1.0 : 0.0,
duration: const Duration(milliseconds: 100),
curve: Curves.easeInOut,
child: state.hasStateData() ? child(context, state) : const SizedBox.shrink()
opacity: state.hasStateData() ? 1.0 : 0.0,
duration: animationDuration,
curve: Curves.easeInOut,
child: state.hasStateData() ? child : const SizedBox.shrink()
),
],
);
var errorBar = AnimatedSwitcher(
duration: animationDuration,
transitionBuilder: (Widget child, Animation<double> animation) => SlideTransition(
position: Tween<Offset>(
begin: const Offset(0.0, -1.0),
end: Offset.zero,
).animate(animation),
child: child,
),
child: !state.errorBarVisible()
? const SizedBox.shrink()
: Container(
height: 20,
decoration: const BoxDecoration(
color: Colors.red,
),
child: const Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Icon(Icons.wifi_find_outlined, size: 12),
SizedBox(width: 10),
Text('Keine Verbindung', style: TextStyle(fontSize: 12))
],
),
),
);
return Column(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisSize: MainAxisSize.max,
children: [errorBar, loadableContent],
);
}
}

10
lib/view/pages/more/test.dart

@ -15,13 +15,13 @@ class Test extends StatelessWidget {
Widget build(BuildContext context) => ControllerProvider<MarianumMessageController>(
create: (context) => MarianumMessageController(),
child: (context) => Scaffold(
appBar: AppBar(title: const Text("TEST")),
appBar: AppBar(title: const Text('TEST')),
body: LoadableControllerConsumer<MarianumMessageController, LoadableState<MarianumMessageState>>(
child: (context, data) => Column(
child: Column(
children: [
TextButton(
onPressed: () => context.readController<MarianumMessageController>().loading(),
child: Text(data.loadingState.toString())
child: Text(context.watchController<MarianumMessageController>().state.loadingState.toString())
),
TextButton(
onPressed: () => context.readController<MarianumMessageController>().backgroundLoading(),
@ -31,6 +31,10 @@ class Test extends StatelessWidget {
onPressed: () => context.readController<MarianumMessageController>().done(),
child: Text(context.watchController<MarianumMessageController>().state.loadingState.toString())
),
TextButton(
onPressed: () => context.readController<MarianumMessageController>().error(),
child: Text(context.watchController<MarianumMessageController>().state.loadingState.toString())
),
ControllerConsumer<MarianumMessageController, LoadableState<MarianumMessageState>>(child: (context, state) => Text(state.data!.test.toString())),
SubSelectedControllerConsumer<MarianumMessageController, LoadableState<MarianumMessageState>, LoadingState>(
subselect: (state) => state.loadingState,