[英]Flutter : screen not scrolling up when keyboard appears in android
I'm trying to make login screen in flutter我正在尝试在 flutter 中制作登录屏幕
I'm using below code我正在使用下面的代码
ModalProgressHUD(
dismissible: false,
child: Container(
color: Colors.white,
child: SafeArea(
child: Scaffold(
body: Container(
height: double.infinity,
decoration: BoxDecoration(
image: DecorationImage(
image: AssetImage('assets/images/login_bg.png'),
fit: BoxFit.fill,
),
shape: BoxShape.rectangle,
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisSize: MainAxisSize.max,
children: <Widget>[
Padding(
padding: const EdgeInsets.only(left: 15.0),
child: IconButton(
iconSize: 70,
icon: Image.asset(
'assets/images/back.png',
),
onPressed: () {
Navigator.pop(context);
},
),
),
// Spacer(),
Expanded(
child: SingleChildScrollView(
child: Column(
mainAxisSize: MainAxisSize.max,
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Column(
mainAxisSize: MainAxisSize.max,
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Column(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisSize: MainAxisSize.max,
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Container(
margin: const EdgeInsets.only(
top: 30, bottom: 40),
child: Image.asset(
'assets/images/oricon_logo.png',
height: 100.0,
width: 100.0,
),
),
Column(
crossAxisAlignment:
CrossAxisAlignment.center,
mainAxisSize: MainAxisSize.max,
mainAxisAlignment: MainAxisAlignment.end,
children: <Widget>[
Form(
key: _formKey,
child: new Theme(
data: ThemeData(
accentColor: Colors.purple,
primaryColor:
AppColors.colorBlue,
inputDecorationTheme:
new InputDecorationTheme(
labelStyle:
new TextStyle(
color: AppColors.colorBlue,
fontSize: 20.0,
))),
child: Padding(
padding:
const EdgeInsets.all(20.0),
child: Column(
crossAxisAlignment:
CrossAxisAlignment.center,
children: <Widget>[
TextFormField(
keyboardType:
TextInputType
.emailAddress,
textCapitalization:
TextCapitalization
.none,
focusNode:
_emailFocusNode,
controller:
emailTextController,
maxLines: 1,
maxLength: 40,
// textCapitalization:
// TextCapitalization.none,
style: TextStyle(
color: AppColors
.colorGray),
decoration:
new InputDecoration(
labelText:
"Email address",
counterText: '',
labelStyle:
TextStyle(
fontFamily:
'h_roman',
color: _emailFocusNode
.hasFocus
? AppColors
.colorBlue
: AppColors
.colorGray,
),
enabledBorder:
UnderlineInputBorder(
borderSide: BorderSide(
color: AppColors
.colorGray),
),
focusedBorder:
UnderlineInputBorder(
borderSide: BorderSide(
color: AppColors
.colorBlue),
),
border:
UnderlineInputBorder()),
validator:
(String email) {
if (email.length == 0) {
return 'Please enter email address';
} else {
if (!RegExp(
r"^[a-zA-Z0-9.]+@[a-zA-Z0-9]+\.[a-zA-Z]+")
.hasMatch(
email)) {
return 'Please enter valid email address';
} else {
return null;
}
}
},
onSaved: (String val) {
// _email = val;
},
onChanged: (text) {
// _email = text;
},
),
TextFormField(
focusNode:
_passwordFocusNode,
controller:
passTextController,
maxLength: 20,
style: TextStyle(
fontFamily: 'h_roman',
color: AppColors
.colorGray),
decoration:
new InputDecoration(
counterText: '',
suffixIcon:
IconButton(
icon: Icon(
// Based on passwordVisible state choose the icon
passwordVisible
? Icons
.visibility
: Icons
.visibility_off,
color: AppColors
.colorGray,
),
onPressed: () {
setState(() {
passwordVisible =
!passwordVisible;
});
},
),
labelText:
"Password",
labelStyle:
TextStyle(
fontFamily:
'h_roman',
color: _passwordFocusNode
.hasFocus
? AppColors
.colorBlue
: AppColors
.colorGray,
),
enabledBorder:
UnderlineInputBorder(
borderSide: BorderSide(
color: AppColors
.colorGray),
),
focusedBorder:
UnderlineInputBorder(
borderSide: BorderSide(
color: AppColors
.colorBlue),
),
border:
UnderlineInputBorder()),
keyboardType:
TextInputType.text,
obscureText:
passwordVisible,
validator: (String pass) {
if (pass.length == 0) {
return 'Please enter password';
} else {
return null;
}
},
),
Align(
alignment: Alignment
.bottomRight,
child: Padding(
padding:
const EdgeInsets
.only(
top: 20),
child:
GestureDetector(
onTap: () {
showContactUsDialog(
context);
},
child: Padding(
padding:
const EdgeInsets
.all(8.0),
child: Text(
"Need help?",
style: TextStyle(
fontFamily:
'h_roman',
color: AppColors
.colorBlue,
fontWeight:
FontWeight
.normal,
fontSize:
15.0),
),
),
),
)),
Container(
margin:
const EdgeInsets.only(
top: 40.0),
child: MaterialButton(
textColor: Colors.white,
minWidth: 250.0,
padding:
const EdgeInsets
.all(15.0),
color:
AppColors.colorBlue,
child: Text(
"Login",
style: TextStyle(
fontFamily:
'h_bold',
color:
Colors.white,
// fontWeight: FontWeight.bold,
fontSize: 20.0),
),
shape: RoundedRectangleBorder(
borderRadius:
BorderRadius
.circular(
50.0)),
onPressed: () {
if (Utils()
.isEmptyString(
_token)) {
if (_formKey
.currentState
.validate()) {
debugPrint(
"Email Address -> " +
emailTextController
.text);
debugPrint(
"Password -> " +
passTextController
.text);
Utils()
.getStatus()
.then(
(connectionResult) {
if (connectionResult) {
setState(() {
_saving =
true;
});
_callLoginAPI(
emailTextController
.text,
passTextController
.text);
} else {
Utils().showMessageDialog(
context,
"No internet connection");
}
});
}
} else {
Utils().showMessageDialog(
context,
"Notification token is invalid");
}
},
splashColor: Colors
.redAccent[100],
),
),
],
),
)),
),
],
),
],
),
],
),
// Container(
// margin:
// const EdgeInsets.only(top: 60, bottom: 20),
// child: Row(
// mainAxisAlignment: MainAxisAlignment.center,
// children: <Widget>[
//// FlutterLogo(
//// size: 40,
//// ),
//// FlutterLogo(
//// size: 40,
//// ),
// ],
// ),
// ),
],
),
),
)
],
),
),
),
),
),
inAsyncCall: _saving);
the above code is working fine in ios device but in android screen not scrolling up when keyboard appears上面的代码在 ios 设备中工作正常,但在 android 屏幕出现键盘时不向上滚动
I have also checked below some links and post but it didn't help to solve my issue我还检查了下面的一些链接和帖子,但它无助于解决我的问题
If need more information please do let me know.如果需要更多信息,请告诉我。 Thanks in advance.提前致谢。 Your efforts will be appreciated.您的努力将不胜感激。
You can just scroll your input fields up by using resizeToAvoidBottomInset: false property in Scaffold widget instead of screen scrolling up.您可以使用脚手架小部件中的 resizeToAvoidBottomInset: false 属性向上滚动输入字段,而不是向上滚动屏幕。
Try with this one, don't use Expanded and SingleChildScrollView used in top of column not second one.试试这个,不要在列的顶部而不是第二列中使用 Expanded 和 SingleChildScrollView。
SingleChildScrollView(
child: Column(
children: <Widget>[
// your other child widgets
],
),
),
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.