Account Screen Car Booking App

car_booking/lib/main.dart

@@ -1,6 +1,7 @@
 import 'package:flutter/material.dart';
 import 'package:google_fonts/google_fonts.dart';
 
+import 'screens/Account/profile_screen.dart';
 import 'screens/available/available_car_screen.dart';
 import 'screens/detail/car_detail_screen.dart';
 import 'screens/login/login_screen.dart';
@@ -31,6 +32,7 @@ class MyApp extends StatelessWidget {
         '/': (context) => LoginScreen(),
         'CreateNewAccount': (context) => CreateNewAccount(),
         'AvailableCarScreen': (context) => AvailableCarScreen(),
+        'ProfileScreen': (context) => ProfileScreen(),
       },
     );
   }

car_booking/lib/screens/Account/profile_screen.dart

@@ -0,0 +1,131 @@
+import 'package:flutter/cupertino.dart';
+import 'package:flutter/material.dart';
+import '../../constants.dart';
+import 'widget/appbar.dart';
+import 'widget/body.dart';
+import 'widget/button.dart';
+import 'widget/number.dart';
+import 'widget/profile.dart';
+import 'widget/user.dart';
+import 'widget/user_prefrance.dart';
+
+
+class ProfileScreen extends StatefulWidget {
+  @override
+  _ProfileScreenState createState() => _ProfileScreenState();
+}
+
+class _ProfileScreenState extends State<ProfileScreen> {
+  @override
+  Widget build(BuildContext context) {
+    final user = UserPreferences.myUser;
+
+    return Scaffold(
+      appBar: buildAppBar(context),
+      body: Padding(
+        padding: const EdgeInsets.all(8.0),
+        child: ListView(
+          physics: BouncingScrollPhysics(),
+          children: [
+            ProfileWidget(
+              imagePath: user.imagePath,
+              onClicked: () async {},
+            ),
+            const SizedBox(height: 24),
+            buildName(user),
+            const SizedBox(height: 24),
+            NumbersWidget(),
+            const SizedBox(height: 24),
+                Body(),
+          ],
+        ),
+      ),
+       bottomNavigationBar: BuildBottomNavigationBar(),
+    );
+  }
+
+  Widget buildName(User user) => Column(
+        children: [
+          Text(
+            user.name,
+            style: TextStyle(fontWeight: FontWeight.bold, fontSize: 24),
+          ),
+          const SizedBox(height: 4),
+          Text(
+            user.email,
+            style: TextStyle(color: Colors.grey),
+          )
+        ],
+      );
+
+  Widget buildUpgradeButton() => ButtonWidget(
+        text: 'Pro Membership',
+        onClicked: () {},
+      );
+
+  Widget buildAbout(User user) => Container(
+        padding: EdgeInsets.symmetric(horizontal: 48),
+        child: Column(
+          crossAxisAlignment: CrossAxisAlignment.start,
+          children: [
+            Text(
+              'About',
+              style: TextStyle(fontSize: 24, fontWeight: FontWeight.bold),
+            ),
+            const SizedBox(height: 16),
+          ],
+        ),
+
+      );
+
+}
+
+
+
+
+class BuildBottomNavigationBar extends StatefulWidget {
+  @override
+  _BuildBottomNavigationBarState createState() => _BuildBottomNavigationBarState();
+}
+
+class _BuildBottomNavigationBarState extends State<BuildBottomNavigationBar> {
+  List<String> bottomNavIcons = [
+    'assets/icons/app.png',
+    'assets/icons/calendar.png',
+    'assets/icons/pin.png',
+    'assets/icons/user.png',
+  ];
+  int selected = 0 ;
+  @override
+  Widget build(BuildContext context) {
+    return Container(
+      padding: EdgeInsets.symmetric(horizontal: 25, vertical: 15),
+      color:Color(0xFF203e5a),
+      height: 65,
+      child: ListView.builder(
+        scrollDirection: Axis.horizontal,
+          itemCount: bottomNavIcons.length,
+          itemBuilder: (context, index) => GestureDetector(
+            onTap: (){
+              setState(() {
+                selected = index;
+
+
+              });
+            },
+            child: Padding(
+              padding: EdgeInsets.only(right: mpadding * 2, left: mpadding),
+              child: Image.asset(
+                bottomNavIcons[index],
+                height: 40,
+                color: selected == index ? mbottonColor :Colors.grey,
+              ),
+            ),
+          )
+      ),
+    );
+  }
+}
+
+
+

car_booking/lib/screens/Account/widget/appbar.dart

@@ -0,0 +1,27 @@
+import 'package:car_booking/constants.dart';
+import 'package:flutter/cupertino.dart';
+import 'package:flutter/material.dart';
+
+AppBar buildAppBar(BuildContext context) {
+  final icon = CupertinoIcons.moon_stars;
+
+  return AppBar(
+    backgroundColor: mCardColor,
+    elevation: 0,
+    leading:IconButton(
+        icon: Icon(
+            Icons.menu,
+            color: Colors.white,
+          ),
+          onPressed: () {},
+      ),
+      centerTitle: true,
+     title:Text('Profile'),
+    actions: [
+      IconButton(
+        icon: Icon(icon),
+        onPressed: () {},
+      ),
+    ],
+  );
+}

