fix: sign up feature

This commit is contained in:
Dian Bayu Nugroho 2024-02-06 19:21:41 +07:00
parent 7ec266cded
commit e538fa5927
6 changed files with 151 additions and 89 deletions

BIN
assets/icons/icon-flag.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.6 KiB

View File

@ -11,6 +11,7 @@ class PathAssets {
static const String icon1 = 'assets/icons/icon-1.png'; static const String icon1 = 'assets/icons/icon-1.png';
static const String iconConnect = 'assets/icons/icon-connect.png'; static const String iconConnect = 'assets/icons/icon-connect.png';
static const String iconShield = 'assets/icons/icon-shield.png'; static const String iconShield = 'assets/icons/icon-shield.png';
static const String iconFlag = 'assets/icons/icon-flag.png';
/// IMAGE /// IMAGE
static const String imgSplashLogo = 'assets/images/splash-logo.png'; static const String imgSplashLogo = 'assets/images/splash-logo.png';

View File

@ -14,7 +14,7 @@ class TextFormView extends StatelessWidget {
final String? hintText, errorText; final String? hintText, errorText;
final TextEditingController? ctrl; final TextEditingController? ctrl;
final Widget? suffixIcon, suffixLable; final Widget? suffixIcon, suffixLable;
final Widget? prefixIcon; final Widget? prefixIcon, prefix;
final TextInputType? keyboardType; final TextInputType? keyboardType;
final FormFieldValidator<String>? validator; final FormFieldValidator<String>? validator;
final bool obscureText; final bool obscureText;
@ -70,7 +70,8 @@ class TextFormView extends StatelessWidget {
this.disableColor = false, this.disableColor = false,
this.enableInteractiveSelection = true, this.enableInteractiveSelection = true,
this.focusNode, this.focusNode,
this.isTextAlignCenter = false}) this.isTextAlignCenter = false,
this.prefix})
: super(key: key); : super(key: key);
@override @override
@ -187,7 +188,8 @@ class TextFormView extends StatelessWidget {
prefixIcon: prefixIcon, prefixIcon: prefixIcon,
suffixIconConstraints: suffixIconConstraints, suffixIconConstraints: suffixIconConstraints,
prefixIconConstraints: preffixIconConstraints, prefixIconConstraints: preffixIconConstraints,
), prefix: prefix,
contentPadding: EdgeInsets.zero),
) )
], ],
); );

View File

@ -55,7 +55,7 @@ class RegistrationPasswordView extends StatelessWidget {
}, },
child: Icon( child: Icon(
provider.showPassword provider.showPassword
? Icons.visibility_off_outlined ? Icons.visibility_outlined
: Icons.visibility_off_outlined, : Icons.visibility_off_outlined,
color: ColorPalette.greyDarker, color: ColorPalette.greyDarker,
), ),

View File

