Implementation
String getSignupUiTemplate({
required String className,
required String isLoading,
bool addApiCalling = false,
List<Map<String, String>> fields = const [],
bool isCurved = true,
String? buttonColor,
String? textColor,
}) {
final String fieldsWidget;
if (fields.isNotEmpty) {
fieldsWidget = fields.map((field) {
final name = field['name'] ?? 'Field';
final isPassword = name.toLowerCase().contains('password');
String hint = "Field";
String icon = "Icons.edit_outlined";
final n = name.toLowerCase();
if (n.contains('email')) {
icon = "Icons.email_outlined";
hint = "Email";
} else if (n.contains('pass')) {
icon = "Icons.lock_outline";
hint = "● ● ● ● ● ● ● ●";
} else if (n.contains('phone')) {
icon = "Icons.phone_android_outlined";
hint = "Phone";
} else if (n.contains('name')) {
icon = "Icons.person_outline";
hint = "Full Name";
} else if (n.contains('otp') || n.contains('code')) {
icon = "Icons.pin_outlined";
hint = "OTP";
}
return '''
Align(
alignment: Alignment.centerLeft,
child: TextWidget(
text: "$name",
textSize: 14.sp,
fontWeight: FontWeight.w500,
color: AppColors.grey,
),
),
SizedBox(height: 8.sp),
CommonTextFormField(
hintText: "$hint",
isPassword: $isPassword,
prefixWidget: Icon($icon, size: 20.sp, color: AppColors.iconColor),
),
SizedBox(height: 20.sp),''';
}).join('\n');
} else {
fieldsWidget = '''
Align(
alignment: Alignment.centerLeft,
child: TextWidget(
text: "Full Name",
textSize: 14.sp,
fontWeight: FontWeight.w500,
color: AppColors.grey,
),
),
SizedBox(height: 8.sp),
CommonTextFormField(
hintText: "Full Name",
prefixWidget: Icon(Icons.person_outline, size: 20.sp, color: AppColors.iconColor),
),
SizedBox(height: 20.sp),
Align(
alignment: Alignment.centerLeft,
child: TextWidget(
text: "Email",
textSize: 14.sp,
fontWeight: FontWeight.w500,
color: AppColors.grey,
),
),
SizedBox(height: 8.sp),
CommonTextFormField(
hintText: "Email",
prefixWidget: Icon(Icons.email_outlined, size: 20.sp, color: AppColors.iconColor),
),
SizedBox(height: 20.sp),
Align(
alignment: Alignment.centerLeft,
child: TextWidget(
text: "Password",
textSize: 14.sp,
fontWeight: FontWeight.w500,
color: AppColors.grey,
),
),
SizedBox(height: 8.sp),
CommonTextFormField(
hintText: "● ● ● ● ● ● ● ●",
isPassword: true,
prefixWidget: Icon(Icons.lock_outline, size: 20.sp, color: AppColors.iconColor),
suffixWidget: Icon(Icons.visibility_outlined, size: 20.sp, color: AppColors.iconColor),
),
SizedBox(height: 20.sp),
Align(
alignment: Alignment.centerLeft,
child: TextWidget(
text: "Confirm Password",
textSize: 14.sp,
fontWeight: FontWeight.w500,
color: AppColors.grey,
),
),
SizedBox(height: 8.sp),
CommonTextFormField(
hintText: "● ● ● ● ● ● ● ●",
isPassword: true,
prefixWidget: Icon(Icons.lock_outline, size: 20.sp, color: AppColors.iconColor),
suffixWidget: Icon(Icons.visibility_outlined, size: 20.sp, color: AppColors.iconColor),
),''';
}
if (isCurved) {
return '''
CustomBody(
title: "",
isLoading: $isLoading,
padding: EdgeInsets.zero,
backgroundColor: AppColors.background,
child: SingleChildScrollView(
child: Column(
children: [
// Top Section (Logo)
Container(
width: 100.sw,
height: 250.sp,
decoration: BoxDecoration(
color: AppColors.primary,
),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Icon(
Icons.person_add_outlined,
size: 80.sp,
color: AppColors.white,
),
SizedBox(height: 20.sp),
TextWidget(
text: "Join Us",
textSize: 24.sp,
fontWeight: FontWeight.bold,
color: AppColors.white,
),
],
),
),
// Bottom Section (Form Sheet)
Transform.translate(
offset: Offset(0, -30.sp),
child: Container(
width: 100.sw,
padding: EdgeInsets.all(30.sp),
decoration: BoxDecoration(
color: AppColors.background,
borderRadius: BorderRadius.only(
topLeft: Radius.circular(40.sp),
topRight: Radius.circular(40.sp),
),
),
child: Column(
children: [
Align(
alignment: Alignment.centerLeft,
child: TextWidget(
text: "Sign Up",
textSize: 26.sp,
fontWeight: FontWeight.bold,
color: AppColors.primary,
),
),
SizedBox(height: 35.sp),
$fieldsWidget
SizedBox(height: 40.sp),
GestureDetector(
onTap: () {
${addApiCalling ? "context.read<${className}Bloc>().add(${className}Submit());" : ""}
},
child: Container(
width: 100.sw,
height: 55.sp,
decoration: BoxDecoration(
color: AppColors.buttonColor,
borderRadius: BorderRadius.circular(15.sp),
),
child: Center(
child: TextWidget(
text: "Register Now",
textSize: 18.sp,
fontWeight: FontWeight.bold,
color: AppColors.buttonTextColor,
),
),
),
),
SizedBox(height: 40.sp),
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
TextWidget(
text: "Already a member? ",
textSize: 14.sp,
color: AppColors.grey,
),
GestureDetector(
onTap: () {},
child: TextWidget(
text: "Log In",
textSize: 14.sp,
color: AppColors.primary,
fontWeight: FontWeight.bold,
),
),
],
),
SizedBox(height: 40.sp),
],
),
),
),
],
),
),
)''';
} else {
// Plain Background (Centralized, Responsive)
return '''
CustomBody(
title: "",
isLoading: $isLoading,
padding: EdgeInsets.symmetric(horizontal: 30.sp),
backgroundColor: AppColors.background,
child: Center(
child: SingleChildScrollView(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
// Logo/Icon
Icon(
Icons.person_add_outlined,
size: 80.sp,
color: AppColors.primary,
),
SizedBox(height: 30.sp),
Align(
alignment: Alignment.centerLeft,
child: TextWidget(
text: "Create Account",
textSize: 28.sp,
fontWeight: FontWeight.bold,
color: AppColors.primary,
),
),
SizedBox(height: 40.sp),
$fieldsWidget
SizedBox(height: 40.sp),
GestureDetector(
onTap: () {
${addApiCalling ? "context.read<${className}Bloc>().add(${className}Submit());" : ""}
},
child: Container(
width: 100.sw,
height: 55.sp,
decoration: BoxDecoration(
color: AppColors.buttonColor,
borderRadius: BorderRadius.circular(15.sp),
),
child: Center(
child: TextWidget(
text: "Register",
textSize: 18.sp,
fontWeight: FontWeight.bold,
color: AppColors.buttonTextColor,
),
),
),
),
SizedBox(height: 30.sp),
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
TextWidget(
text: "Already have an account? ",
textSize: 14.sp,
color: AppColors.grey,
),
GestureDetector(
onTap: () {},
child: TextWidget(
text: "Log In",
textSize: 14.sp,
color: AppColors.primary,
fontWeight: FontWeight.bold,
),
),
],
),
SizedBox(height: 20.sp),
],
),
),
),
)''';
}
}