car_booking/lib/screens/Account/widget/body.dart

@@ -0,0 +1,42 @@
+import 'package:flutter/material.dart';
+
+import 'menu.dart';
+import 'profile_pic.dart';
+
+class Body extends StatelessWidget {
+  @override
+  Widget build(BuildContext context) {
+    return SingleChildScrollView(
+      padding: EdgeInsets.symmetric(vertical: 20),
+      child: Column(
+        children: [
+          ProfileMenu(
+            text: "My Account",
+            icon: "assets/icons/user.png",
+            press: () => {},
+          ),
+          ProfileMenu(
+            text: "Notifications",
+            icon: "assets/icons/bell.png",
+            press: () {},
+          ),
+          ProfileMenu(
+            text: "Settings",
+            icon: "assets/icons/settings.png",
+            press: () {},
+          ),
+          ProfileMenu(
+            text: "Help",
+            icon: "assets/icons/information.png",
+            press: () {},
+          ),
+          ProfileMenu(
+            text: "Total Bills",
+            icon: "assets/icons/windshield.png",
+            press: () {},
+          ),
+        ],
+      ),
+    );
+  }
+}

car_booking/lib/screens/Account/widget/button.dart

@@ -0,0 +1,26 @@
+import 'package:car_booking/constants.dart';
+import 'package:flutter/material.dart';
+
+class ButtonWidget extends StatelessWidget {
+  final String text;
+  final VoidCallback onClicked;
+
+  const ButtonWidget({
+    Key? key,
+    required this.text,
+    required this.onClicked,
+  }) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) => ElevatedButton(
+
+        style: ElevatedButton.styleFrom(
+          shape: StadiumBorder(),
+          onSurface: mCardColor,
+          onPrimary: Colors.white,
+          padding: EdgeInsets.symmetric(horizontal: 32, vertical: 12),
+        ),
+        child: Text(text),
+        onPressed: onClicked
+      );
+      }

car_booking/lib/screens/Account/widget/menu.dart

@@ -0,0 +1,43 @@
+import 'package:flutter/material.dart';
+
+
+class ProfileMenu extends StatelessWidget {
+  const ProfileMenu({
+    Key? key,
+    required this.text,
+    required this.icon,
+    this.press,
+  }) : super(key: key);
+
+  final String text, icon;
+  final VoidCallback? press;
+
+  @override
+  Widget build(BuildContext context) {
+    return Padding(
+      padding: EdgeInsets.symmetric(horizontal: 20, vertical: 10),
+      child: TextButton(
+        style: TextButton.styleFrom(
+          primary: Color(0xFF203e5a),
+          padding: EdgeInsets.all(20),
+          shape:
+              RoundedRectangleBorder(borderRadius: BorderRadius.circular(15)),
+          backgroundColor: Color(0xFFF5F6F9),
+        ),
+        onPressed: press,
+        child: Row(
+          children: [
+            Image.asset(
+              icon,
+              color: Color(0xFF203e5a),
+              width: 22,
+            ),
+            SizedBox(width: 20),
+            Expanded(child: Text(text)),
+            Icon(Icons.arrow_forward_ios),
+          ],
+        ),
+      ),
+    );
+  }
+}

car_booking/lib/screens/Account/widget/number.dart

@@ -0,0 +1,41 @@
+import 'package:flutter/material.dart';
+
+class NumbersWidget extends StatelessWidget {
+  @override
+  Widget build(BuildContext context) => Row(
+        mainAxisAlignment: MainAxisAlignment.center,
+        children: <Widget>[
+          buildButton(context, '4.8', 'Ratings'),
+          buildDivider(),
+          buildButton(context, '35', 'Booked Rides'),
+          buildDivider(),
+          buildButton(context, '5', 'Cncelled Rides'),
+        ],
+      );
+  Widget buildDivider() => Container(
+        height: 24,
+        child: VerticalDivider(),
+      );
+
+  Widget buildButton(BuildContext context, String value, String text) =>
+      MaterialButton(
+        padding: EdgeInsets.symmetric(vertical: 4),
+        onPressed: () {},
+        materialTapTargetSize: MaterialTapTargetSize.shrinkWrap,
+        child: Column(
+          mainAxisSize: MainAxisSize.min,
+          mainAxisAlignment: MainAxisAlignment.start,
+          children: <Widget>[
+            Text(
+              value,
+              style: TextStyle(fontWeight: FontWeight.bold, fontSize: 24),
+            ),
+            SizedBox(height: 2),
+            Text(
+              text,
+              style: TextStyle(fontWeight: FontWeight.bold),
+            ),
+          ],
+        ),
+      );
+}