@ -1,9 +1,16 @@
import 'package:cims_apps/application/assets/path_assets.dart';
import 'package:cims_apps/application/component/button/button_view.dart'; import 'package:cims_apps/application/component/button/button_view.dart';
import 'package:cims_apps/application/component/image/image_view.dart';
import 'package:cims_apps/application/component/otp/otp_view.dart'; import 'package:cims_apps/application/component/otp/otp_view.dart';
import 'package:cims_apps/application/component/text_caption/text_caption.dart'; import 'package:cims_apps/application/component/text_caption/text_caption.dart';
import 'package:cims_apps/application/component/text_form/text_form_view.dart'; import 'package:cims_apps/application/component/text_form/text_form_view.dart';
import 'package:cims_apps/application/theme/color_palette.dart';
import 'package:cims_apps/core/utils/size_config.dart';
import 'package:cims_apps/features/auth/registration/viewmodel/registration_viewmodel.dart';
import 'package:flutter/gestures.dart'; import 'package:flutter/gestures.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:provider/provider.dart';
class RegistrationView extends StatelessWidget { class RegistrationView extends StatelessWidget {
static const routName = '/RegistrationView'; static const routName = '/RegistrationView';
@ -11,7 +18,7 @@ class RegistrationView extends StatelessWidget {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
_showOtpWidget() { showOtpWidget() {
Navigator.of(context).pop(); Navigator.of(context).pop();
showModalBottomSheet( showModalBottomSheet(
context: context, context: context,
@ -35,12 +42,19 @@ class RegistrationView extends StatelessWidget {
); );
} }
return ChangeNotifierProvider(
create: (context) => RegistrationViewModel(),
builder: (context, child) {
return Scaffold( return Scaffold(
appBar: AppBar( appBar: AppBar(
title: const Text('Sign Up'), title: const Text('Sign Up'),
), ),
body: Container( body: Container(
padding: const EdgeInsets.all(24.0), padding: const EdgeInsets.all(24.0),
child: Consumer<RegistrationViewModel>(
builder: (context, provider, child) {
return Form(
key: provider.formKeyPhone,
child: Column( child: Column(
crossAxisAlignment: CrossAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start,
children: [ children: [
@ -48,13 +62,56 @@ class RegistrationView extends StatelessWidget {
title: 'Enter your phone number', title: 'Enter your phone number',
subtitle: 'Input your registered phone number', subtitle: 'Input your registered phone number',
), ),
TextFormView(name: 'Phone Number'), TextFormView(
name: 'Phone Number',
keyboardType: TextInputType.number,
inputFormatters: [
FilteringTextInputFormatter.deny(RegExp(r'^0'))
],
prefixIcon: Container(
width: SizeConfig.width * .23,
padding:
const EdgeInsets.symmetric(horizontal: 16.0),
margin: const EdgeInsets.only(right: 16),
decoration: const BoxDecoration(
color: ColorPalette.grey,
borderRadius: BorderRadius.only(
topLeft: Radius.circular(8),
bottomLeft: Radius.circular(8),
)),
child: const Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
ImageView(
image: PathAssets.iconFlag,
fit: BoxFit.contain,
width: 24,
height: 24,
),
Text(
'+62',
style: TextStyle(
fontWeight: FontWeight.w600,
color: ColorPalette.slate800,
),
)
],
)),
ctrl: provider.phoneNumberCtrl,
validator: (value) {
if (value!.isEmpty) {
return 'Phone number must be filled';
} else {
return null;
}
},
),
ButtonView( ButtonView(
name: 'Next', name: 'Next',
onPressed: () { onPressed: () {
_showOtpWidget(); if (provider.formKeyPhone.currentState!.validate()) {
showOtpWidget();
// routePush(context, page: const RegistrationPasswordView()); }
}, },
), ),
Align( Align(
@ -70,10 +127,7 @@ class RegistrationView extends StatelessWidget {
), ),
), ),
TextSpan( TextSpan(
recognizer: TapGestureRecognizer() recognizer: TapGestureRecognizer()..onTap = () {},
..onTap = () {
print('object');
},
text: ' Sign In', text: ' Sign In',
style: const TextStyle( style: const TextStyle(
color: Colors.blue, color: Colors.blue,
@ -84,7 +138,10 @@ class RegistrationView extends StatelessWidget {
) )
], ],
), ),
);
}),
), ),
); );
});
} }
} }

View File

@ -3,7 +3,9 @@ import 'package:flutter/material.dart';
class RegistrationViewModel extends ChangeNotifier { class RegistrationViewModel extends ChangeNotifier {
TextEditingController passwordCtrl = TextEditingController(); TextEditingController passwordCtrl = TextEditingController();
TextEditingController confirmPasswordCtrl = TextEditingController(); TextEditingController confirmPasswordCtrl = TextEditingController();
TextEditingController phoneNumberCtrl = TextEditingController();
var formKey = GlobalKey<FormState>(); var formKey = GlobalKey<FormState>();
var formKeyPhone = GlobalKey<FormState>();
bool showPassword = false; bool showPassword = false;
bool showPasswordConfirm = false; bool showPasswordConfirm = false;