Day 6 : Stateful, Animated Container, Future Delay

adityaashinde · Sep 29, 2023 · 18375cd · 18375cd
1 parent 6626f47
commit 18375cd
Showing 1 changed file with 50 additions and 6 deletions.
diff --git a/flutter_catalog/lib/pages/login_page.dart b/flutter_catalog/lib/pages/login_page.dart
@@ -1,7 +1,15 @@
 import 'package:flutter/material.dart';
 import 'package:flutter_catalog/utils/routes.dart';
 
-class LoginPage extends StatelessWidget {
+class LoginPage extends StatefulWidget {
+  @override
+  State<LoginPage> createState() => _LoginPageState();
+}
+
+class _LoginPageState extends State<LoginPage> {
+  String name = "";
+  bool changedButton = false;
+
   @override
   Widget build(BuildContext context) {
     return Material(
@@ -18,7 +26,7 @@ class LoginPage extends StatelessWidget {
                 height: 20.0,
               ),
               Text(
-                "Login Page",
+                "Wel-Come",
                 style: TextStyle(
                   fontSize: 22,
                   fontWeight: FontWeight.bold,
@@ -37,6 +45,10 @@ class LoginPage extends StatelessWidget {
                         hintText: "Enter Username",
                         labelText: "Username",
                       ),
+                      onChanged: (value) {
+                        name = value;
+                        setState(() {});
+                      },
                     ),
                     TextFormField(
                       obscureText: true,
@@ -48,12 +60,44 @@ class LoginPage extends StatelessWidget {
                     SizedBox(
                       height: 20.0,
                     ),
-                    ElevatedButton(
-                      child: Text("Login"),
-                      onPressed: () {
+
+                    InkWell(
+                      onTap: () async {
+                        setState(() {
+                          changedButton = true;
+                        });
+                        await Future.delayed(Duration(seconds: 1));
                         Navigator.pushNamed(context, MyRoutes.homeRoute);
                       },
-                    )
+                      child: AnimatedContainer(
+                        duration: Duration(seconds: 1),
+                        width: changedButton ? 50 : 150,
+                        height: 50,
+                        alignment: Alignment.center,
+                        child: changedButton
+                            ? Icon(
+                                Icons.done,
+                                color: Colors.white,
+                              )
+                            : Text(
+                                "Login",
+                                style: TextStyle(
+                                    color: Colors.white,
+                                    fontWeight: FontWeight.bold,
+                                    fontSize: 18),
+                              ),
+                        decoration: BoxDecoration(
+                            color: Colors.deepPurple,
+                            borderRadius: BorderRadius.circular(8)),
+                      ),
+                    ),
+
+                    // ElevatedButton(
+                    //   child: Text("Login"),
+                    //   onPressed: () {
+                    //     Navigator.pushNamed(context, MyRoutes.homeRoute);
+                    //   },
+                    // )
                   ],
                 ),
               )