Skip to content
This repository was archived by the owner on Jan 8, 2025. It is now read-only.

Commit d19e028

Browse files
AmbikadulalAparna16
Ambikadulal
and
Aparna16
authored
Motorbike (#72)
* changes upto * DiscoveryPage * Moterbike Shop UI Co-authored-by: Aparna16 <aparna@kumarijob.com>
1 parent c590ce8 commit d19e028

File tree

4 files changed

+374
-1
lines changed

4 files changed

+374
-1
lines changed

‎README.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -77,7 +77,7 @@ The code for Springy Widget is taken and refactored from (https://github.com/mat
7777
<img height="480px" src="screenshots/quotes1.png"> <img height="480px" src="screenshots/quotes2.jpg">
7878

7979
## Motorbike App UIs
80-
<img height="480px" src="screenshots/bike1.png"> <img height="480px" src="screenshots/bike2.png">
80+
<img height="480px" src="screenshots/bikeshop.png"> <img height="480px" src="screenshots/bike1.png"> <img height="480px" src="screenshots/bike2.png">
8181

8282
## Profile Screens
8383

‎lib/core/presentation/routes.dart‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@ import 'package:flutter_ui_challenges/src/pages/animations/anim4.dart';
77
import 'package:flutter_ui_challenges/src/pages/animations/anim5.dart';
88
import 'package:flutter_ui_challenges/src/pages/lists/grid_view.dart';
99
import 'package:flutter_ui_challenges/src/pages/bike/bike_details.dart';
10+
import 'package:flutter_ui_challenges/src/pages/bike/bikeshop_ui.dart';
1011
import 'package:flutter_ui_challenges/src/pages/bike/home_page.dart';
1112
import 'package:flutter_ui_challenges/src/pages/blog/news1.dart';
1213
import 'package:flutter_ui_challenges/src/pages/blog/sports_news1.dart';
@@ -201,6 +202,7 @@ final List<dynamic> pages = [
201202
],
202203
),
203204
MenuItem(title: "Motorbike App", icon: Icons.list, items: [
205+
SubMenuItem("MoterBike Shop Page", MoterBikeShopPage(), path: MoterBikeShopPage.path),
204206
SubMenuItem("Home Page", BikeHomePage(), path: BikeHomePage.path),
205207
SubMenuItem("Bike Details Page", BikeDetailsPage(),
206208
path: BikeDetailsPage.path),

‎lib/src/pages/bike/bikeshop_ui.dart‎

Lines changed: 371 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,371 @@
1+
/**
2+
* Author: Ambika Dulal
3+
* profile: https://github.com/Ambika Dulal
4+
*/
5+
6+
import 'package:flutter/cupertino.dart';
7+
import 'package:flutter/material.dart';
8+
9+
class MoterBikeShopPage extends StatelessWidget {
10+
static final String path = "lib/src/pages/bike/bikeshop_ui.dart";
11+
12+
@override
13+
Widget build(BuildContext context) {
14+
return MaterialApp(
15+
theme:ThemeData(
16+
fontFamily: 'avenir',
17+
),
18+
debugShowCheckedModeBanner: false,
19+
home: DetailsPage(),
20+
);
21+
}
22+
}
23+
24+
class DetailsPage extends StatefulWidget {
25+
@override
26+
_DetailsPageState createState() => _DetailsPageState();
27+
}
28+
29+
class _DetailsPageState extends State<DetailsPage> {
30+
String selectedButton = "All";
31+
@override
32+
Widget build(BuildContext context) {
33+
return Scaffold(
34+
backgroundColor: Color(0xfff5f6fa),
35+
body:Column(
36+
crossAxisAlignment: CrossAxisAlignment.end,
37+
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
38+
children: <Widget>[
39+
Row(
40+
children: <Widget>[
41+
Container(
42+
height: MediaQuery.of(context).size.height*0.15,
43+
width: MediaQuery.of(context).size.width,
44+
child: Row(
45+
mainAxisAlignment: MainAxisAlignment.spaceBetween,
46+
children: <Widget>[
47+
Container(
48+
padding: EdgeInsets.only(left:30),
49+
width: MediaQuery.of(context).size.width*0.7,
50+
child: Stack(
51+
children: <Widget>[
52+
Container(
53+
padding: EdgeInsets.only(top:40),
54+
child: Text("Bike Shop Name", style:TextStyle(
55+
color: Colors.black,
56+
fontWeight: FontWeight.w900,
57+
fontSize: 20,
58+
)),
59+
)
60+
],
61+
),
62+
),
63+
Container(
64+
decoration: BoxDecoration(
65+
color: Colors.black,
66+
borderRadius: BorderRadius.only(bottomLeft: Radius.circular(20))
67+
),
68+
width: MediaQuery.of(context).size.width*0.25,
69+
height: 80,
70+
child: IconButton(
71+
padding: EdgeInsets.only(top: 5),
72+
icon: Icon(
73+
Icons.search,
74+
color: Colors.white,
75+
size: 30,
76+
),
77+
),
78+
)
79+
],
80+
),
81+
)
82+
],
83+
),
84+
Row(
85+
crossAxisAlignment: CrossAxisAlignment.start,
86+
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
87+
children: <Widget>[
88+
Column(
89+
mainAxisAlignment: MainAxisAlignment.start,
90+
children: <Widget>[
91+
RotatedBox(
92+
quarterTurns: 3,
93+
child: Padding(
94+
padding: EdgeInsets.only(top: 3),
95+
child: Row(
96+
children: <Widget>[
97+
title("All"),
98+
title("Kids"),
99+
title("Men"),
100+
title("Woman"),
101+
],
102+
),
103+
),
104+
)
105+
],
106+
),
107+
SizedBox(width: 20,),
108+
Container(
109+
height: MediaQuery.of(context).size.height*0.85,
110+
child: SingleChildScrollView(
111+
child: Container(
112+
child: Column(
113+
children: <Widget>[
114+
Column(
115+
mainAxisAlignment: MainAxisAlignment.start,
116+
crossAxisAlignment: CrossAxisAlignment.start,
117+
children: <Widget>[
118+
Text("New Arrival", style: TextStyle(
119+
fontSize: 20,
120+
fontWeight: FontWeight.w900,
121+
122+
),),
123+
SizedBox(height: 10,),
124+
Container(
125+
height: 380,
126+
width: MediaQuery.of(context).size.width*0.8,
127+
child: ListView(
128+
physics: BouncingScrollPhysics(),
129+
scrollDirection: Axis.horizontal,
130+
children: <Widget>[
131+
newArrivalWidget("24A", "400W", "30Km", "250,000"),
132+
SizedBox(width: 15,),
133+
newArrivalWidget("22A", "300W", "25Km", "200,000"),
134+
SizedBox(width: 15,),
135+
newArrivalWidget("20A", "320W", "27Km", "300,000"),
136+
],
137+
),
138+
),
139+
SizedBox(
140+
height: 20,
141+
),
142+
Text("Best Sellers", style: TextStyle(
143+
fontSize: 25,
144+
fontWeight: FontWeight.w900,
145+
),),
146+
Container(
147+
height: 300,
148+
width: MediaQuery.of(context).size.width*0.8,
149+
child: ListView(
150+
physics: BouncingScrollPhysics(),
151+
scrollDirection: Axis.horizontal,
152+
children: <Widget>[
153+
bestSellerWidget("Honda Bike", "Prospero", "150,000"),
154+
SizedBox(width: 15,),
155+
bestSellerWidget("Bullet Bike", "Rero", "400,000"),
156+
SizedBox(width: 15,),
157+
bestSellerWidget("Plusar Bike", "Mount", "250,000"),
158+
SizedBox(width: 15,),
159+
],
160+
),
161+
),
162+
163+
],
164+
)
165+
],
166+
),
167+
),
168+
),
169+
)
170+
],
171+
)
172+
],
173+
)
174+
175+
);
176+
}
177+
Container title(String titleName)
178+
{
179+
return Container(
180+
width: 100,
181+
padding: EdgeInsets.only(right: 20),
182+
child: InkWell(
183+
child: Column(
184+
children: <Widget>[
185+
Container(
186+
height: titleName == selectedButton ? 3 : 0,
187+
color: Colors.black,
188+
),
189+
Text(titleName, style: TextStyle(
190+
fontSize: 16,
191+
fontWeight: FontWeight.w600,
192+
color: titleName == selectedButton ? Colors.black : Colors.black45,
193+
),
194+
)
195+
],
196+
),
197+
onTap:()
198+
{
199+
selectedButton = titleName;
200+
setState(() {
201+
202+
});
203+
},
204+
),
205+
);
206+
}
207+
Container bestSellerWidget(String bikeName, String companyName, String price)
208+
{
209+
return Container(
210+
width: 200,
211+
decoration: BoxDecoration(
212+
color: Colors.white,
213+
borderRadius: BorderRadius.circular(20),
214+
boxShadow: [BoxShadow(
215+
color: Colors.grey.withOpacity(0.1),
216+
blurRadius: 0.5,
217+
spreadRadius: 0.5,
218+
)]
219+
),
220+
child: Container(
221+
padding: EdgeInsets.all(15),
222+
child: Column(
223+
crossAxisAlignment: CrossAxisAlignment.start,
224+
children: <Widget>[
225+
Container(
226+
width: 200,
227+
height: 150,
228+
decoration: BoxDecoration(
229+
image: DecorationImage(
230+
image: NetworkImage('https://firebasestorage.googleapis.com/v0/b/dl-flutter-ui-challenges.appspot.com/o/bike%2Fbike1.jpg?alt=media'),
231+
fit: BoxFit.contain
232+
)
233+
),
234+
),
235+
Text(bikeName, style: TextStyle(
236+
fontSize: 20,
237+
fontWeight: FontWeight.bold
238+
),),
239+
Text(companyName, style: TextStyle(
240+
fontSize: 16,
241+
fontWeight: FontWeight.normal
242+
),),
243+
SizedBox(
244+
height: 10,
245+
),
246+
Row(
247+
mainAxisAlignment: MainAxisAlignment.spaceBetween,
248+
children: <Widget>[
249+
Text(price, style: TextStyle(
250+
color: Colors.orange,
251+
fontSize: 18,
252+
fontWeight: FontWeight.bold,
253+
),),
254+
SizedBox(width: 15,),
255+
IconButton(
256+
icon: Icon(
257+
Icons.add_shopping_cart,
258+
),
259+
)
260+
],
261+
)
262+
],
263+
),
264+
),
265+
);
266+
}
267+
Container newArrivalWidget(String battery, String enginePower, String distance, String price)
268+
{
269+
return Container(
270+
width: 300,
271+
decoration: BoxDecoration(
272+
color: Colors.white,
273+
borderRadius: BorderRadius.circular(20),
274+
boxShadow: [BoxShadow(
275+
color: Colors.grey.withOpacity(0.2),
276+
blurRadius: 0.5,
277+
spreadRadius: 0.5,
278+
)]
279+
),
280+
child: Container(
281+
padding: EdgeInsets.all(15),
282+
child: Column(
283+
children: <Widget>[
284+
Text("All Terrain", style: TextStyle(
285+
fontSize: 20,
286+
fontWeight: FontWeight.bold,
287+
),),
288+
Container(
289+
padding:EdgeInsets.all(30),
290+
child: Center(
291+
child: Image.network('https://firebasestorage.googleapis.com/v0/b/dl-flutter-ui-challenges.appspot.com/o/bike%2Fbike1.jpg?alt=media'),
292+
),
293+
),
294+
Row(
295+
mainAxisAlignment: MainAxisAlignment.spaceBetween,
296+
children: <Widget>[
297+
Container(
298+
child: Column(
299+
mainAxisAlignment: MainAxisAlignment.center,
300+
children: <Widget>[
301+
Text(battery, style: TextStyle(
302+
fontSize: 20,
303+
fontWeight: FontWeight.bold,
304+
),),
305+
SizedBox(height: 5,),
306+
Text("Battery", style: TextStyle(
307+
fontSize: 15,
308+
fontWeight: FontWeight.normal
309+
),)
310+
],
311+
),
312+
),
313+
Container(
314+
child: Column(
315+
mainAxisAlignment: MainAxisAlignment.center,
316+
children: <Widget>[
317+
Text(enginePower, style: TextStyle(
318+
fontSize: 20,
319+
fontWeight: FontWeight.bold
320+
),),
321+
SizedBox(
322+
height:5,
323+
),
324+
Text("Engine", style:TextStyle(
325+
fontSize: 15,
326+
fontWeight: FontWeight.normal,
327+
))
328+
],
329+
),
330+
),
331+
Container(
332+
child: Column(
333+
mainAxisAlignment: MainAxisAlignment.center,
334+
children: <Widget>[
335+
Text(distance, style: TextStyle(
336+
fontSize: 20,
337+
fontWeight: FontWeight.bold,
338+
),),
339+
SizedBox(height: 5,),
340+
Text("Distance", style: TextStyle(
341+
fontSize: 15,
342+
fontWeight: FontWeight.normal
343+
),)
344+
],
345+
),
346+
)
347+
],
348+
),
349+
SizedBox(
350+
height: 15,
351+
),
352+
Row(
353+
mainAxisAlignment: MainAxisAlignment.spaceBetween,
354+
children: <Widget>[
355+
Text(price, style:TextStyle(
356+
fontSize: 22,
357+
color: Colors.orange,
358+
fontWeight: FontWeight.bold
359+
)),
360+
IconButton(
361+
iconSize: 30,
362+
icon: Icon(Icons.add_shopping_cart),
363+
)
364+
],
365+
)
366+
],
367+
),
368+
),
369+
);
370+
}
371+
}

‎screenshots/bikeshop.jpg‎

321 KB
Loading

0 commit comments

Comments
 (0)