|
| 1 | +import 'package:flutter/material.dart'; |
| 2 | + |
| 3 | +class SignUpPage extends StatefulWidget { |
| 4 | + const SignUpPage({Key? key}) : super(key: key); |
| 5 | + |
| 6 | + @override |
| 7 | + State<SignUpPage> createState() => _SignUpPageState(); |
| 8 | +} |
| 9 | + |
| 10 | +class _SignUpPageState extends State<SignUpPage> { |
| 11 | + final _formKey = GlobalKey<FormState>(); |
| 12 | + bool isObscure = true; |
| 13 | + |
| 14 | + final _userNameController = TextEditingController(); |
| 15 | + final _passwordController = TextEditingController(); |
| 16 | + final _roleController = TextEditingController(); |
| 17 | + final _customerNameController = TextEditingController(); |
| 18 | + final _emailController = TextEditingController(); |
| 19 | + final _mobileController = TextEditingController(); |
| 20 | + |
| 21 | + // FocusNodes to control field navigation |
| 22 | + final _userNameFocusNode = FocusNode(); |
| 23 | + final _passwordFocusNode = FocusNode(); |
| 24 | + final _customerNameFocusNode = FocusNode(); |
| 25 | + final _emailFocusNode = FocusNode(); |
| 26 | + final _mobileFocusNode = FocusNode(); |
| 27 | + |
| 28 | + @override |
| 29 | + void initState() { |
| 30 | + super.initState(); |
| 31 | + _roleController.text = 'user'; // Default role |
| 32 | + } |
| 33 | + |
| 34 | + @override |
| 35 | + void dispose() { |
| 36 | + // Dispose controllers and focus nodes to free resources |
| 37 | + _userNameController.dispose(); |
| 38 | + _passwordController.dispose(); |
| 39 | + _roleController.dispose(); |
| 40 | + _customerNameController.dispose(); |
| 41 | + _emailController.dispose(); |
| 42 | + _mobileController.dispose(); |
| 43 | + _userNameFocusNode.dispose(); |
| 44 | + _passwordFocusNode.dispose(); |
| 45 | + _customerNameFocusNode.dispose(); |
| 46 | + _emailFocusNode.dispose(); |
| 47 | + _mobileFocusNode.dispose(); |
| 48 | + super.dispose(); |
| 49 | + } |
| 50 | + |
| 51 | + @override |
| 52 | + Widget build(BuildContext context) { |
| 53 | + return Scaffold( |
| 54 | + appBar: AppBar( |
| 55 | + title: const Text('Sign Up'), |
| 56 | + ), |
| 57 | + body: Form( |
| 58 | + key: _formKey, |
| 59 | + child: Center( |
| 60 | + child: ListView( |
| 61 | + padding: const EdgeInsets.symmetric(horizontal: 40, vertical: 8), |
| 62 | + shrinkWrap: true, |
| 63 | + children: [ |
| 64 | + Padding( |
| 65 | + padding: const EdgeInsets.all(32.0), |
| 66 | + child: Text( |
| 67 | + 'Create Account', |
| 68 | + textAlign: TextAlign.center, |
| 69 | + style: Theme.of(context).textTheme.headlineMedium, |
| 70 | + ), |
| 71 | + ), |
| 72 | + _buildTextField( |
| 73 | + controller: _userNameController, |
| 74 | + label: 'Username', |
| 75 | + icon: Icons.person_2_outlined, |
| 76 | + focusNode: _userNameFocusNode, |
| 77 | + nextFocusNode: _passwordFocusNode, |
| 78 | + ), |
| 79 | + _buildTextField( |
| 80 | + controller: _passwordController, |
| 81 | + label: 'Password', |
| 82 | + icon: Icons.lock, |
| 83 | + obscureText: isObscure, |
| 84 | + isPassword: true, |
| 85 | + focusNode: _passwordFocusNode, |
| 86 | + nextFocusNode: _customerNameFocusNode, |
| 87 | + ), |
| 88 | + _buildTextField( |
| 89 | + controller: _roleController, |
| 90 | + label: 'Role', |
| 91 | + icon: Icons.group, |
| 92 | + readOnly: true, |
| 93 | + ), |
| 94 | + _buildTextField( |
| 95 | + controller: _customerNameController, |
| 96 | + label: 'Customer Name', |
| 97 | + icon: Icons.person_outline, |
| 98 | + focusNode: _customerNameFocusNode, |
| 99 | + nextFocusNode: _emailFocusNode, |
| 100 | + ), |
| 101 | + _buildTextField( |
| 102 | + controller: _emailController, |
| 103 | + label: 'Email', |
| 104 | + icon: Icons.email_outlined, |
| 105 | + keyboardType: TextInputType.emailAddress, |
| 106 | + focusNode: _emailFocusNode, |
| 107 | + nextFocusNode: _mobileFocusNode, |
| 108 | + ), |
| 109 | + _buildTextField( |
| 110 | + controller: _mobileController, |
| 111 | + label: 'Mobile', |
| 112 | + icon: Icons.phone_android, |
| 113 | + keyboardType: TextInputType.phone, |
| 114 | + focusNode: _mobileFocusNode, |
| 115 | + textInputAction: TextInputAction.done, |
| 116 | + onEditingComplete: () => FocusScope.of(context).unfocus(), // Dismiss keyboard on done |
| 117 | + ), |
| 118 | + const SizedBox(height: 20), |
| 119 | + Center( |
| 120 | + child: SizedBox( |
| 121 | + width: 100, |
| 122 | + height: 50, |
| 123 | + child: ElevatedButton( |
| 124 | + onPressed: _signUp, |
| 125 | + child: const Text('Sign Up'), |
| 126 | + ), |
| 127 | + ), |
| 128 | + ), |
| 129 | + ], |
| 130 | + ), |
| 131 | + ), |
| 132 | + ), |
| 133 | + ); |
| 134 | + } |
| 135 | + |
| 136 | + Widget _buildTextField({ |
| 137 | + required TextEditingController controller, |
| 138 | + required String label, |
| 139 | + required IconData icon, |
| 140 | + TextInputType keyboardType = TextInputType.text, |
| 141 | + bool obscureText = false, |
| 142 | + bool isPassword = false, |
| 143 | + bool readOnly = false, |
| 144 | + FocusNode? focusNode, |
| 145 | + FocusNode? nextFocusNode, |
| 146 | + TextInputAction textInputAction = TextInputAction.next, |
| 147 | + VoidCallback? onEditingComplete, |
| 148 | + }) { |
| 149 | + return Padding( |
| 150 | + padding: const EdgeInsets.all(4.0), |
| 151 | + child: TextFormField( |
| 152 | + controller: controller, |
| 153 | + decoration: InputDecoration( |
| 154 | + prefixIcon: Icon(icon), |
| 155 | + filled: true, |
| 156 | + labelText: label, |
| 157 | + suffixIcon: isPassword |
| 158 | + ? IconButton( |
| 159 | + icon: Icon(obscureText ? Icons.visibility_off : Icons.visibility), |
| 160 | + onPressed: () { |
| 161 | + setState(() { |
| 162 | + isObscure = !isObscure; |
| 163 | + }); |
| 164 | + }, |
| 165 | + ) |
| 166 | + : null, |
| 167 | + ), |
| 168 | + keyboardType: keyboardType, |
| 169 | + obscureText: obscureText, |
| 170 | + readOnly: readOnly, |
| 171 | + focusNode: focusNode, |
| 172 | + textInputAction: textInputAction, |
| 173 | + onEditingComplete: onEditingComplete ?? |
| 174 | + () { |
| 175 | + if (nextFocusNode != null) { |
| 176 | + FocusScope.of(context).requestFocus(nextFocusNode); |
| 177 | + } |
| 178 | + }, |
| 179 | + validator: (value) { |
| 180 | + if (value == null || value.isEmpty) { |
| 181 | + return 'This field must not be empty'; |
| 182 | + } |
| 183 | + return null; |
| 184 | + }, |
| 185 | + ), |
| 186 | + ); |
| 187 | + } |
| 188 | + |
| 189 | + void _signUp() { |
| 190 | + if (_formKey.currentState!.validate()) { |
| 191 | + final userData = { |
| 192 | + "userName": _userNameController.text, |
| 193 | + "password": _passwordController.text, |
| 194 | + "role": _roleController.text, |
| 195 | + "customer_name": _customerNameController.text, |
| 196 | + "email": _emailController.text, |
| 197 | + "mobile": _mobileController.text, |
| 198 | + }; |
| 199 | + |
| 200 | + // Implement sign-up logic here |
| 201 | + print('User Data: $userData'); |
| 202 | + |
| 203 | + // Show success message and navigate back or to another screen |
| 204 | + ScaffoldMessenger.of(context).showSnackBar( |
| 205 | + const SnackBar(content: Text('Sign up successful')), |
| 206 | + ); |
| 207 | + Navigator.pop(context); |
| 208 | + } |
| 209 | + } |
| 210 | +} |
0 commit comments