Here when I am scrolling then my text fields which is in grey[200], scroll overe stepper little bit, as you can see in image. so How to fix it?
Here when I am scrolling then my text fields which is in grey[200], scroll overe stepper little bit, as you can see in image. so How to fix it?
This is my stepper code
import 'package:flutter/material.dart';
import 'package:google_fonts/google_fonts.dart';
import '../../../constants/constants.dart';
class BecomeHH extends StatefulWidget {
const BecomeHH({Key? key}) : super(key: key);
#override
_BecomeHHState createState() => _BecomeHHState();
}
class _BecomeHHState extends State<BecomeHH> {
int _activeStepIndex = 0;
TextEditingController nameController = TextEditingController();
TextEditingController cityController = TextEditingController();
TextEditingController countryController = TextEditingController();
TextEditingController emailController = TextEditingController();
TextEditingController phoneController = TextEditingController();
List<Step> stepList() => [
Step(
isActive: _activeStepIndex >= 0,
state:
_activeStepIndex >= 0 ? StepState.complete : StepState.disabled,
title: const Text('Step One'),
content: ClipRRect(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisAlignment: MainAxisAlignment.start,
children: [
Padding(
padding: const EdgeInsets.all(1.0),
child: Text(
"Name",
style: GoogleFonts.poppins(
fontSize: 14,
color: Colors.grey,
),
),
),
SizedBox(
height: 3.7,
),
Container(
decoration: BoxDecoration(
color: Colors.grey[200],
borderRadius: BorderRadius.circular(8)),
child: TextFormField(
controller: nameController,
textAlign: TextAlign.left,
keyboardType: TextInputType.text,
decoration: const InputDecoration(
fillColor: Colors.white,
hintText: 'Enter Your Name',
hintStyle: TextStyle(fontSize: 16),
border: OutlineInputBorder(
borderRadius: BorderRadius.all(Radius.circular(8.0)),
borderSide: BorderSide.none,
),
filled: false,
contentPadding: EdgeInsets.only(
left: 16,
),
),
),
),
SizedBox(
height: 16,
),
Padding(
padding: const EdgeInsets.all(1.0),
child: Text(
"City",
style: GoogleFonts.poppins(
fontSize: 14,
color: Colors.grey,
),
),
),
SizedBox(
height: 3.7,
),
Container(
decoration: BoxDecoration(
color: Colors.grey[200],
borderRadius: BorderRadius.circular(8)),
child: TextFormField(
controller: cityController,
textAlign: TextAlign.left,
keyboardType: TextInputType.text,
decoration: const InputDecoration(
fillColor: Colors.white,
hintText: 'Enter Your City',
hintStyle: TextStyle(fontSize: 16),
border: OutlineInputBorder(
borderRadius: BorderRadius.all(Radius.circular(8.0)),
borderSide: BorderSide.none,
),
filled: false,
contentPadding: EdgeInsets.only(
left: 16,
),
),
),
),
SizedBox(
height: 16,
),
Padding(
padding: const EdgeInsets.all(1.0),
child: Text(
"Country",
style: GoogleFonts.poppins(
fontSize: 14,
color: Colors.grey,
),
),
),
SizedBox(
height: 3.7,
),
Container(
decoration: BoxDecoration(
color: Colors.grey[200],
borderRadius: BorderRadius.circular(8)),
child: TextFormField(
controller: countryController,
textAlign: TextAlign.left,
keyboardType: TextInputType.text,
decoration: const InputDecoration(
fillColor: Colors.white,
hintText: 'Enter Your Country',
hintStyle: TextStyle(fontSize: 16),
border: OutlineInputBorder(
borderRadius: BorderRadius.all(Radius.circular(8.0)),
borderSide: BorderSide.none,
),
filled: false,
contentPadding: EdgeInsets.only(
left: 16,
),
),
),
),
SizedBox(
height: 16,
),
Padding(
padding: const EdgeInsets.all(1.0),
child: Text(
"Email",
style: GoogleFonts.poppins(
fontSize: 14,
color: Colors.grey,
),
),
),
SizedBox(
height: 3.7,
),
Container(
decoration: BoxDecoration(
color: Colors.grey[200],
borderRadius: BorderRadius.circular(8)),
child: TextFormField(
controller: emailController,
textAlign: TextAlign.left,
keyboardType: TextInputType.emailAddress,
decoration: const InputDecoration(
fillColor: Colors.white,
hintText: 'Enter Your Email',
hintStyle: TextStyle(fontSize: 16),
border: OutlineInputBorder(
borderRadius: BorderRadius.all(Radius.circular(8.0)),
borderSide: BorderSide.none,
),
filled: false,
contentPadding: EdgeInsets.only(
left: 16,
),
),
),
),
SizedBox(
height: 16,
),
Padding(
padding: const EdgeInsets.all(1.0),
child: Text(
"Phone",
style: GoogleFonts.poppins(
fontSize: 14,
color: Colors.grey,
),
),
),
SizedBox(
height: 3.7,
),
Container(
decoration: BoxDecoration(
color: Colors.grey[200],
borderRadius: BorderRadius.circular(8)),
child: TextFormField(
controller: phoneController,
textAlign: TextAlign.left,
keyboardType: TextInputType.number,
decoration: const InputDecoration(
fillColor: Colors.white,
hintText: 'Enter Your Phone Number',
hintStyle: TextStyle(fontSize: 16),
border: OutlineInputBorder(
borderRadius: BorderRadius.all(Radius.circular(8.0)),
borderSide: BorderSide.none,
),
filled: false,
contentPadding: EdgeInsets.only(
left: 16,
),
),
),
),
SizedBox(
height: 16,
),
],
),
),
),
Step(
isActive: _activeStepIndex >= 0,
state:
_activeStepIndex >= 1 ? StepState.complete : StepState.disabled,
title: const Text('Step Two'),
content: Container(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Padding(
padding: const EdgeInsets.all(1.0),
child: Text(
"Video",
style: GoogleFonts.poppins(
fontSize: 14,
color: Colors.grey,
),
),
),
],
),
)),
Step(
isActive: _activeStepIndex >= 0,
state:
_activeStepIndex >= 2 ? StepState.complete : StepState.disabled,
title: const Text('Step Three'),
content: Container(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Padding(
padding: const EdgeInsets.all(1.0),
child: Text(
"Focus Area",
style: GoogleFonts.poppins(
fontSize: 14,
color: Colors.grey,
),
),
),
],
)))
];
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(elevation: 0,
backgroundColor: Colors.white38,
leading: IconButton(
icon: Icon(
Icons.arrow_back_ios,
color: Colors.black,
),
onPressed: () {
Navigator.pop(context);
},
),
),
body: SafeArea(
child: Theme(
data: ThemeData(
colorScheme: Theme.of(context).colorScheme.copyWith(primary: selectBlueColor),
),
child: Stepper(
type: StepperType.horizontal,
currentStep: _activeStepIndex,
steps: stepList(),
onStepContinue: () {
if (_activeStepIndex < (stepList().length - 1)) {
setState(() {
_activeStepIndex += 1;
});
} else {
print('Submited');
}
},
onStepCancel: () {
if (_activeStepIndex == 0) {
return;
}
setState(() {
_activeStepIndex -= 1;
});
},
onStepTapped: (int index) {
setState(() {
_activeStepIndex = index;
});
},
controlsBuilder: (BuildContext context, ControlsDetails details) {
final isLastStep = _activeStepIndex == stepList().length - 1;
return Container(
child: Row(
children: [
Expanded(
child: ElevatedButton(
style: ButtonStyle(
backgroundColor:
MaterialStateProperty.all(const Color(0xFF158998)),
shape: MaterialStateProperty.all<RoundedRectangleBorder>(
RoundedRectangleBorder(
borderRadius: BorderRadius.circular(18.0),
side: BorderSide(color: Colors.teal, width: 0.0),
),
),
),
onPressed: details.onStepContinue,
child: Padding(
padding: const EdgeInsets.all(15.0),
child: (isLastStep)
? const Text('Submit')
: const Text('Next'),
),
),
),
const SizedBox(
width: 10,
),
if (_activeStepIndex > 0)
Expanded(
child: ElevatedButton(
style: ButtonStyle(
backgroundColor:
MaterialStateProperty.all(const Color(0xFF158998)),
shape: MaterialStateProperty.all<RoundedRectangleBorder>(
RoundedRectangleBorder(
borderRadius: BorderRadius.circular(18.0),
side: BorderSide(color: Colors.teal, width: 0.0),
),
),
),
onPressed: details.onStepCancel,
child: Padding(
padding: const EdgeInsets.all(15.0),
child: const Text('Back'),
),
),
),
],
),
);
},
),
),
),
);
}
}
Simply add this line in your Stepper widget.
physics: ScrollPhysics(),
I am trying to build a form which is the code attach below. But when I try to input the text in the textfieldform it pops out error of bottom overflowed by 217 pixels
I am trying to build a form which is the code attach below. But when I try to input the text in the textfieldform it pops out error of bottom overflowed by 217 pixels
Scaffold(
appBar: AppBar(
leading: SizedBox(
width: 16,
child: IconButton(
icon: const Icon(Icons.arrow_back, color: Colors.black),
onPressed: () {
Navigator.push(
context,
MaterialPageRoute(builder: (context) => const Splash()),
);
}),
),
title: const Text(
"Upload KYC",
style: TextStyles.header4,
),
backgroundColor: ColorPalette.grey2,
elevation: 0,
),
backgroundColor: ColorPalette.grey2,
body: Column(
children: [
Container(
padding: EdgeInsets.only(
top: 45.h(), left: 20.w(), right: 20.w(), bottom: 20.h()),
child: Row(
children: <Widget>[
Expanded(
child: Column(
// crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
const Center(
child: Text(
"Personal Details",
style: TextStyles.subtitle04,
),
),
Divider(
thickness: 4.h(),
color: ColorPalette.azure,
)
],
),
),
const SizedBox(
width: 10,
),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
const Center(
child: Text(
"ID Proof",
style: TextStyles.subtitle004,
),
),
Divider(
thickness: 4.h(),
color: ColorPalette.grey3,
)
],
),
),
const SizedBox(
width: 10,
),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
const Center(
child: Text(
"Bank Details",
style: TextStyles.subtitle004,
),
),
Divider(
thickness: 4.h(),
color: ColorPalette.grey3,
)
],
),
),
],
),
),
Expanded(
child: Container(
width: double.infinity,
padding: const EdgeInsets.symmetric(horizontal: 20.0),
decoration: const BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.only(
topLeft: Radius.circular(20.0),
topRight: Radius.circular(20.0),
),
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
SizedBox(
height: 30.h(),
),
const Text(
"Enter Your Details",
style: TextStyles.header002,
),
SizedBox(height: 50.h()),
// KYC form
Form(
key: formKey,
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
const Align(
alignment: Alignment.topLeft,
child: Text(
'First Name',
style: TextStyles.subtitle4,
),
),
SizedBox(
height: 20.h(),
),
TextFormField(
keyboardType: TextInputType.name,
textInputAction: TextInputAction.next,
decoration: const InputDecoration(
hintText: 'Enter Your First Name',
hintStyle: TextStyles.subtitle1,
border: OutlineInputBorder(
borderRadius:
BorderRadius.all(Radius.circular(16))),
contentPadding:
EdgeInsets.fromLTRB(24, 24, 12, 16),
),
toolbarOptions:
const ToolbarOptions(copy: true, paste: true),
validator: (val) {
if (val!.isEmpty) {
return 'Please fill in your name';
}
firstName = val;
},
),
SizedBox(
height: 50.h(),
),
const Align(
alignment: Alignment.topLeft,
child: Text(
'Last Name',
style: TextStyles.subtitle4,
),
),
SizedBox(
height: 20.h(),
),
TextFormField(
keyboardType: TextInputType.name,
textInputAction: TextInputAction.next,
decoration: const InputDecoration(
hintText: 'Enter Your Last Name',
hintStyle: TextStyles.subtitle1,
border: OutlineInputBorder(
borderRadius:
BorderRadius.all(Radius.circular(16))),
contentPadding:
EdgeInsets.fromLTRB(24, 24, 12, 16),
),
toolbarOptions:
const ToolbarOptions(copy: true, paste: true),
validator: (val) {
if (val!.isEmpty) {
return 'Please complete your name';
}
lastName = val;
},
),
SizedBox(
height: 50.h(),
),
const Align(
alignment: Alignment.topLeft,
child: Text(
'Email',
style: TextStyles.subtitle4,
),
),
SizedBox(
height: 20.h(),
),
TextFormField(
keyboardType: TextInputType.emailAddress,
textInputAction: TextInputAction.next,
decoration: const InputDecoration(
hintText: 'Enter Your Email Address',
hintStyle: TextStyles.subtitle1,
border: OutlineInputBorder(
borderRadius:
BorderRadius.all(Radius.circular(16))),
contentPadding:
EdgeInsets.fromLTRB(24, 24, 12, 16),
),
toolbarOptions:
const ToolbarOptions(copy: true, paste: true),
onChanged: (_) {
emailExists = false;
},
validator: (val) {
if (val == null || val.isEmpty) {
return 'Please enter an email address';
}
if (!Constants().emailFilter.hasMatch(val)) {
return 'Please enter a valid email';
}
if (emailExists) {
return 'A user with this email already exists';
}
email = val;
},
),
SizedBox(
height: 50.h(),
),
const Align(
alignment: Alignment.topLeft,
child: Text(
'Phone Email',
style: TextStyles.subtitle4,
),
),
SizedBox(
height: 20.h(),
),
TextFormField(
keyboardType: TextInputType.phone,
textInputAction: TextInputAction.done,
decoration: const InputDecoration(
hintText: 'Enter Your Phone Number',
hintStyle: TextStyles.subtitle1,
border: OutlineInputBorder(
borderRadius:
BorderRadius.all(Radius.circular(16))),
contentPadding:
EdgeInsets.fromLTRB(24, 24, 12, 16),
),
validator: (val) {
if (val!.length < 11 || val.length > 11) {
return 'Phone Number should be 11';
}
phoneNumber = val;
},
),
],
)),
const Spacer(),
Padding(
padding: const EdgeInsets.only(bottom: 50),
child: ConstrainedBox(
constraints: const BoxConstraints.expand(height: 54),
child: Align(
alignment: Alignment.bottomCenter,
child: RoundedLoadingButton(
color: ColorPalette.blue1,
width: (MediaQuery.of(context).size.width - 40),
controller: _btnController,
borderRadius: 12,
elevation: 0,
animateOnTap: false,
onPressed: () => Navigator.of(context)
.pushReplacementNamed(KYCIDProofScreen.routeName),
child: const Text('Next'),
),
),
),
),
],
),
),
),
],
),
);
Column wrap with SingleChildScrollView it will solve the overflow issue
I want two TextField in row then I am getting error.When I am using Row
I want two TextField in row then I am getting error.I want two TextField in row then I am getting error.I want two TextField in row then I am getting error.
I want two TextField in row then I am getting error.I want two TextField in row then I am getting error.
This is my code.
import 'package:flutter/material.dart';
import 'package:google_fonts/google_fonts.dart';
class EnterDetails extends StatefulWidget {
const EnterDetails({Key? key}) : super(key: key);
#override
_EnterDetailsState createState() => _EnterDetailsState();
}
class _EnterDetailsState extends State<EnterDetails> {
TextEditingController nameController = TextEditingController();
TextEditingController zipCodeController = TextEditingController();
TextEditingController cityController = TextEditingController();
TextEditingController stateController = TextEditingController();
TextEditingController countryController = TextEditingController();
var _formKey = GlobalKey<FormState>();
var CountryList = ["India", "USA", "Africa","England"];
final focus = FocusNode();
#override
void initState() {
_formKey = GlobalKey<FormState>();
super.initState();
}
#override
Widget build(BuildContext context) {
return Scaffold(
body: Container(
height: MediaQuery.of(context).size.height,
decoration: const BoxDecoration(
image: DecorationImage(
image: AssetImage("assets/bg.png"),
fit: BoxFit.cover,
),
),
width: double.infinity,
child: SafeArea(
child: SingleChildScrollView(
child: Column(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
SizedBox(
height: 80,
),
Center(
child: Image.asset(
'assets/logo.png',
width: 115,
height: 80,
),
),
SizedBox(
height: 37,
),
Center(
child: Text(
"We are keen to know\nabout you",
style: GoogleFonts.poppins(
fontSize: 26,
fontWeight: FontWeight.w600,
color: Colors.white,
),
textAlign: TextAlign.center,
),
),
Padding(
padding: const EdgeInsets.fromLTRB(36, 0, 36, 0),
child: Form(
key: _formKey,
child: Column(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
SizedBox(
height: 43,
),
Padding(
padding: const EdgeInsets.all(1.0),
child: Text(
"Enter Full Name",
style: GoogleFonts.poppins(
fontSize: 14,
color: Colors.white,
),
),
),
SizedBox(
height: 3.7,
),
Container(
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(8)),
child: TextFormField(
controller: nameController,
textAlign: TextAlign.left,
keyboardType: TextInputType.text,
decoration: const InputDecoration(
fillColor: Colors.white,
hintText: 'Enter your Full Name',
hintStyle: TextStyle(fontSize: 16),
border: OutlineInputBorder(
borderRadius:
BorderRadius.all(Radius.circular(8.0)),
borderSide: BorderSide.none,
),
filled: false,
contentPadding: EdgeInsets.all(16),
),
),
),
SizedBox(
height: 16,
),
Padding(
padding: const EdgeInsets.all(1.0),
child: Text(
"Zip Code",
style: GoogleFonts.poppins(
fontSize: 14,
color: Colors.white,
),
),
),
SizedBox(
height: 3.7,
),
Container(
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(8)),
child: TextFormField(
controller: zipCodeController,
obscureText: true,
textAlign: TextAlign.left,
keyboardType: TextInputType.number,
decoration: const InputDecoration(
fillColor: Colors.white,
hintText: 'Enter your Zip Code',
hintStyle: TextStyle(fontSize: 16),
border: OutlineInputBorder(
borderRadius:
BorderRadius.all(Radius.circular(8.0)),
borderSide: BorderSide.none,
),
filled: false,
contentPadding: EdgeInsets.all(16),
),
),
),
SizedBox(
height: 16,
),
Padding(
padding: const EdgeInsets.all(1.0),
child: Text(
"City",
style: GoogleFonts.poppins(
fontSize: 14,
color: Colors.white,
),
),
),
SizedBox(
height: 3.7,
),
Container(
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(8)),
child: TextFormField(
controller: cityController,
textAlign: TextAlign.left,
keyboardType: TextInputType.text,
decoration: const InputDecoration(
fillColor: Colors.white,
hintText: 'Enter your city',
hintStyle: TextStyle(fontSize: 16),
border: OutlineInputBorder(
borderRadius:
BorderRadius.all(Radius.circular(8.0)),
borderSide: BorderSide.none,
),
filled: false,
contentPadding: EdgeInsets.all(16),
),
),
),
SizedBox(
height: 16,
),
Padding(
padding: const EdgeInsets.all(1.0),
child: Text(
"State",
style: GoogleFonts.poppins(
fontSize: 14,
color: Colors.white,
),
),
),
SizedBox(
height: 3.7,
),
Container(
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(8)),
child: TextFormField(
controller: cityController,
textAlign: TextAlign.left,
keyboardType: TextInputType.text,
decoration: const InputDecoration(
fillColor: Colors.white,
hintText: 'Enter your state',
hintStyle: TextStyle(fontSize: 16),
border: OutlineInputBorder(
borderRadius:
BorderRadius.all(Radius.circular(8.0)),
borderSide: BorderSide.none,
),
filled: false,
contentPadding: EdgeInsets.all(16),
),
),
),
SizedBox(
height: 16,
),
Padding(
padding: const EdgeInsets.all(1.0),
child: Text(
"Country",
style: GoogleFonts.poppins(
fontSize: 14,
color: Colors.white,
),
),
),
SizedBox(
height: 3.7,
),
Container(
height: 50,
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(8)
),
child: Padding(
padding: const EdgeInsets.only(left: 16.0, right: 8,top: 2),
child: Stack(
children: [
TextFormField(
cursorColor: Colors.white,
controller: countryController,
enabled: true,
validator: (value) {
if (value!.length != 0) {
return null;
}
return "please select country";
},
decoration: const InputDecoration(
suffixIcon: Icon(Icons.keyboard_arrow_down),
hintText: 'Country',
hintStyle: TextStyle(fontSize: 16),
border: UnderlineInputBorder(borderSide: BorderSide.none)),
style: TextStyle(
fontSize: 16,
color: Colors.grey[900],),
),
Container(
color: Colors.transparent,
width: MediaQuery.of(context).size.width,
child: PopupMenuButton<String>(
icon: const Icon(
Icons.arrow_drop_down,
color: Colors.transparent,
),
onSelected: (String value) {
setState(() {
countryController.text = value;
});
},
itemBuilder: (BuildContext context) {
return CountryList
.map<PopupMenuItem<String>>((String value) {
FocusScope.of(context).unfocus();
return new PopupMenuItem(
child: Container(
width: MediaQuery.of(context).size.width,
child: new Text(value)),
value: value);
}).toList();
},
),
)
],
),
),
),
SizedBox(height: 16,),
SizedBox(
height: 48,
width: double.infinity,
child: ElevatedButton(
style: ButtonStyle(
elevation: MaterialStateProperty.all(0),
foregroundColor:
MaterialStateProperty.all<Color>(Colors.white),
backgroundColor: MaterialStateProperty.all<Color>(
Color(0xFFF2A6A4)),
shape: MaterialStateProperty.all<
RoundedRectangleBorder>(
RoundedRectangleBorder(
borderRadius: BorderRadius.circular(10),
side: BorderSide(color: Color(0xFFF2A6A4)),
),
),
),
onPressed: () {
},
child: Text(
'Sign Up',
style: GoogleFonts.poppins(
fontSize: 14, color: Colors.white),
),
),
),
SizedBox(
height: 42,
),
],
),
),
),
],
),
),
),
),
bottomNavigationBar: Container(
color: Color(0xff3a99a4),
child: Container(
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.only(topLeft: Radius.circular(60))),
width: double.infinity,
height: 57,
child: Center(
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(
'Already have an account? ',
style: GoogleFonts.poppins(fontSize: 14, color: Colors.black),
),
GestureDetector(
onTap: () {
// Navigator.pushReplacement(
// context,
// MaterialPageRoute(
// builder: (context) => LoginPage(),
// ),
// );
},
child: Text(
"Let's Go",
style: GoogleFonts.poppins(
fontSize: 14, color: Color(0xFF158998)),
))
],
)),
),
),
);
}
}
In actuall i want to make like this
but it is becoming
To have multiple items in a row you need to use Row() widget inside your Column and after that to get equal width for your inline widgets you need to use Expanded widget inside Row and then you can add another widget as child of Expanded. I have made changes in your code just copy and paste below code and observe the changes for next time.
class EnterDetails extends StatefulWidget {
const EnterDetails({Key? key}) : super(key: key);
#override
_EnterDetailsState createState() => _EnterDetailsState();
}
class _EnterDetailsState extends State<EnterDetails> {
TextEditingController nameController = TextEditingController();
TextEditingController zipCodeController = TextEditingController();
TextEditingController cityController = TextEditingController();
TextEditingController stateController = TextEditingController();
TextEditingController countryController = TextEditingController();
var _formKey = GlobalKey<FormState>();
var CountryList = ["India", "USA", "Africa", "England"];
final focus = FocusNode();
#override
void initState() {
_formKey = GlobalKey<FormState>();
super.initState();
}
#override
Widget build(BuildContext context) {
return Scaffold(
body: Container(
height: MediaQuery.of(context).size.height,
decoration: const BoxDecoration(
image: DecorationImage(
image: AssetImage("assets/bg.png"),
fit: BoxFit.cover,
),
),
width: double.infinity,
child: SafeArea(
child: SingleChildScrollView(
child: Column(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
SizedBox(
height: 80,
),
Center(
child: Image.asset(
'assets/logo.png',
width: 115,
height: 80,
),
),
SizedBox(
height: 37,
),
Center(
child: Text(
"We are keen to know\nabout you",
style: GoogleFonts.poppins(
fontSize: 26,
fontWeight: FontWeight.w600,
color: Colors.white,
),
textAlign: TextAlign.center,
),
),
Padding(
padding: const EdgeInsets.fromLTRB(36, 0, 36, 0),
child: Form(
key: _formKey,
child: Column(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
SizedBox(
height: 43,
),
Padding(
padding: const EdgeInsets.all(1.0),
child: Text(
"Enter Full Name",
style: GoogleFonts.poppins(
fontSize: 14,
color: Colors.white,
),
),
),
SizedBox(
height: 3.7,
),
Container(
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(8)),
child: TextFormField(
controller: nameController,
textAlign: TextAlign.left,
keyboardType: TextInputType.text,
decoration: const InputDecoration(
fillColor: Colors.white,
hintText: 'Enter your Full Name',
hintStyle: TextStyle(fontSize: 16),
border: OutlineInputBorder(
borderRadius:
BorderRadius.all(Radius.circular(8.0)),
borderSide: BorderSide.none,
),
filled: false,
contentPadding: EdgeInsets.all(16),
),
),
),
SizedBox(
height: 16,
),
Row(
children: [
Expanded(
child: Column(
children: [
Padding(
padding: const EdgeInsets.all(1.0),
child: Text(
"Zip Code",
style: GoogleFonts.poppins(
fontSize: 14,
color: Colors.white,
),
),
),
SizedBox(
height: 3.7,
),
Container(
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(8)),
child: TextFormField(
controller: zipCodeController,
obscureText: true,
textAlign: TextAlign.left,
keyboardType: TextInputType.number,
decoration: const InputDecoration(
fillColor: Colors.white,
hintText: 'Enter your Zip Code',
hintStyle: TextStyle(fontSize: 16),
border: OutlineInputBorder(
borderRadius: BorderRadius.all(
Radius.circular(8.0)),
borderSide: BorderSide.none,
),
filled: false,
contentPadding: EdgeInsets.all(16),
),
),
),
],
)),
VerticalDivider(),
Expanded(
child: Column(
children: [
Padding(
padding: const EdgeInsets.all(1.0),
child: Text(
"City",
style: GoogleFonts.poppins(
fontSize: 14,
color: Colors.white,
),
),
),
SizedBox(
height: 3.7,
),
Container(
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(8)),
child: TextFormField(
controller: cityController,
textAlign: TextAlign.left,
keyboardType: TextInputType.text,
decoration: const InputDecoration(
fillColor: Colors.white,
hintText: 'Enter your city',
hintStyle: TextStyle(fontSize: 16),
border: OutlineInputBorder(
borderRadius: BorderRadius.all(
Radius.circular(8.0)),
borderSide: BorderSide.none,
),
filled: false,
contentPadding: EdgeInsets.all(16),
),
),
),
],
))
],
),
SizedBox(
height: 16,
),
Row(
children: [
Expanded(
child: Column(
children: [
Padding(
padding: const EdgeInsets.all(1.0),
child: Text(
"State",
style: GoogleFonts.poppins(
fontSize: 14,
color: Colors.white,
),
),
),
SizedBox(
height: 3.7,
),
Container(
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(8)),
child: TextFormField(
controller: cityController,
textAlign: TextAlign.left,
keyboardType: TextInputType.text,
decoration: const InputDecoration(
fillColor: Colors.white,
hintText: 'Enter your state',
hintStyle: TextStyle(fontSize: 16),
border: OutlineInputBorder(
borderRadius: BorderRadius.all(
Radius.circular(8.0)),
borderSide: BorderSide.none,
),
filled: false,
contentPadding: EdgeInsets.all(16),
),
),
),
],
)),
VerticalDivider(),
Expanded(
child: Column(
children: [
Padding(
padding: const EdgeInsets.all(1.0),
child: Text(
"Country",
style: GoogleFonts.poppins(
fontSize: 14,
color: Colors.white,
),
),
),
SizedBox(
height: 3.7,
),
Container(
height: 50,
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(8)),
child: Padding(
padding: const EdgeInsets.only(
left: 16.0, right: 8, top: 2),
child: Stack(
children: [
TextFormField(
cursorColor: Colors.white,
controller: countryController,
enabled: true,
validator: (value) {
if (value!.length != 0) {
return null;
}
return "please select country";
},
decoration: const InputDecoration(
suffixIcon: Icon(
Icons.keyboard_arrow_down),
hintText: 'Country',
hintStyle:
TextStyle(fontSize: 16),
border: UnderlineInputBorder(
borderSide: BorderSide.none)),
style: TextStyle(
fontSize: 16,
color: Colors.grey[900],
),
),
Container(
color: Colors.transparent,
width:
MediaQuery.of(context).size.width,
child: PopupMenuButton<String>(
icon: const Icon(
Icons.arrow_drop_down,
color: Colors.transparent,
),
onSelected: (String value) {
setState(() {
countryController.text = value;
});
},
itemBuilder:
(BuildContext context) {
return CountryList.map<
PopupMenuItem<String>>(
(String value) {
FocusScope.of(context)
.unfocus();
return new PopupMenuItem(
child: Container(
width: MediaQuery.of(
context)
.size
.width,
child: new Text(value)),
value: value);
}).toList();
},
),
)
],
),
),
)
],
)),
],
),
SizedBox(
height: 16,
),
SizedBox(
height: 16,
),
SizedBox(
height: 48,
width: double.infinity,
child: ElevatedButton(
style: ButtonStyle(
elevation: MaterialStateProperty.all(0),
foregroundColor: MaterialStateProperty.all<Color>(
Colors.white),
backgroundColor: MaterialStateProperty.all<Color>(
Color(0xFFF2A6A4)),
shape: MaterialStateProperty.all<
RoundedRectangleBorder>(
RoundedRectangleBorder(
borderRadius: BorderRadius.circular(10),
side: BorderSide(color: Color(0xFFF2A6A4)),
),
),
),
onPressed: () {},
child: Text(
'Sign Up',
style: GoogleFonts.poppins(
fontSize: 14, color: Colors.white),
),
),
),
SizedBox(
height: 42,
),
],
),
),
),
],
),
),
),
),
bottomNavigationBar: Container(
color: Color(0xff3a99a4),
child: Container(
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.only(topLeft: Radius.circular(60))),
width: double.infinity,
height: 57,
child: Center(
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(
'Already have an account? ',
style: GoogleFonts.poppins(fontSize: 14, color: Colors.black),
),
GestureDetector(
onTap: () {
// Navigator.pushReplacement(
// context,
// MaterialPageRoute(
// builder: (context) => LoginPage(),
// ),
// );
},
child: Text(
"Let's Go",
style: GoogleFonts.poppins(
fontSize: 14, color: Color(0xFF158998)),
))
],
)),
),
),
);
}
}
If you want to place widgets next to each other you need to use a Row-Widget. You can place that Row inside your Column.
https://api.flutter.dev/flutter/widgets/Row-class.html
Please Refer Below Code:-
import 'package:flutter/cupertino.dart';
class EnterDetails extends StatefulWidget {
const EnterDetails({Key? key}) : super(key: key);
#override
_EnterDetailsState createState() => _EnterDetailsState();
}
class _EnterDetailsState extends State<EnterDetails> {
TextEditingController nameController = TextEditingController();
TextEditingController zipCodeController = TextEditingController();
TextEditingController cityController = TextEditingController();
TextEditingController stateController = TextEditingController();
TextEditingController countryController = TextEditingController();
var _formKey = GlobalKey<FormState>();
var CountryList = ["India", "USA", "Africa", "England"];
final focus = FocusNode();
#override
void initState() {
_formKey = GlobalKey<FormState>();
super.initState();
}
#override
Widget build(BuildContext context) {
return Scaffold(
body: Container(
height: MediaQuery.of(context).size.height,
decoration: const BoxDecoration(
image: DecorationImage(
image: AssetImage("assets/bg.png"),
fit: BoxFit.cover,
),
),
width: double.infinity,
child: SafeArea(
child: SingleChildScrollView(
child: Column(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
SizedBox(
height: 80,
),
Center(
child: Image.asset(
'assets/logo.png',
width: 115,
height: 80,
),
),
SizedBox(
height: 37,
),
Center(
child: Text(
"We are keen to know\nabout you",
style: GoogleFonts.poppins(
fontSize: 26,
fontWeight: FontWeight.w600,
color: Colors.white,
),
textAlign: TextAlign.center,
),
),
Padding(
padding: const EdgeInsets.fromLTRB(36, 0, 36, 0),
child: Form(
key: _formKey,
child: Column(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
SizedBox(
height: 43,
),
Padding(
padding: const EdgeInsets.all(1.0),
child: Text(
"Enter Full Name",
style: GoogleFonts.poppins(
fontSize: 14,
color: Colors.white,
),
),
),
SizedBox(
height: 3.7,
),
Container(
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(8)),
child: TextFormField(
controller: nameController,
textAlign: TextAlign.left,
keyboardType: TextInputType.text,
decoration: const InputDecoration(
fillColor: Colors.white,
hintText: 'Enter your Full Name',
hintStyle: TextStyle(fontSize: 16),
border: OutlineInputBorder(
borderRadius:
BorderRadius.all(Radius.circular(8.0)),
borderSide: BorderSide.none,
),
filled: false,
contentPadding: EdgeInsets.all(16),
),
),
),
SizedBox(
height: 16,
),
Row(
children: [
Flexible(
child: Column(
children: [
Padding(
padding: const EdgeInsets.all(1.0),
child: Text(
"Zip Code",
style: GoogleFonts.poppins(
fontSize: 14,
color: Colors.white,
),
),
),
SizedBox(
height: 3.7,
),
Container(
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(8)),
child: TextFormField(
controller: zipCodeController,
obscureText: true,
textAlign: TextAlign.left,
keyboardType: TextInputType.number,
decoration: const InputDecoration(
fillColor: Colors.white,
hintText: 'Enter your Zip Code',
hintStyle: TextStyle(fontSize: 16),
border: OutlineInputBorder(
borderRadius: BorderRadius.all(
Radius.circular(8.0)),
borderSide: BorderSide.none,
),
filled: false,
contentPadding: EdgeInsets.all(16),
),
),
),
],
)),
SizedBox(width: 10,),
Flexible(
child: Column(
children: [
Padding(
padding: const EdgeInsets.all(1.0),
child: Text(
"City",
style: GoogleFonts.poppins(
fontSize: 14,
color: Colors.white,
),
),
),
SizedBox(
height: 3.7,
),
Container(
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(8)),
child: TextFormField(
controller: cityController,
textAlign: TextAlign.left,
keyboardType: TextInputType.text,
decoration: const InputDecoration(
fillColor: Colors.white,
hintText: 'Enter your city',
hintStyle: TextStyle(fontSize: 16),
border: OutlineInputBorder(
borderRadius: BorderRadius.all(
Radius.circular(8.0)),
borderSide: BorderSide.none,
),
filled: false,
contentPadding: EdgeInsets.all(16),
),
),
),
],
))
],
),
SizedBox(
height: 16,
),
Row(
children: [
Flexible(
child: Column(
children: [
Padding(
padding: const EdgeInsets.all(1.0),
child: Text(
"State",
style: GoogleFonts.poppins(
fontSize: 14,
color: Colors.white,
),
),
),
SizedBox(
height: 3.7,
),
Container(
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(8)),
child: TextFormField(
controller: cityController,
textAlign: TextAlign.left,
keyboardType: TextInputType.text,
decoration: const InputDecoration(
fillColor: Colors.white,
hintText: 'Enter your state',
hintStyle: TextStyle(fontSize: 16),
border: OutlineInputBorder(
borderRadius: BorderRadius.all(
Radius.circular(8.0)),
borderSide: BorderSide.none,
),
filled: false,
contentPadding: EdgeInsets.all(16),
),
),
),
],
)),
SizedBox(width: 10,),
Flexible(
child: Column(
children: [
Padding(
padding: const EdgeInsets.all(1.0),
child: Text(
"Country",
style: GoogleFonts.poppins(
fontSize: 14,
color: Colors.white,
),
),
),
SizedBox(
height: 3.7,
),
Container(
height: 50,
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(8)),
child: Padding(
padding: const EdgeInsets.only(
left: 16.0, right: 8, top: 2),
child: Stack(
children: [
TextFormField(
cursorColor: Colors.white,
controller: countryController,
enabled: true,
validator: (value) {
if (value!.length != 0) {
return null;
}
return "please select country";
},
decoration: const InputDecoration(
suffixIcon: Icon(
Icons.keyboard_arrow_down),
hintText: 'Country',
hintStyle:
TextStyle(fontSize: 16),
border: UnderlineInputBorder(
borderSide: BorderSide.none)),
style: TextStyle(
fontSize: 16,
color: Colors.grey[900],
),
),
Container(
color: Colors.transparent,
width:
MediaQuery.of(context).size.width,
child: PopupMenuButton<String>(
icon: const Icon(
Icons.arrow_drop_down,
color: Colors.transparent,
),
onSelected: (String value) {
setState(() {
countryController.text = value;
});
},
itemBuilder:
(BuildContext context) {
return CountryList.map<
PopupMenuItem<String>>(
(String value) {
FocusScope.of(context)
.unfocus();
return new PopupMenuItem(
child: Container(
width: MediaQuery.of(
context)
.size
.width,
child: new Text(value)),
value: value);
}).toList();
},
),
)
],
),
),
)
],
)),
],
),
SizedBox(
height: 16,
),
SizedBox(
height: 16,
),
SizedBox(
height: 48,
width: double.infinity,
child: ElevatedButton(
style: ButtonStyle(
elevation: MaterialStateProperty.all(0),
foregroundColor: MaterialStateProperty.all<Color>(
Colors.white),
backgroundColor: MaterialStateProperty.all<Color>(
Color(0xFFF2A6A4)),
shape: MaterialStateProperty.all<
RoundedRectangleBorder>(
RoundedRectangleBorder(
borderRadius: BorderRadius.circular(10),
side: BorderSide(color: Color(0xFFF2A6A4)),
),
),
),
onPressed: () {},
child: Text(
'Sign Up',
style: GoogleFonts.poppins(
fontSize: 14, color: Colors.white),
),
),
),
SizedBox(
height: 42,
),
],
),
),
),
],
),
),
),
),
bottomNavigationBar: Container(
color: Color(0xff3a99a4),
child: Container(
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.only(topLeft: Radius.circular(60))),
width: double.infinity,
height: 57,
child: Center(
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(
'Already have an account? ',
style: GoogleFonts.poppins(fontSize: 14, color: Colors.black),
),
GestureDetector(
onTap: () {
// Navigator.pushReplacement(
// context,
// MaterialPageRoute(
// builder: (context) => LoginPage(),
// ),
// );
},
child: Text(
"Let's Go",
style: GoogleFonts.poppins(
fontSize: 14, color: Color(0xFF158998)),
))
],
)),
),
),
);
}
}
import 'package:flutter/material.dart';
import 'package:google_fonts/google_fonts.dart';
void main() => runApp(Myapp11());
class Myapp11 extends StatelessWidget {
const Myapp11({Key? key}) : super(key: key);
#override
Widget build(BuildContext context) {
return EnterDetails();
}
}
class EnterDetails extends StatefulWidget {
const EnterDetails({Key? key}) : super(key: key);
#override
_EnterDetailsState createState() => _EnterDetailsState();
}
class _EnterDetailsState extends State<EnterDetails> {
TextEditingController nameController = TextEditingController();
TextEditingController zipCodeController = TextEditingController();
TextEditingController cityController = TextEditingController();
TextEditingController stateController = TextEditingController();
TextEditingController countryController = TextEditingController();
var _formKey = GlobalKey<FormState>();
var CountryList = ["India", "USA", "Africa", "England"];
final focus = FocusNode();
#override
void initState() {
_formKey = GlobalKey<FormState>();
super.initState();
}
#override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
backgroundColor: Colors.teal,
body: Container(
height: 2222,
//MediaQuery.of(context).size.height,
decoration: const BoxDecoration(
image: DecorationImage(
image: AssetImage("assets/bg.png"),
fit: BoxFit.cover,
),
),
width: double.infinity,
child: SafeArea(
child: SingleChildScrollView(
child: Column(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
SizedBox(
height: 80,
),
Center(
child: Image.asset(
'assets/logo.png',
width: 115,
height: 80,
),
),
SizedBox(
height: 37,
),
Center(
child: Text(
"We are keen to know\nabout you",
style: GoogleFonts.poppins(
fontSize: 26,
fontWeight: FontWeight.w600,
color: Colors.white,
),
textAlign: TextAlign.center,
),
),
Padding(
padding: const EdgeInsets.fromLTRB(36, 0, 36, 0),
child: Form(
key: _formKey,
child: Column(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
SizedBox(
height: 43,
),
Padding(
padding: const EdgeInsets.all(1.0),
child: Text(
"Enter Full Name",
style: GoogleFonts.poppins(
fontSize: 14,
color: Colors.white,
),
),
),
SizedBox(
height: 3.7,
),
Container(
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(8)),
child: TextFormField(
controller: nameController,
textAlign: TextAlign.left,
keyboardType: TextInputType.text,
decoration: const InputDecoration(
fillColor: Colors.white,
hintText: 'Enter your Full Name',
hintStyle: TextStyle(fontSize: 16),
border: OutlineInputBorder(
borderRadius:
BorderRadius.all(Radius.circular(8.0)),
borderSide: BorderSide.none,
),
filled: false,
contentPadding: EdgeInsets.all(16),
),
),
),
SizedBox(
height: 16,
),
Padding(
padding: const EdgeInsets.all(1.0),
child: Text(
"Zip Code",
style: GoogleFonts.poppins(
fontSize: 14,
color: Colors.white,
),
),
),
SizedBox(
height: 3.7,
),
Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
Expanded(
child: Container(
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(8)),
child: TextFormField(
controller: zipCodeController,
obscureText: true,
textAlign: TextAlign.left,
keyboardType: TextInputType.number,
decoration: const InputDecoration(
fillColor: Colors.white,
hintText: 'Enter your Zip Code',
hintStyle: TextStyle(fontSize: 16),
border: OutlineInputBorder(
borderRadius: BorderRadius.all(
Radius.circular(8.0)),
borderSide: BorderSide.none,
),
filled: false,
contentPadding: EdgeInsets.all(16),
),
),
),
),
SizedBox(
width: 22,
),
Expanded(
child: Container(
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(8)),
child: TextFormField(
controller: cityController,
textAlign: TextAlign.left,
keyboardType: TextInputType.text,
decoration: const InputDecoration(
fillColor: Colors.white,
hintText: 'Enter your city',
hintStyle: TextStyle(fontSize: 16),
border: OutlineInputBorder(
borderRadius: BorderRadius.all(
Radius.circular(8.0)),
borderSide: BorderSide.none,
),
filled: false,
contentPadding: EdgeInsets.all(16),
),
),
),
),
],
),
SizedBox(
height: 16,
),
Padding(
padding: const EdgeInsets.all(1.0),
child: Text(
"City",
style: GoogleFonts.poppins(
fontSize: 14,
color: Colors.white,
),
),
),
SizedBox(
height: 3.7,
),
SizedBox(
height: 16,
),
Padding(
padding: const EdgeInsets.all(1.0),
child: Text(
"State",
style: GoogleFonts.poppins(
fontSize: 14,
color: Colors.white,
),
),
),
SizedBox(
height: 3.7,
),
Container(
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(8)),
child: TextFormField(
controller: cityController,
textAlign: TextAlign.left,
keyboardType: TextInputType.text,
decoration: const InputDecoration(
fillColor: Colors.white,
hintText: 'Enter your state',
hintStyle: TextStyle(fontSize: 16),
border: OutlineInputBorder(
borderRadius:
BorderRadius.all(Radius.circular(8.0)),
borderSide: BorderSide.none,
),
filled: false,
contentPadding: EdgeInsets.all(16),
),
),
),
SizedBox(
height: 16,
),
Padding(
padding: const EdgeInsets.all(1.0),
child: Text(
"Country",
style: GoogleFonts.poppins(
fontSize: 14,
color: Colors.white,
),
),
),
SizedBox(
height: 3.7,
),
Container(
height: 50,
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(8)),
child: Padding(
padding: const EdgeInsets.only(
left: 16.0, right: 8, top: 2),
child: Stack(
children: [
TextFormField(
cursorColor: Colors.white,
controller: countryController,
enabled: true,
validator: (value) {
if (value!.length != 0) {
return null;
}
return "please select country";
},
decoration: const InputDecoration(
suffixIcon:
Icon(Icons.keyboard_arrow_down),
hintText: 'Country',
hintStyle: TextStyle(fontSize: 16),
border: UnderlineInputBorder(
borderSide: BorderSide.none)),
style: TextStyle(
fontSize: 16,
color: Colors.grey[900],
),
),
Container(
color: Colors.transparent,
width: 2222,
//MediaQuery.of(context).size.width,
child: PopupMenuButton<String>(
icon: const Icon(
Icons.arrow_drop_down,
color: Colors.transparent,
),
onSelected: (String value) {
setState(() {
countryController.text = value;
});
},
itemBuilder: (BuildContext context) {
return CountryList.map<
PopupMenuItem<String>>(
(String value) {
FocusScope.of(context).unfocus();
return new PopupMenuItem(
child: Container(
width: 1111,
//MediaQuery.of(context).size.width,
child: new Text(value)),
value: value);
}).toList();
},
),
)
],
),
),
),
SizedBox(
height: 16,
),
SizedBox(
height: 48,
width: double.infinity,
child: ElevatedButton(
style: ButtonStyle(
elevation: MaterialStateProperty.all(0),
foregroundColor:
MaterialStateProperty.all<Color>(
Colors.white),
backgroundColor:
MaterialStateProperty.all<Color>(
Color(0xFFF2A6A4)),
shape: MaterialStateProperty.all<
RoundedRectangleBorder>(
RoundedRectangleBorder(
borderRadius: BorderRadius.circular(10),
side: BorderSide(color: Color(0xFFF2A6A4)),
),
),
),
onPressed: () {},
child: Text(
'Sign Up',
style: GoogleFonts.poppins(
fontSize: 14, color: Colors.white),
),
),
),
SizedBox(
height: 42,
),
],
),
),
),
],
),
),
),
),
bottomNavigationBar: Container(
color: Color(0xff3a99a4),
child: Container(
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.only(topLeft: Radius.circular(60))),
width: double.infinity,
height: 57,
child: Center(
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(
'Already have an account? ',
style: GoogleFonts.poppins(fontSize: 14, color: Colors.black),
),
GestureDetector(
onTap: () {
// Navigator.pushReplacement(
// context,
// MaterialPageRoute(
// builder: (context) => LoginPage(),
// ),
// );
},
child: Text(
"Let's Go",
style: GoogleFonts.poppins(
fontSize: 14, color: Color(0xFF158998)),
))
],
)),
),
),
),
);
}
}