| @@ -10,6 +10,8 @@ import 'package:flutter_bloc/flutter_bloc.dart'; | |||
| class LoginForm extends StatelessWidget { | |||
| AuthenticationBloc _authenticationBloc; | |||
| FocusNode _usernameFocus = FocusNode(); | |||
| FocusNode _passwordFocus = FocusNode(); | |||
| @override | |||
| Widget build(BuildContext context) { | |||
| @@ -46,9 +48,12 @@ class LoginForm extends StatelessWidget { | |||
| mainAxisAlignment: MainAxisAlignment.spaceBetween, | |||
| mainAxisSize: MainAxisSize.min, | |||
| children: [ | |||
| _UsernameInput(), | |||
| _UsernameInput( | |||
| usernameFocus: _usernameFocus, nextFocus: _passwordFocus), | |||
| const Padding(padding: EdgeInsets.all(12)), | |||
| _PasswordInput(), | |||
| _PasswordInput( | |||
| passwordFocus: _passwordFocus, | |||
| ), | |||
| const Padding(padding: EdgeInsets.all(16)), | |||
| _LoginButton(), | |||
| const Padding(padding: EdgeInsets.all(6)), | |||
| @@ -101,6 +106,9 @@ Widget _registerButton() { | |||
| } | |||
| class _UsernameInput extends StatelessWidget { | |||
| final FocusNode usernameFocus; | |||
| final FocusNode nextFocus; | |||
| _UsernameInput({@required this.usernameFocus, @required this.nextFocus}); | |||
| @override | |||
| Widget build(BuildContext context) { | |||
| return BlocBuilder<LoginBloc, LoginState>( | |||
| @@ -115,6 +123,8 @@ class _UsernameInput extends StatelessWidget { | |||
| color: COLOR_CONST.GRAY7), | |||
| child: Center( | |||
| child: TextFormField( | |||
| focusNode: usernameFocus, | |||
| textInputAction: TextInputAction.next, | |||
| onChanged: (username) => context | |||
| .bloc<LoginBloc>() | |||
| .add(LoginUsernameChanged(username)), | |||
| @@ -124,6 +134,10 @@ class _UsernameInput extends StatelessWidget { | |||
| ? 'Vui lòng nhập tên đăng nhập' | |||
| : null; | |||
| }, | |||
| onFieldSubmitted: (_) { | |||
| usernameFocus.unfocus(); | |||
| FocusScope.of(context).requestFocus(nextFocus); | |||
| }, | |||
| maxLines: 1, | |||
| keyboardType: TextInputType.text, | |||
| obscureText: false, | |||
| @@ -139,6 +153,8 @@ class _UsernameInput extends StatelessWidget { | |||
| } | |||
| class _PasswordInput extends StatelessWidget { | |||
| final FocusNode passwordFocus; | |||
| _PasswordInput({this.passwordFocus}); | |||
| @override | |||
| Widget build(BuildContext context) { | |||
| return BlocBuilder<LoginBloc, LoginState>( | |||
| @@ -153,6 +169,7 @@ class _PasswordInput extends StatelessWidget { | |||
| color: COLOR_CONST.GRAY7), | |||
| child: Center( | |||
| child: TextFormField( | |||
| focusNode: passwordFocus, | |||
| onChanged: (password) => context | |||
| .bloc<LoginBloc>() | |||
| .add(LoginPasswordChanged(password)), | |||
| @@ -162,9 +179,15 @@ class _PasswordInput extends StatelessWidget { | |||
| ? 'Vui lòng nhập mật khẩu' | |||
| : null; | |||
| }, | |||
| onFieldSubmitted: (_) { | |||
| passwordFocus.unfocus(); | |||
| if (state.status.isValidated) { | |||
| context.bloc<LoginBloc>().add(const LoginSubmitted()); | |||
| } | |||
| }, | |||
| maxLines: 1, | |||
| keyboardType: TextInputType.text, | |||
| obscureText: false, | |||
| obscureText: true, | |||
| textAlign: TextAlign.left, | |||
| decoration: InputDecoration.collapsed( | |||
| hintText: 'Mật khẩu', | |||