diff --git a/fonts/DoctorApp.ttf b/fonts/DoctorApp.ttf new file mode 100644 index 00000000..75e43d06 Binary files /dev/null and b/fonts/DoctorApp.ttf differ 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