First designs for ui
This commit is contained in:
@@ -6,9 +6,7 @@ import 'package:go_router/go_router.dart';
|
||||
import 'package:fotodocumentation/controller/login_controller.dart';
|
||||
import 'package:fotodocumentation/dto/jwt_token_pair_dto.dart';
|
||||
import 'package:fotodocumentation/l10n/app_localizations.dart';
|
||||
import 'package:fotodocumentation/pages/ui_utils/component/general_submit_widget.dart';
|
||||
import 'package:fotodocumentation/pages/ui_utils/header_utils.dart';
|
||||
import 'package:fotodocumentation/pages/ui_utils/modern_app_bar.dart';
|
||||
import 'package:fotodocumentation/pages/ui_utils/general_style.dart';
|
||||
import 'package:fotodocumentation/utils/di_container.dart';
|
||||
import 'package:fotodocumentation/utils/login_credentials.dart';
|
||||
|
||||
@@ -20,9 +18,9 @@ class LoginWidget extends StatefulWidget {
|
||||
}
|
||||
|
||||
class _LoginWidgetState extends State<LoginWidget> {
|
||||
HeaderUtils get _headerUtils => DiContainer.get();
|
||||
LoginController get _loginController => DiContainer.get();
|
||||
LoginCredentials get _loginCredentials => DiContainer.get();
|
||||
GeneralStyle get _generalStyle => DiContainer.get();
|
||||
|
||||
final GlobalKey<FormState> _formKey = GlobalKey<FormState>();
|
||||
|
||||
@@ -43,26 +41,13 @@ class _LoginWidgetState extends State<LoginWidget> {
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Scaffold(
|
||||
appBar: ModernAppBar(
|
||||
title: _headerUtils.titleWidget("Login title"),
|
||||
actions: [],
|
||||
),
|
||||
body: _body(context),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _body(BuildContext context) {
|
||||
return Container(
|
||||
decoration: BoxDecoration(
|
||||
gradient: LinearGradient(
|
||||
begin: Alignment.topCenter,
|
||||
end: Alignment.bottomCenter,
|
||||
colors: [
|
||||
Colors.grey[50]!,
|
||||
Colors.white,
|
||||
],
|
||||
),
|
||||
),
|
||||
color: _generalStyle.pageBackgroundColor,
|
||||
child: _content(context),
|
||||
);
|
||||
}
|
||||
@@ -81,49 +66,116 @@ class _LoginWidgetState extends State<LoginWidget> {
|
||||
},
|
||||
child: ListView(
|
||||
children: [
|
||||
Card(
|
||||
elevation: 4,
|
||||
margin: EdgeInsets.zero,
|
||||
clipBehavior: Clip.antiAlias,
|
||||
Center(
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(30.0),
|
||||
child: Column(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
TextFormField(
|
||||
key: Key("username"),
|
||||
controller: _usernameController,
|
||||
decoration: InputDecoration(
|
||||
border: UnderlineInputBorder(),
|
||||
labelText: AppLocalizations.of(context)!.loginUsernameTFLabel,
|
||||
),
|
||||
padding: const EdgeInsets.symmetric(vertical: 40.0),
|
||||
child: Image.asset(
|
||||
'assets/images/logo.png',
|
||||
height: 120,
|
||||
),
|
||||
),
|
||||
),
|
||||
Center(
|
||||
child: ConstrainedBox(
|
||||
constraints: const BoxConstraints(maxWidth: 500),
|
||||
child: Card(
|
||||
elevation: 0,
|
||||
margin: EdgeInsets.zero,
|
||||
clipBehavior: Clip.antiAlias,
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(70.0),
|
||||
child: Column(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Center(
|
||||
child: Text(
|
||||
AppLocalizations.of(context)!.loginTitle,
|
||||
style: TextStyle(
|
||||
fontWeight: FontWeight.bold,
|
||||
color: _generalStyle.primaryTextLabelColor,
|
||||
fontFamily: _generalStyle.fontFamily,
|
||||
fontSize: 50,
|
||||
),
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 40),
|
||||
if (_error != null) ...[
|
||||
Center(
|
||||
child: Text(
|
||||
_error!,
|
||||
style: TextStyle(
|
||||
color: _generalStyle.errorColor,
|
||||
fontWeight: FontWeight.bold,
|
||||
fontSize: 16,
|
||||
fontFamily: _generalStyle.fontFamily,
|
||||
),
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 40),
|
||||
],
|
||||
TextFormField(
|
||||
key: Key("username"),
|
||||
controller: _usernameController,
|
||||
decoration: InputDecoration(
|
||||
border: OutlineInputBorder(
|
||||
borderRadius: BorderRadius.circular(8),
|
||||
borderSide: _error != null ? BorderSide(color: _generalStyle.errorColor) : BorderSide(),
|
||||
),
|
||||
enabledBorder: _error != null
|
||||
? OutlineInputBorder(
|
||||
borderRadius: BorderRadius.circular(8),
|
||||
borderSide: BorderSide(color: _generalStyle.errorColor),
|
||||
)
|
||||
: null,
|
||||
labelText: AppLocalizations.of(context)!.loginUsernameTFLabel.toUpperCase(),
|
||||
labelStyle: TextStyle(color: _generalStyle.primaryTextLabelColor, fontFamily: _generalStyle.fontFamily),
|
||||
floatingLabelBehavior: FloatingLabelBehavior.always,
|
||||
contentPadding: const EdgeInsets.symmetric(horizontal: 16, vertical: 12),
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 25),
|
||||
TextFormField(
|
||||
key: Key("password"),
|
||||
controller: _passwordController,
|
||||
obscureText: true,
|
||||
decoration: InputDecoration(
|
||||
border: OutlineInputBorder(
|
||||
borderRadius: BorderRadius.circular(8),
|
||||
borderSide: _error != null ? BorderSide(color: _generalStyle.errorColor) : BorderSide(),
|
||||
),
|
||||
enabledBorder: _error != null
|
||||
? OutlineInputBorder(
|
||||
borderRadius: BorderRadius.circular(8),
|
||||
borderSide: BorderSide(color: _generalStyle.errorColor),
|
||||
)
|
||||
: null,
|
||||
labelText: AppLocalizations.of(context)!.loginPasswordTFLabel.toUpperCase(),
|
||||
labelStyle: TextStyle(color: _generalStyle.primaryTextLabelColor, fontFamily: _generalStyle.fontFamily),
|
||||
floatingLabelBehavior: FloatingLabelBehavior.always,
|
||||
contentPadding: const EdgeInsets.symmetric(horizontal: 16, vertical: 12),
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 25),
|
||||
Center(
|
||||
child: ElevatedButton(
|
||||
key: Key("SubmitWidgetButton"),
|
||||
style: ElevatedButton.styleFrom(
|
||||
backgroundColor: _generalStyle.primaryButtonBackgroundColor,
|
||||
foregroundColor: _generalStyle.primaryButtonTextColor,
|
||||
padding: const EdgeInsets.symmetric(horizontal: 24, vertical: 20),
|
||||
),
|
||||
onPressed: () async => await _actionSubmit(context),
|
||||
child: Text(
|
||||
AppLocalizations.of(context)!.loginLoginButtonLabel,
|
||||
style: TextStyle(fontWeight: FontWeight.bold, fontFamily: _generalStyle.fontFamily),
|
||||
),
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 30),
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 10),
|
||||
TextFormField(
|
||||
key: Key("password"),
|
||||
controller: _passwordController,
|
||||
obscureText: true,
|
||||
decoration: InputDecoration(
|
||||
border: UnderlineInputBorder(),
|
||||
labelText: AppLocalizations.of(context)!.loginPasswordTFLabel,
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 10),
|
||||
if (_error != null) ...[
|
||||
Text(
|
||||
_error!,
|
||||
style: const TextStyle(color: Colors.red),
|
||||
),
|
||||
const SizedBox(height: 10),
|
||||
],
|
||||
GeneralSubmitWidget(
|
||||
key: const Key("submit"),
|
||||
onSelect: () async => await _actionSubmit(context),
|
||||
title: AppLocalizations.of(context)!.loginLoginButtonLabel,
|
||||
),
|
||||
const SizedBox(height: 30),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
@@ -142,7 +194,7 @@ class _LoginWidgetState extends State<LoginWidget> {
|
||||
|
||||
JwtTokenPairDto? jwtTokenPairDto = authenticateReply.jwtTokenPairDto;
|
||||
if (jwtTokenPairDto == null) {
|
||||
setState(() => _error = "Error message");
|
||||
setState(() => _error = AppLocalizations.of(context)!.loginErrorMessage);
|
||||
return;
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user