i am building a log in ui screen everything is going fine but as i was supposed to use more than one TextField i created a new class of TextField and the code goes as follows
import 'package:gradient_widgets/gradient_widgets.dart';
import 'package:notepad/authentication/textfield.dart';
class LogIn extends StatefulWidget {
LogIn({Key key}) : super(key: key);
@override
_LogInState createState() => _LogInState();
}
class _LogInState extends State<LogIn> {
@override
Widget build(BuildContext context) {
return Scaffold(
resizeToAvoidBottomPadding: false,
body: Column(
crossAxisAlignment:
CrossAxisAlignment.start, //TODO: ESSE DACK NA EK BAR
children: [
Container(
padding: EdgeInsets.fromLTRB(20.0, 150.0, 20.0, 0.0),
child: Stack(
children: [
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
'Welcome,',
style: TextStyle(
fontWeight: FontWeight.bold,
fontSize: 35.0,
),
),
Text(
'Log In to continue!',
style: TextStyle(
fontWeight: FontWeight.bold,
fontSize: 20.0,
color: Colors.grey,
),
),
SizedBox(height: 70),
buildTextField(
labelText: 'Email',
),
SizedBox(height: 30),
buildTextField(
labelText: 'Password',
obscureText: true, //TODO: password ko thich krna hy!!!
),
SizedBox(height: 10),
Container(
alignment: Alignment(1.0, 0.0),
child: InkWell(
onTap: () {
//TODO: navigate to forgot password page
},
child: Text(
'Forgot Password?',
style: TextStyle(
fontWeight: FontWeight.bold,
color: Colors.deepOrange,
fontSize: 10.0,
),
),
),
),
SizedBox(height: 70),
Container(
child: GradientButton(
increaseHeightBy: 10.0,
increaseWidthBy: 200.0,
child: Text(
'Log In',
style: TextStyle(fontWeight: FontWeight.bold),
),
callback: () {},
//TODO: LOGIN KA CALLBACK JAYEGA YAHA PR
gradient: LinearGradient(
colors: [
Color(0xFFFD7F2C),
Color(0xFFFF6200),
Color(0xFFFD9346),
],
),
shadowColor: Gradients.backToFuture.colors.last
.withOpacity(0.25),
),
),
SizedBox(
height: 10.0,
),
Container(
child: GradientButton(
increaseHeightBy: 10.0,
increaseWidthBy: 200.0,
child: Text(
'Log In With Google',
style: TextStyle(
fontWeight: FontWeight.bold, color: Colors.black),
),
callback: () {},
//TODO: LOGIN KA CALLBACK JAYEGA YAHA PR
gradient: LinearGradient(
colors: [Colors.white, Colors.white]),
),
),
],
),
],
),
),
],
),
);
}
}
and the code of text field class
TextField buildTextField({
@required String labelText,
bool obscureText,
}) {
return TextField(
decoration: InputDecoration(
enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(25),
borderSide: BorderSide(color: Colors.white),
),
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(25),
borderSide: BorderSide(color: Colors.deepOrange),
),
labelText: labelText,
labelStyle:
TextStyle(fontWeight: FontWeight.bold, color: Colors.deepOrange),
),
keyboardType: TextInputType.emailAddress,
obscureText: obscureText,
);
}
As i am passing obscureText as true in the login page my app is crashing saying obsureText !=null enter image description here
i dont know to can i solve this as i am new to flutter i will be greatful enough to somebody helped me to solve this issue
Solution 1: bluenile
You are getting that error because you are not passing the value for
bool obscureText,
Make sure to pass the value for obscureText from everywhere the buildTextField is called or set a default value for obscureText like this -
bool obscureText = false,
Please see the working code below :
import 'package:flutter/material.dart';
final Color darkBlue = const Color.fromARGB(255, 18, 32, 47);
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
theme: ThemeData.dark().copyWith(scaffoldBackgroundColor: darkBlue),
debugShowCheckedModeBanner: false,
home: const Scaffold(
body: Center(
child: LogIn(),
),
),
);
}
}
class LogIn extends StatefulWidget {
const LogIn({Key key}) : super(key: key);
@override
_LogInState createState() => _LogInState();
}
class _LogInState extends State<LogIn> {
TextField buildTextField({
@required String labelText,
bool obscureText = false,
}) {
return TextField(
decoration: InputDecoration(
enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(25),
borderSide: const BorderSide(color: Colors.white),
),
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(25),
borderSide: const BorderSide(color: Colors.deepOrange),
),
labelText: labelText,
labelStyle: const TextStyle(
fontWeight: FontWeight.bold, color: Colors.deepOrange),
),
keyboardType: TextInputType.emailAddress,
obscureText: obscureText,
);
}
@override
Widget build(BuildContext context) {
return Scaffold(
resizeToAvoidBottomPadding: false,
body: SingleChildScrollView(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Container(
padding: const EdgeInsets.fromLTRB(20.0, 150.0, 20.0, 0.0),
child: Stack(
children: [
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Text(
'Welcome,',
style: TextStyle(
fontWeight: FontWeight.bold,
fontSize: 35.0,
),
),
const Text(
'Log In to continue!',
style: TextStyle(
fontWeight: FontWeight.bold,
fontSize: 20.0,
color: Colors.grey,
),
),
const SizedBox(height: 70),
buildTextField(
labelText: 'Email',
),
const SizedBox(height: 30),
buildTextField(
labelText: 'Password',
obscureText: true,
),
const SizedBox(height: 10),
Container(
alignment: const Alignment(1.0, 0.0),
child: InkWell(
onTap: () {},
child: const Text(
'Forgot Password?',
style: TextStyle(
fontWeight: FontWeight.bold,
color: Colors.deepOrange,
fontSize: 10.0,
),
),
),
),
const SizedBox(height: 70),
Container(
child: RaisedButton(
child: const Text(
'Log In',
style: TextStyle(fontWeight: FontWeight.bold),
),
onPressed: () {},
),
),
const SizedBox(
height: 10.0,
),
Container(
child: RaisedButton(
child: const Text(
'Log In With Google',
style: TextStyle(
fontWeight: FontWeight.bold,
color: Colors.black),
),
onPressed: () {},
),
),
],
),
],
),
),
],
),
),
);
}
}
Solution 2: Mariganesh
you should provide default value for obscureText (bool obscureText=false) in your buildTextField widget.
