Skip to content

Commit 74062e1

Browse files
committed
Make main page
1 parent 2ba64b9 commit 74062e1

File tree

1 file changed

+134
-97
lines changed

1 file changed

+134
-97
lines changed

lib/main.dart

Lines changed: 134 additions & 97 deletions
Original file line numberDiff line numberDiff line change
@@ -1,111 +1,148 @@
1+
import 'package:day12_login/Animation/FadeAnimation.dart';
12
import '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

Comments
 (0)