Creating a Login screen in Flutter

 

import 'package:flutter/cupertino.dart';

import 'package:flutter/material.dart';
// Import for Android features.

void main() {
  runApp(MyApp());
}

//This is main homepage or we can say main body
class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    Color color = Theme.of(context).primaryColor;

    return MaterialApp(
      title: 'Login Page',
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          title: Center(
              child: Text(
            'Login Page',
            style: TextStyle(fontWeight: FontWeight.bold),
          )),
        ),
        body: Container(
          decoration: BoxDecoration(
            gradient: LinearGradient(
              colors:[Color(0xFFffecd2),
                Color(0xFFfecfef)
              ]
            )
          ),
          child: Stack(
            fit: StackFit.expand,
            children: [
              //Image.asset("assets/images/lake_image.jpg",fit:BoxFit.cover,
              // colorBlendMode: BlendMode.colorBurn,),
              Column(
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  FlutterLogo(
                    size: 100.0,
                  ),
                  SizedBox(
                    height: 15,
                  ),
                  Container(
                    width: 300,
                    child: Column(
                      children: [
                        Form(
                          child: TextFormField(
                            decoration: InputDecoration(
                              focusedBorder: OutlineInputBorder(
                                  borderSide:
                                      BorderSide(color: Colors.orange, width: 2,),
                              borderRadius: BorderRadius.circular(25)),
                              enabledBorder: OutlineInputBorder(
                                  borderSide:
                                  BorderSide( width: 2),
                                borderRadius: BorderRadius.circular(25)

                              ),
                              hintText: "Enter Email here...",
                              label: Text('Email'),
                            ),
                            keyboardType: TextInputType.emailAddress,
                          ),
                        ),
                        SizedBox(
                          height: 15,
                        ),
                        Form(
                          child: TextFormField(
                            obscureText: true,
                            decoration: InputDecoration(
                              focusedBorder: OutlineInputBorder(
                                  borderSide:
                                      BorderSide(color: Colors.orange, width: 2),
                                  borderRadius: BorderRadius.circular(25)),
                              enabledBorder: OutlineInputBorder(
                                borderSide:
                                BorderSide( width: 2),
                                  borderRadius: BorderRadius.circular(25)

                              ),
                              hintText: "Enter Password here...",
                              label: Text('Password'),
                            ),
                            keyboardType: TextInputType.text,
                          ),
                        ),
                        SizedBox(
                          height: 15,
                        ),
                        ElevatedButton (onPressed: (){},
                            child: Text("Login"))

                      ],
                    ),
                  )
                ],
              ),
            ],
          ),
        ));
  }
}