Bottom Overflowed By Infinity Pixels - windows

Question

I have written this code for a login page and a signup page for a new messenger game.
https://github.com/wileecoyote2point0/math_game
In the emulator I get the error message: Bottom overflowed by Infinity pixels
Can anyone guide me in the right direction?
I tried to implement scrolling view and I tried MainAxisSize.Min
but can't seem to get it to work.

Answer 1

You have used all the rigid Container, Rows and Columns. Instead of Using fixed sized Containers, Use the flexible size container so that they fit the required size.
Here You simple have to put the Expanded Widget Outside the Container widget.
Link of the Working app is Working App Image
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'signup.dart';
void main() => runApp(new MyApp());
class MyApp extends StatelessWidget {
#override
Widget build(BuildContext context) {
return new MaterialApp(
theme: new ThemeData(primarySwatch: Colors.purple),
home: new LoginPage(),
routes: <String, WidgetBuilder>{
'/signup': (BuildContext context) => new SignupPage()
});
}
}
class LoginPage extends StatefulWidget {
#override
State createState() => new LoginPageState();
}
class LoginPageState extends State<LoginPage>
with SingleTickerProviderStateMixin {
Animation<double> _iconAnimation;
AnimationController _iconAnimationController;
#override
void initState() {
super.initState();
_iconAnimationController = AnimationController(
vsync: this,
duration: new Duration(milliseconds: 500),
);
_iconAnimation = new CurvedAnimation(
parent: _iconAnimationController, curve: Curves.easeOut);
_iconAnimation.addListener(() => this.setState(() {}));
_iconAnimationController.forward();
}
#override
Widget build(BuildContext context) {
return new Scaffold(
backgroundColor: Colors.tealAccent,
body: new Stack(
fit: StackFit.expand,
children: <Widget>\[
new Image(
image: new AssetImage("assets/nevroner3.jpg"),
fit: BoxFit.cover,
color: Colors.black87,
colorBlendMode: BlendMode.darken,
),
new Theme(
data: new ThemeData(
brightness: Brightness.dark,
inputDecorationTheme: new InputDecorationTheme(
labelStyle:
new TextStyle(color: Colors.tealAccent, fontSize: 20.0),
),
),
isMaterialAppTheme: true,
child: new Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>\[
new Image(
image: new AssetImage("assets/math_logo3.png"),
),
Expanded(
child: new Container(
padding: EdgeInsets.all(20.0),
child: new Form(
autovalidate: true,
child: new Column(
mainAxisAlignment: MainAxisAlignment.start,
children: <Widget>\[
new TextFormField(
decoration: new InputDecoration(
labelText: "Enter Email",
fillColor: Colors.white,
),
keyboardType: TextInputType.emailAddress,
),
new TextFormField(
decoration: new InputDecoration(
labelText: "Enter Password",
fillColor: Colors.white,
),
obscureText: true,
keyboardType: TextInputType.text,
),
new Padding(
padding: const EdgeInsets.only(top: 20.0),
),
new MaterialButton(
color: Colors.teal,
textColor: Colors.white,
child: new Text("Login"),
onPressed: () => {}),
SizedBox(height: 50.0),
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>\[
Text(
"New to Math Messenger ?",
style: TextStyle(
color: Colors.grey,
decoration: TextDecoration.underline),
)
\],
),
SizedBox(height: 20.0),
InkWell(
onTap: () {
Navigator.of(context).pushNamed('/signup');
},
),
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>\[
Text(
"Register",
style: TextStyle(
color: Colors.tealAccent,
decoration: TextDecoration.underline,
),
),
\],
),
\],
),
),
),
)
\],
),
),
\],
),
);
}
}][1]