The keyboard is getting closed after opening after clicking on the textfield of the dialog box. what a problem I am not understanding.
The keyboard is getting closed after opening after clicking on the textfield of the dialog box. The keyboard is getting closed after opening after clicking on the textfield of the dialog box.
import 'dart:ui';
import 'package:bonanza_flutter/Constants/constants.dart';
import 'package:bonanza_flutter/UIs/Dashboard/dashboard.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
class AddNewMemberPage extends StatefulWidget {
@override
State<AddNewMemberPage> createState() => _AddNewMemberPageState();
}
class _AddNewMemberPageState extends State<AddNewMemberPage> {
@override
Widget build(BuildContext context) {
return Dialog(
insetPadding: EdgeInsets.all(35),
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(10),
),
elevation: 0.0,
backgroundColor: Colors.transparent,
child: dialogContent(context),
);
}
}
double t4Size = 14;
extension widgetExtension on _AddNewMemberPageState {
dialogContent(BuildContext context) {
GlobalKey<FormState> _formKey = GlobalKey();
TextEditingController addPanController = TextEditingController();
return SingleChildScrollView(
child: BackdropFilter(
filter: ImageFilter.blur(sigmaX: 3.3, sigmaY: 3.3),
child: Dialog(
insetPadding: EdgeInsets.only(top: 30, bottom: 30, left: 20, right: 20),
shape:
RoundedRectangleBorder(borderRadius: BorderRadius.circular(15.0)),
// backgroundColor: skyBlue,
child: Container(
padding: EdgeInsets.only(top: 30, bottom: 30),
decoration: new BoxDecoration(
color: Colors.white,
shape: BoxShape.rectangle,
borderRadius: BorderRadius.circular(10),
boxShadow: [
BoxShadow(
color: Colors.black26,
blurRadius: 10.0,
offset: const Offset(0.0, 10.0),
),
],
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisSize: MainAxisSize.min,
children: [
Text(
"Add New Member",
style: TextStyle(
fontSize: tSize26,
color: skyBlue,
fontWeight: FontWeight.w500),
textAlign: TextAlign.center,
),
Form(
key: _formKey,
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Padding(
padding:
const EdgeInsets.only(left: 20.0, right: 20, bottom: 4,top: 20),
child: Text(
"PAN Card",
style: TextStyle(
fontSize: tSize14,
color: darkGreyColor,
fontWeight: FontWeight.w500,
),
),
),
Padding(
padding: const EdgeInsets.only(
left: 20.0, right: 20, bottom: 20),
child: TextFormField(
onChanged: (value) {
if (value.length == 10) {
FocusScope.of(context).unfocus();
}
},
validator: (value) {
if (value!.length == 10) {
return null;
}
return "";
},
maxLength: 10,
textCapitalization: TextCapitalization.characters,
controller: addPanController,
cursorColor: Theme.of(context).cursorColor,
decoration: const InputDecoration(
counterText: "",
hintText: "Enter PAN number",
hintStyle: TextStyle(color: greyColor),
enabledBorder: UnderlineInputBorder(
borderSide:
BorderSide(color: mediumGreyColor, width: 1.7),
),
contentPadding:
EdgeInsets.only(left: 12, right: 12, top: 12),
focusedBorder: UnderlineInputBorder(
borderSide:
BorderSide(color: mediumGreyColor, width: 1.7),
),
prefixIcon: Icon(
Icons.verified_user_rounded,
color: greyColor,
),
),
),
)
],
),
),
Padding(
padding: const EdgeInsets.all(20.0),
child: Text(
"Note: PAN number should be connected to same phone number by which you currently sign in.",
style: TextStyle(
fontSize: tSize14,
color: greyColor,
),
textAlign: TextAlign.center,
),
),
Padding(
padding: const EdgeInsets.only(
top: 00.0, bottom: 4, left: 30, right: 30),
child: SizedBox(
height: 45,
width: MediaQuery.of(context).size.width,
child: ElevatedButton(
style: ElevatedButton.styleFrom(
primary: skyBlue, shadowColor: Colors.transparent),
onPressed: () {
Navigator.pop(context);
Navigator.push(
context,
(MaterialPageRoute(
builder: (context) => Dashboard())));
},
child: Text(
'Add Member',
style: TextStyle(
fontSize: tSize16,
),
),
),
),
),
],
)),
),
),
);
}
}
this is my on click fuction
showDialog(
useRootNavigator: true,
barrierDismissible: false,
barrierColor: skyBlue.withOpacity(0.4),
context: context,
builder: (BuildContext context) {
return AddNewMemberPage();
});
CodePudding user response：
I discovered an issue with your _formKey.
Use the below code to fix your issue :
class AddNewMemberPage extends StatefulWidget {
const AddNewMemberPage({Key? key}) : super(key: key);
@override
State<AddNewMemberPage> createState() => _AddNewMemberPageState();
}
class _AddNewMemberPageState extends State<AddNewMemberPage> {
final GlobalKey<FormState> _formKey = GlobalKey<FormState>();
@override
Widget build(BuildContext context) {
return Dialog(
insetPadding: const EdgeInsets.all(35),
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(10),
),
elevation: 0.0,
backgroundColor: Colors.transparent,
child: dialogContent(
context,
_formKey,
),
);
}
}
double t4Size = 14;
dialogContent(BuildContext context, GlobalKey _key) {
TextEditingController addPanController = TextEditingController();
return SingleChildScrollView(
child: BackdropFilter(
filter: ImageFilter.blur(sigmaX: 3.3, sigmaY: 3.3),
child: Dialog(
insetPadding:
const EdgeInsets.only(top: 30, bottom: 30, left: 20, right: 20),
shape:
RoundedRectangleBorder(borderRadius: BorderRadius.circular(15.0)),
// backgroundColor: skyBlue,
child: Container(
padding: const EdgeInsets.only(top: 30, bottom: 30),
decoration: BoxDecoration(
color: Colors.white,
shape: BoxShape.rectangle,
borderRadius: BorderRadius.circular(10),
boxShadow: const [
BoxShadow(
color: Colors.black26,
blurRadius: 10.0,
offset: Offset(0.0, 10.0),
),
],
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisSize: MainAxisSize.min,
children: [
const Text(
"Add New Member",
style: TextStyle(fontSize: 10, fontWeight: FontWeight.w500),
textAlign: TextAlign.center,
),
Form(
key: _key,
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Padding(
padding: EdgeInsets.only(
left: 20.0, right: 20, bottom: 4, top: 20),
child: Text(
"PAN Card",
style: TextStyle(
fontWeight: FontWeight.w500,
),
),
),
Padding(
padding: const EdgeInsets.only(
left: 20.0, right: 20, bottom: 20),
child: TextFormField(
onChanged: (value) {
if (value.length == 10) {
FocusScope.of(context).unfocus();
}
},
validator: (value) {
if (value!.length == 10) {
return null;
}
return "";
},
maxLength: 10,
textCapitalization: TextCapitalization.characters,
controller: addPanController,
cursorColor: Theme.of(context).cursorColor,
decoration: const InputDecoration(
counterText: "",
hintText: "Enter PAN number",
hintStyle: TextStyle(color: Colors.red),
contentPadding:
EdgeInsets.only(left: 12, right: 12, top: 12),
prefixIcon: Icon(
Icons.verified_user_rounded,
),
),
),
)
],
),
),
const Padding(
padding: EdgeInsets.all(20.0),
child: Text(
"Note: PAN number should be connected to same phone number by which you currently sign in.",
style: TextStyle(),
textAlign: TextAlign.center,
),
),
Padding(
padding: const EdgeInsets.only(
top: 00.0, bottom: 4, left: 30, right: 30),
child: SizedBox(
height: 45,
width: MediaQuery.of(context).size.width,
child: ElevatedButton(
style: ElevatedButton.styleFrom(
shadowColor: Colors.transparent),
onPressed: () {
Navigator.pop(context);
},
child: const Text(
'Add Member',
style: TextStyle(),
),
),
),
),
],
)),
),
),
);
}