Flutter Basic Form | Flutter Basic Widget
Hi, In this Flutter tutorial we are going to learn how to make simple form in flutter by TextWidget, TextField, RaisedButton, FlatButton.
import 'package:flutter/material.dart';
void main() {
runApp(new MaterialApp(home: new Login()));
}
class Login extends StatefulWidget {
@override
_LoginState createState() => _LoginState();
}
class _LoginState extends State<Login> {
@override
Widget build(BuildContext context) {
return MaterialApp(
debugShowCheckedModeBanner: false,
title: "LoginPage",
theme: ThemeData(
primarySwatch: Colors.lightBlue
),
home: Scaffold(
backgroundColor: Colors.lightBlueAccent,
resizeToAvoidBottomPadding: false,
appBar: AppBar(
title: Text(
"LoginPage"),
),
body: Center(
child: Column(
children: <Widget>[
Container(
child: Text("Welcom to Flutter",
style: new TextStyle(
fontSize: 30.0,
fontWeight: FontWeight.bold,
),
),
margin: EdgeInsets.only(top: 10.0),
),
Container(
margin: EdgeInsets.only(top: 5.0,right: 25.0 ),
child: FlutterLogo(
size: 100,
)),
Container(
margin: EdgeInsets.only(top: 20.0,right: 90.0),
child: Text(
"Log in to your account",
style: new TextStyle(
fontWeight: FontWeight.bold,
fontSize: 15.0,
),
),
),
Container(
height: 40.0,
width: 250.0,
margin: EdgeInsets.only(top: 10.0),
child: TextField(
decoration: InputDecoration(
labelText: "User Name",
border: OutlineInputBorder(),
),
),
),
Container(
height: 40.0,
width: 250.0,
margin: EdgeInsets.only(top: 10.0),
child: TextField(
decoration: InputDecoration(
labelText: "Password",
border: OutlineInputBorder(),
),
),
),
Container(
height: 40.0,
width: 250.0,
margin: EdgeInsets.only(top: 40.0,),
child: RaisedButton(
shape: OutlineInputBorder(),
color: Colors.blue,
onPressed: (){},
child: Text("Login"),
),
),
Container(
child: Text("______________________or______________________",
style: new TextStyle(
),
),
margin: EdgeInsets.only(top: 10.0),
),
Container(
height: 30.0,
margin: EdgeInsets.only(top: 10.0),
child: RaisedButton(onPressed: (){},
color: Colors.green,
child: Text("Create New Account"),
),
),
Container(
child: FlatButton(onPressed: (){},
child: Text("Forgotton Password?"),
),
),
],
),
),
),
);
}
}
Comments