How to make UI UX Design in Flutter || Login Screen || Sign Up Screen

Use Android Studio for Designing of UI UX.

 Following Code for making UI UX Design in Flutter 

import 'package:flutter/material.dart';

class LoginScreen extends StatelessWidget {
  const LoginScreen({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: SingleChildScrollView(
        child: Column(
          children: [
            const SizedBox(
              height: 70,
            ),
            Row(
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                const Image(
                    width: 85, height: 100, image: AssetImage('assets/logo.png')),
                const SizedBox(
                  width: 10,
                ),
                Column(
                  children: const [
                    Text(
                      "CodeWith",
                      style: TextStyle(
                        fontSize: 24,
                        fontFamily: 'Rubik Medium',
                        fontWeight: FontWeight.w900,
                      ),
                    ),
                    Text(
                      "Friends",
                      style: TextStyle(
                          fontSize: 24,
                          fontWeight: FontWeight.w900,
                          fontFamily: 'Rubik Medium',
                          color: Colors.blueAccent),
                    ),
                  ],
                )
              ],
            ),
            const SizedBox(
              height: 20,
            ),
            Column(
              children: const [
                Text(
                  "Log in",
                  style: TextStyle(
                      fontSize: 24,
                      fontFamily: 'Rubik Medium',
                      color: Color(0xff000000),
                    fontWeight: FontWeight.w900,
                  ),
                ),
                SizedBox(
                  height: 20,
                ),
                Center(
                  child: Text(
                    textAlign:TextAlign.center,
                      "Whereas disregard and contempt \nfor human rights have resulted",
                      style: TextStyle(
                          fontSize: 16,
                          fontFamily: 'Rubik Regular',
                          color: Color(0xff4c5980)),

                      )),

              ],
            ),
            const SizedBox(
              height: 20,
            ),

            Column(
              children:  [
                const Padding(
                  padding: EdgeInsets.all(10.0),
                  child: TextField(
                    decoration: InputDecoration(
                      prefixIcon: Icon(Icons.email_outlined,color: Colors.grey),
                      hintText: 'EMAIL',
                      fillColor:  Color(0xffF8F9FA),
                      filled: true,
                      border: OutlineInputBorder(
                        borderSide: BorderSide(
                          width: 5,
                        ),
                      )

                    ),
                  ),
                ),
                const SizedBox(
                  height: 5,

                ),
                const Padding(
                  padding: EdgeInsets.all(10.0),
                  child: TextField(

                    decoration: InputDecoration(
                        prefixIcon: Icon(Icons.lock_open,color: Colors.grey),
                        suffixIcon: Icon(Icons.remove_red_eye_rounded,color: Colors.grey,),
                        hintText: 'Password',
                        fillColor:  Color(0xffF8F9FA),
                        filled: true,
                        border: OutlineInputBorder(
                          borderSide: BorderSide(
                          color:  Color(0xffe4e7eb)
                          ),
                        )

                    ),
                  ),
                ),
                //forgot password
                Padding(
                  padding:  const EdgeInsets.only(right: 20,top: 10),
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.end,
                    children:  const [
                      Text(
                        "Forgotten Password",textAlign: TextAlign.right,),
                    ],
                  ),
                ),

                const SizedBox(
                  height: 50,
                ),
                //  login button
                Container(
                  height: 50,
                  width: 300,
                  decoration: BoxDecoration(
                    borderRadius: BorderRadius.circular(10),
                    color: Colors.blueAccent,
                  ),

                  child:  const Center(
                    child: Text(
                      "Log In",
                      style: TextStyle(fontSize: 18, fontFamily: 'Rubik Regular',color: Colors.white),
                    ),
                  ),
                ),
                const SizedBox(
                  height: 15,
                ),
                Row(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children:const [
                    Text(
                      "Don't have any account?",
                      textAlign: TextAlign.center,
                      style: TextStyle(
                          fontSize: 16,
                          fontFamily: 'Rubik Regular',
                          color: Color(0xff4c5980)),
                    ),
              ],
            ),
          ],
        ),
  ]
      ),
    ),
    );
  }
}