142 lines
4.3 KiB
Dart
142 lines
4.3 KiB
Dart
import 'package:flutter/gestures.dart';
|
|
import 'package:flutter/material.dart';
|
|
import 'package:whi_flutter/const.dart';
|
|
|
|
class SignupPage extends StatefulWidget {
|
|
const SignupPage({super.key});
|
|
|
|
@override
|
|
State<SignupPage> createState() => _SignupPageState();
|
|
}
|
|
|
|
class _SignupPageState extends State<SignupPage> {
|
|
final _formKey = GlobalKey<FormState>();
|
|
final _usernameController = TextEditingController();
|
|
final _ageController = TextEditingController();
|
|
final _passwordController = TextEditingController();
|
|
final _contrimPasswordController = TextEditingController();
|
|
|
|
bool _isPasswordVisible = false;
|
|
bool _isContrimPasswordVisible = false;
|
|
|
|
@override
|
|
void dispose() {
|
|
_usernameController.dispose();
|
|
_ageController.dispose();
|
|
_passwordController.dispose();
|
|
_contrimPasswordController.dispose();
|
|
super.dispose();
|
|
}
|
|
|
|
void _signup(){
|
|
if(_formKey.currentState!.validate()){
|
|
|
|
ScaffoldMessenger.of(
|
|
context,
|
|
).showSnackBar(const SnackBar(content: Text("Creating accout...")));
|
|
}
|
|
}
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return Scaffold(
|
|
backgroundColor: backgroundColor,
|
|
appBar: AppBar(),
|
|
body: SafeArea(
|
|
child: Form(
|
|
key: _formKey,
|
|
child: Column(
|
|
crossAxisAlignment: CrossAxisAlignment.stretch,
|
|
children: [
|
|
_buildTextField(
|
|
isDarkMode: isDarkMode,
|
|
controller:_usernameController,
|
|
hintText:'username',
|
|
prefixIcon: Icons.account_circle_outlined,
|
|
validator: (value){
|
|
if (value == null || value.isEmpty){
|
|
return 'please enter a username';
|
|
}
|
|
}
|
|
),
|
|
ElevatedButton(
|
|
onPressed: _signup,
|
|
style: ElevatedButton.styleFrom(
|
|
backgroundColor: primaryColor,
|
|
padding: const EdgeInsets. symmetric(vertical: 16),
|
|
shape: RoundedRectangleBorder(
|
|
borderRadius: BorderRadius.circular(12)
|
|
),
|
|
elevation: 5,
|
|
shadowColor: primaryColor.withValues(alpha: 0.4)
|
|
),
|
|
child: const Text(
|
|
'Sign Up',
|
|
style: TextStyle(
|
|
fontSize: 18,
|
|
fontWeight: FontWeight.w600,
|
|
color: Colors.white,
|
|
fontFamily: 'poppins',
|
|
),
|
|
),
|
|
)
|
|
],
|
|
),
|
|
),
|
|
),
|
|
);
|
|
}
|
|
}
|
|
|
|
Widget _buildTextField({
|
|
required bool isDarkMode,
|
|
required TextEditingController controller,
|
|
required String hintText,
|
|
bool obscureText = false,
|
|
TextInputType? keyboardType,
|
|
required IconData prefixIcon,
|
|
Widget? suffixIcon,
|
|
String? Function(String?)? validator,
|
|
}) {
|
|
final primaryColor = Color(0xFF137FEC);
|
|
final textColor = isDarkMode ? Colors.white : Color(0xFF101922);
|
|
final placeholderColor = isDarkMode ? Colors.white70 : Colors.black54;
|
|
final inputBackgroundColor = isDarkMode
|
|
? Color(0xFF1C2A3A)
|
|
: Color(0xFFF3F6F9);
|
|
|
|
return TextFormField(
|
|
controller: controller,
|
|
obscureText: obscureText,
|
|
keyboardType: keyboardType,
|
|
style: TextStyle(color: textColor, fontFamily: 'Poppins'),
|
|
validator: validator,
|
|
decoration: InputDecoration(
|
|
hintText: hintText,
|
|
hintStyle: TextStyle(color: placeholderColor, fontFamily: 'Poppins'),
|
|
filled: true,
|
|
fillColor: inputBackgroundColor,
|
|
prefixIcon: Icon(prefixIcon, color: placeholderColor),
|
|
suffixIcon: suffixIcon,
|
|
border: OutlineInputBorder(
|
|
borderRadius: BorderRadius.circular(12),
|
|
borderSide: BorderSide.none,
|
|
),
|
|
focusedBorder: OutlineInputBorder(
|
|
borderRadius: BorderRadius.circular(12),
|
|
borderSide: BorderSide(color: primaryColor, width: 2),
|
|
),
|
|
errorBorder: OutlineInputBorder(
|
|
borderRadius: BorderRadius.circular(12),
|
|
borderSide: BorderSide(color: Colors.redAccent, width: 1),
|
|
),
|
|
focusedErrorBorder: OutlineInputBorder(
|
|
borderRadius: BorderRadius.circular(12),
|
|
borderSide: BorderSide(color: Colors.redAccent, width: 2),
|
|
),
|
|
contentPadding: const EdgeInsets.symmetric(vertical: 18, horizontal: 16),
|
|
),
|
|
);
|
|
}
|
|
|
|
|