I have created login page, in that login page I have used get x package. In login page I am creating text form field using form widget and have assigned global key to it -> var formKey = GlobalKey();
then I copied code of login page to create register page but it is showing this error
AssertionError ('package:flutter/src/widgets/framework.dart': Failed assertion: line 5403 pos 14: '_dependents.isEmpty': is not true.)
import 'package:book_store/user/sign_up.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:get/get_navigation/src/root/get_material_app.dart';
import 'package:get/get_state_manager/get_state_manager.dart';
class Login extends StatefulWidget {
const Login({Key? key}) : super(key: key);
@override
State<Login> createState() => _LoginState();
}
class _LoginState extends State<Login> {
var formKey = GlobalKey<FormState>();
var emailController = TextEditingController();
var passwordController = TextEditingController();
var isObsecure = true.obs;
@override
Widget build(BuildContext context) {
return GetMaterialApp(
title: "my app",
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: FutureBuilder(
builder: (context, dataSnapShot) {
return Scaffold(
backgroundColor: Colors.black,
body: LayoutBuilder(builder: (context, cons) {
return ConstrainedBox(
constraints: BoxConstraints(
minHeight: cons.maxHeight,
),
child: SingleChildScrollView(
child: Column(
children: [
SizedBox(
width: MediaQuery.of(context).size.width,
height: 285,
child: Image.asset("lib/assets/book_books_bookshelf.jpg"),
),
const SizedBox(
height: 20,
),
Padding(
padding: const EdgeInsets.all(8.0),
child: Container(
decoration: const BoxDecoration(
color: Colors.white24,
borderRadius: BorderRadius.all(Radius.circular(60)),
boxShadow: [
BoxShadow(
blurRadius: 8,
color: Colors.black26,
offset: Offset(0, -3),
),
]),
child: Padding(
padding: const EdgeInsets.fromLTRB(30, 20, 30, 20),
child: Column(
children: [
const SizedBox(height: 20),
// for email
Form(
key: formKey,
child: Column(
children: [
TextFormField(
controller: emailController,
// if user put form empty
validator: (val) => val == ""
? "please write email"
: null,
decoration: InputDecoration(
prefixIcon: const Icon(
Icons.email,
color: Colors.amber,
),
hintText: "abc@gmail.com",
border: OutlineInputBorder(
borderRadius:
BorderRadius.circular(30),
borderSide: const BorderSide(
color: Colors.white70,
)),
enabledBorder: OutlineInputBorder(
borderRadius:
BorderRadius.circular(30),
borderSide: const BorderSide(
color: Colors.white70,
)),
disabledBorder: OutlineInputBorder(
borderRadius:
BorderRadius.circular(30),
borderSide: const BorderSide(
color: Colors.white70,
),
),
focusedBorder: OutlineInputBorder(
borderRadius:
BorderRadius.circular(30),
borderSide: const BorderSide(
color: Colors.white70,
)),
contentPadding:
const EdgeInsets.symmetric(
horizontal: 3.0,
vertical: 8.0,
),
fillColor: Colors.white38,
filled: true,
),
),
SizedBox(
height: 30,
),
//----------------password---------------------------------------------------
Obx(() => TextFormField(
controller: passwordController,
obscureText: isObsecure.value,
// if user put form empty
validator: (val) => val == ""
? "please write password"
: null,
decoration: InputDecoration(
prefixIcon: const Icon(
Icons.key,
color: Colors.amber,
),
suffixIcon:
Obx(() => GestureDetector(
onTap: () => {
isObsecure.value =
!isObsecure.value,
},
child: Icon(
isObsecure.value
? Icons
.visibility_off
: Icons.visibility,
),
)),
hintText: "password",
border: OutlineInputBorder(
borderRadius:
BorderRadius.circular(30),
borderSide: const BorderSide(
color: Colors.white70,
)),
enabledBorder: OutlineInputBorder(
borderRadius:
BorderRadius.circular(30),
borderSide: const BorderSide(
color: Colors.white70,
)),
disabledBorder: OutlineInputBorder(
borderRadius:
BorderRadius.circular(30),
borderSide: const BorderSide(
color: Colors.white70,
),
),
focusedBorder: OutlineInputBorder(
borderRadius:
BorderRadius.circular(30),
borderSide: const BorderSide(
color: Colors.white70,
)),
contentPadding:
const EdgeInsets.symmetric(
horizontal: 3.0,
vertical: 8.0,
),
fillColor: Colors.white38,
filled: true,
),
)),
SizedBox(
height: 30,
),
//---------------material-------------------------------------------
Material(
color: Colors.black,
borderRadius: BorderRadius.circular(38),
child: InkWell(
onTap: () {},
borderRadius: BorderRadius.circular(38),
child: const Padding(
padding: EdgeInsets.symmetric(
vertical: 10,
horizontal: 10,
),
child: Text(
"login",
style: TextStyle(
color: Colors.white,
fontSize: 16,
),
),
),
),
),
],
),
),
const SizedBox(
height: 10,
),
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
const Text("Don't have an Account?"),
TextButton(
onPressed: () {
Get.to(SignUp());
},
child: const Text("Register here"))
],
),
const Text(
"Or",
style: TextStyle(
fontSize: 16,
color: Colors.grey,
),
),
//----------------admin text ---------------------------
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
const Text("Are you an admin?"),
TextButton(
onPressed: () {},
child: const Text("click here"))
],
),
// SizedBox(height: 10,)
],
),
),
),
)
],
)),
);
}),
);
},
),
);
}
}
This is my login page
import 'package:book_store/user/login_screen.dart';
import 'package:flutter/material.dart';
import 'package:get/get_navigation/src/root/get_material_app.dart';
void main() {
WidgetsFlutterBinding.ensureInitialized();
runApp(const MyApp());
}
class MyApp extends StatefulWidget {
const MyApp({Key? key}) : super(key: key);
@override
State<MyApp> createState() => _MyAppState();
}
class _MyAppState extends State<MyApp> {
@override
Widget build(BuildContext context) {
// using get dependency so that state can be easily managed
return MaterialApp(
title: 'book store app',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: FutureBuilder(
builder: (context, dataSnapShot){
return Login();
},
),
);
}
}
this is my main.dart page
I see you say you copy the LoginPage for the SignUpPage.
If you copy the whole code, you will end up having two GetMaterialApp in your widget tree when you tap to navigate to SignUp page.
The error indicate that it should be only one GetMaterialApp in the widget tree, also GetX also document that you can change the MaterialApp with GetMaterialApp if you using GetX Navigate, show dialog, etc
main.dart
void main() {
WidgetsFlutterBinding.ensureInitialized();
runApp(const MyApp());
}
class MyApp extends StatefulWidget {
const MyApp({Key? key}) : super(key: key);
@override
State<MyApp> createState() => _MyAppState();
}
class _MyAppState extends State<MyApp> {
@override
Widget build(BuildContext context) {
// using get dependency so that state can be easily managed
return GetMaterialApp(
title: 'book store app',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: FutureBuilder(
builder: (context, dataSnapShot) {
return Login();
},
),
);
}
}
sign_up.dart
class SignUp extends StatelessWidget {
@override
Widget build(BuildContext context) {
// TODO: implement build
return Semantics(
value: "Sign Up Page",
);
}
}
login.dart
class Login extends StatefulWidget {
const Login({Key? key}) : super(key: key);
@override
State<Login> createState() => _LoginState();
}
class _LoginState extends State<Login> {
var formKey = GlobalKey<FormState>();
var emailController = TextEditingController();
var passwordController = TextEditingController();
var isObsecure = true.obs;
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: Colors.black,
body: LayoutBuilder(builder: (context, cons) {
return ConstrainedBox(
constraints: BoxConstraints(
minHeight: cons.maxHeight,
),
child: SingleChildScrollView(
child: Column(
children: [
const SizedBox(
height: 20,
),
Padding(
padding: const EdgeInsets.all(8.0),
child: Container(
decoration: const BoxDecoration(
color: Colors.white24,
borderRadius: BorderRadius.all(Radius.circular(60)),
boxShadow: [
BoxShadow(
blurRadius: 8,
color: Colors.black26,
offset: Offset(0, -3),
),
]),
child: Padding(
padding: const EdgeInsets.fromLTRB(30, 20, 30, 20),
child: Column(
children: [
const SizedBox(height: 20),
// for email
Form(
key: formKey,
child: Column(
children: [
TextFormField(
controller: emailController,
// if user put form empty
validator: (val) =>
val == "" ? "please write email" : null,
decoration: InputDecoration(
prefixIcon: const Icon(
Icons.email,
color: Colors.amber,
),
hintText: "abc@gmail.com",
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(30),
borderSide: const BorderSide(
color: Colors.white70,
)),
enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(30),
borderSide: const BorderSide(
color: Colors.white70,
)),
disabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(30),
borderSide: const BorderSide(
color: Colors.white70,
),
),
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(30),
borderSide: const BorderSide(
color: Colors.white70,
)),
contentPadding: const EdgeInsets.symmetric(
horizontal: 3.0,
vertical: 8.0,
),
fillColor: Colors.white38,
filled: true,
),
),
SizedBox(
height: 30,
),
//----------------password---------------------------------------------------
Obx(() => TextFormField(
controller: passwordController,
obscureText: isObsecure.value,
// if user put form empty
validator: (val) => val == ""
? "please write password"
: null,
decoration: InputDecoration(
prefixIcon: const Icon(
Icons.key,
color: Colors.amber,
),
suffixIcon: Obx(() => GestureDetector(
onTap: () => {
isObsecure.value =
!isObsecure.value,
},
child: Icon(
isObsecure.value
? Icons.visibility_off
: Icons.visibility,
),
)),
hintText: "password",
border: OutlineInputBorder(
borderRadius:
BorderRadius.circular(30),
borderSide: const BorderSide(
color: Colors.white70,
)),
enabledBorder: OutlineInputBorder(
borderRadius:
BorderRadius.circular(30),
borderSide: const BorderSide(
color: Colors.white70,
)),
disabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(30),
borderSide: const BorderSide(
color: Colors.white70,
),
),
focusedBorder: OutlineInputBorder(
borderRadius:
BorderRadius.circular(30),
borderSide: const BorderSide(
color: Colors.white70,
)),
contentPadding:
const EdgeInsets.symmetric(
horizontal: 3.0,
vertical: 8.0,
),
fillColor: Colors.white38,
filled: true,
),
)),
SizedBox(
height: 30,
),
//---------------material-------------------------------------------
Material(
color: Colors.black,
borderRadius: BorderRadius.circular(38),
child: InkWell(
onTap: () {},
borderRadius: BorderRadius.circular(38),
child: const Padding(
padding: EdgeInsets.symmetric(
vertical: 10,
horizontal: 10,
),
child: Text(
"login",
style: TextStyle(
color: Colors.white,
fontSize: 16,
),
),
),
),
),
],
),
),
const SizedBox(
height: 10,
),
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
const Text("Don't have an Account?"),
TextButton(
onPressed: () {
Get.to(SignUp());
},
child: const Text("Register here"))
],
),
const Text(
"Or",
style: TextStyle(
fontSize: 16,
color: Colors.grey,
),
),
//----------------admin text ---------------------------
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
const Text("Are you an admin?"),
TextButton(
onPressed: () {},
child: const Text("click here"))
],
),
// SizedBox(height: 10,)
],
),
),
),
)
],
)),
);
}),
);
}
}
Navigate to SignUp
Get.to(const SignUp())