When I use form validation at that time I get error Duplicate GlobalKey detected in widget tree.
Can someone please explain How duplicate keys are created, in below code? Is it because of bottomsheet? I event tried to create different widget of bottom sheet as _tempFormBody code
class CreateProfile extends StatefulWidget {
@override
_CreateProfileState createState() => _CreateProfileState();
}
class _CreateProfileState extends State<CreateProfile>
with AutomaticKeepAliveClientMixin {
TextEditingController petname = TextEditingController();
TextEditingController hisage = TextEditingController();
TextEditingController templevel = TextEditingController();
final _formKey = GlobalKey<FormState>();
bool pressAttention = false;
bool pressAttention2 = false;
// Todo image picker
File _image;
final picker = ImagePicker();
var fileSelected = false;
Future getImage() async {
final pickedFile = await picker.getImage(source: ImageSource.gallery);
setState(() {
if (pickedFile != null) {
fileSelected = true;
_image = File(pickedFile.path);
} else {
print('No image selected.');
fileSelected = false;
}
});
}
@override
void initState() {
super.initState();
_tempFormBody();
}
//
@override
void dispose() {
// TODO: implement dispose
super.dispose();
_formKey.currentState.dispose();
}
var selectedtemperament = "";
_selectTemperament() {
List temperament = [
"Stable",
"Confident",
"Aggressive",
"Friendly",
"Protective"
];
return showModalBottomSheet<void>(
context: context,
builder: (BuildContext context) {
return Container(
height: 400,
decoration: BoxDecoration(
borderRadius: BorderRadius.only(
topLeft: Radius.circular(25), topRight: Radius.circular(25)),
color: Colors.white),
child: Column(
children: [
SizedBox(
height: 30,
),
Padding(
padding: const EdgeInsets.all(8.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(
"Temperament Level",
textAlign: TextAlign.left,
style:
TextStyle(fontSize: 18, fontWeight: FontWeight.w700),
),
IconButton(
icon: Icon(Icons.close),
onPressed: () => Navigator.pop(context),
),
],
),
),
ListView.builder(
shrinkWrap: true,
itemCount: temperament.length,
itemBuilder: (BuildContext context, int index) {
var temp = temperament[index];
return Column(
children: [
ListTile(
title: InkWell(
onTap: () {
print("$temp");
setState(() {
selectedtemperament = temp;
});
Navigator.pop(context);
},
child: Text(
'$temp',
style: TextStyle(fontWeight: FontWeight.w500),
)),
),
],
);
},
),
],
),
);
},
);
}
@override
Widget build(BuildContext context) {
super.build(context);
return Scaffold(
// key: globalKey,
body: SingleChildScrollView(
child: Column(
children: [
SizedBox(
height: 52,
),
Row(
children: [
SizedBox(
width: 10,
),
Padding(
padding: const EdgeInsets.only(right: 90),
child: IconButton(
onPressed: () {
Navigator.pop(context);
},
icon: Icon(
Icons.arrow_back_ios,
color: Colors.white,
)),
),
Row(
children: [
Container(
color: Colors.white,
height: 3,
width: 28,
),
SizedBox(
width: 6,
),
Container(
color: Colors.grey,
height: 3,
width: 28,
),
SizedBox(
width: 6,
),
Container(
color: Colors.grey,
height: 3,
width: 28,
),
],
)
],
),
Text(
"STEP 1 OF 3",
style: TextStyle(
color: Color(0xffBCB6D1), fontSize: 10, letterSpacing: 0.63),
),
SizedBox(
height: 6,
),
Text(
"Your dog's profile",
style: GoogleFonts.montserrat(
textStyle: TextStyle(
color: Colors.white,
fontSize: 24,
fontWeight: FontWeight.w700,
letterSpacing: -0.4)),
)
],
),
),
bottomSheet: Container(
width: double.infinity,
height: MediaQuery.of(context).size.height * 0.67,
decoration: BoxDecoration(
borderRadius: BorderRadius.only(
topLeft: Radius.circular(25), topRight: Radius.circular(25)),
color: Colors.white),
child: Padding(
padding: const EdgeInsets.only(left: 2, right: 2),
child: _tempFormBody(),
),
),
floatingActionButton: InkWell(
onTap: () {
print(_image);
getImage();
},
child: Container(
height: 126,
width: 126,
decoration: BoxDecoration(
image: fileSelected
? DecorationImage(image: FileImage(_image), fit: BoxFit.cover)
: null,
borderRadius: BorderRadius.circular(100),
color: Color(0xffEAE8F2),
),
child: fileSelected
? null
: Icon(
Icons.add_a_photo_outlined,
color: Colors.grey,
size: 50,
)),
),
floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
);
}
_tempFormBody(){
return Form(
key: _formKey,
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
SizedBox(
height: 90,
),
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
FlatButton(
minWidth: 126,
height: 36,
onPressed: () {
setState(() {
pressAttention = !pressAttention;
pressAttention2 = false;
});
},
child: Row(
mainAxisSize: MainAxisSize.min,
children: [
Icon(
FontAwesomeIcons.mars,
color: pressAttention
? Color(0xffFF4AAB)
: Color(0xff9891B4),
),
SizedBox(
width: 5,
),
Text(
"Male",
style: GoogleFonts.montserrat(
textStyle: TextStyle(
color: pressAttention
? Color(0xffFF4AAB)
: Color(0xff9891B4),
fontWeight: FontWeight.w600,
fontSize: 14)),
)
],
),
color: pressAttention
? Color(0xffFFECF6)
: Colors.transparent,
shape: RoundedRectangleBorder(
side: BorderSide(
width: 1,
color: pressAttention
? Color(0xffFF4AAB)
: Color(0xff9891B4)),
borderRadius: BorderRadius.circular(66.0),
),
),
SizedBox(
width: 15,
),
FlatButton(
minWidth: 126,
height: 36,
onPressed: () {
setState(() {
pressAttention2 = !pressAttention2;
pressAttention = false;
});
},
child: Row(
mainAxisSize: MainAxisSize.min,
children: [
Icon(
FontAwesomeIcons.venus,
color: pressAttention2
? Color(0xffFF4AAB)
: Color(0xff9891B4),
),
SizedBox(
width: 5,
),
Text(
"Female",
style: GoogleFonts.montserrat(
textStyle: TextStyle(
fontSize: 14,
color: pressAttention2
? Color(0xffFF4AAB)
: Color(0xff9891B4)),
fontWeight: FontWeight.w600),
)
],
),
color: pressAttention2
? Color(0xffFFECF6)
: Colors.transparent,
shape: RoundedRectangleBorder(
side: BorderSide(
width: 1,
color: pressAttention2
? Color(0xffFF4AAB)
: Color(0xff9891B4)),
borderRadius: BorderRadius.circular(66.0),
),
),
],
),
SizedBox(
height: 5,
),
Container(
width: 305,
child: TextFormField(
validator: (value) {
if (value.isEmpty) {
return 'Please enter pets name';
}
return null;
},
controller: petname,
decoration: InputDecoration(
labelText: "Pets Name",
hintStyle: TextStyle(color: Colors.grey),
focusColor: Colors.grey,
labelStyle:
TextStyle(color: Color(0xffBCB6D1), fontSize: 14),
focusedBorder: UnderlineInputBorder(
borderSide: BorderSide(color: Color(0xff1E163E))),
hintText: "eg:- bruno"),
),
),
SizedBox(
height: 20,
),
Container(
width: 305,
child: TextFormField(
validator: (value) {
int a = int.parse(value);
if (a < 1) {
return 'Number cant be zero';
} else if (value.isEmpty) {
return 'Enter age';
}
return null;
},
controller: hisage,
keyboardType: TextInputType.number,
inputFormatters: <TextInputFormatter>[
FilteringTextInputFormatter.digitsOnly
], // Only nu
decoration: InputDecoration(
labelText: "His Age",
labelStyle:
TextStyle(color: Color(0xffBCB6D1), fontSize: 14),
hintStyle: TextStyle(color: Colors.grey),
focusedBorder: UnderlineInputBorder(
borderSide: BorderSide(color: Color(0xff1E163E))),
border: UnderlineInputBorder(
borderSide: BorderSide(color: Color(0xffBCB6D1))),
hintText: "His Age"),
),
),
SizedBox(
height: 20,
),
Container(
width: 305,
child: TextFormField(
onTap: () => _selectTemperament(),
focusNode: AlwaysDisabledFocusNode(),
initialValue: "$selectedtemperament",
style: TextStyle(fontSize: 16, color: Color(0xff4D466A)),
decoration: InputDecoration(
labelStyle:
TextStyle(color: Color(0xffBCB6D1), fontSize: 14),
suffixIcon: IconButton(
icon: Icon(
FontAwesomeIcons.chevronDown,
color: Color(0xffBCB6D1),
size: 16,
),
onPressed: null,
),
labelText: "Temperament level",
hintStyle: TextStyle(color: Colors.grey),
border: UnderlineInputBorder(
borderSide: BorderSide(color: Color(0xffBCB6D1))),
focusedBorder: UnderlineInputBorder(
borderSide: BorderSide(color: Color(0xff1E163E))),
)),
),
Expanded(child: Container()),
Padding(
padding: const EdgeInsets.only(bottom: 10),
child: CustomButton(
text: "CONTINUE",
onPressed: () {
if (_formKey.currentState.validate()) {
Navigator.pushNamed(context, '/selectbreed');
}
},
),
)
],
),
);
}
@override
bool get wantKeepAlive => true;
}
class AlwaysDisabledFocusNode extends FocusNode {
@override
bool get hasFocus => false;
}
Error
════════ Exception caught by widgets library ═══════════════════════════════════════════════════════
The following assertion was thrown while finalizing the widget tree:
Duplicate GlobalKey detected in widget tree.
The following GlobalKey was specified multiple times in the widget tree. This will lead to parts of the widget tree being truncated unexpectedly, because the second time a key is seen, the previous instance is moved to the new location. The key was:
- [LabeledGlobalKey<FormState>#0229e]
This was determined by noticing that after the widget with the above global key was moved out of its previous parent, that previous parent never updated during this frame, meaning that it either did not update at all or updated before the widget was moved, in either case implying that it still thinks that it should have a child with that global key.
The specific parent that did not update after having one or more children forcibly removed due to GlobalKey reparenting is:
- Padding(padding: EdgeInsets(2.0, 0.0, 2.0, 0.0), dependencies: [Directionality], renderObject: RenderPadding#ed2cb)
A GlobalKey can only be specified on one widget at a time in the widget tree.
When the exception was thrown, this was the stack:
#0 BuildOwner.finalizeTree.<anonymous closure> (package:flutter/src/widgets/framework.dart:2881:15)
#1 BuildOwner.finalizeTree (package:flutter/src/widgets/framework.dart:2906:8)
#2 WidgetsBinding.drawFrame (package:flutter/src/widgets/binding.dart:915:18)
#3 RendererBinding._handlePersistentFrameCallback (package:flutter/src/rendering/binding.dart:302:5)
#4 SchedulerBinding._invokeFrameCallback (package:flutter/src/scheduler/binding.dart:1117:15)
...
════════════════════════════════════════════════════════════════════════════════════════════════════
Please help for this, Thanks in advance
