【发布时间】：2020-01-03 18:30:03
【问题描述】：
我正在创建一个页面，在其中创建一些 TextFormField 并将它们放入列表视图中，并且该列表视图位于堆栈小部件中。当我点击TextFormField 时，键盘出现并且背景图像（我放入堆栈中的中心标签）根据剩余的屏幕进行调整。我使用resizeToAvoidBottomInset : false，以避免调整屏幕大小，但是通过放置这个我无法滚动没有此属性resizeToAvoidBottomInset : false 时可滚动的列表视图。
import 'package:flutter/material.dart';
import 'main.dart';
import 'package:flutter/services.dart';
import 'package:url_launcher/url_launcher.dart';
void main() {
runApp(MaterialApp(
home: Contactus(),
));
}
class Contactus extends StatelessWidget {
static final _formkey = GlobalKey<FormState>();
@override
Widget build(BuildContext context) {
SystemChrome.setPreferredOrientations(
[DeviceOrientation.landscapeLeft, DeviceOrientation.landscapeRight]);
return Scaffold(
resizeToAvoidBottomInset: false,
body: Stack(
children: <Widget>[
Center(
child: Image.asset(
'imges/bg.png',
fit: BoxFit.fill,
),
),
Center(
child: ListView(
children: <Widget>[
Container(
child: Stack(
children: <Widget>[
Form(
key: _formkey,
child: Padding(
padding: const EdgeInsets.only(
right: 80, top: 10, bottom: 10, left: 80),
child: Column(
children: <Widget>[
Stack(
children: <Widget>[
Center(
child: Container(
margin: EdgeInsets.only(
left: 20, right: 20, top: 0),
child: Row(
mainAxisAlignment:
MainAxisAlignment.center,
children: <Widget>[
Expanded(
child: Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.all(
Radius.circular(12.0)),
color: Colors.white,
),
child: TextFormField(
textAlign: TextAlign.center,
style: TextStyle(
color: Colors.white,
fontWeight:
FontWeight.w300),
decoration: InputDecoration(
hintText: "Your First Name",
hintStyle: TextStyle(
fontWeight:
FontWeight.w300,
color: Colors.black),
prefixIcon:
Icon(Icons.account_box),
errorStyle: TextStyle(
color: Colors.yellowAccent,
fontSize: 15,
),
border: OutlineInputBorder(
// borderRadius: BorderRadius.circular(25.0),
borderSide: BorderSide(),
),
),
),
),
),
SizedBox(
width: 20.0,
),
Expanded(
child: Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.all(
Radius.circular(12.0)),
color: Colors.white,
),
child: TextFormField(
textAlign: TextAlign.center,
style: TextStyle(
color: Colors.white,
fontWeight:
FontWeight.w300),
decoration: InputDecoration(
hintText: "Your Last Name",
hintStyle: TextStyle(
fontWeight:
FontWeight.w300,
color: Colors.black),
prefixIcon:
Icon(Icons.account_box),
errorStyle: TextStyle(
color: Colors.yellowAccent,
fontSize: 15,
),
border: OutlineInputBorder(
// borderRadius: BorderRadius.circular(25.0),
borderSide: BorderSide(),
),
),
),
),
),
],
),
),
),
SizedBox(
height: 10.0,
),
Center(
child: Container(
margin: EdgeInsets.only(
left: 20, right: 20, top: 60),
child: Row(
mainAxisAlignment:
MainAxisAlignment.center,
children: <Widget>[
Expanded(
child: Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.all(
Radius.circular(12.0)),
color: Colors.white,
),
child: TextFormField(
textAlign: TextAlign.center,
style: TextStyle(
color: Colors.white,
fontWeight:
FontWeight.w300),
decoration: InputDecoration(
hintText: "Email ADDRESS",
hintStyle: TextStyle(
fontWeight:
FontWeight.w300,
color: Colors.black),
prefixIcon: Icon(Icons.email),
errorStyle: TextStyle(
color: Colors.yellowAccent,
fontSize: 15,
),
border: OutlineInputBorder(
// borderRadius: BorderRadius.circular(25.0),
borderSide: BorderSide(),
),
),
),
),
),
SizedBox(
width: 20.0,
),
Expanded(
child: Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.all(
Radius.circular(12.0)),
color: Colors.white,
),
child: TextFormField(
textAlign: TextAlign.center,
style: TextStyle(
color: Colors.white,
fontWeight:
FontWeight.w300),
decoration: InputDecoration(
hintText: "Phone Number",
hintStyle: TextStyle(
fontWeight:
FontWeight.w300,
color: Colors.black),
prefixIcon: Icon(Icons.phone),
errorStyle: TextStyle(
color: Colors.yellowAccent,
fontSize: 15,
),
border: OutlineInputBorder(
// borderRadius: BorderRadius.circular(25.0),
borderSide: BorderSide(),
),
),
),
),
),
],
),
),
),
SizedBox(
height: 10.0,
),
Center(
child: Container(
margin: EdgeInsets.only(
left: 20, right: 20, top: 120),
child: Row(
mainAxisAlignment:
MainAxisAlignment.center,
children: <Widget>[
Expanded(
child: Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.all(
Radius.circular(15.0)),
color: Colors.white,
),
child: TextFormField(
style: TextStyle(
color: Colors.white,
fontWeight: FontWeight.w300,
),
validator: (String value) {
if (value.isEmpty) {
return 'please add some value';
}
},
maxLines: 8,
decoration: InputDecoration(
hintText:
"Your message starts here.....",
focusedBorder:
OutlineInputBorder(
borderSide: BorderSide(
color: Colors
.transparent)),
hintStyle: TextStyle(
fontWeight:
FontWeight.w300,
color: Colors.black),
prefixIcon: Padding(
padding:
const EdgeInsetsDirectional
.only(top: 0),
child: Icon(Icons
.message), // myIcon is a 48px-wide widget.
),
errorStyle: TextStyle(
color: Colors.yellowAccent,
fontSize: 15,
),
),
),
),
),
],
),
),
),
SizedBox(
height: 10.0,
),
Center(
child: Container(
margin:
EdgeInsets.only(right: 20, top: 290),
child: Row(
mainAxisAlignment:
MainAxisAlignment.end,
children: <Widget>[
Container(
width: 100,
height: 56,
decoration: BoxDecoration(
borderRadius: BorderRadius.all(
Radius.circular(12.0)),
color: Colors.white,
),
child: FlatButton(
color: Colors.white,
onPressed: () {
if (_formkey.currentState
.validate()) {
_launchURL(
'd.m.javid95@gmail.com',
'Flutter Email Test',
'Hello Flutter');
}
},
child: Text('Send mail'),
),
),
],
),
),
),
],
)
],
),
),
),
],
))
],
),
),
FlatButton(
onPressed: () {
Navigator.pop(context);
},
child: Icon(
Icons.arrow_back,
color: Colors.white,
size: 30,
),
// color: Colors.transparent,
),
],
));
}
}
_launchURL(String toMailId, String subject, String body) async {
var url = 'mailto:$toMailId?subject=$subject&body=$body';
if (await canLaunch(url)) {
await launch(url);
} else {
throw 'Could not launch $url';
}
}
我希望列表视图能够滚动，而无需在打开键时调整屏幕大小。
【问题讨论】：
-
你有没有接受过任何答案，请保持SO精神。
标签： flutter dart flutter-layout flutter-listview