From 7b1b9a330f0258ef507882dc268aed549fa25bfd Mon Sep 17 00:00:00 2001 From: unknown Date: Mon, 6 Apr 2020 14:01:18 +0300 Subject: [PATCH] dashboard page and fonts icons --- fonts/DoctorApp.ttf | Bin 0 -> 2652 bytes .../dashboard_item_icons_texts.dart | 44 ++++ .../dashboard_item_texts_widget.dart | 39 ++++ .../rounded_container_widget.dart | 42 ++++ lib/presentation/doctor_app_icons.dart | 38 ++++ lib/routes.dart | 7 +- lib/screens/dashboard.dart | 213 ++++++++++++++++++ pubspec.lock | 7 + pubspec.yaml | 5 + 9 files changed, 390 insertions(+), 5 deletions(-) create mode 100644 fonts/DoctorApp.ttf create mode 100644 lib/custom_widgets/dashboard_item_icons_texts.dart create mode 100644 lib/custom_widgets/dashboard_item_texts_widget.dart create mode 100644 lib/custom_widgets/rounded_container_widget.dart create mode 100644 lib/presentation/doctor_app_icons.dart create mode 100644 lib/screens/dashboard.dart diff --git a/fonts/DoctorApp.ttf b/fonts/DoctorApp.ttf new file mode 100644 index 0000000000000000000000000000000000000000..75e43d06a893356ab92dfb2379e21999f4e7bc70 GIT binary patch literal 2652 zcmd^A&2Lmy6hHTU&2+vxLx;8$+P;1;EwOe=3oQ^@p`|T02v|xnnAkjK-hAN9d&A5t zwzWYQ#!q4;#Dy^??jSKC(S<}qWT6W`5)&61WuYuIzJ)vE$};2czV|2?@GtP*p5EX2 zopbL!_uMo05hJ1?y+|SrOrJP8uD-E-g^29|J9q3va&W9`W)k{E=<}(fR(j38Stb&q zkhyGOIdiH1gBwKBDty*+x|VKjN#)>s8#0^&5v=)DVE9mXu4pX{?yIfC_gCnB1v90I zz2e81pN8IC)Rs!DiL$UaLst#0sNeXBHWMjJL}I99R;>2JnYW4RUV{C5LhRyf?JSZ1 zT5Y|y?!U&Ff3={)fc^96SFbMA@BfQ}qRl;SU0wU_?ufZr|21(Ix}OBjqPcl_+S553 zKqsnkBO12{Xn@8@I5c%+jv@ukGN^?l$LiYe$E=XgYFOX3F!*sR1H(wU%SxBnTO=d5 zD+15hMR#PkX(vMj0?8uShqU9F$uu3X$=>ed<226l4&1zK@DodWkt>W2{u=sPZCzT! z_$au~T|xeM!~UoS+z$jXA|iL4*THhshY^_oFVQp5Lr&HtTd-w2V8`t3HRK4fNVeY& zxf;CO#^4>LP1Hy#2!~O*@5Tf|K37Q0>1FlP|q{#3cm~66JDjZ zC&(Uh?+U*^8~4e@;Zc7!#KCpI5Psh_?vo3zL>oJDaeTtS5Znvd5my|Z#{uE>Y~wB9 z;_xwG2<{KH=!)~J0Yz^*{abQ-m8v}IT2{1CtqD3!)S&nxtf`H)GkIi87#VJCYHVj6 zBV!DIyL$RrPok^Sr^sy#Za&5BJ&B&gZr9l9(3|5JK%(;*!T?$&7XG_}c!lZK7P?)-thn{ge@|8yc89^4VjP z;}chMMmVrCGuPD{jmWa%Yi%Ci+o~pF@pvquw(cEoZVd+_(caFJGb@3xk(;wDWJ|!S z^n!F5xsj=pXe;Z$9~*YE(uB;!CAE9k2y`3}dK(+|hb27}{yQ(c+Y)aaN~oiUlS9>8 z)pYgNQ1bCnH8Io}Z&3%5?AdCZ{lR{}^FvG!wsvkCJ+f!CITmXk9eHAOTjy3mh&6<9 z<@|0|#hc;*Y9PGE&fRQQni@J9hMmNA`xF-Ih;_`ghU&vi42kcB1VvF-jOv%qzbyLK zzY~*UB3K_ky)g4(br1XGo7Gp;P{5}scdk}{6rRKhH_^}D%R)2-9kuNIuY=}d0d;rG z!~9K{_pk)K;9(hGubhV!@D&dS=n-1=a1dv>g8F03ZeKAdL!OG+M-roMWj#KLE+V!dZ)S$3F$D zLH)$XBEBZvgEQP-KsPsRhk#Sy`922`Rf%Tdlf`NU>{O-)?GG~Z&aM@lhVP-$POLug zkeSo)GaO&di6jkQ_mmYnk39#$T8NZKTgF;Npebj~dvU9XklW5;9UgbTlRpdWK1!nh z*E#W9a~gkvAJ&3QU?P*4%oOHhepbfOXn-8oL0{23nk6U>xNaAGmH8HFQ@1R zTF_Ef{=6Q|8+W}Hp3CJeJyg^y6%BK_d&B*TH>0ksrSoRN%r3_(skEM6EV#a&IgGvU Sk>R3lEH0eU%Fc4mDgFVfV8Uep literal 0 HcmV?d00001 diff --git a/lib/custom_widgets/dashboard_item_icons_texts.dart b/lib/custom_widgets/dashboard_item_icons_texts.dart new file mode 100644 index 00000000..1693868a --- /dev/null +++ b/lib/custom_widgets/dashboard_item_icons_texts.dart @@ -0,0 +1,44 @@ + +import 'package:doctor_app_flutter/custom_widgets/rounded_container_widget.dart'; +import 'package:flutter/material.dart'; + +class DashboardItemIconText extends StatefulWidget { + +final IconData icon; +final String value; +final String label; +final Color backgroundColor; +final bool showBorder; +final Color borderColor; + +// OWNER : Ibrahim albitar +// DATE : 05-04-2020 +// DESCRIPTION : Custom widget for dashboard items has texts and icons widgets + +DashboardItemIconText(this.icon, this.value, this.label, {this.backgroundColor = Colors.white, this.showBorder = false, this.borderColor = Colors.white}); + @override + _DashboardItemTextsState createState() => _DashboardItemTextsState(); +} +class _DashboardItemTextsState extends State { + @override + Widget build(BuildContext context) { + return new RoundedContainer(Stack( + children: [ + Align( + alignment: FractionalOffset.topLeft, + child: Container(margin: EdgeInsets.all(10), child: Icon(widget.icon,),) + ), + Align( + alignment: FractionalOffset.bottomRight, + child: Container(margin: EdgeInsets.all(10), child: Column( + mainAxisAlignment: MainAxisAlignment.end, + crossAxisAlignment: CrossAxisAlignment.end, + children: [ + Text(widget.value, style: TextStyle(fontWeight: FontWeight.bold, fontSize: 21),), + Text(widget.label, style: TextStyle(fontWeight: FontWeight.normal, fontSize: 14),), + + ],)) + ), + ],) ,backgroundColor: widget.backgroundColor, showBorder: widget.showBorder, borderColor: widget.borderColor,); + } +} \ No newline at end of file diff --git a/lib/custom_widgets/dashboard_item_texts_widget.dart b/lib/custom_widgets/dashboard_item_texts_widget.dart new file mode 100644 index 00000000..71d705a8 --- /dev/null +++ b/lib/custom_widgets/dashboard_item_texts_widget.dart @@ -0,0 +1,39 @@ + +import 'package:doctor_app_flutter/custom_widgets/rounded_container_widget.dart'; +import 'package:flutter/material.dart'; + +class DashboardItemTexts extends StatefulWidget { + +final String label; +final String value; +final Color backgroundColor; +final bool showBorder; +final Color borderColor; + +// OWNER : Ibrahim albitar +// DATE : 05-04-2020 +// DESCRIPTION : Custom widget for dashboard items has texts widgets + +DashboardItemTexts(this.label, this.value, {this.backgroundColor = Colors.white, this.showBorder = false, this.borderColor = Colors.white}); + @override + _DashboardItemTextsState createState() => _DashboardItemTextsState(); +} + +class _DashboardItemTextsState extends State { + @override + Widget build(BuildContext context) { + return new RoundedContainer(Stack( + children: [ + Align( + alignment: FractionalOffset.topLeft, + child:Container(margin: EdgeInsets.all(5), child: Text(widget.label),) + ), + + Align( + alignment: FractionalOffset.bottomRight, + child: Container(margin: EdgeInsets.all(10), child: Text(widget.value, style: TextStyle(fontWeight: FontWeight.bold, fontSize: 21),),) + ), + + ],) ,backgroundColor: widget.backgroundColor, showBorder: widget.showBorder, borderColor: widget.borderColor, margin: 4,); + } +} \ No newline at end of file diff --git a/lib/custom_widgets/rounded_container_widget.dart b/lib/custom_widgets/rounded_container_widget.dart new file mode 100644 index 00000000..a962b335 --- /dev/null +++ b/lib/custom_widgets/rounded_container_widget.dart @@ -0,0 +1,42 @@ + +import 'package:flutter/material.dart'; + +// OWNER : Ibrahim albitar +// DATE : 05-04-2020 +// DESCRIPTION : Custom widget for rounded container and custom decoration + +class RoundedContainer extends StatefulWidget { + + final double raduis; + final Color backgroundColor; + final double margin; + final double elevation; + final bool showBorder; + final Color borderColor; + final Widget widget; + +RoundedContainer(this.widget ,{this.raduis = 10,this.backgroundColor = Colors.white, this.margin = 10, this.elevation = 1, this.showBorder = false, this.borderColor = Colors.red}); + + @override + _RoundedContainerState createState() => _RoundedContainerState(); +} + +class _RoundedContainerState extends State { + @override + Widget build(BuildContext context) { + return Container( + margin: EdgeInsets.all(widget.margin), + decoration: widget.showBorder == true ? BoxDecoration( + border: Border.all(color: Colors.red, width:1 ), + borderRadius: BorderRadius.circular(widget.raduis), + ):null, + child: Card( + margin: EdgeInsets.all(0), + shape: RoundedRectangleBorder( + borderRadius: BorderRadius.circular(widget.raduis), + ), + color: widget.backgroundColor, + child: widget.widget , + )); + } +} diff --git a/lib/presentation/doctor_app_icons.dart b/lib/presentation/doctor_app_icons.dart new file mode 100644 index 00000000..5c3c80bf --- /dev/null +++ b/lib/presentation/doctor_app_icons.dart @@ -0,0 +1,38 @@ +/// Flutter icons DoctorApp +/// Copyright (C) 2020 by original authors @ fluttericon.com, fontello.com +/// This font was generated by FlutterIcon.com, which is derived from Fontello. +/// +/// To use this font, place it in your fonts/ directory and include the +/// following in your pubspec.yaml +/// +/// flutter: +/// fonts: +/// - family: DoctorApp +/// fonts: +/// - asset: fonts/DoctorApp.ttf +/// +/// +/// +import 'package:flutter/widgets.dart'; + +class DoctorApp { + DoctorApp._(); + + static const _kFontFam = 'DoctorApp'; + + static const IconData discharge_patient = IconData(0xe800, fontFamily: _kFontFam); + static const IconData home_icon = IconData(0xe801, fontFamily: _kFontFam); + static const IconData home_icon_active = IconData(0xe802, fontFamily: _kFontFam); + static const IconData in_patient_white = IconData(0xe804, fontFamily: _kFontFam); + static const IconData lab_results = IconData(0xe805, fontFamily: _kFontFam); + static const IconData menu_icon_active = IconData(0xe808, fontFamily: _kFontFam); + static const IconData message_icon = IconData(0xe809, fontFamily: _kFontFam); + static const IconData message_icon_active = IconData(0xe80a, fontFamily: _kFontFam); + static const IconData out_patient = IconData(0xe80c, fontFamily: _kFontFam); + static const IconData radiology = IconData(0xe80d, fontFamily: _kFontFam); + static const IconData referral = IconData(0xe80e, fontFamily: _kFontFam); + static const IconData scdedule_icon_active = IconData(0xe80f, fontFamily: _kFontFam); + static const IconData search_patient = IconData(0xe810, fontFamily: _kFontFam); + static const IconData schedule_icon = IconData(0xe811, fontFamily: _kFontFam); + static const IconData menu_bar_icon = IconData(0xe825, fontFamily: _kFontFam); +} diff --git a/lib/routes.dart b/lib/routes.dart index f26e18b8..85f26ad4 100644 --- a/lib/routes.dart +++ b/lib/routes.dart @@ -4,7 +4,7 @@ import './screens/QR_reader_screen.dart'; import './screens/auth/login_screen.dart'; import './screens/blood_bank_screen.dart'; import './screens/doctor_reply_screen.dart'; -import './screens/home_screen.dart'; +import './screens/dashboard.dart'; import './screens/medicine/medicine_search_screen.dart'; import './screens/my_schedule_screen.dart'; import './screens/patients/patient_search_screen.dart'; @@ -23,11 +23,8 @@ const String MEDICINE_SEARCH='medicine_search'; const String SETTINGS ='settings'; - - - var routes = { - HOME:(_)=>HomeScreen(), + HOME:(_)=>DashboardPage(title: 'Home',), INIT_ROUTE:(_)=>Loginsreen(), MY_SCHEDULE:(_)=>MyScheduleScreen(), PATIENT_SEARCH:(_)=>PatientSearchScreen(), diff --git a/lib/screens/dashboard.dart b/lib/screens/dashboard.dart new file mode 100644 index 00000000..b54a5627 --- /dev/null +++ b/lib/screens/dashboard.dart @@ -0,0 +1,213 @@ +import 'package:doctor_app_flutter/custom_widgets/dashboard_item_icons_texts.dart'; +import 'package:doctor_app_flutter/custom_widgets/dashboard_item_texts_widget.dart'; +import 'package:doctor_app_flutter/custom_widgets/rounded_container_widget.dart'; +import 'package:doctor_app_flutter/presentation/doctor_app_icons.dart'; +import 'package:flutter/material.dart'; +import 'package:percent_indicator/circular_percent_indicator.dart'; + + +class DashboardPage extends StatefulWidget { + DashboardPage({Key key, this.title}) : super(key: key); + + final String title; + + @override + _MyHomePageState createState() => _MyHomePageState(); +} + +class _MyHomePageState extends State { + @override + Widget build(BuildContext context) { + return Scaffold( + appBar: AppBar( + elevation: 0, + backgroundColor: Colors.red[100], + textTheme: TextTheme( + title: + TextStyle(color: Colors.black, fontWeight: FontWeight.bold)), + title: Text(widget.title), + leading: IconButton( + icon: Icon(Icons.menu), + color: Colors.black, + onPressed: () => Scaffold.of(context).openDrawer(), + ), + centerTitle: true, + actions: [ + IconButton(icon: Icon(Icons.person), onPressed: null) + ], + ), + drawer: Container( + child: Card(), + ), + bottomNavigationBar: BottomNavigationBar(items:[ + BottomNavigationBarItem( + icon: Icon(DoctorApp.home_icon), + title: Text('Home'), + backgroundColor: Colors.red, + activeIcon: Icon(Icons.home) + ), + BottomNavigationBarItem( + icon: new Icon(Icons.mail), + title: new Text('Messages'), + ), + BottomNavigationBarItem( + icon: Icon(Icons.apps), + title: Text('Menu') + ) + ]), + body: Container( + decoration: new BoxDecoration( + gradient: LinearGradient( + colors: [Colors.red[100], Colors.white], + begin: Alignment.topLeft, + end: Alignment.bottomRight, + ), + ), + child: Column( + children: [ + Expanded( + flex: 1, + child: Container( + margin: EdgeInsets.all(10), + child: Text( + "Today's Statistics", + style: TextStyle( + fontWeight: FontWeight.bold, fontSize: 18), + ), + alignment: Alignment.centerLeft, + )), + Expanded( + flex: 3, + child: Row( + crossAxisAlignment: CrossAxisAlignment.stretch, + children: [ + Expanded( + flex: 2, + child: RoundedContainer( + CircularPercentIndicator( + radius: 90.0, + animation: true, + animationDuration: 1200, + lineWidth: 7.0, + percent: .75, + center: Column( mainAxisAlignment: MainAxisAlignment.center, + children: [ + new Text( + "38", + style: new TextStyle( + fontWeight: FontWeight.bold, + fontSize: 24.0), + ), + new Text( + "Out-Patients", + style: new TextStyle( + fontWeight: FontWeight.normal, + fontSize: 11.0, + color: Colors.grey[800]), + ), + ],), + circularStrokeCap: CircularStrokeCap.butt, + backgroundColor: Colors.blueGrey[100], + progressColor: Colors.red, + ) + )), + Expanded( + flex: 2, + child: Row( + children: [ + Expanded( + flex: 1, + child: Column( + crossAxisAlignment: + CrossAxisAlignment.stretch, + children: [ + Expanded( + child: DashboardItemTexts("Arrived","23",)), + Expanded( + child: DashboardItemTexts("Not Arrived","23",)), + ], + )), + Expanded( + child: Column( + crossAxisAlignment: + CrossAxisAlignment.stretch, + children: [ + Expanded( + child: DashboardItemTexts("ER","23",)), + Expanded( + child: DashboardItemTexts("Walk-in","23",)), + ], + )), + ], + )) + ])), + Expanded( + flex: 2, + child: Row( + crossAxisAlignment: CrossAxisAlignment.stretch, + children: [ + Expanded( + flex: 2, + child: new DashboardItemIconText(DoctorApp.home_icon,"08", "Lab Result", backgroundColor: Colors.red,)), + Expanded( + flex: 2, + child: new DashboardItemIconText(DoctorApp.home_icon, "10","Radiology", backgroundColor: Colors.red,)), + Expanded( + flex: 2, + child: new DashboardItemIconText(DoctorApp.home_icon,"05", "Referral", backgroundColor: Colors.red,)), + ], + )), + Expanded( + flex: 2, + child: Row( + crossAxisAlignment: CrossAxisAlignment.stretch, + children: [ + Expanded( + flex: 2, + child: new DashboardItemIconText(DoctorApp.home_icon,"23","In-Patient", showBorder: true,)), + Expanded( + flex: 2, + child: new DashboardItemIconText(DoctorApp.home_icon,"23","Operations", showBorder: true,)), + ], + )), + Expanded( + flex: 1, + child: Container( + margin: EdgeInsets.all(10), + child: Text( + "Patient Services", + style: TextStyle( + fontWeight: FontWeight.bold, fontSize: 15), + ), + alignment: Alignment.centerLeft, + )), + Expanded( + flex: 2, + child: Row( + crossAxisAlignment: CrossAxisAlignment.stretch, + children: [ + Expanded( + flex: 2, + child: new DashboardItemIconText(DoctorApp.home_icon,"","Search Patient", showBorder: false,backgroundColor: Colors.green[200],)), + Expanded( + flex: 2, + child: new DashboardItemIconText(DoctorApp.home_icon,"","Out Patient", showBorder: false,backgroundColor: Colors.deepPurple[300],)), + ], + )), + Expanded( + flex: 2, + child: Row( + crossAxisAlignment: CrossAxisAlignment.stretch, + children: [ + Expanded( + flex: 2, + child: new DashboardItemIconText(DoctorApp.home_icon,"","In Patient", showBorder: false, backgroundColor: Colors.blueGrey[900],)), + Expanded( + flex: 2, + child: new DashboardItemIconText(DoctorApp.home_icon,"","Discharge Patient", showBorder: false,backgroundColor: Colors.brown[400],)), + ], + )), + ], + ))); + } +} diff --git a/pubspec.lock b/pubspec.lock index d1775f85..0549d83b 100644 --- a/pubspec.lock +++ b/pubspec.lock @@ -408,6 +408,13 @@ packages: url: "https://pub.dartlang.org" source: hosted version: "1.8.0+1" + percent_indicator: + dependency: "direct main" + description: + name: percent_indicator + url: "https://pub.dartlang.org" + source: hosted + version: "2.1.1+1" petitparser: dependency: transitive description: diff --git a/pubspec.yaml b/pubspec.yaml index 24d55e61..47014e30 100644 --- a/pubspec.yaml +++ b/pubspec.yaml @@ -36,6 +36,7 @@ dependencies: # The following adds the Cupertino Icons font to your application. # Use with the CupertinoIcons class for iOS style icons. cupertino_icons: ^0.1.2 + percent_indicator: "^2.1.1" dev_dependencies: flutter_test: @@ -54,6 +55,7 @@ flutter: # included with your application, so that you can use the icons in # the material Icons class. uses-material-design: true + # To add assets to your application, add an assets section, like this: assets: @@ -92,6 +94,9 @@ flutter: # - asset: fonts/TrajanPro.ttf # - asset: fonts/TrajanPro_Bold.ttf # weight: 700 + - family: DoctorApp + fonts: + - asset: fonts/DoctorApp.ttf # # For details regarding fonts from package dependencies, # see https://flutter.dev/custom-fonts/#from-packages