1+ import 'package:day12_login/Animation/FadeAnimation.dart' ;
12import 'package:flutter/material.dart' ;
23
3- void main () => runApp (MyApp ());
4+ void main () => runApp (
5+ MaterialApp (
6+ debugShowCheckedModeBanner: false ,
7+ home: HomePage (),
8+ )
9+ );
410
5- class MyApp extends StatelessWidget {
6- // This widget is the root of your application.
11+ class HomePage extends StatelessWidget {
712 @override
813 Widget build (BuildContext context) {
9- return MaterialApp (
10- title: 'Flutter Demo' ,
11- theme: ThemeData (
12- // This is the theme of your application.
13- //
14- // Try running your application with "flutter run". You'll see the
15- // application has a blue toolbar. Then, without quitting the app, try
16- // changing the primarySwatch below to Colors.green and then invoke
17- // "hot reload" (press "r" in the console where you ran "flutter run",
18- // or simply save your changes to "hot reload" in a Flutter IDE).
19- // Notice that the counter didn't reset back to zero; the application
20- // is not restarted.
21- primarySwatch: Colors .blue,
22- ),
23- home: MyHomePage (title: 'Flutter Demo Home Page' ),
24- );
25- }
26- }
27-
28- class MyHomePage extends StatefulWidget {
29- MyHomePage ({Key key, this .title}) : super (key: key);
30-
31- // This widget is the home page of your application. It is stateful, meaning
32- // that it has a State object (defined below) that contains fields that affect
33- // how it looks.
34-
35- // This class is the configuration for the state. It holds the values (in this
36- // case the title) provided by the parent (in this case the App widget) and
37- // used by the build method of the State. Fields in a Widget subclass are
38- // always marked "final".
39-
40- final String title;
41-
42- @override
43- _MyHomePageState createState () => _MyHomePageState ();
44- }
45-
46- class _MyHomePageState extends State <MyHomePage > {
47- int _counter = 0 ;
48-
49- void _incrementCounter () {
50- setState (() {
51- // This call to setState tells the Flutter framework that something has
52- // changed in this State, which causes it to rerun the build method below
53- // so that the display can reflect the updated values. If we changed
54- // _counter without calling setState(), then the build method would not be
55- // called again, and so nothing would appear to happen.
56- _counter++ ;
57- });
58- }
59-
60- @override
61- Widget build (BuildContext context) {
62- // This method is rerun every time setState is called, for instance as done
63- // by the _incrementCounter method above.
64- //
65- // The Flutter framework has been optimized to make rerunning build methods
66- // fast, so that you can just rebuild anything that needs updating rather
67- // than having to individually change instances of widgets.
6814 return Scaffold (
69- appBar: AppBar (
70- // Here we take the value from the MyHomePage object that was created by
71- // the App.build method, and use it to set our appbar title.
72- title: Text (widget.title),
73- ),
74- body: Center (
75- // Center is a layout widget. It takes a single child and positions it
76- // in the middle of the parent.
15+ backgroundColor: Colors .white,
16+ body: Container (
7717 child: Column (
78- // Column is also a layout widget. It takes a list of children and
79- // arranges them vertically. By default, it sizes itself to fit its
80- // children horizontally, and tries to be as tall as its parent.
81- //
82- // Invoke "debug painting" (press "p" in the console, choose the
83- // "Toggle Debug Paint" action from the Flutter Inspector in Android
84- // Studio, or the "Toggle Debug Paint" command in Visual Studio Code)
85- // to see the wireframe for each widget.
86- //
87- // Column has various properties to control how it sizes itself and
88- // how it positions its children. Here we use mainAxisAlignment to
89- // center the children vertically; the main axis here is the vertical
90- // axis because Columns are vertical (the cross axis would be
91- // horizontal).
92- mainAxisAlignment: MainAxisAlignment .center,
9318 children: < Widget > [
94- Text (
95- 'You have pushed the button this many times:' ,
96- ),
97- Text (
98- '$_counter ' ,
99- style: Theme .of (context).textTheme.display1,
19+ Container (
20+ height: 400 ,
21+ decoration: BoxDecoration (
22+ image: DecorationImage (
23+ image: AssetImage ('assets/images/background.png' ),
24+ fit: BoxFit .fill
25+ )
26+ ),
27+ child: Stack (
28+ children: < Widget > [
29+ Positioned (
30+ left: 30 ,
31+ width: 80 ,
32+ height: 200 ,
33+ child: FadeAnimation (1 , Container (
34+ decoration: BoxDecoration (
35+ image: DecorationImage (
36+ image: AssetImage ('assets/images/light-1.png' )
37+ )
38+ ),
39+ )),
40+ ),
41+ Positioned (
42+ left: 140 ,
43+ width: 80 ,
44+ height: 150 ,
45+ child: FadeAnimation (1.3 , Container (
46+ decoration: BoxDecoration (
47+ image: DecorationImage (
48+ image: AssetImage ('assets/images/light-2.png' )
49+ )
50+ ),
51+ )),
52+ ),
53+ Positioned (
54+ right: 40 ,
55+ top: 40 ,
56+ width: 80 ,
57+ height: 150 ,
58+ child: FadeAnimation (1.5 , Container (
59+ decoration: BoxDecoration (
60+ image: DecorationImage (
61+ image: AssetImage ('assets/images/clock.png' )
62+ )
63+ ),
64+ )),
65+ ),
66+ Positioned (
67+ child: FadeAnimation (1.6 , Container (
68+ margin: EdgeInsets .only (top: 50 ),
69+ child: Center (
70+ child: Text ("Login" , style: TextStyle (color: Colors .white, fontSize: 40 , fontWeight: FontWeight .bold),),
71+ ),
72+ )),
73+ )
74+ ],
75+ ),
10076 ),
77+ Padding (
78+ padding: EdgeInsets .all (30.0 ),
79+ child: Column (
80+ children: < Widget > [
81+ FadeAnimation (1.8 , Container (
82+ padding: EdgeInsets .all (5 ),
83+ decoration: BoxDecoration (
84+ color: Colors .white,
85+ borderRadius: BorderRadius .circular (10 ),
86+ boxShadow: [
87+ BoxShadow (
88+ color: Color .fromRGBO (143 , 148 , 251 , .2 ),
89+ blurRadius: 20.0 ,
90+ offset: Offset (0 , 10 )
91+ )
92+ ]
93+ ),
94+ child: Column (
95+ children: < Widget > [
96+ Container (
97+ padding: EdgeInsets .all (8.0 ),
98+ decoration: BoxDecoration (
99+ border: Border (bottom: BorderSide (color: Colors .grey[100 ]))
100+ ),
101+ child: TextField (
102+ decoration: InputDecoration (
103+ border: InputBorder .none,
104+ hintText: "Email or Phone number" ,
105+ hintStyle: TextStyle (color: Colors .grey[400 ])
106+ ),
107+ ),
108+ ),
109+ Container (
110+ padding: EdgeInsets .all (8.0 ),
111+ child: TextField (
112+ decoration: InputDecoration (
113+ border: InputBorder .none,
114+ hintText: "Password" ,
115+ hintStyle: TextStyle (color: Colors .grey[400 ])
116+ ),
117+ ),
118+ )
119+ ],
120+ ),
121+ )),
122+ SizedBox (height: 30 ,),
123+ FadeAnimation (2 , Container (
124+ height: 50 ,
125+ decoration: BoxDecoration (
126+ borderRadius: BorderRadius .circular (10 ),
127+ gradient: LinearGradient (
128+ colors: [
129+ Color .fromRGBO (143 , 148 , 251 , 1 ),
130+ Color .fromRGBO (143 , 148 , 251 , .6 ),
131+ ]
132+ )
133+ ),
134+ child: Center (
135+ child: Text ("Login" , style: TextStyle (color: Colors .white, fontWeight: FontWeight .bold),),
136+ ),
137+ )),
138+ SizedBox (height: 70 ,),
139+ FadeAnimation (1.5 , Text ("Forgot Password?" , style: TextStyle (color: Color .fromRGBO (143 , 148 , 251 , 1 )),)),
140+ ],
141+ ),
142+ )
101143 ],
102144 ),
103145 ),
104- floatingActionButton: FloatingActionButton (
105- onPressed: _incrementCounter,
106- tooltip: 'Increment' ,
107- child: Icon (Icons .add),
108- ), // This trailing comma makes auto-formatting nicer for build methods.
109146 );
110147 }
111- }
148+ }
0 commit comments