dashboard page and fonts icons
parent
9d4d9b026d
commit
7b1b9a330f
Binary file not shown.
@ -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<DashboardItemIconText> {
|
||||||
|
@override
|
||||||
|
Widget build(BuildContext context) {
|
||||||
|
return new RoundedContainer(Stack(
|
||||||
|
children: <Widget>[
|
||||||
|
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: <Widget>[
|
||||||
|
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,);
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -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<DashboardItemTexts> {
|
||||||
|
@override
|
||||||
|
Widget build(BuildContext context) {
|
||||||
|
return new RoundedContainer(Stack(
|
||||||
|
children: <Widget>[
|
||||||
|
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,);
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -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<RoundedContainer> {
|
||||||
|
@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 ,
|
||||||
|
));
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -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);
|
||||||
|
}
|
||||||
@ -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<DashboardPage> {
|
||||||
|
@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: <Widget>[
|
||||||
|
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: <Widget>[
|
||||||
|
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: <Widget>[
|
||||||
|
Expanded(
|
||||||
|
flex: 2,
|
||||||
|
child: RoundedContainer(
|
||||||
|
CircularPercentIndicator(
|
||||||
|
radius: 90.0,
|
||||||
|
animation: true,
|
||||||
|
animationDuration: 1200,
|
||||||
|
lineWidth: 7.0,
|
||||||
|
percent: .75,
|
||||||
|
center: Column( mainAxisAlignment: MainAxisAlignment.center,
|
||||||
|
children: <Widget>[
|
||||||
|
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: <Widget>[
|
||||||
|
Expanded(
|
||||||
|
flex: 1,
|
||||||
|
child: Column(
|
||||||
|
crossAxisAlignment:
|
||||||
|
CrossAxisAlignment.stretch,
|
||||||
|
children: <Widget>[
|
||||||
|
Expanded(
|
||||||
|
child: DashboardItemTexts("Arrived","23",)),
|
||||||
|
Expanded(
|
||||||
|
child: DashboardItemTexts("Not Arrived","23",)),
|
||||||
|
],
|
||||||
|
)),
|
||||||
|
Expanded(
|
||||||
|
child: Column(
|
||||||
|
crossAxisAlignment:
|
||||||
|
CrossAxisAlignment.stretch,
|
||||||
|
children: <Widget>[
|
||||||
|
Expanded(
|
||||||
|
child: DashboardItemTexts("ER","23",)),
|
||||||
|
Expanded(
|
||||||
|
child: DashboardItemTexts("Walk-in","23",)),
|
||||||
|
],
|
||||||
|
)),
|
||||||
|
],
|
||||||
|
))
|
||||||
|
])),
|
||||||
|
Expanded(
|
||||||
|
flex: 2,
|
||||||
|
child: Row(
|
||||||
|
crossAxisAlignment: CrossAxisAlignment.stretch,
|
||||||
|
children: <Widget>[
|
||||||
|
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: <Widget>[
|
||||||
|
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: <Widget>[
|
||||||
|
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: <Widget>[
|
||||||
|
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],)),
|
||||||
|
],
|
||||||
|
)),
|
||||||
|
],
|
||||||
|
)));
|
||||||
|
}
|
||||||
|
}
|
||||||
Loading…
Reference in New Issue