| 
 | 1 | +import 'package:flutter/cupertino.dart';  | 
1 | 2 | import 'package:flutter/material.dart';  | 
2 | 3 | 
 
  | 
3 |  | -void main() => runApp(MyApp());  | 
 | 4 | +void main() => runApp(  | 
 | 5 | + MaterialApp(  | 
 | 6 | + debugShowCheckedModeBanner: false,  | 
 | 7 | + home: HomePage()  | 
 | 8 | + )  | 
 | 9 | +);  | 
4 | 10 | 
 
  | 
5 |  | -class MyApp extends StatelessWidget {  | 
6 |  | - // This widget is the root of your application.  | 
 | 11 | +class HomePage extends StatefulWidget {  | 
7 | 12 |  @override  | 
8 |  | - 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 |  | - }  | 
 | 13 | + _HomePageState createState() => _HomePageState();  | 
26 | 14 | }  | 
27 | 15 | 
 
  | 
28 |  | -class MyHomePage extends StatefulWidget {  | 
29 |  | - MyHomePage({Key key, this.title}) : super(key: key);  | 
 | 16 | +class _HomePageState extends State<HomePage> {  | 
30 | 17 | 
 
  | 
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 |  | - }  | 
 | 18 | + final List<String> _listItem = [  | 
 | 19 | + 'assets/images/two.jpg',  | 
 | 20 | + 'assets/images/three.jpg',  | 
 | 21 | + 'assets/images/four.jpg',  | 
 | 22 | + 'assets/images/five.jpg',  | 
 | 23 | + 'assets/images/one.jpg',  | 
 | 24 | + 'assets/images/two.jpg',  | 
 | 25 | + 'assets/images/three.jpg',  | 
 | 26 | + 'assets/images/four.jpg',  | 
 | 27 | + 'assets/images/five.jpg',  | 
 | 28 | + ];  | 
59 | 29 | 
 
  | 
60 | 30 |  @override  | 
61 | 31 |  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.  | 
68 | 32 |  return Scaffold(  | 
 | 33 | + backgroundColor: Colors.grey[600],  | 
69 | 34 |  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.  | 
77 |  | - 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,  | 
93 |  | - 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,  | 
 | 35 | + backgroundColor: Colors.transparent,  | 
 | 36 | + elevation: 0,  | 
 | 37 | + leading: Icon(Icons.menu),  | 
 | 38 | + title: Text("Home"),  | 
 | 39 | + actions: <Widget>[  | 
 | 40 | + Padding(  | 
 | 41 | + padding: EdgeInsets.all(10.0),  | 
 | 42 | + child: Container(  | 
 | 43 | + width: 36,  | 
 | 44 | + height: 30,  | 
 | 45 | + decoration: BoxDecoration(  | 
 | 46 | + color: Colors.grey[800],  | 
 | 47 | + borderRadius: BorderRadius.circular(10)  | 
 | 48 | + ),  | 
 | 49 | + child: Center(child: Text("0")),  | 
100 | 50 |  ),  | 
101 |  | - ],  | 
 | 51 | + )  | 
 | 52 | + ],  | 
 | 53 | + ),  | 
 | 54 | + body: SafeArea(  | 
 | 55 | + child: Container(  | 
 | 56 | + padding: EdgeInsets.all(20.0),  | 
 | 57 | + child: Column(  | 
 | 58 | + children: <Widget>[  | 
 | 59 | + Container(  | 
 | 60 | + width: double.infinity,  | 
 | 61 | + height: 250,  | 
 | 62 | + decoration: BoxDecoration(  | 
 | 63 | + borderRadius: BorderRadius.circular(20),  | 
 | 64 | + image: DecorationImage(  | 
 | 65 | + image: AssetImage('assets/images/one.jpg'),  | 
 | 66 | + fit: BoxFit.cover  | 
 | 67 | + )  | 
 | 68 | + ),  | 
 | 69 | + child: Container(  | 
 | 70 | + decoration: BoxDecoration(  | 
 | 71 | + borderRadius: BorderRadius.circular(20),  | 
 | 72 | + gradient: LinearGradient(  | 
 | 73 | + begin: Alignment.bottomRight,  | 
 | 74 | + colors: [  | 
 | 75 | + Colors.black.withOpacity(.4),  | 
 | 76 | + Colors.black.withOpacity(.2),  | 
 | 77 | + ]  | 
 | 78 | + )  | 
 | 79 | + ),  | 
 | 80 | + child: Column(  | 
 | 81 | + mainAxisAlignment: MainAxisAlignment.end,  | 
 | 82 | + children: <Widget>[  | 
 | 83 | + Text("Lifestyle Sale", style: TextStyle(color: Colors.white, fontSize: 35, fontWeight: FontWeight.bold),),  | 
 | 84 | + SizedBox(height: 30,),  | 
 | 85 | + Container(  | 
 | 86 | + height: 50,  | 
 | 87 | + margin: EdgeInsets.symmetric(horizontal: 40),  | 
 | 88 | + decoration: BoxDecoration(  | 
 | 89 | + borderRadius: BorderRadius.circular(10),  | 
 | 90 | + color: Colors.white  | 
 | 91 | + ),  | 
 | 92 | + child: Center(child: Text("Shop Now", style: TextStyle(color: Colors.grey[900], fontWeight: FontWeight.bold),)),  | 
 | 93 | + ),  | 
 | 94 | + SizedBox(height: 30,),  | 
 | 95 | + ],  | 
 | 96 | + ),  | 
 | 97 | + ),  | 
 | 98 | + ),  | 
 | 99 | + SizedBox(height: 20,),  | 
 | 100 | + Expanded(  | 
 | 101 | + child: GridView.count(  | 
 | 102 | + crossAxisCount: 2,  | 
 | 103 | + crossAxisSpacing: 10,  | 
 | 104 | + mainAxisSpacing: 10,  | 
 | 105 | + children: _listItem.map((item) => Card(  | 
 | 106 | + color: Colors.transparent,  | 
 | 107 | + elevation: 0,  | 
 | 108 | + child: Container(  | 
 | 109 | + decoration: BoxDecoration(  | 
 | 110 | + borderRadius: BorderRadius.circular(20),  | 
 | 111 | + image: DecorationImage(  | 
 | 112 | + image: AssetImage(item),  | 
 | 113 | + fit: BoxFit.cover  | 
 | 114 | + )  | 
 | 115 | + ),  | 
 | 116 | + child: Transform.translate(  | 
 | 117 | + offset: Offset(50, -50),  | 
 | 118 | + child: Container(  | 
 | 119 | + margin: EdgeInsets.symmetric(horizontal: 65, vertical: 63),  | 
 | 120 | + decoration: BoxDecoration(  | 
 | 121 | + borderRadius: BorderRadius.circular(10),  | 
 | 122 | + color: Colors.white  | 
 | 123 | + ),  | 
 | 124 | + child: Icon(Icons.bookmark_border, size: 15,),  | 
 | 125 | + ),  | 
 | 126 | + ),  | 
 | 127 | + ),  | 
 | 128 | + )).toList(),  | 
 | 129 | + )  | 
 | 130 | + )  | 
 | 131 | + ],  | 
 | 132 | + ),  | 
102 | 133 |  ),  | 
103 | 134 |  ),  | 
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.  | 
109 | 135 |  );  | 
110 | 136 |  }  | 
111 | 137 | }  | 
0 commit comments