diff --git a/android/app/src/main/AndroidManifest.xml b/android/app/src/main/AndroidManifest.xml
index 7be27d5..27bdf35 100644
--- a/android/app/src/main/AndroidManifest.xml
+++ b/android/app/src/main/AndroidManifest.xml
@@ -7,6 +7,7 @@
routes = {
login: (context) => LoginScreen(),
verifyLogin: (context) => VerifyLoginScreen(),
@@ -65,5 +69,6 @@ class AppRoutes {
myAttendance: (context) => MyAttendanceScreen(),
workFromHome: (context) => WorkFromHomeScreen(),
addWorkFromHome: (context) => AddWorkFromHomeScreen(),
+ profile: (context) => ProfileScreen(),
};
}
diff --git a/lib/ui/landing/dashboard_screen.dart b/lib/ui/landing/dashboard_screen.dart
index be692fe..354e0db 100644
--- a/lib/ui/landing/dashboard_screen.dart
+++ b/lib/ui/landing/dashboard_screen.dart
@@ -10,6 +10,7 @@ import 'package:mohem_flutter_app/extensions/string_extensions.dart';
import 'package:mohem_flutter_app/extensions/widget_extensions.dart';
import 'package:mohem_flutter_app/generated/locale_keys.g.dart';
import 'package:mohem_flutter_app/provider/dashboard_provider_model.dart';
+import 'package:mohem_flutter_app/ui/landing/widget/app_drawer.dart';
import 'package:mohem_flutter_app/ui/landing/widget/menus_widget.dart';
import 'package:mohem_flutter_app/ui/landing/widget/services_widget.dart';
import 'package:mohem_flutter_app/widgets/circular_avatar.dart';
@@ -27,7 +28,7 @@ class DashboardScreen extends StatefulWidget {
class _DashboardScreenState extends State {
late DashboardProviderModel data;
-
+ final GlobalKey _scaffoldState = GlobalKey();
@override
void initState() {
super.initState();
@@ -47,272 +48,277 @@ class _DashboardScreenState extends State {
@override
Widget build(BuildContext context) {
List namesD = ["Nostalgia Perfume Perfume", "Al Nafoura", "AlJadi", "Nostalgia Perfume"];
-
+ final GlobalKey _key = GlobalKey(); //
return Scaffold(
- body: Column(
- children: [
- Row(
- children: [
- Row(
- mainAxisSize: MainAxisSize.min,
- children: [
- CircularAvatar(
- width: 34,
- height: 34,
- url: "https://cdn4.iconfinder.com/data/icons/professions-2-2/151/89-512.png",
- ),
- 8.width,
- SvgPicture.asset("assets/images/side_nav.svg"),
- ],
- ).onPress(() {}),
- Expanded(
- child: Row(
- crossAxisAlignment: CrossAxisAlignment.center,
- mainAxisAlignment: MainAxisAlignment.center,
- mainAxisSize: MainAxisSize.min,
- children: [
- //AppLogo(),
- 8.width,
- LocaleKeys.mohemm.tr().toText14()
- ],
- ),
- ),
- SizedBox(
- width: 36,
- height: 36,
- child: Stack(
- alignment: Alignment.centerLeft,
- children: [
- SvgPicture.asset("assets/images/announcements.svg"),
- Positioned(
- right: 0,
- top: 0,
- child: Container(
- padding: const EdgeInsets.only(left: 5, right: 5),
- decoration: BoxDecoration(color: MyColors.redColor, borderRadius: BorderRadius.circular(17)),
- child: "3".toText12(color: Colors.white),
+ key: _scaffoldState,
+ body: Column(
+ children: [
+ Row(
+ children: [
+ Builder(builder: (context) {
+ return Row(
+ mainAxisSize: MainAxisSize.min,
+ children: [
+ CircularAvatar(
+ width: 34,
+ height: 34,
+ url: "https://cdn4.iconfinder.com/data/icons/professions-2-2/151/89-512.png",
),
- )
- ],
+ 8.width,
+ SvgPicture.asset("assets/images/side_nav.svg"),
+ ],
+ ).onPress(() {
+ _scaffoldState.currentState!.openDrawer();
+ });
+ }),
+ Expanded(
+ child: Row(
+ crossAxisAlignment: CrossAxisAlignment.center,
+ mainAxisAlignment: MainAxisAlignment.center,
+ mainAxisSize: MainAxisSize.min,
+ children: [
+ //AppLogo(),
+ 8.width,
+ LocaleKeys.mohemm.tr().toText14()
+ ],
+ ),
),
- ).onPress(() {
- data.update(context);
- })
- ],
- ).paddingOnly(left: 21, right: 21, top: 48, bottom: 7),
- Expanded(
- child: SingleChildScrollView(
- child: Column(
- children: [
- Column(
- crossAxisAlignment: CrossAxisAlignment.start,
+ SizedBox(
+ width: 36,
+ height: 36,
+ child: Stack(
+ alignment: Alignment.centerLeft,
children: [
- LocaleKeys.goodMorning.tr().toText14(color: MyColors.grey77Color),
- "Mahmoud Shrouf".toText24(isBold: true),
- 16.height,
- Row(
- children: [
- Expanded(
- child: AspectRatio(
- aspectRatio: 159 / 159,
- child: Consumer(
- builder: (context, model, child) {
- return (model.isAttendanceTrackingLoading
- ? GetAttendanceTrackingShimmer()
- : Container(
- decoration: BoxDecoration(
- borderRadius: BorderRadius.circular(15),
- gradient: const LinearGradient(transform: GradientRotation(.46), begin: Alignment.topRight, end: Alignment.bottomLeft, colors: [
- MyColors.gradiantEndColor,
- MyColors.gradiantStartColor,
- ]),
- ),
- child: Stack(
- alignment: Alignment.center,
- children: [
- if (model.isTimeRemainingInSeconds == 0) SvgPicture.asset("assets/images/thumb.svg"),
- Column(
- crossAxisAlignment: CrossAxisAlignment.start,
- children: [
- Expanded(
- child: Column(
- mainAxisSize: MainAxisSize.min,
- crossAxisAlignment: CrossAxisAlignment.start,
+ SvgPicture.asset("assets/images/announcements.svg"),
+ Positioned(
+ right: 0,
+ top: 0,
+ child: Container(
+ padding: const EdgeInsets.only(left: 5, right: 5),
+ decoration: BoxDecoration(color: MyColors.redColor, borderRadius: BorderRadius.circular(17)),
+ child: "3".toText12(color: Colors.white),
+ ),
+ )
+ ],
+ ),
+ ).onPress(() {
+ data.update(context);
+ })
+ ],
+ ).paddingOnly(left: 21, right: 21, top: 48, bottom: 7),
+ Expanded(
+ child: SingleChildScrollView(
+ child: Column(
+ children: [
+ Column(
+ crossAxisAlignment: CrossAxisAlignment.start,
+ children: [
+ LocaleKeys.goodMorning.tr().toText14(color: MyColors.grey77Color),
+ "Mahmoud Shrouf".toText24(isBold: true),
+ 16.height,
+ Row(
+ children: [
+ Expanded(
+ child: AspectRatio(
+ aspectRatio: 159 / 159,
+ child: Consumer(
+ builder: (context, model, child) {
+ return (model.isAttendanceTrackingLoading
+ ? GetAttendanceTrackingShimmer()
+ : Container(
+ decoration: BoxDecoration(
+ borderRadius: BorderRadius.circular(15),
+ gradient: const LinearGradient(transform: GradientRotation(.46), begin: Alignment.topRight, end: Alignment.bottomLeft, colors: [
+ MyColors.gradiantEndColor,
+ MyColors.gradiantStartColor,
+ ]),
+ ),
+ child: Stack(
+ alignment: Alignment.center,
+ children: [
+ if (model.isTimeRemainingInSeconds == 0) SvgPicture.asset("assets/images/thumb.svg"),
+ Column(
+ crossAxisAlignment: CrossAxisAlignment.start,
+ children: [
+ Expanded(
+ child: Column(
+ mainAxisSize: MainAxisSize.min,
+ crossAxisAlignment: CrossAxisAlignment.start,
+ children: [
+ LocaleKeys.markAttendance.tr().toText14(color: Colors.white, isBold: true),
+ if (model.isTimeRemainingInSeconds == 0) "01-02-2022".toText12(color: Colors.white),
+ if (model.isTimeRemainingInSeconds != 0)
+ Column(
+ mainAxisSize: MainAxisSize.min,
+ crossAxisAlignment: CrossAxisAlignment.start,
+ children: [
+ 9.height,
+ CountdownTimer(
+ endTime: model.endTime,
+ onEnd: null,
+ endWidget: "00:00:00".toText14(color: Colors.white, isBold: true),
+ textStyle: TextStyle(color: Colors.white, fontSize: 14, letterSpacing: -0.48, fontWeight: FontWeight.bold),
+ ),
+ LocaleKeys.timeLeftToday.tr().toText12(color: Colors.white),
+ 9.height,
+ ClipRRect(
+ borderRadius: BorderRadius.all(
+ Radius.circular(20),
+ ),
+ child: LinearProgressIndicator(
+ value: model.progress,
+ minHeight: 8,
+ valueColor: const AlwaysStoppedAnimation(Colors.white),
+ backgroundColor: const Color(0xff196D73),
+ ),
+ ),
+ ],
+ ),
+ ],
+ ).paddingOnly(top: 12, right: 15, left: 12),
+ ),
+ Row(
children: [
- LocaleKeys.markAttendance.tr().toText14(color: Colors.white, isBold: true),
- if (model.isTimeRemainingInSeconds == 0) "01-02-2022".toText12(color: Colors.white),
- if (model.isTimeRemainingInSeconds != 0)
- Column(
+ Expanded(
+ child: Column(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
- 9.height,
- CountdownTimer(
- endTime: model.endTime,
- onEnd: null,
- endWidget: "00:00:00".toText14(color: Colors.white, isBold: true),
- textStyle: TextStyle(color: Colors.white, fontSize: 14, letterSpacing: -0.48, fontWeight: FontWeight.bold),
- ),
- LocaleKeys.timeLeftToday.tr().toText12(color: Colors.white),
- 9.height,
- ClipRRect(
- borderRadius: BorderRadius.all(
- Radius.circular(20),
- ),
- child: LinearProgressIndicator(
- value: model.progress,
- minHeight: 8,
- valueColor: const AlwaysStoppedAnimation(Colors.white),
- backgroundColor: const Color(0xff196D73),
- ),
- ),
+ LocaleKeys.checkIn.tr().toText12(color: Colors.white),
+ (model.attendanceTracking!.pSwipeIn == null ? "--:--" : model.attendanceTracking!.pSwipeIn)
+ .toString()
+ .toText14(color: Colors.white, isBold: true),
+ 4.height,
],
+ ).paddingOnly(left: 12),
+ ),
+ Container(
+ width: 45,
+ height: 45,
+ padding: const EdgeInsets.only(left: 14, right: 14),
+ decoration: const BoxDecoration(
+ color: Color(0xff259EA4),
+ borderRadius: BorderRadius.only(
+ bottomRight: Radius.circular(15),
+ ),
),
- ],
- ).paddingOnly(top: 12, right: 15, left: 12),
- ),
- Row(
- children: [
- Expanded(
- child: Column(
- mainAxisSize: MainAxisSize.min,
- crossAxisAlignment: CrossAxisAlignment.start,
- children: [
- LocaleKeys.checkIn.tr().toText12(color: Colors.white),
- (model.attendanceTracking!.pSwipeIn == null ? "--:--" : model.attendanceTracking!.pSwipeIn)
- .toString()
- .toText14(color: Colors.white, isBold: true),
- 4.height,
- ],
- ).paddingOnly(left: 12),
- ),
- Container(
- width: 45,
- height: 45,
- padding: const EdgeInsets.only(left: 14, right: 14),
- decoration: const BoxDecoration(
- color: Color(0xff259EA4),
- borderRadius: BorderRadius.only(
- bottomRight: Radius.circular(15),
- ),
+ child: SvgPicture.asset(model.isTimeRemainingInSeconds == 0 ? "assets/images/play.svg" : "assets/images/stop.svg"),
),
- child: SvgPicture.asset(model.isTimeRemainingInSeconds == 0 ? "assets/images/play.svg" : "assets/images/stop.svg"),
- ),
- ],
- ),
- ],
- ),
- ],
- ),
- ).onPress(() {
- Navigator.pushNamed(context, AppRoutes.todayAttendance);
- }))
- .animatedSwither();
- },
+ ],
+ ),
+ ],
+ ),
+ ],
+ ),
+ ).onPress(() {
+ Navigator.pushNamed(context, AppRoutes.todayAttendance);
+ }))
+ .animatedSwither();
+ },
+ ),
),
),
- ),
- 9.width,
- Expanded(
- child: MenusWidget(),
- ),
- ],
- ),
- ],
- ).paddingOnly(left: 21, right: 21, top: 7),
- ServicesWidget(),
- 8.height,
- Container(
- width: double.infinity,
- padding: EdgeInsets.only(top: 31),
- decoration: BoxDecoration(
- color: Colors.white,
- borderRadius: BorderRadius.only(topRight: Radius.circular(50), topLeft: Radius.circular(50)),
- border: Border.all(color: MyColors.lightGreyEDColor, width: 1),
- ),
- child: Column(
- mainAxisSize: MainAxisSize.min,
- children: [
- Row(
- crossAxisAlignment: CrossAxisAlignment.center,
- children: [
+ 9.width,
Expanded(
- child: Column(
- crossAxisAlignment: CrossAxisAlignment.start,
- mainAxisSize: MainAxisSize.min,
- children: [
- LocaleKeys.offers.tr().toText12(),
- Row(
- children: [
- LocaleKeys.discounts.tr().toText24(isBold: true),
- 6.width,
- Container(
- padding: const EdgeInsets.only(left: 8, right: 8),
- decoration: BoxDecoration(
- color: MyColors.yellowColor,
- borderRadius: BorderRadius.circular(10),
- ),
- child: LocaleKeys.newString.tr().toText10(isBold: true)),
- ],
- ),
- ],
- ),
+ child: MenusWidget(),
),
- LocaleKeys.viewAllOffers.tr().toText12(isUnderLine: true),
],
- ).paddingOnly(left: 21, right: 21),
- SizedBox(
- height: 103 + 33,
- child: ListView.separated(
- shrinkWrap: true,
- physics: const BouncingScrollPhysics(),
- padding: const EdgeInsets.only(left: 21, right: 21, top: 13),
- scrollDirection: Axis.horizontal,
- itemBuilder: (cxt, index) {
- return SizedBox(
- width: 73,
- child: Column(
- crossAxisAlignment: CrossAxisAlignment.center,
- children: [
- Container(
- width: 73,
- height: 73,
- decoration: BoxDecoration(
- borderRadius: const BorderRadius.all(
- Radius.circular(100),
- ),
- border: Border.all(color: MyColors.lightGreyEDColor, width: 1),
- ),
- child: ClipRRect(
- borderRadius: const BorderRadius.all(
- Radius.circular(50),
+ ),
+ ],
+ ).paddingOnly(left: 21, right: 21, top: 7),
+ ServicesWidget(),
+ 8.height,
+ Container(
+ width: double.infinity,
+ padding: EdgeInsets.only(top: 31),
+ decoration: BoxDecoration(
+ color: Colors.white,
+ borderRadius: BorderRadius.only(topRight: Radius.circular(50), topLeft: Radius.circular(50)),
+ border: Border.all(color: MyColors.lightGreyEDColor, width: 1),
+ ),
+ child: Column(
+ mainAxisSize: MainAxisSize.min,
+ children: [
+ Row(
+ crossAxisAlignment: CrossAxisAlignment.center,
+ children: [
+ Expanded(
+ child: Column(
+ crossAxisAlignment: CrossAxisAlignment.start,
+ mainAxisSize: MainAxisSize.min,
+ children: [
+ LocaleKeys.offers.tr().toText12(),
+ Row(
+ children: [
+ LocaleKeys.discounts.tr().toText24(isBold: true),
+ 6.width,
+ Container(
+ padding: const EdgeInsets.only(left: 8, right: 8),
+ decoration: BoxDecoration(
+ color: MyColors.yellowColor,
+ borderRadius: BorderRadius.circular(10),
+ ),
+ child: LocaleKeys.newString.tr().toText10(isBold: true)),
+ ],
+ ),
+ ],
+ ),
+ ),
+ LocaleKeys.viewAllOffers.tr().toText12(isUnderLine: true),
+ ],
+ ).paddingOnly(left: 21, right: 21),
+ SizedBox(
+ height: 103 + 33,
+ child: ListView.separated(
+ shrinkWrap: true,
+ physics: const BouncingScrollPhysics(),
+ padding: const EdgeInsets.only(left: 21, right: 21, top: 13),
+ scrollDirection: Axis.horizontal,
+ itemBuilder: (cxt, index) {
+ return SizedBox(
+ width: 73,
+ child: Column(
+ crossAxisAlignment: CrossAxisAlignment.center,
+ children: [
+ Container(
+ width: 73,
+ height: 73,
+ decoration: BoxDecoration(
+ borderRadius: const BorderRadius.all(
+ Radius.circular(100),
+ ),
+ border: Border.all(color: MyColors.lightGreyEDColor, width: 1),
),
- child: Image.network(
- "https://play-lh.googleusercontent.com/NPo88ojmhah4HDiposucJmfQIop4z4xc8kqJK9ITO9o-yCab2zxIp7PPB_XPj2iUojo",
- fit: BoxFit.cover,
+ child: ClipRRect(
+ borderRadius: const BorderRadius.all(
+ Radius.circular(50),
+ ),
+ child: Image.network(
+ "https://play-lh.googleusercontent.com/NPo88ojmhah4HDiposucJmfQIop4z4xc8kqJK9ITO9o-yCab2zxIp7PPB_XPj2iUojo",
+ fit: BoxFit.cover,
+ ),
),
),
- ),
- 4.height,
- Expanded(
- child: namesD[6 % (index + 1)].toText12(isCenter: true, maxLine: 2),
- ),
- ],
- ),
- );
- },
- separatorBuilder: (cxt, index) => 8.width,
- itemCount: 6),
- ),
- ],
- ),
- )
- ],
+ 4.height,
+ Expanded(
+ child: namesD[6 % (index + 1)].toText12(isCenter: true, maxLine: 2),
+ ),
+ ],
+ ),
+ );
+ },
+ separatorBuilder: (cxt, index) => 8.width,
+ itemCount: 6),
+ ),
+ ],
+ ),
+ )
+ ],
+ ),
),
- ),
- )
- ],
- ),
- );
+ )
+ ],
+ ),
+ drawer: SafeArea(child: AppDrawer()));
}
}
diff --git a/lib/ui/landing/widget/app_drawer.dart b/lib/ui/landing/widget/app_drawer.dart
new file mode 100644
index 0000000..4ef5eb4
--- /dev/null
+++ b/lib/ui/landing/widget/app_drawer.dart
@@ -0,0 +1,47 @@
+import 'package:flutter/material.dart';
+import 'package:flutter/widgets.dart';
+import 'package:mohem_flutter_app/config/routes.dart';
+import 'package:mohem_flutter_app/ui/landing/widget/drawer_item.dart';
+import 'package:provider/provider.dart';
+
+class AppDrawer extends StatefulWidget {
+ @override
+ _AppDrawerState createState() => _AppDrawerState();
+}
+
+class _AppDrawerState extends State {
+ @override
+ Widget build(BuildContext context) {
+ return Container(
+ color: Colors.white,
+ child: Drawer(
+ child: Column(children: [
+ const SizedBox(
+ height: 200,
+ ),
+ Expanded(
+ child: ListView(padding: const EdgeInsets.all(21), physics: const BouncingScrollPhysics(), children: [
+ Divider(),
+ InkWell(
+ child: DrawerItem(
+ 'My Profile',
+ icon: Icons.person,
+ color: Colors.grey,
+ ),
+ onTap: () {
+ drawerNavigator(context, AppRoutes.profile);
+ })
+ ]))
+ ])));
+ }
+
+ drawerNavigator(context, routeName) {
+ Navigator.of(context).pushNamed(routeName);
+ }
+}
+
+String capitalizeOnlyFirstLater(String text) {
+ if (text.trim().isEmpty) return "";
+
+ return "${text[0].toUpperCase()}${text.substring(1)}";
+}
diff --git a/lib/ui/landing/widget/drawer_item.dart b/lib/ui/landing/widget/drawer_item.dart
new file mode 100644
index 0000000..301719b
--- /dev/null
+++ b/lib/ui/landing/widget/drawer_item.dart
@@ -0,0 +1,59 @@
+import 'dart:ui';
+import 'package:flutter/material.dart';
+
+class DrawerItem extends StatefulWidget {
+ final String title;
+ final String subTitle;
+ final IconData icon;
+ final Color color;
+ final dynamic assetLink;
+
+ const DrawerItem(this.title, {required this.icon, required this.color, this.subTitle = '', this.assetLink});
+
+ @override
+ _DrawerItemState createState() => _DrawerItemState();
+}
+
+class _DrawerItemState extends State {
+ @override
+ Widget build(BuildContext context) {
+ return Container(
+ margin: EdgeInsets.only(top: 0, bottom: 5, left: 0, right: 0),
+ child: Row(
+ crossAxisAlignment: CrossAxisAlignment.start,
+ children: [
+ if (widget.assetLink != null)
+ Container(
+ height: 20,
+ width: 20,
+ child: Image.asset(widget.assetLink),
+ ),
+ if (widget.assetLink == null)
+ Icon(
+ widget.icon,
+ color: widget.color ?? Colors.black87,
+ size: 25,
+ ),
+ Expanded(
+ child: Column(
+ crossAxisAlignment: CrossAxisAlignment.start,
+ mainAxisAlignment: MainAxisAlignment.start,
+ children: [
+ Container(
+ width: MediaQuery.of(context).size.width * 0.45,
+ child: Text(widget.title,
+ style: TextStyle(
+ color: widget.color ?? Color(0xFF2E303A),
+ fontSize: 14,
+ fontFamily: 'Poppins',
+ fontWeight: FontWeight.w600,
+ letterSpacing: -0.84,
+ )),
+ ),
+ ],
+ ),
+ ),
+ ],
+ ));
+ }
+}
diff --git a/lib/ui/screens/profile/profile_screen.dart b/lib/ui/screens/profile/profile_screen.dart
new file mode 100644
index 0000000..4431c95
--- /dev/null
+++ b/lib/ui/screens/profile/profile_screen.dart
@@ -0,0 +1,66 @@
+import 'dart:ui';
+
+import 'package:flutter/cupertino.dart';
+import 'package:flutter/material.dart';
+import 'package:mohem_flutter_app/ui/screens/profile/widgets/header.dart';
+import 'package:mohem_flutter_app/ui/screens/profile/widgets/profile_panel.dart';
+
+class ProfileScreen extends StatelessWidget {
+ @override
+ Widget build(BuildContext context) {
+ return Scaffold(
+ extendBody: true,
+ backgroundColor: const Color(0xffefefef),
+ body: Stack(children: [
+ Container(
+ height: 300,
+ margin: EdgeInsets.only(top: 50),
+ decoration: new BoxDecoration(
+ image: new DecorationImage(
+ image: new ExactAssetImage('assets/images/user-avatar.png'),
+ fit: BoxFit.cover,
+ ),
+ ),
+ child: new BackdropFilter(
+ filter: new ImageFilter.blur(sigmaX: 10.0, sigmaY: 10.0),
+ child: new Container(
+ decoration: new BoxDecoration(color: Colors.white.withOpacity(0.0)),
+ ),
+ )),
+ SingleChildScrollView(
+ scrollDirection: Axis.vertical,
+ child: Column(crossAxisAlignment: CrossAxisAlignment.center, children: [
+ SizedBox(
+ height: 80,
+ ),
+ Container(
+ padding: EdgeInsets.only(left: 15, right: 15),
+ child: Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: [
+ IconButton(
+ onPressed: () {},
+ icon: Icon(
+ Icons.arrow_back_ios,
+ color: Colors.white,
+ )),
+ InkWell(
+ child: Container(
+ padding: EdgeInsets.only(left: 10, right: 10, top: 5, bottom: 5),
+ decoration: BoxDecoration(borderRadius: BorderRadius.circular(15), color: Colors.black.withOpacity(.3)),
+ child: Row(children: [
+ Icon(Icons.photo, color: Colors.white),
+ Text(
+ 'Edit',
+ style: TextStyle(color: Colors.white, fontSize: 12),
+ )
+ ]))),
+ ],
+ )),
+ HeaderPanel(),
+ ProfilePanle()
+ ]),
+ )
+ ]));
+ }
+}
diff --git a/lib/ui/screens/profile/widgets/header.dart b/lib/ui/screens/profile/widgets/header.dart
new file mode 100644
index 0000000..3a4499a
--- /dev/null
+++ b/lib/ui/screens/profile/widgets/header.dart
@@ -0,0 +1,16 @@
+import 'package:flutter/cupertino.dart';
+import 'package:flutter/material.dart';
+
+class HeaderPanel extends StatelessWidget {
+ @override
+ Widget build(BuildContext context) {
+ double _width = MediaQuery.of(context).size.width;
+ return Container(
+ padding: EdgeInsets.symmetric(horizontal: _width / 10, vertical: 0),
+ child: Column(
+ mainAxisAlignment: MainAxisAlignment.start,
+ crossAxisAlignment: CrossAxisAlignment.start,
+ children: [],
+ ));
+ }
+}
diff --git a/lib/ui/screens/profile/widgets/profile_info.dart b/lib/ui/screens/profile/widgets/profile_info.dart
new file mode 100644
index 0000000..a02b56e
--- /dev/null
+++ b/lib/ui/screens/profile/widgets/profile_info.dart
@@ -0,0 +1,122 @@
+import 'package:flutter/cupertino.dart';
+import 'package:flutter/material.dart';
+
+class ProfileInFo extends StatelessWidget {
+ String data = '.';
+ double sliderValue = 75;
+ List menu = [
+ ProfileMenu(name: 'Personal information', icon: ''),
+ ProfileMenu(name: 'Basic Details', icon: ''),
+ ProfileMenu(name: 'Family Details', icon: ''),
+ ];
+ @override
+ Widget build(BuildContext context) {
+ return Container(
+ child: Column(crossAxisAlignment: CrossAxisAlignment.center, children: [
+ /// card header
+ customLabel('Sultan khan', 22, Colors.black, true),
+
+ customLabel('217869 | Software Developer', 14, Colors.grey, false),
+
+ customLabel('sultan.khan@cloudsolutions.com.sa', 13, Colors.black, true),
+
+ Divider(height: 40, thickness: 8, color: const Color(0xffefefef)),
+
+ customLabel('We appreciates you for completing the service of', 10, Colors.black, true),
+
+ SizedBox(height: 10),
+ Container(
+ child: Row(mainAxisAlignment: MainAxisAlignment.spaceAround, crossAxisAlignment: CrossAxisAlignment.center, children: [
+ Column(
+ children: [customLabel('Years', 14, const Color(0xff808080), true), customLabel('03', 22, Color(0xff2BB8A6), true)],
+ ),
+ Column(
+ children: [customLabel('Month', 14, const Color(0xff808080), true), customLabel('06', 22, Color(0xff2BB8A6), true)],
+ ),
+ Column(
+ children: [customLabel('Day', 14, const Color(0xff808080), true), customLabel('20', 22, Color(0xff2BB8A6), true)],
+ )
+ ])),
+
+ Divider(height: 40, thickness: 8, color: const Color(0xffefefef)),
+ Container(
+ padding: EdgeInsets.only(
+ left: 20,
+ right: 20,
+ ),
+ child: Column(
+ mainAxisAlignment: MainAxisAlignment.start,
+ crossAxisAlignment: CrossAxisAlignment.start,
+ children: [
+ customLabel('Profile Completion 75%', 18, Colors.black, true),
+ const SizedBox(height: 10),
+ Row(
+ children: [
+ for (var i = 0; i < 4; i++)
+ if (i < 3) Expanded(child: drawSlider(Color(0xff2BB8A6))) else Expanded(child: drawSlider(const Color(0xffefefef)))
+ ],
+ ),
+ const SizedBox(height: 10),
+ Text(
+ 'Complete Profile',
+ style: TextStyle(color: Color(0xff2BB8A6), fontWeight: FontWeight.bold, decoration: TextDecoration.underline),
+ ),
+ ],
+ )),
+
+ /// description
+ Divider(height: 50, thickness: 8, color: const Color(0xffefefef)),
+
+ Column(
+ children: menu.map((i) => rowItem(i, context)).toList(),
+ )
+ ]));
+ }
+
+ Widget drawSlider(color) {
+ return Row(children: [
+ Expanded(
+ flex: 1,
+ child: ClipRRect(
+ borderRadius: BorderRadius.circular(10),
+ child: Container(
+ height: 6,
+ width: 20,
+ color: color,
+ ),
+ )),
+ Container(height: 6, width: 3, color: Colors.white),
+ ]);
+ }
+
+ Widget rowItem(obj, context) {
+ return InkWell(
+ onTap: () {
+ // Navigator.pushNamed(
+ // context,
+ // AppRoutes.addEitScreen,
+ // arguments: obj,
+ // );
+ },
+ child: ListTile(
+ leading: FlutterLogo(),
+ title: Text(obj.name),
+ trailing: Icon(Icons.arrow_forward),
+ ),
+ );
+ }
+
+ Widget customLabel(String label, double size, Color color, bool isBold, {double padding = 0.0}) => Container(
+ padding: EdgeInsets.all(padding),
+ // height: 50,
+ child: Column(
+ mainAxisAlignment: MainAxisAlignment.spaceEvenly,
+ crossAxisAlignment: CrossAxisAlignment.center,
+ children: [Text(label, style: TextStyle(color: color, fontSize: size, fontWeight: isBold ? FontWeight.bold : FontWeight.normal))]));
+}
+
+class ProfileMenu {
+ final String name;
+ final String icon;
+ ProfileMenu({this.name = '', this.icon = ''});
+}
diff --git a/lib/ui/screens/profile/widgets/profile_panel.dart b/lib/ui/screens/profile/widgets/profile_panel.dart
new file mode 100644
index 0000000..7cf73ea
--- /dev/null
+++ b/lib/ui/screens/profile/widgets/profile_panel.dart
@@ -0,0 +1,28 @@
+import 'package:flutter/cupertino.dart';
+import 'package:flutter/material.dart';
+import 'package:mohem_flutter_app/ui/screens/profile/widgets/profile_info.dart';
+
+class ProfilePanle extends StatelessWidget {
+ @override
+ Widget build(BuildContext context) {
+ double _width = MediaQuery.of(context).size.width;
+ return Container(
+ margin: EdgeInsets.fromLTRB(5, 0, 5, 10),
+ height: MediaQuery.of(context).size.height,
+ child: Stack(children: [
+ Container(
+ width: _width,
+ margin: EdgeInsets.only(top: 50),
+ padding: EdgeInsets.only(top: 50),
+ decoration: BoxDecoration(
+ color: Colors.white,
+ borderRadius: const BorderRadius.only(topLeft: Radius.circular(25), topRight: Radius.circular(25)),
+ boxShadow: [BoxShadow(color: Colors.white60, blurRadius: 10, spreadRadius: 10)]),
+ child: ProfileInFo(),
+ ),
+ Container(height: 100, alignment: Alignment.center, child: ProfileImage())
+ ]));
+ }
+
+ Widget ProfileImage() => CircleAvatar(radius: 70, backgroundImage: AssetImage('assets/images/user-avatar.png'));
+}