After wrapping my Column widget with SingleChildScrollView widget, my screen got cut like this:
我找不到填充最大高度或作为SingleChildScrolledView参数的东西.添加SingleChild的原因是,当我打开TextField小部件并弹出键盘时,最后一个TextField说它"溢出",作为一种解决方案,我发现应该添加TextField.提前感谢:)
class _RegisterScreenState extends State<RegisterScreen> {
// TextFields controllers
final _emailController = TextEditingController();
final _passwordController = TextEditingController();
final _confirmPasswordController = TextEditingController();
@override
Widget build(BuildContext context) {
return Scaffold(
body: Container(
padding: const EdgeInsets.fromLTRB(36, 0, 36, 0),
width: double.infinity,
color: const Color(0xFF26243C),
child: SingleChildScrollView(
reverse: true,
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const SizedBox(height: 72),
const Text("Get Started",
textAlign: TextAlign.center,
style: TextStyle(
fontFamily: 'Chalet',
fontSize: 48,
fontWeight: FontWeight.w100,
color: Color(0xFFDF862D),
height: 1.0
),),
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
const Text('Already have an account?',
textAlign: TextAlign.center,
style: TextStyle(color: Color(0xFFF6F9F8))),
TextButton(
onPressed: () {
// take you to login page
Navigator.push(context, MaterialPageRoute(builder: (context) => const RegisterScreen()));
},
child: const Text(
'Sign In!',
style: TextStyle(
color: Color(0xFFF6F9F8), fontWeight: FontWeight.bold)
))
],
),
const SizedBox(height: 65),
const Text("Your e-mail",
style: TextStyle(
fontSize: 16,
fontFamily: 'Montserrat',
fontWeight: FontWeight.bold,
color: Color(0xFFF6F9F8)
),),
const SizedBox(height: 12),
// email textField
SizedBox(
width: MediaQuery.of(context).size.width * 0.85,
child: TextField(
controller: _emailController,
decoration: InputDecoration(
filled: true,
fillColor: const Color(0xFFF6F9F8),
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(12),
borderSide: BorderSide.none
),
hintText: 'Enter your e-mail',
hintStyle: const TextStyle(
color:Color.fromARGB(255, 174, 173, 173)
)
),
),
),
const SizedBox(height: 12),
const Text("Your password",
style: TextStyle(
fontSize: 16,
fontFamily: 'Montserrat',
fontWeight: FontWeight.bold,
color: Color(0xFFF6F9F8)
),),
const SizedBox(height: 12),
// password textField
SizedBox(
width: MediaQuery.of(context).size.width * 0.85,
child: TextField(
controller: _passwordController,
decoration: InputDecoration(
filled: true,
fillColor: const Color(0xFFF6F9F8),
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(12),
borderSide: BorderSide.none
),
hintText: 'Enter your password',
hintStyle: const TextStyle(
color:Color.fromARGB(255, 174, 173, 173)
)
),
),
),
const SizedBox(height: 12),
const Text("Confirm your password",
style: TextStyle(
fontSize: 16,
fontFamily: 'Montserrat',
fontWeight: FontWeight.bold,
color: Color(0xFFF6F9F8)
),),
const SizedBox(height: 12),
// confirm password textField
SizedBox(
width: MediaQuery.of(context).size.width * 0.85,
child: TextField(
controller: _confirmPasswordController,
decoration: InputDecoration(
filled: true,
fillColor: const Color(0xFFF6F9F8),
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(12),
borderSide: BorderSide.none
),
hintText: 'Confirm your password',
hintStyle: const TextStyle(
color:Color.fromARGB(255, 174, 173, 173)
)
),
),
),
],
),
),
),
);
}
}
将BoxConstrains.Expand()添加到My Container Constraints后,发生了以下情况:
Scaffold(
body: Container(
// ...
constraints: BoxConstraints.expand(), // Added this
child: SingleChildScrollView(
// ...
),
),
)