diff --git a/README.md b/README.md index c3b927d..35ff79e 100644 --- a/README.md +++ b/README.md @@ -2,6 +2,13 @@ A new Flutter project. +# Content of DAY 9 ([Tutorial](https://www.youtube.com/watch?v=rq0F4HTCFMg&list=PLrjrqTcKCnhTXI2GyPkaQF47inLp6LoIC&index=9)) + +- Material Drawer +- DevTools +- ListView +- NetworkImage + ## Getting Started This project is a starting point for a Flutter application. diff --git a/assets/images/hey.png b/assets/images/hey.png new file mode 100644 index 0000000..caeca23 Binary files /dev/null and b/assets/images/hey.png differ diff --git a/lib/main.dart b/lib/main.dart index 81f5db5..9ea57bb 100644 --- a/lib/main.dart +++ b/lib/main.dart @@ -1,5 +1,6 @@ import 'package:flutter/material.dart'; import 'package:flutter_catalog/pages/login_page.dart'; +import 'package:flutter_catalog/utils/routes.dart'; import 'package:google_fonts/google_fonts.dart'; import 'pages/home_page.dart'; @@ -19,11 +20,12 @@ class MyApp extends StatelessWidget { darkTheme: ThemeData( brightness: Brightness.dark, ), - initialRoute: "/", + debugShowCheckedModeBanner: false, + initialRoute: MyRoutes.homeRoute, routes: { "/": (context) => LoginPage(), - "/home": (context) => HomePage(), - "/login": (context) => LoginPage() + MyRoutes.homeRoute: (context) => HomePage(), + MyRoutes.loginRoute: (context) => LoginPage() }, ); } diff --git a/lib/pages/home_page.dart b/lib/pages/home_page.dart index 487caed..43112ee 100644 --- a/lib/pages/home_page.dart +++ b/lib/pages/home_page.dart @@ -1,4 +1,5 @@ import 'package:flutter/material.dart'; +import 'package:flutter_catalog/widgets/drawer.dart'; class HomePage extends StatelessWidget { final int days = 30; @@ -14,7 +15,7 @@ class HomePage extends StatelessWidget { child: Text("Welcome to $days days of flutter by $name"), ), ), - drawer: Drawer(), + drawer: MyDrawer(), ); } } diff --git a/lib/pages/login_page.dart b/lib/pages/login_page.dart index 73465b5..d176d74 100644 --- a/lib/pages/login_page.dart +++ b/lib/pages/login_page.dart @@ -1,61 +1,129 @@ import 'package:flutter/material.dart'; +import 'package:flutter_catalog/utils/routes.dart'; + +class LoginPage extends StatefulWidget { + @override + _LoginPageState createState() => _LoginPageState(); +} + +class _LoginPageState extends State { + String name = ""; + bool changeButton = false; + + final _formKey = GlobalKey(); + + moveToHome(BuildContext context) async { + if (_formKey.currentState.validate()) { + setState(() { + changeButton = true; + }); + await Future.delayed(Duration(seconds: 1)); + await Navigator.pushNamed(context, MyRoutes.homeRoute); + setState(() { + changeButton = false; + }); + } + } -class LoginPage extends StatelessWidget { @override Widget build(BuildContext context) { return Material( color: Colors.white, - child: Column( - children: [ - Image.asset( - "assets/images/login_image.png", - fit: BoxFit.cover, - ), - SizedBox( - height: 20.0, - ), - Text( - "Welcome", - style: TextStyle( - fontSize: 24, - fontWeight: FontWeight.bold, - ), - ), - SizedBox( - height: 20.0, - ), - Padding( - padding: - const EdgeInsets.symmetric(vertical: 16.0, horizontal: 32.0), - child: Column( - children: [ - TextFormField( - decoration: InputDecoration( - hintText: "Enter username", - labelText: "Username", - ), - ), - TextFormField( - obscureText: true, - decoration: InputDecoration( - hintText: "Enter password", - labelText: "Password", - ), + child: SingleChildScrollView( + child: Form( + key: _formKey, + child: Column( + children: [ + Image.asset( + "assets/images/hey.png", + fit: BoxFit.cover, + ), + SizedBox( + height: 20.0, + ), + Text( + "Welcome $name", + style: TextStyle( + fontSize: 28, + fontWeight: FontWeight.bold, ), - SizedBox( - height: 20.0, + ), + SizedBox( + height: 20.0, + ), + Padding( + padding: const EdgeInsets.symmetric( + vertical: 16.0, horizontal: 32.0), + child: Column( + children: [ + TextFormField( + decoration: InputDecoration( + hintText: "Enter username", + labelText: "Username", + ), + validator: (value) { + if (value.isEmpty) { + return "Username cannot be empty"; + } + + return null; + }, + onChanged: (value) { + name = value; + setState(() {}); + }, + ), + TextFormField( + obscureText: true, + decoration: InputDecoration( + hintText: "Enter password", + labelText: "Password", + ), + validator: (value) { + if (value.isEmpty) { + return "Password cannot be empty"; + } else if (value.length < 6) { + return "Password length should be atleast 6"; + } + + return null; + }, + ), + SizedBox( + height: 40.0, + ), + Material( + color: Colors.deepPurple, + borderRadius: + BorderRadius.circular(changeButton ? 50 : 8), + child: InkWell( + onTap: () => moveToHome(context), + child: AnimatedContainer( + duration: Duration(seconds: 1), + width: changeButton ? 50 : 150, + height: 50, + alignment: Alignment.center, + child: changeButton + ? Icon( + Icons.done, + color: Colors.white, + ) + : Text( + "Login", + style: TextStyle( + color: Colors.white, + fontWeight: FontWeight.bold, + fontSize: 18), + ), + ), + ), + ), + ], ), - ElevatedButton( - child: Text("Login"), - style: TextButton.styleFrom(), - onPressed: () { - print("Hi Codepur"); - }, - ) - ], - ), - ) - ], + ) + ], + ), + ), )); } } diff --git a/lib/utils/routes.dart b/lib/utils/routes.dart new file mode 100644 index 0000000..510c16a --- /dev/null +++ b/lib/utils/routes.dart @@ -0,0 +1,4 @@ +class MyRoutes { + static String loginRoute = "/login"; + static String homeRoute = "/home"; +} diff --git a/lib/widgets/drawer.dart b/lib/widgets/drawer.dart new file mode 100644 index 0000000..298d27b --- /dev/null +++ b/lib/widgets/drawer.dart @@ -0,0 +1,70 @@ +import 'package:flutter/cupertino.dart'; +import 'package:flutter/material.dart'; + +class MyDrawer extends StatelessWidget { + @override + Widget build(BuildContext context) { + final imageUrl = + "https://avatars.githubusercontent.com/u/12619420?s=460&u=26db98cbde1dd34c7c67b85c240505a436b2c36d&v=4"; + return Drawer( + child: Container( + color: Colors.deepPurple, + child: ListView( + padding: EdgeInsets.zero, + children: [ + DrawerHeader( + padding: EdgeInsets.zero, + child: UserAccountsDrawerHeader( + margin: EdgeInsets.zero, + accountName: Text("Pawan Kumar"), + accountEmail: Text("mtechviral@gmail.com"), + currentAccountPicture: CircleAvatar( + backgroundImage: NetworkImage(imageUrl), + ), + ), + ), + ListTile( + leading: Icon( + CupertinoIcons.home, + color: Colors.white, + ), + title: Text( + "Home", + textScaleFactor: 1.2, + style: TextStyle( + color: Colors.white, + ), + ), + ), + ListTile( + leading: Icon( + CupertinoIcons.profile_circled, + color: Colors.white, + ), + title: Text( + "Profile", + textScaleFactor: 1.2, + style: TextStyle( + color: Colors.white, + ), + ), + ), + ListTile( + leading: Icon( + CupertinoIcons.mail, + color: Colors.white, + ), + title: Text( + "Email me", + textScaleFactor: 1.2, + style: TextStyle( + color: Colors.white, + ), + ), + ) + ], + ), + ), + ); + } +}