diff --git a/lib/src/auth_screen.dart b/lib/src/auth_screen.dart index 9accb86..a889e11 100644 --- a/lib/src/auth_screen.dart +++ b/lib/src/auth_screen.dart @@ -1,6 +1,5 @@ import 'dart:collection'; import 'package:flutter/material.dart'; -import 'package:flutter_registration/src/model/auth_action.dart'; import 'package:flutter_registration/src/model/auth_field.dart'; import 'package:flutter_registration/src/model/auth_step.dart'; @@ -10,7 +9,6 @@ class AuthScreen extends StatefulWidget { required this.steps, required this.submitBtnTitle, required this.onFinish, - this.actions, super.key, }) : assert(steps.length > 0, 'At least one step is required'); @@ -18,15 +16,16 @@ class AuthScreen extends StatefulWidget { final Function(HashMap) onFinish; final List steps; final String submitBtnTitle; - final List? actions; @override State createState() => _AuthScreenState(); } class _AuthScreenState extends State { - int _index = 0; final _formKey = GlobalKey(); + final _pageController = PageController(); + final _animationDuration = const Duration(milliseconds: 300); + final _animationCurve = Curves.ease; @override Widget build(BuildContext context) { @@ -37,89 +36,117 @@ class _AuthScreenState extends State { ), body: Form( key: _formKey, - child: Column( - mainAxisAlignment: MainAxisAlignment.spaceBetween, - children: [ - const Spacer(), - Padding( - padding: const EdgeInsets.symmetric( - vertical: 8.0, - horizontal: 30.0, - ), - child: Column( + child: PageView( + physics: const NeverScrollableScrollPhysics(), + controller: _pageController, + children: [ + for (AuthStep step in widget.steps) + Column( + mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ - Column( - children: [ - for (AuthField field in widget.steps[_index].fields) - Column( - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - Padding( - padding: const EdgeInsets.only( - top: 24.0, - bottom: 12.0, - ), - child: Text( - field.title, - style: const TextStyle( - fontWeight: FontWeight.bold, + const Spacer(), + Padding( + padding: const EdgeInsets.symmetric( + vertical: 8.0, + horizontal: 30.0, + ), + child: Column( + children: [ + for (AuthField field in step.fields) + Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Padding( + padding: const EdgeInsets.only( + top: 24.0, + bottom: 12.0, + ), + child: Text( + field.title, + style: const TextStyle( + fontWeight: FontWeight.bold, + ), ), ), + field.build(), + ], + ) + ], + ), + ), + const Spacer(), + Padding( + padding: const EdgeInsets.all(30.0), + child: Row( + mainAxisAlignment: widget.steps.first != step + ? MainAxisAlignment.spaceBetween + : MainAxisAlignment.end, + children: [ + if (widget.steps.first != step) + ElevatedButton( + onPressed: () => _pageController.previousPage( + duration: _animationDuration, + curve: _animationCurve, ), - field.build(), - ], - ) - ], + child: Row( + children: [ + const Icon( + Icons.arrow_back, + size: 18, + ), + const Padding( + padding: EdgeInsets.only(left: 4.0), + child: Text('Vorige stap'), + ), + ], + ), + ), + ElevatedButton( + onPressed: () { + if (!_formKey.currentState!.validate()) { + return; + } + + if (widget.steps.last == step) { + var values = HashMap(); + + for (var step in widget.steps) { + for (var field in step.fields) { + values[field.name] = field.value; + } + } + + widget.onFinish(values); + return; + } + + _pageController.nextPage( + duration: _animationDuration, + curve: _animationCurve, + ); + }, + child: Row( + children: [ + Text( + widget.steps.last == step + ? widget.submitBtnTitle + : 'Volgende stap', + ), + const Padding( + padding: EdgeInsets.only(left: 4.0), + child: Icon( + Icons.arrow_forward, + size: 18, + ), + ), + ], + ), + ), + ], + ), ) ], ), - ), - const Spacer(), - Padding( - padding: const EdgeInsets.all(30.0), - child: Column( - children: [ - ElevatedButton( - style: ElevatedButton.styleFrom( - minimumSize: const Size.fromHeight(50), - ), - onPressed: () { - if (!_formKey.currentState!.validate()) { - return; - } - if (widget.steps.length > _index + 1) { - setState(() { - _index++; - }); - } else { - var values = HashMap(); - - for (var step in widget.steps) { - for (var field in step.fields) { - values[field.name] = field.value; - } - } - - widget.onFinish(values); - } - }, - child: Text( - widget.steps.length > _index + 1 - ? 'Volgende stap' - : widget.submitBtnTitle, - ), - ), - for (AuthAction action in widget.actions ?? []) - TextButton( - style: ElevatedButton.styleFrom( - minimumSize: const Size.fromHeight(40), - ), - onPressed: action.onPress, - child: Text(action.title), - ), - ], - ), - ) ], ), ), diff --git a/lib/src/registration_screen.dart b/lib/src/registration_screen.dart index 3db7a89..37e5de2 100644 --- a/lib/src/registration_screen.dart +++ b/lib/src/registration_screen.dart @@ -55,11 +55,11 @@ class RegistrationScreen extends StatelessWidget { (email) => (email == null || email.isEmpty) ? 'Geef uw e-mailadres op' : null, - (email) => RegExp( - r'^.+@[a-zA-Z]+\.{1}[a-zA-Z]+(\.{0,1}[a-zA-Z]+)$', - ).hasMatch(email!) - ? 'Geef een geldig e-mailadres op' - : null, + (email) => + RegExp(r"^[a-zA-Z0-9.a-zA-Z0-9.!#$%&'*+-/=?^_`{|}~]+@[a-zA-Z0-9]+\.[a-zA-Z]+") + .hasMatch(email!) + ? null + : 'Geef een geldig e-mailadres op', ], ) ],